1 files changed, 5 insertions, 4 deletions

diff --git a/packages/renderer/src/components/ToggleDarkModeButton.tsx b/packages/renderer/src/components/ToggleDarkModeButton.tsx
index 1b6757e..c8ffdf0 100644
--- a/packages/renderer/src/components/ToggleDarkModeButton.tsx
+++ b/packages/renderer/src/components/ToggleDarkModeButton.tsx
@@ -18,21 +18,22 @@
  * SPDX-License-Identifier: AGPL-3.0-only
  */
 
-import { observer } from 'mobx-react-lite';
 import DarkModeIcon from '@mui/icons-material/DarkMode';
 import LightModeIcon from '@mui/icons-material/LightMode';
 import IconButton from '@mui/material/IconButton';
+import { observer } from 'mobx-react-lite';
 import React from 'react';
 
 import { useStore } from './StoreProvider';
 
-export const ToggleDarkModeButton = observer(function ToggleDarkModeButton() {
-  const { shared: { shouldUseDarkColors }, toggleDarkMode } = useStore();
+export default observer(() => {
+  const store = useStore();
+  const { shared: { shouldUseDarkColors } } = store;
 
   return (
     <IconButton
       aria-label="Toggle dark mode"
-      onClick={() => toggleDarkMode()}
+      onClick={() => store.toggleDarkMode()}
     >
       {shouldUseDarkColors ? <LightModeIcon /> : <DarkModeIcon />}
     </IconButton>