refactor: use named export for everything except pages

Next expect a default export for pages so only those components should
use default exports. Everything else should use named exports to
reduce the number of import statements.

1 files changed, 5 insertions, 7 deletions

diff --git a/src/components/molecules/forms/theme-toggle.tsx b/src/components/molecules/forms/theme-toggle.tsx
index e0a6683..25e2a39 100644
--- a/src/components/molecules/forms/theme-toggle.tsx
+++ b/src/components/molecules/forms/theme-toggle.tsx
@@ -1,9 +1,9 @@
 import { useTheme } from 'next-themes';
 import { FC } from 'react';
 import { useIntl } from 'react-intl';
-import Moon from '../../atoms/icons/moon';
-import Sun from '../../atoms/icons/sun';
-import RadioGroup, {
+import { Moon, Sun } from '../../atoms';
+import {
+  RadioGroup,
   type RadioGroupCallback,
   type RadioGroupCallbackProps,
   type RadioGroupOption,
@@ -20,7 +20,7 @@ export type ThemeToggleProps = Pick<
  *
  * Render a Toggle component to set theme.
  */
-const ThemeToggle: FC<ThemeToggleProps> = (props) => {
+export const ThemeToggle: FC<ThemeToggleProps> = (props) => {
   const intl = useIntl();
   const { resolvedTheme, setTheme } = useTheme();
   const isDarkTheme = resolvedTheme === 'dark';
@@ -95,14 +95,12 @@ const ThemeToggle: FC<ThemeToggleProps> = (props) => {
 
   return (
     <RadioGroup
+      {...props}
       initialChoice={isDarkTheme ? 'dark' : 'light'}
       kind="toggle"
       legend={themeLabel}
       onChange={handleChange}
       options={options}
-      {...props}
     />
   );
 };
-
-export default ThemeToggle;