refactor: use storybook and atomic design (#16)

BREAKING CHANGE: rewrite most of the Typescript types, so the content format (the meta in particular) needs to be updated.

1 files changed, 0 insertions, 50 deletions

diff --git a/src/components/Settings/PrismThemeToggle/PrismThemeToggle.tsx b/src/components/Settings/PrismThemeToggle/PrismThemeToggle.tsx
deleted file mode 100644
index 20ad267..0000000
--- a/src/components/Settings/PrismThemeToggle/PrismThemeToggle.tsx
+++ /dev/null
@@ -1,50 +0,0 @@
-import { Toggle } from '@components/FormElements';
-import { MoonIcon, SunIcon } from '@components/Icons';
-import Spinner from '@components/Spinner/Spinner';
-import { usePrismTheme } from '@utils/providers/prism-theme';
-import { useEffect, useState } from 'react';
-import { useIntl } from 'react-intl';
-
-const PrismThemeToggle = () => {
-  const intl = useIntl();
-  const [isMounted, setIsMounted] = useState<boolean>(false);
-
-  useEffect(() => {
-    setIsMounted(true);
-  }, []);
-
-  const { theme, setTheme, resolvedTheme } = usePrismTheme();
-  const [isDarkTheme, setIsDarkTheme] = useState<boolean>(theme === 'dark');
-
-  useEffect(() => {
-    if (theme === 'system') {
-      setIsDarkTheme(resolvedTheme === 'dark');
-    } else {
-      setIsDarkTheme(theme === 'dark');
-    }
-  }, [theme, resolvedTheme]);
-
-  const updateTheme = () => {
-    isDarkTheme ? setTheme('light') : setTheme('dark');
-    setIsDarkTheme(!isDarkTheme);
-  };
-
-  if (!isMounted) return <Spinner />;
-
-  return (
-    <Toggle
-      id="prism-theme"
-      label={intl.formatMessage({
-        defaultMessage: 'Code blocks:',
-        description: 'PrismThemeToggle: toggle label',
-        id: 'w0UfY0',
-      })}
-      leftChoice={<SunIcon />}
-      rightChoice={<MoonIcon />}
-      value={isDarkTheme}
-      changeHandler={updateTheme}
-    />
-  );
-};
-
-export default PrismThemeToggle;