ThemeProvider doesn't pass down dictionary prop properly

[bob606]

Expected Behavior

When wrapping components with a @kiwicom/orbit-components/lib/ThemeProvider all children should use the language passed in the dictionary prop. This would be the same behavior which is already working for the theme prop.

Current Behavior

You have to directly wrap a component (e.g. a Wizard) in order for the dictionary to be applied.

     <ThemeProvider
          theme={{
            orbit: customTokens,
            rtl: false,
            transitions: false,
            lockScrolling: false,
          }}
          dictionary={de_DE}
        >
          <Wizard
            id='wizard'
            completedSteps={currentStep}
            activeStep={currentStep}
            onChangeStep={(step) => {
              setCurrentStep(step);
            }}
          >
            {
              wizardComponents
                .map((key, index) => {
                  return <WizardStep key={index} title={getWizardTitle(key)} />;
                })
            }
          </Wizard>
        </ThemeProvider>

Possible Solution

The ThemeProvider works for the theme prop, so the solution probably lies somewhere in how the implementation of the dictionary prop differs from the theme prop.

Steps to Reproduce

1. try to pass the dictionary to a children component and see that it will default to English

      <KiwiThemeProvider
        theme={{
          orbit: customTokens,
          rtl: false,
          transitions: false,
          lockScrolling: false,
        }}
        dictionary={de_DE}
      >
       <Component {...pageProps} />   //<-- dictionary should be passed to all components in here but isn't
      </KiwiThemeProvider>

2. Change something in your customTokens and see how the effect is applied to all children, unlike the language.

Context (Environment)

    "@kiwicom/orbit-components": "^2.17.2",
    "next": "^12.1.6",

[kouloughli-hemza]

can you show me your implementation? are you using useTranslate or Translate ?