fix(frontend): improve performance by caching translated texts

Signed-off-by: Tilman Vatteroth <git@tilmanvatteroth.de>
This commit is contained in:
Tilman Vatteroth 2023-06-26 22:32:19 +02:00
parent ced4cd953c
commit 76242330fd
81 changed files with 341 additions and 292 deletions

View file

@ -3,11 +3,12 @@
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
import { useTranslatedText } from '../../../../hooks/common/use-translated-text'
import { cypressId } from '../../../../utils/cypress-attribute'
import type { ChangeEvent } from 'react'
import React, { useMemo } from 'react'
import { Form } from 'react-bootstrap'
import { Trans, useTranslation } from 'react-i18next'
import { Trans } from 'react-i18next'
interface AccessTokenCreationFormLabelFieldProps extends AccessTokenCreationFormFieldProps {
onChangeLabel: (event: ChangeEvent<HTMLInputElement>) => void
@ -23,11 +24,8 @@ export const AccessTokenCreationFormLabelField: React.FC<AccessTokenCreationForm
onChangeLabel,
formValues
}) => {
const { t } = useTranslation()
const labelValid = useMemo(() => {
return formValues.label.trim() !== ''
}, [formValues])
const labelValid = useMemo(() => formValues.label.trim() !== '', [formValues])
const placeholderText = useTranslatedText('profile.accessTokens.label')
return (
<Form.Group>
@ -37,7 +35,7 @@ export const AccessTokenCreationFormLabelField: React.FC<AccessTokenCreationForm
<Form.Control
type='text'
size='sm'
placeholder={t('profile.accessTokens.label') ?? undefined}
placeholder={placeholderText}
value={formValues.label}
onChange={onChangeLabel}
isValid={labelValid}

View file

@ -8,8 +8,7 @@ import { UiIcon } from '../../common/icons/ui-icon'
import { AccountDeletionModal } from './account-deletion-modal'
import React, { Fragment } from 'react'
import { Button, Card, Row } from 'react-bootstrap'
import { Trash as IconTrash } from 'react-bootstrap-icons'
import { CloudDownload as IconCloudDownload } from 'react-bootstrap-icons'
import { CloudDownload as IconCloudDownload, Trash as IconTrash } from 'react-bootstrap-icons'
import { Trans, useTranslation } from 'react-i18next'
/**