jamesf/Perplexica
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

prettier

Browse source
This commit is contained in:
Jin Yucong 2024-07-05 14:36:50 +08:00
parent 5b1aaee605
commit 3b737a078a
63 changed files with 1132 additions and 1853 deletions
Download patch file Download diff file Expand all files Collapse all files

10
ui/components/theme/Provider.tsx
View file

@ -1,11 +1,7 @@
'use client';
import { ThemeProvider } from 'next-themes';
"use client";
import { ThemeProvider } from "next-themes";
const ThemeProviderComponent = ({
children,
}: {
children: React.ReactNode;
}) => {
const ThemeProviderComponent = ({ children }: { children: React.ReactNode }) => {
return (
<ThemeProvider attribute="class" enableSystem={false} defaultTheme="dark">
{children}

30
ui/components/theme/Switcher.tsx
View file

@ -1,10 +1,10 @@
'use client';
import { useTheme } from 'next-themes';
import { SunIcon, MoonIcon, MonitorIcon } from 'lucide-react';
import { useCallback, useEffect, useState } from 'react';
import { Select } from '../SettingsDialog';
"use client";
import { useTheme } from "next-themes";
import { SunIcon, MoonIcon, MonitorIcon } from "lucide-react";
import { useCallback, useEffect, useState } from "react";
import { Select } from "../SettingsDialog";
type Theme = 'dark' | 'light' | 'system';
type Theme = "dark" | "light" | "system";
const ThemeSwitcher = ({ className }: { className?: string }) => {
const [mounted, setMounted] = useState(false);
@ -22,20 +22,18 @@ const ThemeSwitcher = ({ className }: { className?: string }) => {
}, []);
useEffect(() => {
if (isTheme('system')) {
const preferDarkScheme = window.matchMedia(
'(prefers-color-scheme: dark)',
);
if (isTheme("system")) {
const preferDarkScheme = window.matchMedia("(prefers-color-scheme: dark)");
const detectThemeChange = (event: MediaQueryListEvent) => {
const theme: Theme = event.matches ? 'dark' : 'light';
const theme: Theme = event.matches ? "dark" : "light";
setTheme(theme);
};
preferDarkScheme.addEventListener('change', detectThemeChange);
preferDarkScheme.addEventListener("change", detectThemeChange);
return () => {
preferDarkScheme.removeEventListener('change', detectThemeChange);
preferDarkScheme.removeEventListener("change", detectThemeChange);
};
}
}, [isTheme, setTheme, theme]);
@ -49,10 +47,10 @@ const ThemeSwitcher = ({ className }: { className?: string }) => {
<Select
className={className}
value={theme}
onChange={(e) => handleThemeSwitch(e.target.value as Theme)}
onChange={e => handleThemeSwitch(e.target.value as Theme)}
options={[
{ value: 'light', label: 'Light' },
{ value: 'dark', label: 'Dark' },
{ value: "light", label: "Light" },
{ value: "dark", label: "Dark" },
]}
/>
);