Add text register

src/components/RegisterForm/RegisterForm.tsx

@@ -32,68 +32,113 @@ const RegisterForm = (): JSX.Element => {
     return (
         <form onSubmit={onSubmit}>
             <dl className={styles.registerIntro} key="register-intro">
-                <dt>Qu&apos;est-ce le festival ?</dt>
+                <dt>Qu&apos;est-ce que Paris est Ludique ?</dt>
                 <dd>
-                    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
+                    <p>
-                    incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis
+                        Cette grande fête est dédiée aux <b>jeux de société modernes</b> sous toutes
-                    nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
+                        leurs formes.
-                    Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu
+                    </p>
-                    fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in
+                    <p>
-                    culpa qui officia deserunt mollit anim id est laborum.
+                        En 2019 lors de la dernière édition, ce sont <b>16 000</b> joueurs qui se
+                        sont réunis sous 300 chapiteaux et 2 000 tables.
+                    </p>
+                    <p>
+                        Les 2 jours que durent le festival sont entièrement dédiés à ce que le
+                        public <b>JOUE</b>, que ce soit sur les stands d&apos;éditeurs,
+                        d&apos;associations, d&apos;animateurs bénévoles, du coin des petits
+                        joueurs, de l&apos;espace tournois, ou de l&apos;espace prototypes.
+                    </p>
                 </dd>
-                <dt>Être bénévole à PEL c&apos;est :</dt>
+                <dt>Et les bénévoles de PeL ?</dt>
                 <dd>
-                    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
+                    <p>
-                    incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis
+                        L&apos;organisation du festival est <b>entièrement gérée par nous</b>, les
-                    nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
+                        bénévoles. À aucun moment ça ne doit devenir une corvée, donc nous faisons
-                    Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu
+                        tout pour passer <b>un aussi bon moment que les visiteurs</b> :)
-                    fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in
+                    </p>
-                    culpa qui officia deserunt mollit anim id est laborum.
+                    <p>
+                        C&apos;est pour ça que chaque mois, ceux qui sont dispo prennent
+                        l&apos;apéro tous ensemble en jouant et discutant de l&apos;organisation.
+                    </p>
+                    <p>
+                        Pendant le festival de 2019, nous étions <b>187 bénévoles</b> organisés en
+                        équipes spécialisées qui chouchoutent les visiteurs en les accueillant, en
+                        s&apos;assurant que tout se passe bien, ou en expliquant des règles de jeux.
+                    </p>
+                    <p>
+                        Une équipe s&apos;occupe même du bien être des bénévoles en leur servant à
+                        boire et à manger dans un espace à part où faire des pauses régulières.
+                    </p>
+                    <p>
+                        Les deux jours avant et le jour après le festival, ceux qui le peuvent
+                        viennent tout préparer et ranger. Certains ne sont disponibles que ces jours
+                        là et c&apos;est déjà d&apos;une grande aide !
+                    </p>
+                    <p>
+                        Nous nous arrangeons pour héberger les bénévoles qui habitent loin de Paris,
+                        et certains ne viennent qu&apos;un seul jour du weekend pour être visiteur
+                        l&apos;autre.
+                    </p>
+                    <p>
+                        Le samedi soir, cerise sur le gâteau, nous prenons un{" "}
+                        <b>dîner avec les auteurs, illustrateurs et éditeurs</b> qui sont présents
+                        sur le festival !
+                    </p>
+                </dd>
+                <dt>
+                    Si l&apos;expérience vous tente, n&apos;hésitez pas à remplir le formulaire
+                    suivant pour nous rencontrer lors d&apos;un des gros apéros mensuels !<br />
+                    Les prochains sont les 21 décembre et 27 janvier, mais nous vous appelerons
+                    d&apos;ici là pour discuter :)
+                </dt>
+                <dd>
+                    <div className={styles.formLine} key="line-firstname">
+                        <label htmlFor="firstname">Prénom</label>
+                        <input type="text" id="firstname" />
+                    </div>
+                    <div className={styles.formLine} key="line-lastname">
+                        <label htmlFor="lastname">Nom</label>
+                        <input type="text" id="lastname" />
+                    </div>
+                    <div className={styles.formLine} key="line-email">
+                        <label htmlFor="email">Email</label>
+                        <input type="email" id="email" />
+                    </div>
+                    <div className={styles.formLine} key="line-phone">
+                        <label htmlFor="phone">Téléphone</label>
+                        <input type="text" id="phone" />
+                    </div>
+                    <div className={styles.formLine} key="line-already-volunteer">
+                        <div>
+                            J&apos;ai déjà été bénévole
+                            <input
+                                type="radio"
+                                name="alreadyVolunteer"
+                                id="alreadyVolunteer-yes"
+                                className={styles.inputRadio}
+                            />
+                            <label htmlFor="alreadyVolunteer-yes">Oui</label>
+                            <input
+                                type="radio"
+                                name="alreadyVolunteer"
+                                id="alreadyVolunteer-no"
+                                className={styles.inputRadio}
+                            />
+                            <label htmlFor="alreadyVolunteer-no">Non</label>
+                        </div>
+                    </div>
+                    <div className={styles.formLine} key="line-message">
+                        <textarea
+                            name="message"
+                            id="message"
+                            placeholder="Des petits mots sympas, questions, envies, des infos sur toi, des compétences dont tu aimerais te servir... ou rien de tout ça et nous en discuterons au téléphone :)"
+                        />
+                    </div>
+                    <div className={styles.formButtons}>
+                        <button type="submit">Envoyer</button>
+                    </div>
                 </dd>
             </dl>
