Parcours de démarrage : cartes Transactions (mots-clés) et Budget (feuilles, colonne Annuel) #430

New issue

Closed

opened 2026-10-12 23:23:20 +00:00 by maximus · 0 comments

maximus commented

2026-10-12 23:23:20 +00:00

Owner

Planifié le 2026-10-12 (/plan-run, jalon planned-2026-10-12-retours-onboarding-v0171), après /analyze et une revue /review-spec (sécurité, architecture, technique) dont les constats sont intégrés ci-dessous. Corps autosuffisant : la spec (spec-plan-retours-onboarding-v0171.md) est locale et ignorée par git.

Préalable : ce jalon s'exécute après le merge de planned-2026-10-10-fiabilite-tests (#408, #409, #395, #389). Les numéros de ligne cités sont lus sur main à 8b5b3b1 et ont pu bouger : se fier aux noms de fonctions, aux clés et aux textes cités.

Contexte

Faits vérifiés :

Le clic droit sur une transaction, classée ou non, puis « Ajouter comme mot-clé » (reports.keyword.addFromTransaction) ouvre AddKeywordDialog (src/pages/TransactionsPage.tsx:175-198) : mot-clé prérempli avec le premier mot de la description, choix de la catégorie, aperçu des transactions qui le contiennent, toutes cochées (AddKeywordDialog.tsx:82), puis « Appliquer et recatégoriser ». Le mot-clé est créé en priorité 100, au-dessus des mots-clés du seed (177 à 0, 2 à 50, 1 à 10), et les transactions cochées sont classées avec is_manually_categorized = 1 : l'étape « Classer une transaction à la main » se coche.
Seules les feuilles de la grille Budget acceptent un montant (src/components/budget/BudgetTable.tsx:249-297) ; un montant saisi dans « Annuel » est réparti également sur les 12 mois et remplace les montants mensuels (src/hooks/useBudget.ts:470-480).

Travail à faire

transactionsCardModel (src/utils/onboardingPath.ts:360-375) : ajouter addKeyword: "reports.keyword.addFromTransaction" aux labels de ses deux phrases.
budgetCardModel (:394-414) : ajouter annual: "budget.annual" aux labels de ses deux phrases.
Textes ci-dessous, en FR et en EN, puis le guide Markdown.
La mise en évidence ne change pas (catégorie de la première ligne, « Tout déplier » ou cellule du mois). La boîte du mot-clé ne change pas.

Textes (FR | EN)

