feat: tema ayarları Appwrite user prefs ile kalıcı hale getirildi

- saveThemePrefsAction: account.updatePrefs ile mevcut prefs'i merge eder
- Dashboard layout'ta account.getPrefs ile prefs server-side yüklenir
- PrefsInitializer: mount'ta dark/light, renk teması, radius, sidebar
  config'ini Appwrite'dan gelen initialPrefs ile uygular
- ThemeCustomizer: renk teması / tweakcn / radius / sidebar değişikliği
  anında Appwrite'a kaydedilir; dark/light toggle useEffect ile izlenir
- Sayfa yenileme ve farklı cihazda giriş sonrasında ayarlar korunur
This commit is contained in:
egecankomur
2026-05-05 20:57:30 +03:00
parent 9497cc72ce
commit 237ec92691
5 changed files with 155 additions and 39 deletions
+7
View File
@@ -7,7 +7,9 @@ import { SiteHeader } from "@/components/site-header";
import { SiteFooter } from "@/components/site-footer";
import { SidebarProvider, SidebarInset } from "@/components/ui/sidebar";
import { ThemeCustomizer, ThemeCustomizerTrigger } from "@/components/theme-customizer";
import { PrefsInitializer } from "@/components/theme-customizer/prefs-initializer";
import { useSidebarConfig } from "@/hooks/use-sidebar-config";
import type { ThemePrefs } from "@/lib/appwrite/theme-prefs-actions";
export type ShellUser = {
id: string;
@@ -25,10 +27,12 @@ export function DashboardShell({
user,
company,
children,
initialPrefs,
}: {
user: ShellUser;
company: ShellCompany;
children: React.ReactNode;
initialPrefs: ThemePrefs;
}) {
const [themeCustomizerOpen, setThemeCustomizerOpen] = React.useState(false);
const { config } = useSidebarConfig();
@@ -44,6 +48,8 @@ export function DashboardShell({
}
className={config.collapsible === "none" ? "sidebar-none-mode" : ""}
>
<PrefsInitializer prefs={initialPrefs} />
{config.side === "left" ? (
<>
<AppSidebar
@@ -88,6 +94,7 @@ export function DashboardShell({
<ThemeCustomizer
open={themeCustomizerOpen}
onOpenChange={setThemeCustomizerOpen}
initialPrefs={initialPrefs}
/>
</SidebarProvider>
);
+11 -1
View File
@@ -2,6 +2,8 @@ import { redirect } from "next/navigation";
import { getActiveContext } from "@/lib/appwrite/active-context";
import { getLogoUrl } from "@/lib/appwrite/storage";
import { createSessionClient } from "@/lib/appwrite/server";
import type { ThemePrefs } from "@/lib/appwrite/theme-prefs-actions";
import { DashboardShell } from "./dashboard-shell";
export default async function DashboardLayout({
@@ -12,6 +14,14 @@ export default async function DashboardLayout({
const ctx = await getActiveContext();
if (!ctx) redirect("/onboarding");
let themePrefs: ThemePrefs = {};
try {
const { account } = await createSessionClient();
themePrefs = await account.getPrefs<ThemePrefs>();
} catch {
// use defaults if prefs unavailable
}
const company = {
id: ctx.tenantId,
name: ctx.settings?.officeName ?? "Çalışma alanı",
@@ -24,7 +34,7 @@ export default async function DashboardLayout({
};
return (
<DashboardShell user={user} company={company}>
<DashboardShell user={user} company={company} initialPrefs={themePrefs}>
{children}
</DashboardShell>
);