Type React-i18next useTranslation()

useTypedTranslation.ts

import * as React from 'react';
import { useTranslation } from 'react-i18next';
type Dictionary = string | DictionaryObject;
type DictionaryObject = { [K: string]: Dictionary };

const dict = {
      form: {
        title: 'Nova Ideia',
        fields: {
          unit: 'Qual é a sua unidade?',
          prn: {
            text: 'Qual é o seu PRN?',
            tooltip: 'Caractere de 6 dígitos'
          },
          secondEmail: 'Deseja informar um e-mail secundário?',
          participante: {
            label: 'Está se inscrevendo para o programa sozinho ou tem um grupo te ajudando?',
            option1: 'Somente Eu',
            option2: 'Em Grupo',
            secondEmail: 'E-mail do 2º do participante',
            thirdEmail: 'E-mail do 3º do participante',
            fourthEmail: 'E-mail do 4º do participante'
          },
          ideaTitle: {
            title: 'Qual o título da sua ideia?',
            desc: 'Dê um nome curto que caracterize sua ideia'
          },
          description: 'Descreva quais são os ganhos que a sua ideia proporcionará?',
          gains: 'Descreva quais são os ganhos que a sua ideia proporcionará?',
          file: {
            image: {
              title: 'Deseja inserir uma imagem que ajude a ilustrar sua ideia?',
              description: 'Clique ou arraste e solte um arquivo de imagem do seu dispositivo aqui. Arquivos suportados: JPG, PNG, BMP.'
            },
            attatch: {
              title: 'Deseja inserir um documento que complemente a sua ideia?',
              description: 'Clique ou arraste e solte um arquivo do seu dispositivo aqui.'
            }
          },
          cancelButton: 'Cancelar',
          sendButton: 'Enviar'
        },
        showForm: 'Mostrar Formulário'
      },
      navigationItems: {
        register: 'Cadastrar uma Ideia',
        actionItems: 'Itens de Ação',
        allIdeas: 'Todas as Ideias',
        scorecard: 'Scorecards Avaliados'
      },
      actionCards: {
        userCards: {
          submitedIdea: 'Ideias submetidas: ',
          developIdea: 'Desenvolver a Ideia - ',
          reviewIdea: {
            top: 'Ideias para',
            bottom: 'Revisar - '
          },
          superarIdea: {
            top: 'Ideias no',
            bottom: 'Banco Superar - '
          },
          geralIdea: {
            top: 'Ideias no',
            bottom: 'Banco Geral - '
          }
        },
        actionItems: {
          total: {
            bottom: 'Total de ideias para'
          },
          superar: 'Superar - ',
          aderencia: 'Aderência ao Tema - ',
          desenvolvimento: 'Desenvolvimento - ',
          scorecard: 'Scorecard - '
        },
        allIdeas: {
          total: {
            top: 'Total de ideias para',
            bottom: 'Avaliar - '
          },
          geral: {
            top: 'Ideias no Banco',
            bottom: 'Geral - '
          },
          superar: {
            top: 'Ideias no Banco',
            bottom: 'Superar - '
          },
          plante: {
            top: 'Ideias no Banco',
            bottom: 'Plante Sua Ideia - '
          },
          review: {
            top: 'Ideias no Banco',
            bottom: 'Revisão - '
          },
          outras: {
            top: 'Ideias no Banco',
            bottom: 'Outras Ideias - '
          },
          aderente: {
            top: 'Ideias no Banco',
            bottom: 'Ideias Aderentes - '
          },
          desenvolvimento: {
            top: 'Ideias no Banco',
            bottom: 'Ideias em Desenvolvimento - '
          },
          desenvolvidas: {
            top: 'Ideias no Banco',
            bottom: 'Ideias Desenvolvidas - '
          },
          implementacao: {
            top: 'Ideias no Banco',
            bottom: 'Para Implementação - '
          },
          naoAderente: {
            top: 'Ideias no Banco',
            bottom: 'Não Aderentes - '
          },
          implementadas: {
            top: 'Ideias no Banco',
            bottom: 'Implementadas - '
          }
        }
      },
      detailLists: {
        ideaList: {
          title: 'Título da Ideia',
          date: 'Data de Envio',
          status: 'Status',
          step: 'Etapa',
          resp: 'Responsável'
        },
        scorecard: {
          title: 'Título da Ideia',
          average: 'Média da Ideia',
          master: 'Avaliado por Mestre?',
          info: 'Informações da Ideia'
        }
      },
      scorecard: {
        navigation: {
          implement: 'Implementar Ideias',
          implemented: 'Ideias Implementadas',
          discarted: 'Ideias Descartadas'
        },
        infoBtn: 'Informações',
        returnBtn: 'Voltar Para Desenvolvida',
        implementBtn: 'Implementar Ideia',
        discartBtn: 'Descartar Ideia',
        dialog: {
          title: 'Atualizar Ideia',
          yesBtn: 'Confirmar',
          noBtn: 'Cancelar',
          returnIdea: 'Você tem certeza que deseja trazer de volta esta ideia para o Banco Ideias Desenvolvidas?',
          implementIdea: 'Você tem certeza que deseja implementar essa ideia?',
          discartIdea: 'Você tem certeza que deseja descartar a ideia?'
        },
        infoDialog: {
          btn: 'Abrir Informações Adicionais',
          sentBy: 'Enviada por: ',
          created: 'Criada em: ',
          sendType: 'Enviado via: ',
          description: 'Descrição',
          gain: 'Ganhos'
        }
      },
      modal: {
        sentBy: 'Enviado Por:',
        created: 'Enviado Em:',
        sendType: 'Enviado Via:',
        status: 'Status da Ideia',
        filesLabel: 'Imagens e Arquivos enviados:',
        img: 'Imagem:',
        attatch: 'Anexo:',
        noFile: 'Não Possui',
        fileBtn: 'Escolha um arquivo',
        comments: {
          reviewerComment: 'Comentários deixados pelo avaliador',
          userComment: 'Comentários do usuário',
          sendUserComment: 'Deseja enviar um comentário?',
          sendBothComment: 'Deseja enviar um comentário? -Ambos-',
          sendReviewComment: 'Deseja enviar um comentário sobre a ideia?',
          sendCommentBtn: 'Enviar Comentário'
        },
        bancoOptions: {
          sendSuperar: {
            title: 'A ideia deve ser enviada ao Superar?',
            yes: 'Sim',
            no: 'Não'
          },
          sendPlante: {
            title: 'Em relação ao tema da onda, essa ideia é:',
            opt1: 'Aderente',
            opt2: 'Aderente, mas precisa de revisão',
            opt3: 'Não aderente',
            temaLabel: 'Escolha um tema'
          },
          btnReview: 'Confirmar Revisão',
          sendAderente: {
            title: 'A ideia deve ser aprovada?',
            yes: 'Sim',
            no: 'Não',
            navReview: 'Ideia Revisada',
            navInitial: 'Ideia Inicial'
          },
          sendDevelop: {}
        }
      },
      noIdeasMessage: {
        noStage: 'Não há ideias neste estágio',
        noReviewed: 'Não há ideias já avaliadas neste estágio'
      }
};

 export type MyTranslations = typeof dict;
