-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #601 from MTES-MCT/feat/lic-papier
Feat/lic papier
- Loading branch information
Showing
51 changed files
with
1,434 additions
and
838 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,150 @@ | ||
| import React from "react"; | ||
|
|
||
| import classNames from "classnames"; | ||
| import { CURRENT_YEAR } from "common/utils/time"; | ||
| import { Input } from "./Input"; | ||
|
|
||
| const BIRTH_DATE_MIN_YEAR = 100; | ||
| const BIRTH_DATE_MAX_YEAR = 18; | ||
|
|
||
| export function BirthDate({ label, userBirthDate, setUserBirthDate }) { | ||
| const [day, setDay] = React.useState(""); | ||
| const [month, setMonth] = React.useState(""); | ||
| const [year, setYear] = React.useState(""); | ||
|
|
||
| const [dayState, setDayState] = React.useState("default"); | ||
| const [monthState, setMonthState] = React.useState("default"); | ||
| const [yearState, setYearState] = React.useState("default"); | ||
| const [dateState, setDateState] = React.useState("default"); | ||
|
|
||
| React.useEffect(() => { | ||
| if (!userBirthDate) { | ||
| return; | ||
| } | ||
| const date = new Date(userBirthDate); | ||
| setYear(date.getFullYear()); | ||
| setMonth(date.getMonth() + 1); | ||
| setDay(date.getDate()); | ||
| }, [userBirthDate]); | ||
|
|
||
| const MAX_BIRTH_DATE_YEAR = React.useMemo( | ||
| () => CURRENT_YEAR - BIRTH_DATE_MAX_YEAR, | ||
| [CURRENT_YEAR] | ||
| ); | ||
| const MIN_BIRTH_DATE_YEAR = React.useMemo( | ||
| () => CURRENT_YEAR - BIRTH_DATE_MIN_YEAR, | ||
| [CURRENT_YEAR] | ||
| ); | ||
|
|
||
| const onValidateBirthDate = () => { | ||
| let hasError = false; | ||
| if ( | ||
| year !== "" && | ||
| (year < MIN_BIRTH_DATE_YEAR || year > MAX_BIRTH_DATE_YEAR) | ||
| ) { | ||
| setYearState("error"); | ||
| hasError = true; | ||
| } else { | ||
| setYearState("default"); | ||
| } | ||
| if (month !== "" && (month < 1 || month > 12)) { | ||
| setMonthState("error"); | ||
| hasError = true; | ||
| } else { | ||
| setMonthState("default"); | ||
| } | ||
| if (day !== "" && (day < 1 || day > 31)) { | ||
| setDayState("error"); | ||
| hasError = true; | ||
| } else { | ||
| setDayState("default"); | ||
| } | ||
|
|
||
| if (!hasError && day !== "" && month !== "" && year !== "") { | ||
| const date = new Date(year, month - 1, day, 10, 0, 0, 0); | ||
| const validYear = date.getFullYear() === parseInt(year); | ||
| const validMonth = date.getMonth() === parseInt(month - 1); | ||
| const validDay = date.getDate() === parseInt(day); | ||
| if (validYear && validMonth && validDay) { | ||
| setDateState("default"); | ||
| const newDateString = date.toISOString().split("T")[0]; | ||
| setUserBirthDate(newDateString); | ||
| } else { | ||
| setDateState("error"); | ||
| } | ||
| } else { | ||
| setDateState("default"); | ||
| } | ||
| }; | ||
|
|
||
| return ( | ||
| <fieldset | ||
| role="group" | ||
| aria-labelledby="date-naissance-salarie" | ||
| aria-describedby="date-naissance-salarie-error" | ||
| className={classNames( | ||
| "fr-fieldset", | ||
| dateState === "error" ? "fr-input-group--error" : "" | ||
| )} | ||
| style={{ alignItems: "flex-start" }} | ||
| > | ||
| <legend className="fr-fieldset__legend" id="date-naissance-salarie"> | ||
| {label} | ||
| </legend> | ||
| <div className="fr-fieldset__element fr-fieldset__element--inline fr-fieldset__element--number"> | ||
| <Input | ||
| nativeInputProps={{ | ||
| value: day, | ||
| onChange: e => setDay(e.target.value), | ||
| onBlur: onValidateBirthDate, | ||
| type: "number", | ||
| inputMode: "numeric" | ||
| }} | ||
| type="number" | ||
| label="Jour" | ||
| hintText="Entre 1 et 31" | ||
| required | ||
| state={dayState} | ||
| stateRelatedMessage="Jour invalide. Exemple : 14." | ||
| /> | ||
| </div> | ||
| <div className="fr-fieldset__element fr-fieldset__element--inline fr-fieldset__element--number"> | ||
| <Input | ||
| nativeInputProps={{ | ||
| value: month, | ||
| onChange: e => setMonth(e.target.value), | ||
| onBlur: onValidateBirthDate, | ||
| type: "number", | ||
| inputMode: "numeric" | ||
| }} | ||
| label="Mois" | ||
| hintText="Entre 1 et 12" | ||
| required | ||
| state={monthState} | ||
| stateRelatedMessage="Mois invalide. Exemple : 12." | ||
| /> | ||
| </div> | ||
| <div className="fr-fieldset__element fr-fieldset__element--inline fr-fieldset__element--inline-grow fr-fieldset__element--year"> | ||
| <Input | ||
| nativeInputProps={{ | ||
| value: year, | ||
| onChange: e => setYear(e.target.value), | ||
| onBlur: onValidateBirthDate, | ||
| type: "number", | ||
| inputMode: "numeric" | ||
| }} | ||
| label="Année" | ||
| hintText="Exemple : 1984" | ||
| required | ||
| state={yearState} | ||
| stateRelatedMessage="Année invalide : elle doit être comprise entre 1924 et 2006. Exemple : 1990." | ||
| /> | ||
| </div> | ||
| {dateState === "error" && ( | ||
| <p id="date-naissance-salarie-error" className="fr-error-text"> | ||
| Date invalide : ce jour n'existe pas. | ||
| </p> | ||
| )} | ||
| </fieldset> | ||
| ); | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,20 @@ | ||
| import React from "react"; | ||
|
|
||
| export const SirenFieldset = ({ | ||
| labelAnnuaire = "Annuaire des entreprises", | ||
| children | ||
| }) => ( | ||
| <fieldset className="fr-fieldset" aria-label="Identifiant entreprise"> | ||
| <div className="fr-fieldset__element">{children}</div> | ||
| <div className="fr-mt-n1v fr-fieldset__element"> | ||
| <a | ||
| className="fr-link" | ||
| target="_blank" | ||
| rel="noopener noreferrer" | ||
| href="https://annuaire-entreprises.data.gouv.fr/" | ||
| > | ||
| {labelAnnuaire} | ||
| </a> | ||
| </div> | ||
| </fieldset> | ||
| ); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,28 @@ | ||
| export function sirenValidationErrorMessage(siren) { | ||
| if (!siren) { | ||
| return "Veuillez compléter ce champ."; | ||
| } | ||
| if (siren.length !== 9 || !/^\d+$/.test(siren)) { | ||
| return "Ce numéro SIREN n'est pas valide. Le numéro SIREN est composé de 9 chiffres."; | ||
| } | ||
|
|
||
| // The last digit of the 9-digit siren must be the Luhn checksum of the 8 firsts | ||
| // The following implementation is inspired from https://simplycalc.com/luhn-source.php | ||
|
|
||
| let luhnSum = 0; | ||
| for (let i = 8; i >= 0; i--) { | ||
| let digit = parseInt(siren.charAt(i)); | ||
| if (i % 2 === 1) { | ||
| digit *= 2; | ||
| } | ||
| if (digit > 9) { | ||
| digit -= 9; | ||
| } | ||
| luhnSum += digit; | ||
| } | ||
| const validSiren = luhnSum % 10 === 0; | ||
| if (!validSiren) { | ||
| return "Ce numéro SIREN n'est pas valide. Vérifiez le numéro auprès de l'entreprise ou de la personne qui vous l'a transmis."; | ||
| } | ||
| return null; | ||
| } |
Oops, something went wrong.