50 lines
1.4 KiB
TypeScript
50 lines
1.4 KiB
TypeScript
|
"use client";
|
||
|
|
|
||
|
|
import { useEffect, useState } from "react";
|
||
|
|
import { formatUserLocalTime } from "@/components/dashboard/scan-terminal/decision-utils";
|
||
|
|
|
||
|
|
export type ThemeMode = "dark" | "light";
|
||
|
|
|
||
|
|
export function useUserLocalClock() {
|
||
|
|
const [userLocalTime, setUserLocalTime] = useState("--");
|
||
|
|
|
||
|
|
useEffect(() => {
|
||
|
|
setUserLocalTime(formatUserLocalTime());
|
||
|
|
const intervalId = window.setInterval(() => {
|
||
|
|
setUserLocalTime(formatUserLocalTime());
|
||
|
|
}, 10_000);
|
||
|
|
return () => window.clearInterval(intervalId);
|
||
|
|
}, []);
|
||
|
|
|
||
|
|
return userLocalTime;
|
||
|
|
}
|
||
|
|
|
||
|
|
export function useScanTerminalTheme() {
|
||
|
|
const [themeMode, setThemeMode] = useState<ThemeMode>("dark");
|
||
|
|
|
||
|
|
useEffect(() => {
|
||
|
|
const root = document.documentElement;
|
||
|
|
const hadLight = root.classList.contains("light");
|
||
|
|
const hadDark = root.classList.contains("dark");
|
||
|
|
root.classList.toggle("light", themeMode === "light");
|
||
|
|
root.classList.toggle("dark", themeMode === "dark");
|
||
|
|
return () => {
|
||
|
|
root.classList.toggle("light", hadLight);
|
||
|
|
root.classList.toggle("dark", hadDark);
|
||
|
|
};
|
||
|
|
}, [themeMode]);
|
||
|
|
|
||
|
|
useEffect(() => {
|
||
|
|
const stored = window.localStorage.getItem("polyweather_scan_theme");
|
||
|
|
if (stored === "light") {
|
||
|
|
setThemeMode("light");
|
||
|
|
}
|
||
|
|
}, []);
|
||
|
|
|
||
|
|
useEffect(() => {
|
||
|
|
window.localStorage.setItem("polyweather_scan_theme", themeMode);
|
||
|
|
}, [themeMode]);
|
||
|
|
|
||
|
|
return { setThemeMode, themeMode };
|
||
|
|
}
|