github/hedgedoc
1
0
Fork 0
mirror of https://github.com/hedgedoc/hedgedoc.git synced 2024-11-25 11:16:31 -05:00
Code Issues Projects Releases Packages Wiki Activity

fix(notifications): use translation hook to eval replacements

Browse source 
Signed-off-by: Erik Michelson <github@erik.michelson.eu>
This commit is contained in:
Erik Michelson 2024-03-23 00:33:13 +01:00
parent 1f60a7dedf
commit 2473075a33
1 changed files with 4 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
frontend/src/components/notifications/ui-notification-toast.tsx
View file

@ -12,8 +12,9 @@ import { useUiNotifications } from './ui-notification-boundary'
import { DateTime } from 'luxon' import { DateTime } from 'luxon'
import React, { Fragment, useCallback, useEffect, useMemo, useState } from 'react' import React, { Fragment, useCallback, useEffect, useMemo, useState } from 'react'
import { Button, ProgressBar, Toast } from 'react-bootstrap' import { Button, ProgressBar, Toast } from 'react-bootstrap'
import { Trans, useTranslation } from 'react-i18next' import { useTranslation } from 'react-i18next'
import { useEffectOnce, useInterval } from 'react-use' import { useEffectOnce, useInterval } from 'react-use'
import { useTranslatedText } from '../../hooks/common/use-translated-text'
const STEPS_PER_SECOND = 10 const STEPS_PER_SECOND = 10
const log = new Logger('UiNotificationToast') const log = new Logger('UiNotificationToast')
@ -31,6 +32,7 @@ export const UiNotificationToast: React.FC<UiNotificationProps> = ({ notificatio
const { t } = useTranslation() const { t } = useTranslation()
const [remainingSteps, setRemainingSteps] = useState<number>(() => notification.durationInSecond * STEPS_PER_SECOND) const [remainingSteps, setRemainingSteps] = useState<number>(() => notification.durationInSecond * STEPS_PER_SECOND)
const { dismissNotification, pruneNotification } = useUiNotifications() const { dismissNotification, pruneNotification } = useUiNotifications()
const textNotificationTitle = useTranslatedText(notification.titleI18nKey, notification.titleI18nOptions)
const dismissNow = useCallback(() => { const dismissNow = useCallback(() => {
log.debug(`Dismiss notification ${notification.uuid} immediately`) log.debug(`Dismiss notification ${notification.uuid} immediately`)
@ -106,7 +108,7 @@ export const UiNotificationToast: React.FC<UiNotificationProps> = ({ notificatio
<Toast.Header> <Toast.Header>
<strong className='me-auto'> <strong className='me-auto'>
{notification.icon !== undefined && <UiIcon icon={notification.icon} className={'me-1'} />} {notification.icon !== undefined && <UiIcon icon={notification.icon} className={'me-1'} />}
<Trans i18nKey={notification.titleI18nKey} tOptions={notification.titleI18nOptions} /> {textNotificationTitle}
</strong> </strong>
<small>{formattedCreatedAtDate}</small> <small>{formattedCreatedAtDate}</small>
</Toast.Header> </Toast.Header>