#428

frontend/src/lib/useUITranslation.ts

@@ -1,4 +1,4 @@
-import { createElement } from 'react'
+import { createElement, useCallback } from 'react'
 import { useTranslation } from 'react-i18next'
 
 import LocalisedText from '@/components/LocalisedText'
@@ -10,15 +10,15 @@ export const useUITranslation = (namespace = 'common') => {
   const locale = useLocale ()
   useTranslation (namespace, { lng: locale })
 
-  const message = (key: string, values?: Record<string, string | number>) => {
+  const message = useCallback ((key: string, values?: Record<string, string | number>) => {
     return translateUIMessage (key, namespace, locale, values)
-  }
+  }, [namespace, locale])
 
-  const label = (key: string, values?: Record<string, string | number>) => {
+  const label = useCallback ((key: string, values?: Record<string, string | number>) => {
     const result = message (key, values)
     return createElement (LocalisedText, {
 	language: result.language, children: result.text })
-  }
+  }, [message])
 
   return { message, label }
 }