Mise à jour des formulaires d'inscription/connexion

.gitignore

@@ -79,3 +79,5 @@ sonar.properties
 **/*.copy.ts
 **/*.copy.scss
 **/*.copy.html
+
+certificates

package.json

@@ -7,6 +7,7 @@
   },
   "scripts": {
     "dev": "next dev",
+    "secure": "next dev --experimental-https",
     "build": "next build",
     "start": "next start",
     "lint": "next lint",

src/app/login/_components/loginForm/presentation.tsx

@@ -1,4 +1,4 @@
-import { Button } from "@/modules/common/components/button";
+import { Button, Form } from "react-bootstrap";
 import { ErrorMessage } from "@/modules/common/components/errorMessage";
 import { SubmissionResult, useForm } from "@conform-to/react";
 import { parseWithZod } from "@conform-to/zod";
@@ -32,33 +32,36 @@ export const LoginForm = ({ result, action, isPending }: Props) => {
   return (
     <>
       <ErrorMessage messages={form.errors} />
-      <form id={form.id} onSubmit={form.onSubmit} action={action} noValidate={true}>
-        <fieldset className="form-group">
-          <input
+      <Form id={form.id} action={action} onSubmit={form.onSubmit} noValidate={true}>
+        <Form.Group className="mb-3" controlId="formEmail">
+          <Form.Label>Adresse email</Form.Label>
+          <Form.Control
             type="email"
             key={fields.email.key}
             name={fields.email.name}
             defaultValue={fields.email.initialValue}
-            placeholder="Email"
-            className="form-control form-control-lg"
+            placeholder="Votre adresse email"
           />
           <ErrorMessage messages={fields.email.errors} />
-        </fieldset>
-        <fieldset className="form-group">
-          <input
+        </Form.Group>
+        <Form.Group className="mb-3" controlId="formPassword">
+          <Form.Label>Mot de passe</Form.Label>
+          <Form.Control
             type="password"
             key={fields.password.key}
             name={fields.password.name}
             defaultValue={fields.password.initialValue}
-            placeholder="Password"
-            className="form-control form-control-lg"
+            placeholder="Mot de passe"
+            autoComplete="new-password"
           />
           <ErrorMessage messages={fields.password.errors} />
-        </fieldset>
-        <Button component="button" size="lg" type="submit" className="pull-xs-right" disabled={isPending}>
-          Se connecter
-        </Button>
-      </form>
+        </Form.Group>
+        <div className="d-flex justify-content-end">
+          <Button variant="primary" type="submit" disabled={isPending}>
+            Se connecter
+          </Button>
+        </div>
+      </Form>
     </>
   );
 };

src/app/register/_components/registrationForm/presentation.tsx

@@ -1,4 +1,4 @@
-import { Button, Form } from 'react-bootstrap';
+import { Button, Form } from "react-bootstrap";
 //import { Button } from "@/modules/common/components/button";
 import { ErrorMessage } from "@/modules/common/components/errorMessage";
 import { SubmissionResult, useForm } from "@conform-to/react";
@@ -7,96 +7,95 @@ import { startTransition } from "react";
 import { inputsSchema } from "./types";
 
 type Props = {
-    action?: (formData: FormData) => void;
-    isPending?: boolean;
-    result?: SubmissionResult<string[]>;
+  action?: (formData: FormData) => void;
+  isPending?: boolean;
+  result?: SubmissionResult<string[]>;
 };
 
 export const RegistrationForm = ({ result, action, isPending }: Props) => {
-    const [form, fields] = useForm({
-        lastResult: result,
-        onValidate({ formData }) {
-            return parseWithZod(formData, { schema: inputsSchema });
-        },
-        // onSubmit is defined to avoid resetting form after successful submission
-        // see https://github.com/edmundhung/conform/discussions/606
-        onSubmit(event, { formData }) {
-            event.preventDefault();
-            startTransition(() => {
-                action?.(formData);
-            });
-        },
-        shouldValidate: "onBlur",
-        shouldRevalidate: "onBlur",
-    });
+  const [form, fields] = useForm({
+    lastResult: result,
+    onValidate({ formData }) {
+      return parseWithZod(formData, { schema: inputsSchema });
+    },
+    // onSubmit is defined to avoid resetting form after successful submission
+    // see https://github.com/edmundhung/conform/discussions/606
+    onSubmit(event, { formData }) {
+      event.preventDefault();
+      startTransition(() => {
+        action?.(formData);
+      });
+    },
+    shouldValidate: "onBlur",
+    shouldRevalidate: "onBlur",
+  });
 
-    return (
-        <>
-            <ErrorMessage messages={form.errors} />
-            <Form id={form.id} action={action} onSubmit={form.onSubmit} noValidate={true}>
-                <Form.Group className="mb-3" controlId="formFirstname">
-                    <Form.Label>Nom</Form.Label>
-                    <Form.Control
-                        type="text"
-                        key={fields.lastname.key}
-                        name={fields.lastname.name}
-                        defaultValue={fields.lastname.initialValue}
-                        placeholder="Votre nom"
-                    />
-                    <ErrorMessage messages={fields.firstname.errors} />
-                </Form.Group>
-                <Form.Group className="mb-3" controlId="formLastname">
-                    <Form.Label>Prénom</Form.Label>
-                    <Form.Control
-                        type="text"
-                        key={fields.firstname.key}
-                        name={fields.firstname.name}
-                        defaultValue={fields.firstname.initialValue}
-                        placeholder="Votre prénom"
-                    />
-                    <ErrorMessage messages={fields.lastname.errors} />
-                </Form.Group>
-                <Form.Group className="mb-3" controlId="formUsername">
-                    <Form.Label>Pseudo</Form.Label>
-                    <Form.Control
-                        type="text"
-                        key={fields.username.key}
-                        name={fields.username.name}
-                        defaultValue={fields.username.initialValue}
-                        placeholder="Votre pseudo"
-                    />
-                    <ErrorMessage messages={fields.username.errors} />
-                </Form.Group>
-                <Form.Group className="mb-3" controlId="formEmail">
-                    <Form.Label>Adresse email</Form.Label>
-                    <Form.Control
-                        type="email"
-                        key={fields.email.key}
-                        name={fields.email.name}
-                        defaultValue={fields.email.initialValue}
-                        placeholder="Votre adresse email"
-                    />
-                    <ErrorMessage messages={fields.email.errors} />
-                    <Form.Text className="text-muted">
-                        Nous ne partagerons jamais votre email avec qui que ce soit.
-                    </Form.Text>
-                </Form.Group>
-                <Form.Group className="mb-3" controlId="formPassword">
-                    <Form.Label>Mot de passe</Form.Label>
-                    <Form.Control
-                        type="password"
-                        key={fields.password.key}
-                        name={fields.password.name}
-                        defaultValue={fields.password.initialValue}
-                        placeholder="Mot de passe"
-                        autoComplete="new-password"
-                    />
-                    <ErrorMessage messages={fields.password.errors} />
-                </Form.Group>
-                <Button variant="primary" type="submit" disabled={isPending}>
-                    Submit
-                </Button>
-            </Form>
-        </>
-    );
+  return (
+    <>
+      <ErrorMessage messages={form.errors} />
+      <Form id={form.id} action={action} onSubmit={form.onSubmit} noValidate={true}>
+        <Form.Group className="mb-3" controlId="formFirstname">
+          <Form.Label>Nom</Form.Label>
+          <Form.Control
+            type="text"
+            key={fields.lastname.key}
+            name={fields.lastname.name}
+            defaultValue={fields.lastname.initialValue}
+            placeholder="Votre nom"
+          />
+          <ErrorMessage messages={fields.firstname.errors} />
+        </Form.Group>
+        <Form.Group className="mb-3" controlId="formLastname">
+          <Form.Label>Prénom</Form.Label>
+          <Form.Control
+            type="text"
+            key={fields.firstname.key}
+            name={fields.firstname.name}
+            defaultValue={fields.firstname.initialValue}
+            placeholder="Votre prénom"
+          />
+          <ErrorMessage messages={fields.lastname.errors} />
+        </Form.Group>
+        <Form.Group className="mb-3" controlId="formUsername">
+          <Form.Label>Pseudo</Form.Label>
+          <Form.Control
+            type="text"
+            key={fields.username.key}
+            name={fields.username.name}
+            defaultValue={fields.username.initialValue}
+            placeholder="Votre pseudo"
+          />
+          <ErrorMessage messages={fields.username.errors} />
+        </Form.Group>
+        <Form.Group className="mb-3" controlId="formEmail">
+          <Form.Label>Adresse email</Form.Label>
+          <Form.Control
+            type="email"
+            key={fields.email.key}
+            name={fields.email.name}
+            defaultValue={fields.email.initialValue}
+            placeholder="Votre adresse email"
+          />
+          <ErrorMessage messages={fields.email.errors} />
+        </Form.Group>
+        <Form.Group className="mb-3" controlId="formPassword">
+          <Form.Label>Mot de passe</Form.Label>
+          <Form.Control
+            type="password"
+            key={fields.password.key}
+            name={fields.password.name}
+            defaultValue={fields.password.initialValue}
+            placeholder="Mot de passe"
+            autoComplete="new-password"
+          />
+          <ErrorMessage messages={fields.password.errors} />
+        </Form.Group>
+        <div className="d-flex justify-content-end">
+          <Button variant="primary" type="submit" disabled={isPending}>
+            Créer mon compte
+          </Button>
+        </div>
+      </Form>
+    </>
+  );
 };

src/modules/common/components/footer/footer.tsx

@@ -18,8 +18,8 @@ export const Footer = () => (
           </Link>
           <ul className="list-unstyled small">
             <li className="mb-2">
-              L&apos;équipe de passionnés Ad Astra est réactive et à l&apos;écoute de vos demandes afin de vous
-              accompagner au mieux et satisfaire vos besoins en fleurs et hashes CBD de qualité.
+              L&apos;équipe Ad Astra est réactive et à l&apos;écoute de vos demandes afin de vous accompagner au mieux
+              et satisfaire vos besoins en fleurs et hashes CBD de qualité.
             </li>
             <li className="mb-2">Exigez la qualité Ad Astra, vous la méritez.</li>
           </ul>
@@ -124,7 +124,7 @@ export const Footer = () => (
         </div>
       </div>
     </div>
-    <hr className="mt-3 mb-4" />
-    <p className="text-muted px-4 small">Copyright © 2025 Ad Astra</p>
+    <hr className="my-3" />
+    <p className="text-muted px-4 mb-2 small">Copyright © 2025 Ad Astra</p>
   </footer>
 );

src/styles/styles.scss

@@ -5,7 +5,7 @@ $success: #7952b3;
 $dark-blue: #141d5e; /*#171f50;*/
 $dark-grey: #222222;
 $gold: #d7c067;
-$orange: #FF8300;
+$orange: #ff8300;
 $time-grey: #b7b2aa;
 $time-grey-dark: #474747;
 $dark-grey: #222222;
@@ -34,6 +34,13 @@ body {
   }
 }
 
+.error-messages {
+  width: 100%;
+  margin-top: 0.25rem;
+  font-size: 0.875em;
+  color: var(--bs-form-invalid-color);
+}
+
 .clock {
   height: 100px;
   .divider {