Feat ffsu tournament

src/app/(dashboard)/dashboard/register/page.tsx

@@ -4,7 +4,7 @@ import { useState, useEffect } from 'react';
 // eslint-disable-next-line import/named
 import { animated, useTransition } from '@react-spring/web';
 
-import { setType } from '@/modules/login';
+import { editUserFfsu, setType } from '@/modules/login';
 
 import { Input, Button, Table, Icon, Title, Checkbox } from '@/components/UI';
 import { createTeam as cT, joinTeam, cancelJoin } from '@/modules/team';
@@ -37,17 +37,23 @@ const Register = () => {
   const soloTeamName = `${user.username}-solo-team`;
   const [teamName, setTeamName] = useState('');
   const [pokemonPlayerId, setPokemonPlayerId] = useState('');
+  const [ffsuLicense, setFfsuLicense] = useState<string | null>(user.ffsuLicense || null);
   const [tournaments, setTournaments] = useState<Tournament[]>([]);
   const [tournament, setTournament] = useState('');
   const [tournamentSolo, setTournamentSolo] = useState(false);
+  const [tournamentFfsu, setTournamentFfsu] = useState(false);
   const [createTeam, setCreateTeam] = useState(false);
   const [acceptedRules, setAcceptedRules] = useState(false);
+  const [certifyFfsu, setCertifyFfsu] = useState(false);
   // Contains the team the user is trying to join. This is used to remember the team, so it will be filled only when the confirmation modal will be on.
   const [confirmationForTeam, setConfirmationForTeam] = useState<Team>();
 
   // Split multiplayer and solo tournaments
-  const tournamentsList = tournaments.filter((tournament) => tournament.playersPerTeam > 1);
-  const tournamentsSoloList = tournaments.filter((tournament) => tournament.playersPerTeam === 1);
+  const tournamentsList = tournaments.filter((tournament) => tournament.playersPerTeam > 1 && !tournament.ffsu);
+  const tournamentsSoloList = tournaments.filter((tournament) => tournament.playersPerTeam === 1 && !tournament.ffsu);
+
+  // Get Ffsu tournaments
+  const tournamentsFfsuList = tournaments.filter((tournament) => tournament.ffsu === true);
 
   // Get tournaments category select options
   const tournamentsOptions = tournamentsList.map((tournament) => ({
@@ -60,6 +66,11 @@ const Register = () => {
     value: tournament.id,
   }));
 
+  const tournamentsFfsuOptions = tournamentsFfsuList.map((tournament) => ({
+    label: tournament.name,
+    value: tournament.id,
+  }));
+
   const transitions = useTransition(step, {
     from: { opacity: 0, transform: `translate3d(100%,0,0)` },
     enter: { opacity: 1, transform: 'translate3d(0%,0,0)' },
@@ -142,7 +153,7 @@ const Register = () => {
           title="Spectateur"
           onClick={() => {
             setUserType(UserType.spectator);
-            setStep(step + 3);
+            setStep(step + 4);
             setTournamentSolo(true);
           }}
           imgSrc={spectatorImg.src}
@@ -160,13 +171,28 @@ const Register = () => {
           imgSrc={getTournamentBackgroundLink(element.value)}
           onClick={() => {
             setTournament(element.value);
-            setStep(step + 1);
+            setStep(step + 2);
             setTournamentSolo(false);
           }}
         />
       );
     });
 
+    tournamentsFfsuOptions.forEach((element, i) => {
+      list.push(
+        <RegisterCard
+          key={'tournament-ffsu-' + i}
+          title={element.label}
+          imgSrc={getTournamentBackgroundLink(element.value)}
+          onClick={() => {
+            setTournament(element.value);
+            setStep(step + 1);
+            setTournamentFfsu(true);
+          }}
+        />
+      );
+    });
+
     if (userType === UserType.player || userType === UserType.coach) {
       // You can disable solo tournaments for coaches here
       tournamentsSoloOptions.forEach((element, i) => {
@@ -178,7 +204,7 @@ const Register = () => {
             onClick={() => {
               setTournament(element.value);
               setCreateTeam(userType === UserType.player);
-              setStep(step + 2);
+              setStep(step + 3);
               setTournamentSolo(true);
             }}
           />,
@@ -195,6 +221,34 @@ const Register = () => {
   );
 
   const Step4 = (
+    <>
+      <div className={styles.checkboxRules}>
+        <Input label="Numéro de license FFSU" value={ffsuLicense || ''} onChange={setFfsuLicense} />
+        <Checkbox
+          label={
+            <>
+              En cochant cette case je certifie que le numéro de licence FFSU que j'ai renseigné est valide et que je suis bien licencié(e) 
+              à la FFSU pour la saison en cours. Ce tournoi sera par conséquent gratuit mais ne disposera pas de cashprize.
+            </>
+          }
+          value={certifyFfsu}
+          onChange={setCertifyFfsu}
+        />
+      </div>
+      <Button
+        primary
+        onClick={() => {
+          setStep(step + 1);
+          const license = ffsuLicense?.length === 0 ? null : ffsuLicense;
+          dispatch(editUserFfsu({ ffsuLicense: license }));
+        }}
+        disabled={!user.discordId || !certifyFfsu}>
+        {'Valider'}
+      </Button>
+    </>
+  );
+
+  const Step5 = (
     <>
       <div className={styles.cardContainer}>
         <RegisterCard
@@ -256,7 +310,7 @@ const Register = () => {
     };
   };
 
-  const Step5 = (
+  const Step6 = (
     <>
       {createTeam || userType === UserType.spectator ? (
         <>
@@ -322,6 +376,8 @@ const Register = () => {
         return Step4;
       case 5:
         return Step5;
+      case 6:
+        return Step6;
       default:
         break;
     }
@@ -333,7 +389,7 @@ const Register = () => {
         <Button
           primary
           onClick={() =>
-            setStep(userType === UserType.spectator ? step - 3 : tournamentSolo && step === 5 ? step - 2 : step - 1)
+            setStep(userType === UserType.spectator ? step - 4 : tournamentSolo && step === 6 ? step - 3 : step === 5 ? step - 2 : step - 1)
           }>
           {'Retour'}
         </Button>
@@ -354,6 +410,7 @@ const Register = () => {
             <li className={step > 2 ? styles.active : ``}></li>
             <li className={step > 3 ? styles.active : ``}></li>
             <li className={step > 4 ? styles.active : ``}></li>
+            <li className={step > 5 ? styles.active : ``}></li>
           </ul>
         </div>
 

src/app/(dashboard)/dashboard/shop/page.tsx

@@ -16,6 +16,7 @@ import { AttendantInfo, CartItem, Item, User, UserAge, UserType } from '@/types'
 import { IconName } from '@/components/UI/Icon';
 import { setRedirect } from '@/modules/redirect';
 import { getItemImageLink } from '@/utils/uploadLink';
+import { API } from '@/utils/api';
 
 // Hello there ! This is a big file (and it's not the only one :P), I commented it as well as I could, I hope you'll understand :)
 
@@ -293,8 +294,14 @@ const Shop = () => {
   const onPay = async () => {
     setHasRequestedPayment(true);
     deleteCart();
-    const token = await cartPay(cart);
-    dispatch(setRedirect(`/dashboard/payment?stripeToken=${token}&cart=${JSON.stringify(cart)}`));
+    if (totalPrice) {
+      const token = await cartPay(cart);
+      dispatch(setRedirect(`/dashboard/payment?stripeToken=${token}&cart=${JSON.stringify(cart)}`));
+    } else {
+      API.post('carts/ffsu').then(() => {
+        dispatch(setRedirect('/dashboard/team'));
+      });
+    }
   };
 
   // Hide the places section if user can't buy any places
@@ -403,7 +410,7 @@ const Shop = () => {
                 veryLong
                 className={styles.shopButton}
                 onClick={onPay}
-                disabled={!totalPrice || !isCgvAccepted || hasRequestedPayment}>
+                disabled={(!totalPrice && (cart.tickets.userIds.length === 0)) || !isCgvAccepted || hasRequestedPayment}>
                 <Icon name={IconName.ShoppingCart} />
                 Payer
               </Button>

src/components/dashboard/Cart.stories.tsx

@@ -57,6 +57,7 @@ export const Default: Story = {
         age: UserAge.adult,
         attendant: {} as UserAttendant,
         orga: null,
+        ffsuLicense: 'A45D4F4F78'
       },
     ],
     onItemRemoved: () => {},

src/modules/login.ts

@@ -126,6 +126,15 @@ export const editUser =
     dispatch(updateStatus());
   };
 
+export const editUserFfsu =
+  (data: { ffsuLicense: string | null }): AppThunk =>
+  async (dispatch) => {
+    const res = await API.patch(`users/current/ffsu`, data);
+    toast.success('Ton numéro de licence FFSU a été modifié');
+    dispatch(updateUser(res));
+    dispatch(updateStatus());
+  };
+
 export const resetPassword =
   (email: string, resetFields: () => unknown): AppThunk =>
   async (dispatch) => {

src/types.ts

@@ -87,6 +87,7 @@ export interface User {
   discordId: string | null;
   teamId: string | null;
   askingTeamId: string | null;
+  ffsuLicense: string | null;
   attendant: UserAttendant;
   age: UserAge;
   orga: OrgaData | null;
@@ -98,6 +99,10 @@ export interface UserEdit {
   newPassword: string;
 }
 
+export interface UserEditFfsu {
+  ffsuLicense: string | null;
+}
+
 export interface UserRestricted {
   id: string;
   username: string;
@@ -227,6 +232,7 @@ export interface Tournament {
   placesLeft: number;
   infos: string | null;
   format: string | null;
+  ffsu: boolean;
   cashprize: number | null;
   cashprizeDetails: string | null;
   casters: Caster[] | null;