Help needed to translate LabelLikertGroup.tsx

[GuilleHoardings]

I've translated LabelLikertGroup.tsx with code like this:

...
import { useTranslation } from "react-i18next";
...
const getLabelInfo = (label: string): LabelInfo => {
  const { t } = useTranslation("labelling");
  switch (label) {
    case "spam":
      return {
        zeroText: t("not_spam"),
        zeroDescription: [t("not_spam.explanation")],
        oneText: t("spam"),
...

It works in my system, but when I run pre-commit, I get this error:

23:17 Error: React Hook "useTranslation" is called in function "getLabelInfo" that is neither a React function component nor a custom React Hook function. React component names must start with an uppercase letter. React Hook names must start with the word "use". react-hooks/rules-of-hooks

I kind of understand the error, but I don't know howw to fix it. Any pointers about fixing it? I've spent hours adding translations to this file and I don't want to lose this work...

[notmd]

You need to call useTranslation inside a component, and then pass the t function to getLabelInfo

[GuilleHoardings]

That works, thank you!