Added a tabbed setting modal

This commit is contained in:
Dustin Loring
2024-12-07 10:27:50 -05:00
parent 2af32b0333
commit 42ebd3d50e
10 changed files with 650 additions and 7 deletions

View File

@@ -3,6 +3,8 @@ import { useCallback, useEffect, useRef, useState } from 'react';
import { toast } from 'react-toastify';
import { Dialog, DialogButton, DialogDescription, DialogRoot, DialogTitle } from '~/components/ui/Dialog';
import { ThemeSwitch } from '~/components/ui/ThemeSwitch';
import { Settings } from '~/components/ui/Settings';
import { SettingsButton } from '~/components/ui/SettingsButton';
import { db, deleteById, getAll, chatId, type ChatHistoryItem, useChatHistory } from '~/lib/persistence';
import { cubicEasingFn } from '~/utils/easings';
import { logger } from '~/utils/logger';
@@ -39,6 +41,7 @@ export const Menu = () => {
const [list, setList] = useState<ChatHistoryItem[]>([]);
const [open, setOpen] = useState(false);
const [dialogContent, setDialogContent] = useState<DialogContent>(null);
const [isSettingsOpen, setIsSettingsOpen] = useState(false);
const { filteredItems: filteredList, handleSearchChange } = useSearchFilter({
items: list,
@@ -200,10 +203,12 @@ export const Menu = () => {
</Dialog>
</DialogRoot>
</div>
<div className="flex items-center border-t border-bolt-elements-borderColor p-4">
<ThemeSwitch className="ml-auto" />
<div className="flex items-center justify-between border-t border-bolt-elements-borderColor p-4">
<SettingsButton onClick={() => setIsSettingsOpen(true)} />
<ThemeSwitch />
</div>
</div>
<Settings open={isSettingsOpen} onClose={() => setIsSettingsOpen(false)} />
</motion.div>
);
};