Import source: src/app/providers

Import the existing local project snapshot. This commit organizes existing files; it does not represent newly developed functionality.
This commit is contained in:
arsam
2026-09-18 23:10:30 +03:30
parent bf1d13e121
commit 40c2ce02dc
+54
View File
@@ -0,0 +1,54 @@
"use client";
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
import { useEffect, useMemo } from "react";
import { TooltipProvider } from "@radix-ui/react-tooltip";
import { useUiStore } from "@/stores/ui-store";
export function Providers({ children }: { children: React.ReactNode }) {
const queryClient = useMemo(
() =>
new QueryClient({
defaultOptions: {
queries: {
staleTime: 30_000,
refetchOnWindowFocus: false,
},
},
}),
[],
);
const theme = useUiStore((state) => state.theme);
const density = useUiStore((state) => state.density);
const accent = useUiStore((state) => state.accent);
const glass = useUiStore((state) => state.glass);
const radius = useUiStore((state) => state.radius);
const ambiance = useUiStore((state) => state.ambiance);
useEffect(() => {
const root = document.documentElement;
const media = window.matchMedia("(prefers-color-scheme: dark)");
const apply = () => {
root.classList.toggle("dark", theme === "dark" || (theme === "system" && media.matches));
};
apply();
media.addEventListener("change", apply);
return () => media.removeEventListener("change", apply);
}, [theme]);
useEffect(() => {
const root = document.documentElement;
root.classList.toggle("density-compact", density === "compact");
root.classList.toggle("density-comfortable", density === "comfortable");
root.dataset.accent = accent;
root.dataset.glass = glass;
root.dataset.radius = radius;
root.dataset.ambiance = ambiance ? "on" : "off";
}, [density, accent, glass, radius, ambiance]);
return (
<QueryClientProvider client={queryClient}>
<TooltipProvider delayDuration={250}>{children}</TooltipProvider>
</QueryClientProvider>
);
}