useState not firing

[soderlind]

I merged remix-sanity-studio-v3 with my code, any reason why useState not working any more?

I'm using react-spring to toggle a mobile menu (it's running in root.tsx):

const [fullMenuVisible, setFullMenuVisible] = useState(false);
const fullMenuAnimation = useSpring({
    transform: fullMenuVisible ? `translateY(0)` : `translateY(-100%)`,
    opacity: fullMenuVisible ? 1 : 0,
});

<div className="nav-toggle" onClick={() =>setFullMenuVisible(!fullMenuVisible)}>
    <div className="bar"></div>
    <div className="bar"></div>
</div>

<animated.div className="mobile-menu-wrapper" style={fullMenuAnimation}>
    <ul className="main-menu mobile">
        <MobileMenu />
    </ul>
</animated.div>

[soderlind]

Solved it (started with React in Juli, so I'm a bit n00b).TL;DR: Wrapped it in <ClientOnly></ClientOnly>

Created a component:

const Hamburger = ({ onClick }) => {
  return (
    <ClientOnly>
      {() => (
        <div className="nav-toggle" onClick={onClick}>
          <div className="bar"></div>
          <div className="bar"></div>
        </div>
      )}
    </ClientOnly>
  );
};

export default Hamburger;

and calling it from root.tsx:

<Hamburger
    onClick={() => {
        setFullMenuVisible(!fullMenuVisible);
    }}
/>

[soderlind]

.. and fixing this, also fixed #1