L'écran de review OCR avait un Input texte libre pour le nom du client, ce qui faisait qu'on créait un nouveau client à chaque validation même quand le nom matchait un client existant — doublons assurés. Maintenant l'OCR fait le matching en amont : - L'extraction côté MSW (fakeOcrExtract) cherche un client existant par nom case-insensitive et pré-remplit clientId dans extracted/edited. Confidence clientName = 1 quand match (vs 0.95 sinon). - DraftFields type ajoute clientId: string | null - draftFieldsSchema (validation) ajoute clientId nullable Côté UI : - L'Input clientName devient un ClientCombobox (le même que pour la saisie manuelle — chunk mutualisé 26 KB gzip) - Border rubis quand un client existant est sélectionné - Hint contextuel sur le Field : · clientId set → "Lié à un client existant ✓" · clientId null + nom ≥ 2 chars → "Nouveau client — sera créé à la validation." · Sinon → "Tapez pour rechercher ou créer un client." Validate handler MSW (résolution client en cascade) : 1. clientId explicite (combobox) → utilise direct, zéro lookup 2. Match par nom case-insensitive sur les clients existants → utilise si match 3. Création à la volée si rien ne matche Fallback création si clientId fourni mais introuvable. Migration mockDb : les batches d'import seedés avant l'ajout du champ sont patchés à load() avec clientId ?? null (spread des données stockées d'abord pour ne pas écraser les snapshots récents). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
React + TypeScript + Vite
This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
Currently, two official plugins are available:
- @vitejs/plugin-react uses Oxc
- @vitejs/plugin-react-swc uses SWC
React Compiler
The React Compiler is not enabled on this template because of its impact on dev & build performances. To add it, see this documentation.
Expanding the ESLint configuration
If you are developing a production application, we recommend updating the configuration to enable type-aware lint rules:
export default defineConfig([
globalIgnores(['dist']),
{
files: ['**/*.{ts,tsx}'],
extends: [
// Other configs...
// Remove tseslint.configs.recommended and replace with this
tseslint.configs.recommendedTypeChecked,
// Alternatively, use this for stricter rules
tseslint.configs.strictTypeChecked,
// Optionally, add this for stylistic rules
tseslint.configs.stylisticTypeChecked,
// Other configs...
],
languageOptions: {
parserOptions: {
project: ['./tsconfig.node.json', './tsconfig.app.json'],
tsconfigRootDir: import.meta.dirname,
},
// other options...
},
},
])
You can also install eslint-plugin-react-x and eslint-plugin-react-dom for React-specific lint rules:
// eslint.config.js
import reactX from 'eslint-plugin-react-x'
import reactDom from 'eslint-plugin-react-dom'
export default defineConfig([
globalIgnores(['dist']),
{
files: ['**/*.{ts,tsx}'],
extends: [
// Other configs...
// Enable lint rules for React
reactX.configs['recommended-typescript'],
// Enable lint rules for React DOM
reactDom.configs.recommended,
],
languageOptions: {
parserOptions: {
project: ['./tsconfig.node.json', './tsconfig.app.json'],
tsconfigRootDir: import.meta.dirname,
},
// other options...
},
},
])