feat: create basic settings modal

inertia/components/theme_switcher.tsx

@@ -0,0 +1,25 @@
+import { Fragment } from 'react';
+import Toggle from 'react-toggle';
+import 'react-toggle/style.css';
+import useDarkTheme from '~/hooks/use_dark_theme';
+
+export default function ThemeSwitcher() {
+  const { isDarkTheme, toggleDarkTheme } = useDarkTheme();
+
+  if (typeof window === 'undefined') {
+    return <Fragment />;
+  }
+
+  return (
+    <Toggle
+      onChange={({ target }) => toggleDarkTheme(target.checked)}
+      checked={isDarkTheme}
+      name="theme-switcher"
+      id="theme-switcher"
+      icons={{
+        checked: '☀️',
+        unchecked: '🌑',
+      }}
+    />
+  );
+}