}
onClick={() => setTheme('system')}
active={theme === 'system'}
+ tooltip={{ content: 'System' }}
/>
}
onClick={() => setTheme('light')}
active={theme === 'light'}
+ tooltip={{ content: 'Light Mode' }}
/>
}
onClick={() => setTheme('dark')}
active={theme === 'dark'}
+ tooltip={{ content: 'Dark Mode' }}
/>
);
diff --git a/src/app/ViewSwitcher.tsx b/src/app/ViewSwitcher.tsx
deleted file mode 100644
index 21f3322e..00000000
--- a/src/app/ViewSwitcher.tsx
+++ /dev/null
@@ -1,77 +0,0 @@
-import Switcher from '@/components/Switcher';
-import SwitcherItem from '@/components/SwitcherItem';
-import IconFeed from '@/components/icons/IconFeed';
-import IconGrid from '@/components/icons/IconGrid';
-import {
- PATH_FEED_INFERRED,
- PATH_GRID_INFERRED,
-} from '@/app/paths';
-import IconSearch from '../components/icons/IconSearch';
-import { useAppState } from '@/state/AppState';
-import { GRID_HOMEPAGE_ENABLED } from './config';
-import AdminAppMenu from '@/admin/AdminAppMenu';
-import Spinner from '@/components/Spinner';
-import clsx from 'clsx/lite';
-
-export type SwitcherSelection = 'feed' | 'grid' | 'admin';
-
-export default function ViewSwitcher({
- currentSelection,
- className,
-}: {
- currentSelection?: SwitcherSelection
- className?: string
-}) {
- const {
- isUserSignedIn,
- isUserSignedInEager,
- setIsCommandKOpen,
- } = useAppState();
-
- const renderItemFeed =
-
}
- href={PATH_FEED_INFERRED}
- active={currentSelection === 'feed'}
- noPadding
- />;
-
- const renderItemGrid =
-
}
- href={PATH_GRID_INFERRED}
- active={currentSelection === 'grid'}
- noPadding
- />;
-
- return (
-
-
- {GRID_HOMEPAGE_ENABLED ? renderItemGrid : renderItemFeed}
- {GRID_HOMEPAGE_ENABLED ? renderItemFeed : renderItemGrid}
- {/* Show spinner if admin is suspected to be logged in */}
- {(isUserSignedInEager && !isUserSignedIn) &&
- }
- isInteractive={false}
- noPadding
- />}
- {isUserSignedIn &&
- }
- noPadding
- />}
-
-
- }
- onClick={() => setIsCommandKOpen?.(true)}
- />
-
-
- );
-}
diff --git a/src/components/Modal.tsx b/src/components/Modal.tsx
index a93e82e8..190e33cd 100644
--- a/src/components/Modal.tsx
+++ b/src/components/Modal.tsx
@@ -61,7 +61,10 @@ export default function Modal({
},
});
- useEscapeHandler(onClose, true);
+ useEscapeHandler({
+ onKeyDown: onClose,
+ ignoreShouldRespondToKeyboardCommands: true,
+ });
return (
className?: string
onClick?: () => void
active?: boolean
isInteractive?: boolean
noPadding?: boolean
prefetch?: boolean
+ tooltip?: ComponentProps
}) {
const className = clsx(
'flex items-center justify-center',
- 'w-[42px] h-full',
- 'py-0.5 px-1.5',
+ `${WIDTH_CLASS} h-[28px]`,
isInteractive && 'cursor-pointer',
isInteractive && 'hover:bg-gray-100/60 active:bg-gray-100',
isInteractive && 'dark:hover:bg-gray-900/75 dark:active:bg-gray-900',
@@ -50,18 +56,29 @@ export default function SwitcherItem({
{icon}
;
+ const content = href
+ ?