diff --git a/packages/desktop-client/src/components/App.tsx b/packages/desktop-client/src/components/App.tsx index 431bed29fb4..acc0f361c87 100644 --- a/packages/desktop-client/src/components/App.tsx +++ b/packages/desktop-client/src/components/App.tsx @@ -134,7 +134,7 @@ function AppInner() { id: 'login-expired', title: t('Login expired'), sticky: true, - message: t('Login expired, please login again.'), + message: t('Login expired, please log in again.'), button: { title: t('Go to login'), action: signOut, diff --git a/packages/desktop-client/src/components/LoggedInUser.tsx b/packages/desktop-client/src/components/LoggedInUser.tsx index 982b1ae9b42..a49ba79ac76 100644 --- a/packages/desktop-client/src/components/LoggedInUser.tsx +++ b/packages/desktop-client/src/components/LoggedInUser.tsx @@ -205,9 +205,7 @@ export function LoggedInUser({ userData?.displayName && !hasSyncedPrefs && ( - - (logged in as: {userData?.displayName}) - + (logged in as: {userData?.displayName}) )} {!loading && @@ -216,13 +214,11 @@ export function LoggedInUser({ userData?.displayName && hasSyncedPrefs && ( - - (logged in as:{' '} - - {userData?.displayName} - - ) - + (logged in as:{' '} + + {userData?.displayName} + + ) )} diff --git a/packages/desktop-client/src/components/Modals.tsx b/packages/desktop-client/src/components/Modals.tsx index f0c008c141e..013d4672fe0 100644 --- a/packages/desktop-client/src/components/Modals.tsx +++ b/packages/desktop-client/src/components/Modals.tsx @@ -302,7 +302,7 @@ export function Modals() { /> )} inputPlaceholder={t('Category name')} - buttonText="Add" + buttonText={t('Add')} onValidate={options.onValidate} onSubmit={options.onSubmit} /> diff --git a/packages/desktop-client/src/components/accounts/AccountSyncCheck.tsx b/packages/desktop-client/src/components/accounts/AccountSyncCheck.tsx index 0d3e24c904f..489b6e92e19 100644 --- a/packages/desktop-client/src/components/accounts/AccountSyncCheck.tsx +++ b/packages/desktop-client/src/components/accounts/AccountSyncCheck.tsx @@ -68,7 +68,7 @@ function useErrorMessage() { return ( - An internal error occurred. Try to login again, or get{' '} + An internal error occurred. Try to log in again, or get{' '} in touch {' '} diff --git a/packages/desktop-client/src/components/admin/UserAccess/UserAccess.tsx b/packages/desktop-client/src/components/admin/UserAccess/UserAccess.tsx index 5183f86bded..61c89c97a11 100644 --- a/packages/desktop-client/src/components/admin/UserAccess/UserAccess.tsx +++ b/packages/desktop-client/src/components/admin/UserAccess/UserAccess.tsx @@ -163,15 +163,15 @@ function UserAccessContent({ > - Determine which users can view and manage your budgets..{' '} - - Learn more - - + Determine which users can view and manage your budgets + {' '} + + Learn more + diff --git a/packages/desktop-client/src/components/admin/UserDirectory/UserDirectory.tsx b/packages/desktop-client/src/components/admin/UserDirectory/UserDirectory.tsx index f5b59d57a41..711b7baebfe 100644 --- a/packages/desktop-client/src/components/admin/UserDirectory/UserDirectory.tsx +++ b/packages/desktop-client/src/components/admin/UserDirectory/UserDirectory.tsx @@ -46,7 +46,7 @@ function useGetUserDirectoryErrors() { case 'unauthorized': return t('You are not logged in.'); case 'token-expired': - return t('Login expired, please login again.'); + return t('Login expired, please log in again.'); case 'user-cant-be-empty': return t( 'Please enter a value for the username; the field cannot be empty.', @@ -232,15 +232,15 @@ function UserDirectoryContent({ Manage and view users who can create new budgets or be invited - to access existing ones.{' '} - - Learn more - - + to access existing ones. + {' '} + + Learn more + @@ -282,7 +282,7 @@ function UserDirectoryContent({ {selectedInst.items.size > 0 && ( )} )} {showManagePayees && ( )} diff --git a/packages/desktop-client/src/components/budget/IncomeHeader.tsx b/packages/desktop-client/src/components/budget/IncomeHeader.tsx index 5b657a569b7..193188fcf9d 100644 --- a/packages/desktop-client/src/components/budget/IncomeHeader.tsx +++ b/packages/desktop-client/src/components/budget/IncomeHeader.tsx @@ -25,7 +25,7 @@ export function IncomeHeader({ }} > - {t('Are you sure you want to close ')} - {account.name}?{' '} + + Are you sure you want to close{' '} + + {{ accountName: account.name }} + + ?{' '} + {canDelete ? ( - This account has no transactions so it will be permanently - deleted. + + This account has no transactions so it will be permanently + deleted. + ) : ( - This account has transactions so we can’t permanently delete - it. + + This account has transactions so we can’t permanently delete + it. + )} @@ -142,10 +151,14 @@ export function CloseAccountModal({ {balance !== 0 && ( - This account has a balance of{' '} - {integerToCurrency(balance)}. To close this - account, select a different account to transfer this balance - to: + + This account has a balance of{' '} + + {{ balance: integerToCurrency(balance) }} + + . To close this account, select a different account to + transfer this balance to: + @@ -176,16 +189,18 @@ export function CloseAccountModal({ {transferError && ( - {t('Transfer is required')} + Transfer is required )} {needsCategory(account, transferAccountId, accounts) && ( - Since you are transferring the balance from an on budget - account to an off budget account, this transaction must - be categorized. Select a category: + + Since you are transferring the balance from an on + budget account to an off budget account, this + transaction must be categorized. Select a category: + {categoryError && ( - {t('Category is required')} + + Category is required + )} )} @@ -223,22 +240,24 @@ export function CloseAccountModal({ {!canDelete && ( - {t('You can also')}{' '} - { - setLoading(true); + + You can also{' '} + { + setLoading(true); - dispatch(forceCloseAccount(account.id)); - close(); - }} - style={{ color: theme.errorText }} - > - {t('force close')} - {' '} - the account which will delete it and all its transactions - permanently. Doing so may change your budget unexpectedly - since money in it may vanish. + dispatch(forceCloseAccount(account.id)); + close(); + }} + style={{ color: theme.errorText }} + > + force close + {' '} + the account which will delete it and all its transactions + permanently. Doing so may change your budget unexpectedly + since money in it may vanish. + )} @@ -256,7 +275,7 @@ export function CloseAccountModal({ }} onPress={close} > - {t('Cancel')} + Cancel diff --git a/packages/desktop-client/src/components/modals/CreateAccountModal.tsx b/packages/desktop-client/src/components/modals/CreateAccountModal.tsx index 7245a399d33..85d438a65fb 100644 --- a/packages/desktop-client/src/components/modals/CreateAccountModal.tsx +++ b/packages/desktop-client/src/components/modals/CreateAccountModal.tsx @@ -177,12 +177,12 @@ export function CreateAccountModal({ upgradingAccountId }: CreateAccountProps) { setIsSimpleFinSetupComplete(configuredSimpleFin); }, [configuredSimpleFin]); - let title = t('Add Account'); + let title = t('Add account'); const [loadingSimpleFinAccounts, setLoadingSimpleFinAccounts] = useState(false); if (upgradingAccountId != null) { - title = t('Link Account'); + title = t('Link account'); } const canSetSecrets = @@ -209,23 +209,23 @@ export function CreateAccountModal({ upgradingAccountId }: CreateAccountProps) { }} onPress={onCreateLocalAccount} > - {t('Create local account')} + {t('Create a local account')} - {t('Create a local account')}{' '} - {t( - 'if you want to add transactions manually. You can also', - )}{' '} - - {t('import QIF/OFX/QFX files into a local account')} - - . + + Create a local account if you want to add + transactions manually. You can also{' '} + + import QIF/OFX/QFX files into a local account + + . + @@ -288,13 +288,16 @@ export function CreateAccountModal({ upgradingAccountId }: CreateAccountProps) { )} - - {t('Link a')} {t('European')}{' '} - {t('bank account')} - {' '} - {t( - 'to automatically download transactions. GoCardless provides reliable, up-to-date information from hundreds of banks.', - )} + + + Link a European bank account + {' '} + to automatically download transactions. + + + GoCardless provides reliable, up-to-date information + from hundreds of banks. + - - {t('Link a')} {t('North American')} - {t(' bank account')} - {' '} - {t( - 'to automatically download transactions. SimpleFIN provides reliable, up-to-date information from hundreds of banks.', - )}{' '} + + + Link a North American bank account + {' '} + to automatically download transactions. + + + SimpleFIN provides reliable, up-to-date information + from hundreds of banks. + )} @@ -387,18 +393,20 @@ export function CreateAccountModal({ upgradingAccountId }: CreateAccountProps) { fontWeight: 600, }} > - {t('Set up bank sync')} + Set up bank sync - {t('Connect to an Actual server to set up')}{' '} - - {t('automatic syncing')} - - . + + Connect to an Actual server to set up{' '} + + automatic syncing + + . + )} diff --git a/packages/desktop-client/src/components/modals/CreateEncryptionKeyModal.tsx b/packages/desktop-client/src/components/modals/CreateEncryptionKeyModal.tsx index b513a58a83e..5d289367300 100644 --- a/packages/desktop-client/src/components/modals/CreateEncryptionKeyModal.tsx +++ b/packages/desktop-client/src/components/modals/CreateEncryptionKeyModal.tsx @@ -1,7 +1,7 @@ // @ts-strict-ignore import React, { useState } from 'react'; import { Form } from 'react-aria-components'; -import { useTranslation } from 'react-i18next'; +import { useTranslation, Trans } from 'react-i18next'; import { useDispatch } from 'react-redux'; import { css } from '@emotion/css'; @@ -87,11 +87,13 @@ export function CreateEncryptionKeyModal({ {!isRecreating ? ( <> - To enable end-to-end encryption, you need to create a key. We - will generate a key based on a password and use it to encrypt - from now on. This requires a sync reset and - all other devices will have to revert to this version of your - data.{' '} + + To enable end-to-end encryption, you need to create a key. + We will generate a key based on a password and use it to + encrypt from now on.{' '} + This requires a sync reset and all other + devices will have to revert to this version of your data.{' '} +
  • - Important: if you forget this password{' '} - and you don’t have any local copies of your data, - you will lose access to all your data. The data cannot be - decrypted without the password. + + Important: if you forget this password{' '} + and you don’t have any local copies of your + data, you will lose access to all your data. The data + cannot be decrypted without the password. +
  • - {t( - 'This key only applies to this file. You will need to generate a new key for each file you want to encrypt.', - )} + + This key only applies to this file. You will need to + generate a new key for each file you want to encrypt. +
  • - {t( - 'If you’ve already downloaded your data on other devices, you will need to reset them. Actual will automatically take you through this process.', - )} + + If you’ve already downloaded your data on other devices, + you will need to reset them. Actual will automatically + take you through this process. +
  • - {t( - 'It is recommended for the encryption password to be different than the log-in password in order to better protect your data.', - )} + + It is recommended for the encryption password to be + different than the log-in password in order to better + protect your data. +
    • @@ -134,11 +143,12 @@ export function CreateEncryptionKeyModal({ ) : ( <> - {t('This will generate a new key for encrypting your data.')}{' '} - {t('This requires a sync reset')} - {t( - ' and all other devices will have to revert to this version of your data. Actual will take you through that process on those devices.', - )}{' '} + + This will generate a new key for encrypting your data.{' '} + This requires a sync reset and all other + devices will have to revert to this version of your data. + Actual will take you through that process on those devices.' + {' '} - {t( - 'Key generation is randomized. The same password will create different keys, so this will change your key regardless of the password being different.', - )} + + Key generation is randomized. The same password will create + different keys, so this will change your key regardless of + the password being different. + )} @@ -163,7 +175,7 @@ export function CreateEncryptionKeyModal({ > - {t('Password')} + Password {error && ( @@ -195,7 +207,7 @@ export function CreateEncryptionKeyModal({ type="checkbox" onClick={() => setShowPassword(!showPassword)} />{' '} - {t('Show password')} + Show password @@ -209,7 +221,7 @@ export function CreateEncryptionKeyModal({ isLoading={loading} variant="primary" > - {t('Enable')} + Enable diff --git a/packages/desktop-client/src/components/modals/EditRuleModal.jsx b/packages/desktop-client/src/components/modals/EditRuleModal.jsx index 649a9236472..2149f4ffb5b 100644 --- a/packages/desktop-client/src/components/modals/EditRuleModal.jsx +++ b/packages/desktop-client/src/components/modals/EditRuleModal.jsx @@ -1,5 +1,5 @@ import React, { useState, useEffect, useRef, useMemo } from 'react'; -import { useTranslation } from 'react-i18next'; +import { useTranslation, Trans } from 'react-i18next'; import { useDispatch } from 'react-redux'; import { css } from '@emotion/css'; @@ -337,7 +337,7 @@ function ScheduleDescription({ id }) { textOverflow: 'ellipsis', }} > - {t('Payee')}:{' '} + Payee:{' '} — - {t('Amount')}: {formatAmount(schedule._amount)} + Amount: {formatAmount(schedule._amount)} — - {t('Next')}: {monthUtils.format(schedule.next_date, dateFormat)} + Next:{' '} + {monthUtils.format(schedule.next_date, dateFormat)}     @@ -527,9 +528,12 @@ function StageInfo() { - The stage of a rule allows you to force a specific order. Pre rules - always run first, and post rules always run last. Within each stage - rules are automatically ordered from least to most specific. + + The stage of a rule allows you to force a specific order. Pre + rules always run first, and post rules always run last. Within + each stage rules are automatically ordered from least to most + specific. + } placement="bottom start" @@ -704,7 +708,7 @@ function ConditionsList({ return conditions.length === 0 ? ( ) : ( @@ -1046,26 +1050,28 @@ export function EditRuleModal({ defaultRule, onSave: originalOnSave }) { padding: '0 20px', }} > - {t('Stage of rule:')} + + Stage of rule: + onChangeStage('pre')} > - {t('Pre')} + Pre onChangeStage(null)} > - {t('Default')} + Default onChangeStage('post')} > - {t('Post')} + Post @@ -1084,18 +1090,20 @@ export function EditRuleModal({ defaultRule, onSave: originalOnSave }) { - {t('If')} - - {t('of these conditions match:')} + + If{' '} + + {{ allOrAny: '' }} of these conditions match: + - {t('Then apply these actions:')} + Then apply these actions: {actionSplits.length === 0 && ( @@ -1116,7 +1124,7 @@ export function EditRuleModal({ defaultRule, onSave: originalOnSave }) { style={{ alignSelf: 'flex-start' }} onPress={addInitialAction} > - {t('Add action')} + Add action )} @@ -1205,7 +1213,7 @@ export function EditRuleModal({ defaultRule, onSave: originalOnSave }) { addActionToSplitAfterIndex(splitIndex, -1) } > - {t('Add action')} + Add action )} @@ -1238,7 +1246,7 @@ export function EditRuleModal({ defaultRule, onSave: originalOnSave }) { }} > - {t('This rule applies to these transactions:')} + This rule applies to these transactions: @@ -1246,7 +1254,7 @@ export function EditRuleModal({ defaultRule, onSave: originalOnSave }) { isDisabled={selectedInst.items.size === 0} onPress={onApply} > - {t('Apply actions')} ({selectedInst.items.size}) + Apply actions ({selectedInst.items.size}) @@ -1269,7 +1277,7 @@ export function EditRuleModal({ defaultRule, onSave: originalOnSave }) { > diff --git a/packages/desktop-client/src/components/modals/EditUser.tsx b/packages/desktop-client/src/components/modals/EditUser.tsx index e8ddccca135..f71961ea037 100644 --- a/packages/desktop-client/src/components/modals/EditUser.tsx +++ b/packages/desktop-client/src/components/modals/EditUser.tsx @@ -43,7 +43,7 @@ function useGetUserDirectoryErrors() { case 'unauthorized': return t('You are not logged in.'); case 'token-expired': - return t('Login expired, please login again.'); + return t('Login expired, please log in again.'); case 'user-cant-be-empty': return t( 'Please enter a value for the username; the field cannot be empty.', @@ -405,7 +405,7 @@ const RoleDescription = () => { }} > - Also can assign ownership of a budget to another person, ensuring + Can also assign ownership of a budget to another person, ensuring efficient budget management. diff --git a/packages/desktop-client/src/components/modals/GoCardlessExternalMsgModal.tsx b/packages/desktop-client/src/components/modals/GoCardlessExternalMsgModal.tsx index d2b3730d5a9..886fff3c88e 100644 --- a/packages/desktop-client/src/components/modals/GoCardlessExternalMsgModal.tsx +++ b/packages/desktop-client/src/components/modals/GoCardlessExternalMsgModal.tsx @@ -228,7 +228,7 @@ export function GoCardlessExternalMsgModal({ onPress={onJump} isDisabled={!institutionId || !country} > - Link bank in browser → + Link bank in browser → @@ -280,9 +280,11 @@ export function GoCardlessExternalMsgModal({ onClick={onJump} style={{ marginTop: 10 }} > + ( - (Account linking not opening in a new tab? Click here) + Account linking not opening in a new tab? Click here + ) )} @@ -298,7 +300,7 @@ export function GoCardlessExternalMsgModal({ }} onPress={onContinue} > - Success! Click to continue → + Success! Click to continue → ) : isConfigured || isGoCardlessSetupComplete ? ( renderLinkButton() diff --git a/packages/desktop-client/src/components/modals/GoCardlessInitialiseModal.tsx b/packages/desktop-client/src/components/modals/GoCardlessInitialiseModal.tsx index d305caf15d5..9137ad82e83 100644 --- a/packages/desktop-client/src/components/modals/GoCardlessInitialiseModal.tsx +++ b/packages/desktop-client/src/components/modals/GoCardlessInitialiseModal.tsx @@ -1,6 +1,6 @@ // @ts-strict-ignore import React, { useState } from 'react'; -import { useTranslation } from 'react-i18next'; +import { useTranslation, Trans } from 'react-i18next'; import { getSecretsError } from 'loot-core/shared/errors'; import { send } from 'loot-core/src/platform/client/fetch'; @@ -83,22 +83,24 @@ export const GoCardlessInitialiseModal = ({ {({ state: { close } }) => ( <> } /> - {t( - 'In order to enable bank-sync via GoCardless (only for EU banks) you will need to create access credentials. This can be done by creating an account with', - )}{' '} - - {t('GoCardless')} - - . + + In order to enable bank-sync via GoCardless (only for EU banks) + you will need to create access credentials. This can be done by + creating an account with{' '} + + GoCardless + + . + @@ -140,7 +142,7 @@ export const GoCardlessInitialiseModal = ({ onSubmit(close); }} > - {t('Save and continue')} + Save and continue diff --git a/packages/desktop-client/src/components/modals/ImportTransactionsModal/ParsedDate.tsx b/packages/desktop-client/src/components/modals/ImportTransactionsModal/ParsedDate.tsx index 81ca7c93ba9..a2467210fdb 100644 --- a/packages/desktop-client/src/components/modals/ImportTransactionsModal/ParsedDate.tsx +++ b/packages/desktop-client/src/components/modals/ImportTransactionsModal/ParsedDate.tsx @@ -1,4 +1,5 @@ import React from 'react'; +import { Trans, useTranslation } from 'react-i18next'; import { theme } from '../../../style'; import { Text } from '../../common/Text'; @@ -16,6 +17,8 @@ export function ParsedDate({ dateFormat, date, }: ParsedDateProps) { + const { t } = useTranslation(); + const parsed = date && formatDate( @@ -27,13 +30,13 @@ export function ParsedDate({ {date || ( - Empty + Empty )}{' '} →{' '} - {parsed || 'Invalid'} + {parsed || t('Invalid')} ); diff --git a/packages/desktop-client/src/components/modals/LoadBackupModal.tsx b/packages/desktop-client/src/components/modals/LoadBackupModal.tsx index 84aca0fb77d..0be83b372c1 100644 --- a/packages/desktop-client/src/components/modals/LoadBackupModal.tsx +++ b/packages/desktop-client/src/components/modals/LoadBackupModal.tsx @@ -129,7 +129,7 @@ export function LoadBackupModal({ isDisabled={backupDisabled} onPress={() => dispatch(makeBackup())} > - {t('Backup now')} + {t('Back up now')} )} diff --git a/packages/desktop-client/src/components/modals/ManageRulesModal.tsx b/packages/desktop-client/src/components/modals/ManageRulesModal.tsx index fe61ce7f984..b61c0a077d5 100644 --- a/packages/desktop-client/src/components/modals/ManageRulesModal.tsx +++ b/packages/desktop-client/src/components/modals/ManageRulesModal.tsx @@ -25,7 +25,7 @@ export function ManageRulesModal({ payeeId }: ManageRulesModalProps) { } return ( - + {({ state: { close } }) => ( <>