libra: i18n the expense form (AddExpense.vue) to match the income form #140

New issue

Open

opened 2026-06-25 20:27:17 +00:00 by padreug · 0 comments

padreug commented

2026-06-25 20:27:17 +00:00

Owner

Problem

Neither libra entry form is fully translated, but they diverge in how much they i18n — and the expense form does none of it, so French/Spanish users get a mismatched experience.

Expense form — src/modules/expenses/components/AddExpense.vue: no i18n at all (no useI18n / t() calls). Every string is hardcoded: step instructions, Description *, Amount *, Currency *, Reference, all FormDescription helper texts, placeholders, the success-dialog copy, buttons, etc.
Income form — src/accounting-app/views/AddIncome.vue: partially i18n'd — only libra.income.{title,description,selectAccount,submitIncome} go through t(). The field labels, placeholders, helper texts, success dialog, "Pending Admin Approval" badge, and the Back button are also hardcoded English.

This surfaced while adding the "Other" account note to both forms (#139): the income note went in as a proper i18n key across en/fr/es, but the expense form's equivalent note (from #138) is hardcoded English and won't translate.

Scope

Fully internationalize both forms — extract all remaining hardcoded strings into libra.expense.* / libra.income.* keys and translate them, mirroring the partial structure already present for income.

Add/complete libra.expense.* and libra.income.* keys in src/i18n/locales/en.ts, fr.ts, es.ts (and the src/i18n/types.ts interface).
AddExpense.vue: wire up useI18n, replace every hardcoded string with t('libra.expense.…') — Step 1 instruction + "Other" note (from #138), Step 2 labels/placeholders/helper texts, equity checkbox label/description, success-dialog copy, Back/Submit buttons, dialog title/description.
AddIncome.vue: replace the remaining hardcoded strings (field labels, placeholders, helper texts, success dialog, badge, Back button) with t('libra.income.…').
Mirror key naming between expense.* and income.* where the two forms share concepts (e.g. selectAccount, amount/currency helpers, success copy) so they stay parallel.
Keep each locale file's existing encoding convention (fr uses \u escapes, es uses raw UTF-8).

Notes

Pure i18n refactor — no behavior, schema, or layout changes.
AccountSelector.vue is shared by both forms; check whether it has its own hardcoded strings that also need extracting.
Related: #138 (expense copy), #139 (form UI fixes + income "Other" note + Description match).

Source: surfaced during #139 review, 2026-06-25.

## Problem Neither libra entry form is fully translated, but they diverge in how much they i18n — and the expense form does none of it, so French/Spanish users get a mismatched experience. - Expense form — `src/modules/expenses/components/AddExpense.vue`: **no i18n at all** (no `useI18n` / `t()` calls). Every string is hardcoded: step instructions, `Description *`, `Amount *`, `Currency *`, `Reference`, all `FormDescription` helper texts, placeholders, the success-dialog copy, buttons, etc. - Income form — `src/accounting-app/views/AddIncome.vue`: **partially** i18n'd — only `libra.income.{title,description,selectAccount,submitIncome}` go through `t()`. The field labels, placeholders, helper texts, success dialog, "Pending Admin Approval" badge, and the Back button are **also hardcoded English**. This surfaced while adding the "Other" account note to both forms (#139): the income note went in as a proper i18n key across en/fr/es, but the expense form's equivalent note (from #138) is hardcoded English and won't translate. ## Scope Fully internationalize **both** forms — extract all remaining hardcoded strings into `libra.expense.*` / `libra.income.*` keys and translate them, mirroring the partial structure already present for income. - [ ] Add/complete `libra.expense.*` and `libra.income.*` keys in `src/i18n/locales/en.ts`, `fr.ts`, `es.ts` (and the `src/i18n/types.ts` interface). - [ ] `AddExpense.vue`: wire up `useI18n`, replace every hardcoded string with `t('libra.expense.…')` — Step 1 instruction + "Other" note (from #138), Step 2 labels/placeholders/helper texts, equity checkbox label/description, success-dialog copy, Back/Submit buttons, dialog title/description. - [ ] `AddIncome.vue`: replace the remaining hardcoded strings (field labels, placeholders, helper texts, success dialog, badge, Back button) with `t('libra.income.…')`. - [ ] Mirror key naming between `expense.*` and `income.*` where the two forms share concepts (e.g. `selectAccount`, amount/currency helpers, success copy) so they stay parallel. - [ ] Keep each locale file's existing encoding convention (fr uses `\u` escapes, es uses raw UTF-8). ## Notes - Pure i18n refactor — no behavior, schema, or layout changes. - `AccountSelector.vue` is shared by both forms; check whether it has its own hardcoded strings that also need extracting. - Related: #138 (expense copy), #139 (form UI fixes + income "Other" note + Description match). _Source: surfaced during #139 review, 2026-06-25._

padreug added the

app:libra

enhancement

labels

2026-06-25 20:27:24 +00:00

padreug referenced this issue

2026-06-25 20:37:46 +00:00

feat(libra): expense/income form UI fixes #139