diff --git a/client/src/components/Auth/RequestPasswordReset.tsx b/client/src/components/Auth/RequestPasswordReset.tsx index 770a4bd523..9df69433a6 100644 --- a/client/src/components/Auth/RequestPasswordReset.tsx +++ b/client/src/components/Auth/RequestPasswordReset.tsx @@ -36,6 +36,9 @@ function RequestPasswordReset() { }; useEffect(() => { + if (bodyText) { + return; + } if (!requestPasswordReset.isSuccess) { setHeaderText('com_auth_reset_password'); setBodyText(undefined); @@ -64,6 +67,7 @@ function RequestPasswordReset() { resetLink, localize, setHeaderText, + bodyText, ]); if (bodyText) { diff --git a/client/src/hooks/useLocalize.ts b/client/src/hooks/useLocalize.ts index a959b72ca2..277102cfa0 100644 --- a/client/src/hooks/useLocalize.ts +++ b/client/src/hooks/useLocalize.ts @@ -1,8 +1,15 @@ +import { useCallback } from 'react'; import { useRecoilValue } from 'recoil'; import { localize } from '~/localization/Translation'; import store from '~/store'; export default function useLocalize() { const lang = useRecoilValue(store.lang); - return (phraseKey: string, ...values: string[]) => localize(lang, phraseKey, ...(values ?? [])); + + const memoizedLocalize = useCallback( + (phraseKey: string, ...values: string[]) => localize(lang, phraseKey, ...(values ?? [])), + [lang], // Only recreate the function when `lang` changes + ); + + return memoizedLocalize; }