remember collapse state in cookie

lib/cookies.ts

+import type { Types } from 'typescript-cookie';
+import { Cookies } from 'typescript-cookie';
+
+export enum NAMES {
+  NAV_BAR_COLLAPSED='nav_bar_collapsed'
+}
+
+export function get(name?: string | undefined | null) {
+  return Cookies.get(name);
+}
+
+export function set(name: string, value: string, attributes: Types.CookieAttributes = {}) {
+  attributes.path = '/';
+
+  return Cookies.set(name, value, attributes);
+}

lib/isBrowser.ts

+export default function isBrowser() {
+  return typeof window !== 'undefined';
+}

package.json

@@ -28,6 +28,7 @@
     "react-identicons": "^1.2.5",
     "react-jazzicon": "^1.0.4",
     "react-scroll": "^1.8.7",
+    "typescript-cookie": "^1.0.4",
     "use-font-face-observer": "^1.2.1"
   },
   "devDependencies": {

ui/navigation/Navigation.tsx

@@ -14,6 +14,7 @@ import publicTagIcon from 'icons/publictags.svg';
 import tokensIcon from 'icons/token.svg';
 import transactionsIcon from 'icons/transactions.svg';
 import watchlistIcon from 'icons/watchlist.svg';
+import * as cookies from 'lib/cookies';
 import getDefaultTransitionProps from 'theme/utils/getDefaultTransitionProps';
 
 import NavFooter from './NavFooter';
@@ -38,9 +39,14 @@ const accountNavItems = [
 const Navigation = () => {
   const [ isCollapsed, setCollapsedState ] = React.useState(false);
 
+  React.useEffect(() => {
+    setCollapsedState(cookies.get(cookies.NAMES.NAV_BAR_COLLAPSED) === 'true');
+  }, []);
+
   const handleTogglerClick = React.useCallback(() => {
     setCollapsedState((flag) => !flag);
-  }, []);
+    cookies.set(cookies.NAMES.NAV_BAR_COLLAPSED, isCollapsed ? 'false' : 'true');
+  }, [ isCollapsed ]);
 
   const logoColor = useColorModeValue('blue.600', 'white');
 

yarn.lock

@@ -3400,6 +3400,11 @@ type-fest@^0.21.3:
   resolved "https://registry.yarnpkg.com/type-fest/-/type-fest-0.21.3.tgz#d260a24b0198436e133fa26a524a6d65fa3b2e37"
   integrity sha512-t0rzBq87m3fVcduHDUFhKmyyX+9eo6WQjZvf51Ea/M0Q7+T374Jp1aUiyUl0GKxp8M/OETVHSDvmkyPgvX+X2w==
 
+typescript-cookie@^1.0.4:
+  version "1.0.4"
+  resolved "https://registry.yarnpkg.com/typescript-cookie/-/typescript-cookie-1.0.4.tgz#22715aa394275e967fd734fa1417e24870504985"
+  integrity sha512-vZo252VmoEleD/dbE9Wb2lMK63V3M/8aqFbp2Pdb4Oxq8YqqADJ7iMh8THZenFXN+uZJPE8RXkztEaHkOptH4w==
+
 typescript@4.7.2:
   version "4.7.2"
   resolved "https://registry.yarnpkg.com/typescript/-/typescript-4.7.2.tgz#1f9aa2ceb9af87cca227813b4310fff0b51593c4"