Clé	FR	EN
`onboarding.card.transactions.uncategorized`	Seules les transactions {{filter, lowercase}} sont affichées. Faites un clic droit sur l'une d'elles, puis « {{addKeyword}} » : le mot-clé classe cette transaction et les transactions semblables de l'aperçu, et servira aux prochains imports. Gardez un mot propre au commerçant, pas « PAIEMENT », et décochez les transactions déjà bien classées. Vous pouvez aussi cliquer sur sa catégorie et en choisir une.	Only {{filter, lowercase}} transactions are shown. Right-click one of them, then “{{addKeyword}}”: the keyword categorizes it and the similar transactions in the preview, and will apply to future imports. Keep a word specific to the merchant, not “PAYMENT”, and uncheck the transactions already correctly categorized. You can also click its category and pick one.
`onboarding.card.transactions.all`	Faites un clic droit sur une transaction, puis « {{addKeyword}} » : le mot-clé classe cette transaction et les transactions semblables de l'aperçu, et servira aux prochains imports. Gardez un mot propre au commerçant, pas « PAIEMENT », et décochez les transactions déjà bien classées. Vous pouvez aussi cliquer sur sa catégorie et en choisir une.	Right-click a transaction, then “{{addKeyword}}”: the keyword categorizes it and the similar transactions in the preview, and will apply to future imports. Keep a word specific to the merchant, not “PAYMENT”, and uncheck the transactions already correctly categorized. You can also click its category and pick one.
`onboarding.card.budget.collapsed`	Cliquez « {{expand}} » pour afficher vos catégories. Seules celles du dernier niveau, sans chevron, acceptent un montant : cliquez sur un mois et saisissez-le (Entrée enregistre ; Tab enregistre et passe au mois suivant). Un montant saisi dans la colonne « {{annual}} » est réparti également sur les 12 mois et remplace les montants mensuels.	Click “{{expand}}” to show your categories. Only the last-level ones, without a chevron, take an amount: click a month and type it (Enter saves; Tab saves and moves to the next month). An amount typed in the “{{annual}}” column is split evenly over the 12 months and replaces the monthly amounts.
`onboarding.card.budget.flat`	Seules les catégories du dernier niveau, sans chevron, acceptent un montant : cliquez sur un mois et saisissez-le (Entrée enregistre ; Tab enregistre et passe au mois suivant). Un montant saisi dans la colonne « {{annual}} » est réparti également sur les 12 mois et remplace les montants mensuels.	Only last-level categories, without a chevron, take an amount: click a month and type it (Enter saves; Tab saves and moves to the next month). An amount typed in the “{{annual}}” column is split evenly over the 12 months and replaces the monthly amounts.
`docs.gettingStarted.subsections[0].steps[3]` (ajout en fin de puce)	Sur la page Transactions, la carte propose le clic droit et « Ajouter comme mot-clé » ; sur la page Budget, elle rappelle que seules les catégories du dernier niveau acceptent un montant et ce que fait la colonne Annuel.	On the Transactions page, the card suggests right-clicking and “Add as keyword”; on the Budget page, it recalls that only last-level categories take an amount and what the Annual column does.