interface TypedTFunction<D extends Dictionary> {
    <K extends keyof D>(args: K): D[K];
    <K extends keyof D, K1 extends keyof D[K]>
    (...args: [K, K1]): D[K][K1];
    <K extends keyof D,
     K1 extends keyof D[K], 
     K2 extends keyof D[K][K1], 
     K3 extends keyof D[K][K1][K2],
     K4 extends keyof D[K][K1][K2][K3]>(
        ...args: [K, K1, K2, K3, K4]
    ): D[K][K1][K2][K3][K4];
}
interface TypedTFunction<D extends Dictionary> {
    <K extends keyof D>(args: K): D[K];
    <K extends keyof D, K1 extends keyof D[K]>
    (...args: [K, K1]): D[K][K1];
    <K extends keyof D,
     K1 extends keyof D[K], 
     K2 extends keyof D[K][K1], 
>(
        ...args: [K, K1, K2]
    ): D[K][K1][K2];
}
interface TypedTFunction<D extends Dictionary> {
    <K extends keyof D>(args: K): D[K];
    <K extends keyof D, K1 extends keyof D[K]>
    (...args: [K, K1]): D[K][K1];
    <K extends keyof D,
     K1 extends keyof D[K], 
     K2 extends keyof D[K][K1],
     K3 extends keyof D[K][K1][K2],
>(
        ...args: [K, K1, K2, K3]
    ): D[K][K1][K2][K3];
}
    // ... up to a reasonable key parameters length of your choice ...

// import this hook in other modules instead of i18next useTranslation
export function useTypedTranslation (): { t: TypedTFunction<Partial<typeof dict>> } {
  const { t, i18n } = useTranslation();
  // implementation goes here: join keys by dot (depends on your config)
  // and delegate to lib t
  return { t(...keys: string[]) { return t(keys.join("."));} };  
}
/**@example */
//const {t} = useTypedTranslation();
//<div><h2>{t('form', 'fields', 'file', 'attatch', 'title')}</h2></div>