From a26737313e8de174339bb1f0339a3fd8d93d6fee Mon Sep 17 00:00:00 2001
From: Chuy Garcia <75956027+chuygarcia92@users.noreply.github.com>
Date: Wed, 21 Oct 2026 17:01:12 -0600
Subject: [PATCH] Set initial mode from localStorage and persist changes

Fix persistent light/dark mode setting in Staking Brain UI
---
 packages/ui/src/App.tsx | 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)

diff --git a/packages/ui/src/App.tsx b/packages/ui/src/App.tsx
index ba522080..2ca6d4d3 100644
--- a/packages/ui/src/App.tsx
+++ b/packages/ui/src/App.tsx
@@ -11,7 +11,9 @@ import { rpcClient } from "./socket";
 import type { Web3SignerStatus } from "@stakingbrain/brain";
 
 function App(): JSX.Element {
-  const [mode, setMode] = React.useState<"dark" | "light">("light");
+  const [mode, setMode] = React.useState<"dark" | "light">(                                                                                                       
+          () => (localStorage.getItem("ui-mode") as "dark" | "light") || "light"
+        );
   const [userMode, setUserMode] = React.useState<"basic" | "advanced">("basic");
 
   const [signerStatus, setSignerStatus] = React.useState<Web3SignerStatus>("LOADING");
@@ -20,7 +22,11 @@ function App(): JSX.Element {
   useEffect(() => {
     getStakerConfig();
   }, []);
-
+  
+  useEffect(() => {                                                                                                                                               
+    localStorage.setItem("ui-mode", mode);
+  }, [mode]);
+  
   useEffect(() => {
     signerGetStatus();
     const interval = setInterval(() => {