useState is not working

 const [localStorageTheme, setLocalStorageTheme] = useState(() => {
    const lTheme = localStorage.getItem("localStorageTheme");
    if (lTheme) {
      return lTheme;
    }
    const isLight = window.matchMedia("(prefers-color-scheme: light)").matches;
    console.log(isLight);
    return isLight ? "light" : "dark";
  });

 const [localStorageTheme, setLocalStorageTheme] = useState(() => {
    const lTheme = localStorage.getItem("localStorageTheme");
    if (lTheme) {
      return lTheme;
    }
    const isLight = window.matchMedia("(prefers-color-scheme: light)").matches;
    console.log(isLight);
    return isLight ? "light" : "dark";
  });

{
    <div
        style={{
          transitionTimingFunction: "steps(10)",
        }}
        className={`leading-none w-[660px] h-[100%]  block overflow-hidden transition-transform ${
          localStorageTheme === "dark" ? "translate-x-[-93%] " : "translate-x-0"
        } duration-100`}
      >
          //code
      </div>
}

{
    <div
        style={{
          transitionTimingFunction: "steps(10)",
        }}
        className={`leading-none w-[660px] h-[100%]  block overflow-hidden transition-transform ${
          localStorageTheme === "dark" ? "translate-x-[-93%] " : "translate-x-0"
        } duration-100`}
      >
          //code
      </div>
}