mirror of
https://github.com/gabehf/Koito.git
synced 2026-03-07 21:48:18 -08:00
c16b557c21
* feat: single SOT for themes + basic custom support * fix: adjust colors for yuu theme * feat: Allow loading of environment variables from file (#20) * feat: allow loading of environment variables from file * Panic if a file for an environment variable cannot be read * Use log.Fatalf + os.Exit instead of panic * fix: remove supurfluous call to os.Exit() --------- Co-authored-by: adaexec <nixos-git.s1pht@simplelogin.com> Co-authored-by: Gabe Farrell <90876006+gabehf@users.noreply.github.com> * chore: add pr test workflow * chore: changelog * feat: make all activity grids configurable * fix: adjust activity grid style * fix: make background gradient consistent size * revert: remove year from activity grid opts * style: adjust top item list min size to 200px * feat: add support for custom themes * fix: stabilized the order of top items * chore: update changelog * feat: native import & export * fix: use correct request body for alias requests * fix: clear input when closing edit modal * chore: changelog * docs: make endpoint clearer for some apps * feat: add ui and handler for export * fix: fix pr test workflow --------- Co-authored-by: adaexec <78047743+adaexec@users.noreply.github.com> Co-authored-by: adaexec <nixos-git.s1pht@simplelogin.com>
58 lines
No EOL
2.4 KiB
TypeScript
58 lines
No EOL
2.4 KiB
TypeScript
import { Modal } from "./Modal"
|
|
import { Tabs, TabsContent, TabsList, TabsTrigger } from "@radix-ui/react-tabs";
|
|
import AccountPage from "./AccountPage";
|
|
import { ThemeSwitcher } from "../themeSwitcher/ThemeSwitcher";
|
|
import ThemeHelper from "../../routes/ThemeHelper";
|
|
import { useAppContext } from "~/providers/AppProvider";
|
|
import ApiKeysModal from "./ApiKeysModal";
|
|
import { AsyncButton } from "../AsyncButton";
|
|
import ExportModal from "./ExportModal";
|
|
|
|
interface Props {
|
|
open: boolean
|
|
setOpen: Function
|
|
}
|
|
|
|
export default function SettingsModal({ open, setOpen } : Props) {
|
|
|
|
const { user } = useAppContext()
|
|
|
|
const triggerClasses = "px-4 py-2 w-full hover-bg-secondary rounded-md text-start data-[state=active]:bg-[var(--color-bg-secondary)]"
|
|
const contentClasses = "w-full px-2 mt-8 sm:mt-0 sm:px-10 overflow-y-auto"
|
|
|
|
return (
|
|
<Modal h={700} isOpen={open} onClose={() => setOpen(false)} maxW={900}>
|
|
<Tabs
|
|
defaultValue="Appearance"
|
|
orientation="vertical" // still vertical, but layout is responsive via Tailwind
|
|
className="flex flex-col sm:flex-row h-full"
|
|
>
|
|
<TabsList className="flex flex-row sm:flex-col gap-1 w-full sm:max-w-1/4 rounded-md bg p-2">
|
|
<TabsTrigger className={triggerClasses} value="Appearance">Appearance</TabsTrigger>
|
|
<TabsTrigger className={triggerClasses} value="Account">Account</TabsTrigger>
|
|
{user && (
|
|
<>
|
|
<TabsTrigger className={triggerClasses} value="API Keys">
|
|
API Keys
|
|
</TabsTrigger>
|
|
<TabsTrigger className={triggerClasses} value="Export">Export</TabsTrigger>
|
|
</>
|
|
)}
|
|
</TabsList>
|
|
|
|
<TabsContent value="Account" className={contentClasses}>
|
|
<AccountPage />
|
|
</TabsContent>
|
|
<TabsContent value="Appearance" className={contentClasses}>
|
|
<ThemeSwitcher />
|
|
</TabsContent>
|
|
<TabsContent value="API Keys" className={contentClasses}>
|
|
<ApiKeysModal />
|
|
</TabsContent>
|
|
<TabsContent value="Export" className={contentClasses}>
|
|
<ExportModal />
|
|
</TabsContent>
|
|
</Tabs>
|
|
</Modal>
|
|
)
|
|
} |