Merge pull request #244 from flickmatch/rename-paymentOptions

phonepe/stripe renamed & login makes compulsory for joining game.
flickmatch · Jun 2, 2024 · 7f181d8 · 7f181d8
2 parents 5ccfe00 + a9c7db1
commit 7f181d8
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 9 deletions.
diff --git a/react-fm/src/pages/matchQueues/eventsComponents/Events.module.scss b/react-fm/src/pages/matchQueues/eventsComponents/Events.module.scss
@@ -100,7 +100,7 @@ input:-webkit-autofill:active {
 
 .paymentOptionsPortrait {
   width: 100%;
-  margin-left: 5px;
+  margin-left: 7px;
   position: relative;
   gap: 0.7rem;
   margin-bottom: 10px;

diff --git a/react-fm/src/pages/matchQueues/eventsComponents/JoinNow.tsx b/react-fm/src/pages/matchQueues/eventsComponents/JoinNow.tsx
@@ -1,8 +1,9 @@
 import { useEffect, useState } from 'react';
 import type { FC } from 'react';
 import ReactGA from 'react-ga';
+import { useNavigate } from 'react-router-dom';
 
-//import { useNavigate } from 'react-router-dom';
+import CreditCardIcon from '@mui/icons-material/CreditCard';
 import LockIcon from '@mui/icons-material/Lock';
 import { InputLabel, MenuItem, Select } from '@mui/material';
 import Alert from '@mui/material/Alert';
@@ -41,7 +42,7 @@ export const JoinNow: FC<EventDetails> = ({
 }) => {
   const [, notificationsActions] = useNotifications();
   const isPortrait = useOrientation();
-  //const navigate = useNavigate();
+  const navigate = useNavigate();
   const [showPaymentOptions, setShowPaymentOptions] = useState(false);
   const [open, setOpen] = useState(false);
   const [userData, setUserData] = useState({ name: '', email: '', phoneNumber: '' });
@@ -108,9 +109,13 @@ export const JoinNow: FC<EventDetails> = ({
   };
 
   const paymentOptions = (event: { stopPropagation: () => void }) => {
-    event.stopPropagation();
-    history.replaceState(null, '', `#${uniqueEventId}`);
-    setShowPaymentOptions(true);
+    if (userData.name) {
+      event.stopPropagation();
+      history.replaceState(null, '', `#${uniqueEventId}`);
+      setShowPaymentOptions(true);
+    } else {
+      navigate('/login');
+    }
   };
 
   const handleClickOpen = (event: { stopPropagation: () => void }) => {
@@ -271,14 +276,15 @@ export const JoinNow: FC<EventDetails> = ({
                 <Button
                   variant="contained"
                   startIcon={
-                    <Icon icon="simple-icons:stripe" color="navy" style={{ fontSize: 16 }} />
+                    <CreditCardIcon />
+                    // <Icon icon="simple-icons:stripe" color="navy" style={{ fontSize: 16 }} />
                   }
                   className={isPortrait ? '' : styles.payViaCard}
                   onClick={() => {
                     openInNewTab(stripePaymentUrl);
                   }}
                 >
-                  Stripe
+                  Pay via card
                 </Button>
               ) : null}
               <Button
@@ -293,7 +299,7 @@ export const JoinNow: FC<EventDetails> = ({
                   setOpen(true);
                 }}
               >
-                RazorPay
+                Pay via UPI
               </Button>
             </FlexBox>
           ) : null}