Guide Markdown (§1 « Le parcours de démarrage », la puce qui commence par « La carte suit l'étape ») : la même phrase que docs.gettingStarted.subsections[0].steps[3].

Fichiers concernés

src/utils/onboardingPath.ts, src/utils/onboardingPath.test.ts
src/pages/TransactionsPage.render.test.tsx
src/i18n/locales/fr.json, src/i18n/locales/en.json
docs/guide-utilisateur.md, docs/qa-onboarding.html
CHANGELOG.md, CHANGELOG.fr.md

Depends on

#426

Lien d'ordre : #422, #427, #426 et cette issue touchent les mêmes fichiers (fr.json, en.json, onboardingPath.ts, guide, CHANGELOG).

Tests

transactionsCardModel : labels contient addKeyword dans les deux phrases, et filter dans uncategorized.
budgetCardModel : labels contient annual dans collapsed (avec expand) et dans flat ; états « fait » inchangés.
TransactionsPage.render.test.tsx : les phrases attendues (uncategorized, all) portent addKeyword.
Liste QA : les phrases des cartes Transactions et Budget.

Critères d'acceptation

La carte Transactions nomme « Ajouter comme mot-clé », entre guillemets, et porte la consigne sur le mot et les cases ; l'étape se coche toujours par un classement à la main, y compris par la boîte du mot-clé.
La carte Budget dit que seules les feuilles se saisissent et ce que fait la colonne Annuel, dans ses deux variantes.
FR et EN complets ; npm run build et npm test verts.

Review caveats

🟡 Sécurité, résolu par décision : suivie à la lettre, la carte mène à une recatégorisation en bloc sans retour arrière (toutes les correspondances précochées, mot générique prérempli comme « PAIEMENT » pour 3 des 7 lignes à classer du dossier d'exemple, règle en priorité 100). Max a retenu une consigne dans les deux variantes de la carte ; la boîte ne change pas.
🟡 Technique, résolu : TransactionsPage.render.test.tsx affirme les phrases exactes de la carte ; il est dans les fichiers.

Décisions prises en planification

L'étape de classement garde son critère (is_manually_categorized = 1) ; la carte guide vers « Ajouter comme mot-clé » (Max, 2026-10-12).
Consigne sur le mot et les cases dans la carte, boîte inchangée (Max, 2026-10-12).
Guillemets autour des libellés de contrôle interpolés (Max, 2026-10-12).
La carte de l'étape « Parcourir les catégories et les mots-clés », juste avant celle-ci, annonce qu'un mot-clé sera ajouté à cette étape : garder les deux textes cohérents.

Conventions

Toute chaîne en FR et en EN (src/i18n/locales/fr.json, en.json) ; les textes de ce corps s'écrivent mot pour mot (FR validé par Max le 2026-10-12, EN rédigé sur le même contenu).
Phrase de carte : un contrôle cité passe par StepCardText.labels (src/utils/onboardingPath.ts), traduit par StepCard ; jamais recopié dans la phrase. Guillemets « » en FR et “ ” en EN autour de chaque libellé de contrôle interpolé ; {{filter, lowercase}} sans guillemets.
CHANGELOG : une entrée sous ## [Unreleased] dans CHANGELOG.md et CHANGELOG.fr.md.
Tests de rendu : renderToStaticMarkup (pas de jsdom) et le faux t partagé livré par #389.
Aucune migration ; npm run build (il vérifie aussi les types des fichiers de test) et npm test verts.
Guide Markdown (docs/guide-utilisateur.md) : repérer une ligne par son texte cité, pas par son numéro.

CHANGELOG

Changed / Modifié : FR « Parcours de démarrage : la carte Transactions explique les mots-clés et propose « Ajouter comme mot-clé » ; la carte Budget précise que seules les catégories du dernier niveau acceptent un montant et ce que fait la colonne Annuel. » EN "Getting started: the Transactions card explains keywords and suggests “Add as keyword”; the Budget card states that only last-level categories take an amount and what the Annual column does."

Spec source

spec-plan-retours-onboarding-v0171.md (local, ignoré par git) ; décisions dans spec-decisions-retours-onboarding-v0171.md.

Les cartes du parcours n'expliquent ni les mots-clés à l'étape de classement, ni la saisie du budget (catégories du dernier niveau seulement, colonne Annuel). Retours de Max sur la v0.17.1 (#422, texte d'origine) ; textes validés par Max le 2026-10-12. > Planifié le 2026-10-12 (`/plan-run`, jalon `planned-2026-10-12-retours-onboarding-v0171`), après `/analyze` et une revue `/review-spec` (sécurité, architecture, technique) dont les constats sont intégrés ci-dessous. Corps autosuffisant : la spec (`spec-plan-retours-onboarding-v0171.md`) est locale et ignorée par git. > > **Préalable :** ce jalon s'exécute après le merge de `planned-2026-10-10-fiabilite-tests` (#408, #409, #395, #389). Les numéros de ligne cités sont lus sur `main` à `8b5b3b1` et ont pu bouger : se fier aux noms de fonctions, aux clés et aux textes cités. ## Contexte Faits vérifiés : - Le clic droit sur une transaction, classée ou non, puis « Ajouter comme mot-clé » (`reports.keyword.addFromTransaction`) ouvre `AddKeywordDialog` (`src/pages/TransactionsPage.tsx:175-198`) : mot-clé prérempli avec le premier mot de la description, choix de la catégorie, aperçu des transactions qui le contiennent, toutes cochées (`AddKeywordDialog.tsx:82`), puis « Appliquer et recatégoriser ». Le mot-clé est créé en priorité 100, au-dessus des mots-clés du seed (177 à 0, 2 à 50, 1 à 10), et les transactions cochées sont classées avec `is_manually_categorized = 1` : l'étape « Classer une transaction à la main » se coche. - Seules les feuilles de la grille Budget acceptent un montant (`src/components/budget/BudgetTable.tsx:249-297`) ; un montant saisi dans « Annuel » est réparti également sur les 12 mois et remplace les montants mensuels (`src/hooks/useBudget.ts:470-480`). ## Travail à faire - [ ] `transactionsCardModel` (`src/utils/onboardingPath.ts:360-375`) : ajouter `addKeyword: "reports.keyword.addFromTransaction"` aux `labels` de ses deux phrases. - [ ] `budgetCardModel` (`:394-414`) : ajouter `annual: "budget.annual"` aux `labels` de ses deux phrases. - [ ] Textes ci-dessous, en FR et en EN, puis le guide Markdown. - [ ] La mise en évidence ne change pas (catégorie de la première ligne, « Tout déplier » ou cellule du mois). La boîte du mot-clé ne change pas. ## Textes (FR | EN) | Clé | FR | EN | |---|---|---| | `onboarding.card.transactions.uncategorized` | Seules les transactions {{filter, lowercase}} sont affichées. Faites un clic droit sur l'une d'elles, puis « {{addKeyword}} » : le mot-clé classe cette transaction et les transactions semblables de l'aperçu, et servira aux prochains imports. Gardez un mot propre au commerçant, pas « PAIEMENT », et décochez les transactions déjà bien classées. Vous pouvez aussi cliquer sur sa catégorie et en choisir une. | Only {{filter, lowercase}} transactions are shown. Right-click one of them, then “{{addKeyword}}”: the keyword categorizes it and the similar transactions in the preview, and will apply to future imports. Keep a word specific to the merchant, not “PAYMENT”, and uncheck the transactions already correctly categorized. You can also click its category and pick one. | | `onboarding.card.transactions.all` | Faites un clic droit sur une transaction, puis « {{addKeyword}} » : le mot-clé classe cette transaction et les transactions semblables de l'aperçu, et servira aux prochains imports. Gardez un mot propre au commerçant, pas « PAIEMENT », et décochez les transactions déjà bien classées. Vous pouvez aussi cliquer sur sa catégorie et en choisir une. | Right-click a transaction, then “{{addKeyword}}”: the keyword categorizes it and the similar transactions in the preview, and will apply to future imports. Keep a word specific to the merchant, not “PAYMENT”, and uncheck the transactions already correctly categorized. You can also click its category and pick one. | | `onboarding.card.budget.collapsed` | Cliquez « {{expand}} » pour afficher vos catégories. Seules celles du dernier niveau, sans chevron, acceptent un montant : cliquez sur un mois et saisissez-le (Entrée enregistre ; Tab enregistre et passe au mois suivant). Un montant saisi dans la colonne « {{annual}} » est réparti également sur les 12 mois et remplace les montants mensuels. | Click “{{expand}}” to show your categories. Only the last-level ones, without a chevron, take an amount: click a month and type it (Enter saves; Tab saves and moves to the next month). An amount typed in the “{{annual}}” column is split evenly over the 12 months and replaces the monthly amounts. | | `onboarding.card.budget.flat` | Seules les catégories du dernier niveau, sans chevron, acceptent un montant : cliquez sur un mois et saisissez-le (Entrée enregistre ; Tab enregistre et passe au mois suivant). Un montant saisi dans la colonne « {{annual}} » est réparti également sur les 12 mois et remplace les montants mensuels. | Only last-level categories, without a chevron, take an amount: click a month and type it (Enter saves; Tab saves and moves to the next month). An amount typed in the “{{annual}}” column is split evenly over the 12 months and replaces the monthly amounts. | | `docs.gettingStarted.subsections[0].steps[3]` (ajout en fin de puce) | Sur la page Transactions, la carte propose le clic droit et « Ajouter comme mot-clé » ; sur la page Budget, elle rappelle que seules les catégories du dernier niveau acceptent un montant et ce que fait la colonne Annuel. | On the Transactions page, the card suggests right-clicking and “Add as keyword”; on the Budget page, it recalls that only last-level categories take an amount and what the Annual column does. | **Guide Markdown** (§1 « Le parcours de démarrage », la puce qui commence par « La carte suit l'étape ») : la même phrase que `docs.gettingStarted.subsections[0].steps[3]`. ## Fichiers concernés - `src/utils/onboardingPath.ts`, `src/utils/onboardingPath.test.ts` - `src/pages/TransactionsPage.render.test.tsx` - `src/i18n/locales/fr.json`, `src/i18n/locales/en.json` - `docs/guide-utilisateur.md`, `docs/qa-onboarding.html` - `CHANGELOG.md`, `CHANGELOG.fr.md` ## Depends on - #426 > Lien d'ordre : #422, #427, #426 et cette issue touchent les mêmes fichiers (`fr.json`, `en.json`, `onboardingPath.ts`, guide, CHANGELOG). ## Tests - `transactionsCardModel` : `labels` contient `addKeyword` dans les deux phrases, et `filter` dans `uncategorized`. - `budgetCardModel` : `labels` contient `annual` dans `collapsed` (avec `expand`) et dans `flat` ; états « fait » inchangés. - `TransactionsPage.render.test.tsx` : les phrases attendues (`uncategorized`, `all`) portent `addKeyword`. - Liste QA : les phrases des cartes Transactions et Budget. ## Critères d'acceptation - [ ] La carte Transactions nomme « Ajouter comme mot-clé », entre guillemets, et porte la consigne sur le mot et les cases ; l'étape se coche toujours par un classement à la main, y compris par la boîte du mot-clé. - [ ] La carte Budget dit que seules les feuilles se saisissent et ce que fait la colonne Annuel, dans ses deux variantes. - [ ] FR et EN complets ; `npm run build` et `npm test` verts. ## Review caveats - 🟡 Sécurité, résolu par décision : suivie à la lettre, la carte mène à une recatégorisation en bloc sans retour arrière (toutes les correspondances précochées, mot générique prérempli comme « PAIEMENT » pour 3 des 7 lignes à classer du dossier d'exemple, règle en priorité 100). Max a retenu une consigne dans les deux variantes de la carte ; la boîte ne change pas. - 🟡 Technique, résolu : `TransactionsPage.render.test.tsx` affirme les phrases exactes de la carte ; il est dans les fichiers. ## Décisions prises en planification - L'étape de classement garde son critère (`is_manually_categorized = 1`) ; la carte guide vers « Ajouter comme mot-clé » (Max, 2026-10-12). - Consigne sur le mot et les cases dans la carte, boîte inchangée (Max, 2026-10-12). - Guillemets autour des libellés de contrôle interpolés (Max, 2026-10-12). - La carte de l'étape « Parcourir les catégories et les mots-clés », juste avant celle-ci, annonce qu'un mot-clé sera ajouté à cette étape : garder les deux textes cohérents. ## Conventions - Toute chaîne en FR et en EN (`src/i18n/locales/fr.json`, `en.json`) ; les textes de ce corps s'écrivent mot pour mot (FR validé par Max le 2026-10-12, EN rédigé sur le même contenu). - Phrase de carte : un contrôle cité passe par `StepCardText.labels` (`src/utils/onboardingPath.ts`), traduit par `StepCard` ; jamais recopié dans la phrase. Guillemets « » en FR et “ ” en EN autour de chaque libellé de contrôle interpolé ; `{{filter, lowercase}}` sans guillemets. - CHANGELOG : une entrée sous `## [Unreleased]` dans `CHANGELOG.md` et `CHANGELOG.fr.md`. - Tests de rendu : `renderToStaticMarkup` (pas de jsdom) et le faux `t` partagé livré par #389. - Aucune migration ; `npm run build` (il vérifie aussi les types des fichiers de test) et `npm test` verts. - Guide Markdown (`docs/guide-utilisateur.md`) : repérer une ligne par son texte cité, pas par son numéro. ## CHANGELOG Changed / Modifié : FR « Parcours de démarrage : la carte Transactions explique les mots-clés et propose « Ajouter comme mot-clé » ; la carte Budget précise que seules les catégories du dernier niveau acceptent un montant et ce que fait la colonne Annuel. » EN "Getting started: the Transactions card explains keywords and suggests “Add as keyword”; the Budget card states that only last-level categories take an amount and what the Annual column does." ## Spec source `spec-plan-retours-onboarding-v0171.md` (local, ignoré par git) ; décisions dans `spec-decisions-retours-onboarding-v0171.md`.