From 670419b087335b7e114d3605be7c30ad3d79eabf Mon Sep 17 00:00:00 2001 From: Awais Alee Date: Fri, 15 Nov 2024 00:05:15 +0500 Subject: [PATCH] Added the i18n translation for desktop-client (#3832) --- .../modals/EnvelopeBalanceMenuModal.tsx | 4 ++- .../modals/EnvelopeBudgetMenuModal.tsx | 4 ++- .../modals/EnvelopeBudgetMonthMenuModal.tsx | 31 ++++++++++++++----- .../modals/EnvelopeBudgetSummaryModal.tsx | 8 +++-- .../src/components/modals/LoadBackupModal.tsx | 28 ++++++++++------- .../modals/TrackingBalanceMenuModal.tsx | 4 ++- .../modals/TrackingBudgetMenuModal.tsx | 4 ++- .../modals/TrackingBudgetMonthMenuModal.tsx | 30 +++++++++++++----- .../modals/TrackingBudgetSummaryModal.tsx | 4 ++- .../src/components/reports/Header.tsx | 16 +++++----- .../components/reports/reports/NetWorth.tsx | 10 +++--- .../select/RecurringSchedulePicker.tsx | 24 +++++++------- upcoming-release-notes/3832.md | 6 ++++ 13 files changed, 115 insertions(+), 58 deletions(-) create mode 100644 upcoming-release-notes/3832.md diff --git a/packages/desktop-client/src/components/modals/EnvelopeBalanceMenuModal.tsx b/packages/desktop-client/src/components/modals/EnvelopeBalanceMenuModal.tsx index f81005d0a08..f4d9e655f13 100644 --- a/packages/desktop-client/src/components/modals/EnvelopeBalanceMenuModal.tsx +++ b/packages/desktop-client/src/components/modals/EnvelopeBalanceMenuModal.tsx @@ -3,6 +3,8 @@ import React, { type CSSProperties, } from 'react'; +import { t } from 'i18next'; + import { envelopeBudget } from 'loot-core/client/queries'; import { useCategory } from '../../hooks/useCategory'; @@ -66,7 +68,7 @@ export function EnvelopeBalanceMenuModal({ fontWeight: 400, }} > - Balance + {t('Balance')} - Budgeted + {t('Budgeted')} - Edit notes + {t('Edit notes')} @@ -143,7 +145,7 @@ export function EnvelopeBudgetMonthMenuModal({ style={{ paddingRight: 5 }} /> )} - Actions + {t('Actions')} @@ -155,14 +157,20 @@ export function EnvelopeBudgetMonthMenuModal({ onBudgetAction(month, 'copy-last'); close(); showUndoNotification({ - message: `${displayMonth} budgets have all been set to last month’s budgeted amounts.`, + message: t( + '{displayMonth} budgets have all been set to last month’s budgeted amounts.', + { displayMonth }, + ), }); }} onSetBudgetsToZero={() => { onBudgetAction(month, 'set-zero'); close(); showUndoNotification({ - message: `${displayMonth} budgets have all been set to zero.`, + message: t( + '{displayMonth} budgets have all been set to zero.', + { displayMonth }, + ), }); }} onSetMonthsAverage={numberOfMonths => { @@ -180,21 +188,30 @@ export function EnvelopeBudgetMonthMenuModal({ onBudgetAction(month, 'apply-goal-template'); close(); showUndoNotification({ - message: `${displayMonth} budget templates have been applied.`, + message: t( + '{displayMonth} budget templates have been applied.', + { displayMonth }, + ), }); }} onOverwriteWithBudgetTemplates={() => { onBudgetAction(month, 'overwrite-goal-template'); close(); showUndoNotification({ - message: `${displayMonth} budget templates have been overwritten.`, + message: t( + '{displayMonth} budget templates have been overwritten.', + { displayMonth }, + ), }); }} onEndOfMonthCleanup={() => { onBudgetAction(month, 'cleanup-goal-template'); close(); showUndoNotification({ - message: `${displayMonth} end-of-month cleanup templates have been applied.`, + message: t( + '{displayMonth} end-of-month cleanup templates have been applied.', + { displayMonth }, + ), }); }} /> diff --git a/packages/desktop-client/src/components/modals/EnvelopeBudgetSummaryModal.tsx b/packages/desktop-client/src/components/modals/EnvelopeBudgetSummaryModal.tsx index e8944c9ad72..8c9b247da3b 100644 --- a/packages/desktop-client/src/components/modals/EnvelopeBudgetSummaryModal.tsx +++ b/packages/desktop-client/src/components/modals/EnvelopeBudgetSummaryModal.tsx @@ -1,4 +1,5 @@ import React from 'react'; +import { useTranslation } from 'react-i18next'; import { useDispatch } from 'react-redux'; import { collapseModals, pushModal } from 'loot-core/client/actions'; @@ -35,11 +36,12 @@ export function EnvelopeBudgetSummaryModal({ const { showUndoNotification } = useUndo(); const { list: categories } = useCategories(); const categoriesById = groupById(categories); + const { t } = useTranslation(); const openTransferAvailableModal = () => { dispatch( pushModal('transfer', { - title: 'Transfer: To Budget', + title: t('Transfer: To Budget'), month, amount: sheetValue, onSubmit: (amount, toCategoryId) => { @@ -60,7 +62,7 @@ export function EnvelopeBudgetSummaryModal({ const openCoverOverbudgetedModal = () => { dispatch( pushModal('cover', { - title: 'Cover: Overbudgeted', + title: t('Cover: Overbudgeted'), month, showToBeBudgeted: false, onSubmit: categoryId => { @@ -112,7 +114,7 @@ export function EnvelopeBudgetSummaryModal({ {({ state: { close } }) => ( <> } /> diff --git a/packages/desktop-client/src/components/modals/LoadBackupModal.tsx b/packages/desktop-client/src/components/modals/LoadBackupModal.tsx index b40b659d087..ab623da624d 100644 --- a/packages/desktop-client/src/components/modals/LoadBackupModal.tsx +++ b/packages/desktop-client/src/components/modals/LoadBackupModal.tsx @@ -1,4 +1,5 @@ import React, { useState, useEffect } from 'react'; +import { useTranslation } from 'react-i18next'; import { useDispatch } from 'react-redux'; import { loadBackup, makeBackup } from 'loot-core/client/actions'; @@ -73,13 +74,14 @@ export function LoadBackupModal({ const previousBackups = backups.filter( backup => !('isLatest' in backup ? backup.isLatest : false), ); + const { t } = useTranslation(); return ( {({ state: { close } }) => ( <> } /> @@ -95,10 +97,11 @@ export function LoadBackupModal({ - You are currently working from a backup. + {t('You are currently working from a backup.')} {' '} - You can load a different backup or revert to the original - version below. + {t( + 'You can load a different backup or revert to the original version below.', + )} ) : ( - Select a backup to load. After loading a backup, you will - have a chance to revert to the current version in this - screen.{' '} + {t( + 'Select a backup to load. After loading a backup, you will have a chance to revert to the current version in this screen.', + )}{' '} - If you use a backup, you will have to setup all your - devices to sync from the new budget. + {t( + 'If you use a backup, you will have to setup all your devices to sync from the new budget.', + )} )} {previousBackups.length === 0 ? ( - No backups available + {t('No backups available')} ) : ( - Balance + {t('Balance')} - Budgeted + {t('Budgeted')} 0 ? originalNotes : 'No notes'} + notes={ + originalNotes?.length > 0 ? originalNotes : t('No notes') + } editable={false} focused={false} getStyle={() => ({ @@ -113,7 +117,7 @@ export function TrackingBudgetMonthMenuModal({ height={20} style={{ paddingRight: 5 }} /> - Edit notes + {t('Edit notes')} @@ -143,7 +147,7 @@ export function TrackingBudgetMonthMenuModal({ style={{ paddingRight: 5 }} /> )} - Actions + {t('Actions')} @@ -155,14 +159,20 @@ export function TrackingBudgetMonthMenuModal({ onBudgetAction(month, 'copy-last'); close(); showUndoNotification({ - message: `${displayMonth} budgets have all been set to last month’s budgeted amounts.`, + message: t( + '{displayMonth} budgets have all been set to last month’s budgeted amounts.', + { displayMonth }, + ), }); }} onSetBudgetsToZero={() => { onBudgetAction(month, 'set-zero'); close(); showUndoNotification({ - message: `${displayMonth} budgets have all been set to zero.`, + message: t( + '{displayMonth} budgets have all been set to zero.', + { displayMonth }, + ), }); }} onSetMonthsAverage={numberOfMonths => { @@ -180,14 +190,20 @@ export function TrackingBudgetMonthMenuModal({ onBudgetAction(month, 'apply-goal-template'); close(); showUndoNotification({ - message: `${displayMonth} budget templates have been applied.`, + message: t( + '{displayMonth} budget templates have been applied.', + { displayMonth }, + ), }); }} onOverwriteWithBudgetTemplates={() => { onBudgetAction(month, 'overwrite-goal-template'); close(); showUndoNotification({ - message: `${displayMonth} budget templates have been overwritten.`, + message: t( + '{displayMonth} budget templates have been overwritten.', + { displayMonth }, + ), }); }} /> diff --git a/packages/desktop-client/src/components/modals/TrackingBudgetSummaryModal.tsx b/packages/desktop-client/src/components/modals/TrackingBudgetSummaryModal.tsx index fe07c1b8c02..d015ca8d660 100644 --- a/packages/desktop-client/src/components/modals/TrackingBudgetSummaryModal.tsx +++ b/packages/desktop-client/src/components/modals/TrackingBudgetSummaryModal.tsx @@ -1,4 +1,5 @@ import React from 'react'; +import { useTranslation } from 'react-i18next'; import { sheetForMonth } from 'loot-core/src/shared/months'; import * as monthUtils from 'loot-core/src/shared/months'; @@ -18,13 +19,14 @@ type TrackingBudgetSummaryModalProps = { export function TrackingBudgetSummaryModal({ month, }: TrackingBudgetSummaryModalProps) { + const { t } = useTranslation(); const currentMonth = monthUtils.currentMonth(); return ( {({ state: { close } }) => ( <> } /> diff --git a/packages/desktop-client/src/components/reports/Header.tsx b/packages/desktop-client/src/components/reports/Header.tsx index ba820128284..a262f2dcec6 100644 --- a/packages/desktop-client/src/components/reports/Header.tsx +++ b/packages/desktop-client/src/components/reports/Header.tsx @@ -1,4 +1,5 @@ import { type ComponentProps, type ReactNode } from 'react'; +import { useTranslation } from 'react-i18next'; import * as monthUtils from 'loot-core/src/shared/months'; import { @@ -60,6 +61,7 @@ export function Header({ onConditionsOpChange, children, }: HeaderProps) { + const { t } = useTranslation(); const isDashboardsFeatureEnabled = useFeatureFlag('dashboards'); const { isNarrowWidth } = useResponsive(); @@ -92,7 +94,7 @@ export function Header({ onChangeDates(newStart, newEnd, newMode); }} > - {mode === 'static' ? 'Static' : 'Live'} + {mode === 'static' ? t('Static') : t('Live')} )} @@ -111,7 +113,7 @@ export function Header({ defaultLabel={monthUtils.format(start, 'MMMM, yyyy')} options={allMonths.map(({ name, pretty }) => [name, pretty])} /> - to + {t('to')} dispatch({ type: 'add-recurrence' })} > - Add specific days + {t('Add specific days')} ) : null} @@ -503,7 +505,7 @@ function RecurringScheduleTooltip({ marginRight: 5, }} > - Move schedule{' '} + {t('Move schedule')}{' '}