Refactor development settings management in HomeClient component

Author: Kinin-Code-Offical

src/components/HomeClient.tsx

@@ -65,28 +65,37 @@ export default function HomeClient({ content }: HomeClientProps) {
   const heroRef = useRef<HTMLElement>(null);
   const scrollProgress = useScrollProgress(heroRef);
   const isMobile = useMediaQuery("(max-width: 900px)");
-  const [devEnabled] = useState(() => {
-    const params = new URLSearchParams(window.location.search);
-    return params.get("dev") === "1" || process.env.NEXT_PUBLIC_DEVTOOLS === "1";
+  const [devEnabled, setDevEnabled] = useState(false);
+  const [devSettings, setDevSettings] = useState<DevSettings>(defaultDevSettings);
+  const [terminalApi, setTerminalApi] = useState<TerminalApi | null>(null);
+  const [terminalFocused, setTerminalFocused] = useState(false);
+  const [debugInfo, setDebugInfo] = useState<SceneDebugInfo>({
+    meshNames: [],
+    screenMeshName: null,
+    fallbackPlane: false,
   });
-  const [devSettings, setDevSettings] = useState<DevSettings>(() => {
+
+  useEffect(() => {
+    if (typeof window === "undefined") {
+      return;
+    }
+    const params = new URLSearchParams(window.location.search);
+    setDevEnabled(params.get("dev") === "1" || process.env.NEXT_PUBLIC_DEVTOOLS === "1");
+  }, []);
+
+  useEffect(() => {
+    if (typeof window === "undefined") {
+      return;
+    }
     try {
       const raw = localStorage.getItem("devtools");
       if (raw) {
-        return { ...defaultDevSettings, ...JSON.parse(raw) } as DevSettings;
+        setDevSettings((prev) => ({ ...prev, ...JSON.parse(raw) } as DevSettings));
       }
     } catch {
       // ignore
     }
-    return defaultDevSettings;
-  });
-  const [terminalApi, setTerminalApi] = useState<TerminalApi | null>(null);
-  const [terminalFocused, setTerminalFocused] = useState(false);
-  const [debugInfo, setDebugInfo] = useState<SceneDebugInfo>({
-    meshNames: [],
-    screenMeshName: null,
-    fallbackPlane: false,
-  });
+  }, []);
 
   const projectsMd = useMemo(() => {
     return [