Как исправить ThemeProvider с React.StrictMode

Question

Я пытаюсь настроить переключатель для темных и светлых тем. После устранения почти всего в проекте мне удалось воспроизвести проблему в минимальном примере.

Когда я использую оболочку React.StrictMode JSX, полезно для предотвращения проблем при разработке , тема может быть переключена с ThemeProvider один раз, но после этого изменения больше не применяются.

Вот пример живого кода *1010*, с которым можно поиграть. Проверьте его и несколько раз нажмите кнопку переключения темного режима, и вы увидите, что он никогда не вернется в светлый режим.

Однако, если вы просто удалите тег React.StrictMode, который охватывает все, приложение работает, как и ожидалось:

Из этого

function App() {
  return (
    <React.StrictMode>
      <ThemeContextProvider>
        <ThemeWrapper />
      </ThemeContextProvider>
    </React.StrictMode>
  );
}

Для этого:

function App() {
  return (
    <ThemeContextProvider>
      <ThemeWrapper />
    </ThemeContextProvider>
  );
}

Есть идеи? Это ошибка в реакции или материале? Или есть какой-то способ использовать их по-другому?