Recueillir à l'embauche ce qu'exige le contrat

Créer un salarié demandait cinq champs. Le contrat, la déclaration et le
registre en réclament une vingtaine, et rien ne permettait de les saisir :
le sexe, le nom de naissance, le pays et le département de naissance, la
situation de famille, les personnes à charge, le téléphone fixe, le
complément d'adresse et l'heure d'embauche n'existaient pas en base.

La migration les ajoute, toutes facultatives : un dossier incomplet doit
pouvoir exister — c'est au registre de signaler ce qui lui manque, pas à
la base de refuser l'embauche. Seul l'envoi des plannings par SMS fait
exception : c'est un consentement, donc faux par défaut, la charge de la
preuve pesant sur l'employeur.

Le pays et le département de naissance sont des colonnes à part et non une
commune saisie librement : la déclaration sociale les demande séparément,
et les rétro-extraire échouerait au premier « Bar-le-Duc (Meuse) ».

Le formulaire devient un panneau latéral : une trentaine de champs posés
au centre masquaient l'annuaire, et on embauche en regardant qui est déjà
là. Le matricule y est proposé à la suite du dernier, attribué dans la
transaction pour que deux embauches simultanées ne tombent pas sur le même
rang. Le nom de naissance vaut le nom de famille quand il n'en diffère
pas, plutôt que d'imposer une ressaisie à l'immense majorité des dossiers.

Le responsable hiérarchique et la politique RTT se posent enfin à
l'embauche : les deux modèles existaient sans qu'aucun écran ne les
alimente.

Le registre unique du personnel gagne sa colonne « sexe » et se tient
désormais au nom de naissance — le nom d'usage peut changer sans que la
personne change.

La migration s'applique au redéploiement : l'entrypoint du conteneur passe
`prisma migrate deploy` avant de démarrer le serveur. Elle n'ajoute que des
colonnes nullables et deux types énumérés, sans réécriture de table.
Écrite et validée contre le schéma, non exécutée ici : aucune base n'était
ouverte.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

src/app/(app)/equipe/AddEmployeeDialog.tsx

@@ -4,23 +4,28 @@ import { useEffect, useRef, useState } from 'react';
 
 import { AddEmployeeForm } from '@/app/(app)/equipe/AddEmployeeForm';
 import { Button } from '@/components/ui/Button';
-import type { ContractLocation } from '@/server/employees/queries';
+import type {
+  ContractLocation,
+  HiringOptions,
+} from '@/server/employees/queries';
 
 /**
- * Ajout d'un collaborateur, en modale.
+ * Embauche, en panneau latéral.
  *
- * Le formulaire d'embauche compte une quinzaine de champs : posé au bas de la
- * liste, il occupait plus de place que l'effectif qu'on vient consulter. Il ne
- * s'ouvre donc qu'à la demande.
+ * Une trentaine de champs : posés au bas de la liste, ils occupaient plus de
+ * place que l'effectif qu'on vient consulter. Le panneau glisse par la droite
+ * et laisse l'annuaire visible — on embauche en regardant qui est déjà là.
  *
- * `<dialog>` natif plutôt qu'un panneau maison : il apporte le piège de focus,
- * la fermeture par Échap et le fond inerte, trois choses qu'une `<div>` doit
- * réimplémenter et rate presque toujours.
+ * `<dialog>` natif plutôt qu'un panneau maison : le piège de focus, la
+ * fermeture par Échap et le fond inerte viennent avec, et une `<div>` doit les
+ * réimplémenter sans jamais les tenir tout à fait.
  */
 export function AddEmployeeDialog({
   locations,
+  options,
 }: {
   locations: ContractLocation[];
+  options: HiringOptions;
 }) {
   const dialog = useRef<HTMLDialogElement>(null);
   const [open, setOpen] = useState(false);
@@ -40,29 +45,32 @@ export function AddEmployeeDialog({
 
       <dialog
         ref={dialog}
-        aria-labelledby="ajout-collaborateur"
+        aria-labelledby="titre-embauche"
         onClose={() => setOpen(false)}
-        className="m-auto w-[min(46rem,calc(100vw-2rem))] rounded-3 border border-line-1 bg-surface p-0 text-ink-1 backdrop:bg-[rgb(0_0_0/0.4)]"
+        className="mt-0 mr-0 mb-0 ml-auto h-full max-h-none w-[min(30rem,100vw)] max-w-none border-l border-line-1 bg-surface p-0 text-ink-1 backdrop:bg-[rgb(0_0_0/0.4)]"
       >
-        <header className="flex items-center gap-3 border-b border-line-1 px-5 py-4">
-          <h2 id="ajout-collaborateur" className="text-md font-semibold">
-            Ajouter un collaborateur
-          </h2>
-          <span className="flex-1" />
-          <Button variant="ghost" onClick={() => setOpen(false)}>
-            Fermer
-          </Button>
-        </header>
+        <div className="flex h-full flex-col">
+          <header className="flex items-center gap-3 border-b border-line-1 px-5 py-4">
+            <h2 id="titre-embauche" className="text-md font-semibold">
+              Nouvel employé
+            </h2>
+            <span className="flex-1" />
+            <Button variant="ghost" onClick={() => setOpen(false)}>
+              Fermer
+            </Button>
+          </header>
 
-        <div className="max-h-[70vh] overflow-y-auto p-5">
-          {open ? (
-            // Monté à l'ouverture : un formulaire démonté entre deux usages
-            // repart vide, sans traîner la saisie abandonnée la fois d'avant.
-            <AddEmployeeForm
-              locations={locations}
-              onSaved={() => setOpen(false)}
-            />
-          ) : null}
+          <div className="min-h-0 flex-1 overflow-y-auto px-5 pt-5">
+            {open ? (
+              // Monté à l'ouverture : un formulaire démonté entre deux usages
+              // repart vide, sans traîner la saisie abandonnée la fois d'avant.
+              <AddEmployeeForm
+                locations={locations}
+                options={options}
+                onSaved={() => setOpen(false)}
+              />
+            ) : null}
+          </div>
         </div>
       </dialog>
     </>