title: Blazor - Change UI CultureInfo at runtime
body: <p>I need to change cultures at runtime according to resource files for each culture.</p>
  
  <p><em>Expected</em></p>
  
  <p>User clicks a button that switches from current language to the other language. The texts in the page are refreshed according to resource files for each culture.</p>
  
  <p><em>Actual</em></p>
  
  <p>User clicks a button that switches from current language to the other language. The texts in the page are refreshed according to resource files for each culture. As soon as the user does any action on any component (I have several radio buttons, buttons and checkboxes) the texts go back to what was written in the first time. It's like the CultureInfo hasn't been changed at all. </p>
  
  <p><em>Tries</em> </p>
  
  <p>Created an AppState class that is injected to the components</p>
  
  <pre><code>    public class AppState
  {
      public CultureInfo currentCulture { get; private set; } = CultureInfo.CurrentCulture;
      public event Action OnChange;
      public void ChangeCulture(CultureInfo newCulture)
      {
          currentCulture = newCulture;
          System.Threading.Thread.CurrentThread.CurrentCulture.ClearCachedData();
          System.Threading.Thread.CurrentThread.CurrentUICulture.ClearCachedData();
          System.Threading.Thread.CurrentThread.CurrentCulture = newCulture;
          System.Threading.Thread.CurrentThread.CurrentUICulture = newCulture;
          NotifyStateChanged();
      }
  
      public CultureInfo getCurrentCulture()
      {
          if (currentCulture == null)
          {
              ChangeCulture(CultureInfo.CurrentCulture);
          }
          return currentCulture;
  
      }
  
      private void NotifyStateChanged() =&gt; OnChange?.Invoke();
  }
  </code></pre>
  
  <p>Added localization to the project in <em>startup.cs</em> and AppState instante as well</p>
  
  <pre><code>        services.AddScoped&lt;AppState&gt;();
          services.AddMvc().AddMvcLocalization();
          services.AddLocalization();
          var supportedCultures = new List&lt;CultureInfo&gt; { new CultureInfo("en-US"), new CultureInfo("es-ES") };
          services.Configure&lt;RequestLocalizationOptions&gt;(options =&gt;
          {
              options.DefaultRequestCulture = new RequestCulture("es-ES");
              options.SupportedUICultures = supportedCultures;
              options.SupportedCultures = supportedCultures;
          });
  </code></pre>
  
  <p>Component has the AppState injected as well as the IStringLocalizer object to get the strings from the resource file.</p>
  
  <pre><code>@inject AppState state
  @inject IStringLocalizer&lt;Index&gt; _localizer
  
  @implements IDisposable
  
  &lt;div class="uk-container" id="data_container"&gt;
      &lt;button @onclick="e =&gt; CambiarIdioma()"&gt;Holadenuevo&lt;/button&gt;
  
      &lt;TablaReconocimientos @ref="tablaReconocimientos" searchText="@navigatableSearchInput"&gt;&lt;/TablaReconocimientos&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>And then has the events set</p>
  
  <pre><code>    protected override void OnInitialized()
      {
          _lematizador = new LematizadorService();
  
          state.OnChange += OnCultureChange;
      }
  
      public void Dispose()
      {
          state.OnChange -= OnCultureChange;
      }
      private void CambiarIdioma()
      {
          if (state.getCurrentCulture().Equals(new CultureInfo("es-ES")))
          {
              state.ChangeCulture(new CultureInfo("en-US"));
          }
          else
          {
              state.ChangeCulture(new CultureInfo("es-ES"));
          }
      }
  
      private void OnCultureChange()
      {
          CultureInfo.CurrentCulture = state.currentCulture;
          CultureInfo.CurrentUICulture = state.currentCulture;
  
          StateHasChanged();
      }
  </code></pre>
  
  <p>So now when clicking the button that triggers <em>CambiarIdioma()</em> the project works fine. But as soon as any action is done inside the component (lets say that I check something inside the <em>TablaReconocimientos</em> component or I click on a radiobutton) the texts are reverted into their original strings.</p>
  
  <p>Every component that needs to have their texts localized has the AppState injected and implemented this functions:</p>
  
  <pre><code>@inject AppState state
  @inject IStringLocalizer&lt;TablaModos&gt; _localizer
  
  @implements IDisposable
  
  
  @*Component stuff*@
  
  @functions{
      protected override void OnInitialized()
      {
          state.OnChange += OnCultureChange;
      }
  
      public void Dispose()
      {
          state.OnChange -= OnCultureChange;
      }
  
      private void OnCultureChange()
      {
          CultureInfo.CurrentCulture = state.currentCulture;
          CultureInfo.CurrentUICulture = state.currentCulture;
  
          StateHasChanged();
      }
  
  }
  </code></pre>
  
  <p>Image as exmaple of whats happening at the moment: 
  <a href="https://i.stack.imgur.com/dlxXH.gif" rel="noreferrer"><img src="https://i.stack.imgur.com/dlxXH.gif" alt="enter image description here"></a></p>