One Calendar is a privacy-first calendar web app built with Next.js. It has modern security features, including e2ee, password-protected sharing, and self-destructing share links 📅
calendar.xyehr.cn
Update Settings.tsx
authored by
Evan Huang
and committed by
GitHub
21444fd3
c027cbb7
+16
-1
+16
-1
components/Settings.tsx
+16
-1
components/Settings.tsx
···
9
9
import type { NOTIFICATION_SOUNDS } from "@/utils/notifications"
10
10
import { Switch } from "@/components/ui/switch"
11
11
import { ScrollArea } from "@/components/ui/scroll-area"
12
+
import { useTheme } from "next-themes"
12
13
13
-
// First, add the defaultView and enableShortcuts props to the SettingsProps interface
14
14
interface SettingsProps {
15
15
language: Language
16
16
setLanguage: (lang: Language) => void
···
41
41
enableShortcuts,
42
42
setEnableShortcuts,
43
43
}: SettingsProps) {
44
+
const { setTheme } = useTheme()
44
45
const t = translations[language]
45
46
46
47
// Replace the timezones array with GMT formatted timezones
···
95
96
96
97
<ScrollArea className="flex-1 pr-4">
97
98
<div className="space-y-6 py-4">
99
+
<div className="space-y-2">
100
+
<Label htmlFor="theme">{language === "zh" ? "主题" : "Theme"}</Label>
101
+
<Select value={theme}>
102
+
<SelectTrigger id="theme">
103
+
<SelectValue />
104
+
</SelectTrigger>
105
+
<SelectContent>
106
+
<SelectItem value="light" onClick={() => setTheme("light")}>{language === "zh" ? "亮色" : "Light"}</SelectItem>
107
+
<SelectItem value="dark" onClick={() => setTheme("dark")}>{language === "zh" ? "暗色" : "Dark"}</SelectItem>
108
+
<SelectItem value="system" onClick={() => setTheme("system")}>{language === "zh" ? "系统" : "System"}</SelectItem>
109
+
</SelectContent>
110
+
</Select>
111
+
</div>
112
+
98
113
<div className="space-y-2">
99
114
<Label htmlFor="language">{t.language}</Label>
100
115
<Select value={language} onValueChange={(value: Language) => handleLanguageChange(value)}>