From 3d2361f8256d4a4f9bd555af0de436fd3d7d6b62 Mon Sep 17 00:00:00 2001 From: Martin Koparanov <50118937+PsychedMagnet@users.noreply.github.com> Date: Sun, 8 Sep 2019 02:19:37 +0300 Subject: [PATCH] Fix hooks being called conditionally in useTranslation In the `useTranslation` hook, `useContext` is called conditionally, which breaks the Rule of Hooks, so it may cause problems in the future. This fixes it by calling `useContext` on every render, just not always using the result from it. --- src/useTranslation.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/useTranslation.js b/src/useTranslation.js index 0b553b23..7224f8d8 100755 --- a/src/useTranslation.js +++ b/src/useTranslation.js @@ -11,8 +11,9 @@ import { warnOnce, loadNamespaces, hasLoadedNamespace } from './utils'; export function useTranslation(ns, props = {}) { // assert we have the needed i18nInstance const { i18n: i18nFromProps } = props; + const ReactI18nContext = useContext(I18nContext); const { i18n: i18nFromContext, defaultNS: defaultNSFromContext } = getHasUsedI18nextProvider() - ? useContext(I18nContext) || {} + ? ReactI18nContext || {} : {}; const i18n = i18nFromProps || i18nFromContext || getI18n(); if (i18n && !i18n.reportNamespaces) i18n.reportNamespaces = new ReportNamespaces();