# All files / src/pages LegacyPage.js

100% Statements 23/23
100% Branches 6/6
100% Functions 4/4
100% Lines 22/22

Press n or j to go to the next uncovered block, b, p or k for the previous block.

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100

    115x
    115x
    115x

    115x
    10x
    10x

    1x

    115x
    6x
    6x

    6x
    1x
    1x
    1x

    5x
    5x
    3x

    3x
    3x

    2x
    2x

    115x

     import { useEffect, useState } from 'react';
    import NavLink from '../components/NavLink/NavLink';
    import PageNavigation from '../components/PageNavigation/PageNavigation';
    import RegistrationForm from '../components/RegistrationForm/RegistrationForm';
    import RegistrationsList from '../components/RegistrationsList/RegistrationsList';
    import Toast from '../components/Toast/Toast';
    import { DOCS_URL } from '../constants/navigation';
    import { useRegistrationForm } from '../hooks/useRegistrationForm';
    import { useToast } from '../hooks/useToast';
    import { getRegistrations, handleSubmit } from '../module/module';
    import './LegacyPage.css';

    function LegacyPage() {
      const {
        formValues,
        fieldErrors,
        setFieldErrors,
        onChange,
        resetForm,
        validateAllFields,
        isSubmitDisabled
      } = useRegistrationForm();
      const { toastMessage, toastType, showToast } = useToast();
      const [registrations, setRegistrations] = useState([]);

      useEffect(() => {
        try {
          setRegistrations(getRegistrations());
        } catch (error) {
          showToast(error.message || 'Une erreur est survenue', 'error');
        }
      }, [showToast]);

      const onSubmit = (e) => {
        const nextErrors = validateAllFields();
        setFieldErrors(nextErrors);

        if (Object.keys(nextErrors).length > 0) {
          e.preventDefault();
          showToast('Veuillez corriger les erreurs du formulaire.', 'error');
          return;
        }

        try {
          const savedRegistration = handleSubmit(e);
          setRegistrations((previousRegistrations) => [
            ...previousRegistrations,
            savedRegistration
          ]);
          resetForm();
          showToast('Formulaire valide et enregistre.', 'success');
        } catch (error) {
          e.preventDefault();
          showToast(error.message || 'Une erreur est survenue', 'error');
        }
      };

      return (
        <div className="legacy-page" data-testid="legacy-page">
          <header className="legacy-page-header">
            <h1>Mode legacy</h1>
            <p>Formulaire et liste des inscrits sur une seule page (comportement initial).</p>
            <PageNavigation variant="on-dark" ariaLabel="Navigation legacy">
              <NavLink to="/" theme="dark" testId="go-to-home">
                Accueil
              </NavLink>
              <NavLink to="/register" theme="dark" variant="primary" testId="go-to-registration">
                Inscription
              </NavLink>
              <NavLink to="/list" theme="dark" testId="go-to-list">
                Liste
              </NavLink>
              <NavLink href={DOCS_URL} external theme="dark" testId="go-to-docs">
                Documentation
              </NavLink>
            </PageNavigation>
          </header>

          <RegistrationForm
            formValues={formValues}
            fieldErrors={fieldErrors}
            isSubmitDisabled={isSubmitDisabled}
            onChange={onChange}
            onSubmit={onSubmit}
          />

          <RegistrationsList
            registrations={registrations}
            title="Liste des inscrits"
            headingLevel="h2"
            testId="legacy-registrations-list"
          />

          <Toast message={toastMessage} type={toastType} />
        </div>
      );
    }

    export default LegacyPage;