-            <div className={styles.formLine} key="line-firstname">
-                <label htmlFor="firstname">Prénom</label>
-                <input type="text" id="firstname" />
-            </div>
-            <div className={styles.formLine} key="line-lastname">
-                <label htmlFor="lastname">Nom</label>
-                <input type="text" id="lastname" />
-            </div>
-            <div className={styles.formLine} key="line-email">
-                <label htmlFor="email">Email</label>
-                <input type="email" id="email" />
-            </div>
-            <div className={styles.formLine} key="line-phone">
-                <label htmlFor="phone">Téléphone</label>
-                <input type="text" id="phone" />
-            </div>
-            <div className={styles.formLine} key="line-already-volunteer">
-                <div>J&apos;ai déjà été bénévole</div>
-                <input
-                    type="radio"
-                    name="alreadyVolunteer"
-                    id="alreadyVolunteer-yes"
-                    className={styles.inputRadio}
-                />
-                <label htmlFor="alreadyVolunteer-yes">Oui</label>
-                <input
-                    type="radio"
-                    name="alreadyVolunteer"
-                    id="alreadyVolunteer-no"
-                    className={styles.inputRadio}
-                />
-                <label htmlFor="alreadyVolunteer-no">Non</label>
-            </div>
-            <div className={styles.formLine} key="line-message">
-                <label htmlFor="message">
-                    Des petits mots sympas, questions, envies, des infos sur toi, des compétences
-                    dont tu aimerais te servir... dis-nous !!!
-                </label>
-                <textarea name="message" id="message" />
-            </div>
-            <div className={styles.formButtons}>
-                <button type="submit">Je deviens bénévole</button>
-            </div>
         </form>
     )
 }

src/components/RegisterForm/styles.module.scss

@@ -4,9 +4,15 @@
 .registerIntro {
     dt {
         font-weight: bold;
+        margin-top: 10px;
+        margin-bottom: 10px;
     }
     dd {
-        margin-bottom: 10px;
+        margin-bottom: 30px;
+    }
+    p {
+        margin-block-start: 0.3em;
+        margin-block-end: 0.3em;
     }
 }
 
@@ -26,14 +32,15 @@
         outline: 0;
     }
     textarea {
-        height: 80px;
+        height: 100px;
     }
     .inputRadio {
+        margin-left: 12px;
         width: inherit;
     }
     .inputRadio + label {
         display: inline;
-        margin: 0 20px 0 5px;
+        margin: 0 0 0 5px;
     }
 }
 

src/routes/index.ts

@@ -13,9 +13,7 @@ export default [
         routes: [
             {
                 path: "/",
-                exact: true,
+                component: Register,
-                component: AsyncHome, // Add your page here
-                loadData: loadHomeData, // Add your pre-fetch method here
             },
             {
                 path: "/MembrePage/:id",
@@ -28,7 +26,9 @@ export default [
             },
             {
                 path: "/register",
-                component: Register,
+                exact: true,
+                component: AsyncHome,
+                loadData: loadHomeData,
             },
             {
                 component: NotFound,

src/server/userManagement/__tests__/login.tsx

@@ -5,7 +5,9 @@
 import _ from "lodash"
 import { login } from "../login"
 
-// Could do a full test with wget --header='Content-Type:application/json' --post-data='{"email":"pikiou.sub@gmail.com","password":"mot de passe"}' http://localhost:3000/api/user/login
+// Could do a full test with: wget --header='Content-Type:application/json' --post-data='{"email":"pikiou.sub@gmail.com","password":"mot de passe"}' http://localhost:3000/api/user/login
+
+// Full test with Bearer: wget --header='Authorization: Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VyIjoicGlraW91c3ViQGdlYWlsLmNvbSIsInBlcm1pc3Npb25zIjpbXSwiaWF0IjoxNjM4MjUzODgzLCJleHAiOjE2Mzg4NTg2ODN9.MknJ4NfcVlgW2ODeimfwZI1a4z8asdEXtHwHgViy6c4' http://localhost:3000/MembreGet?id=1
 
 const mockUser = {
     mail: "my.email@gmail.com",