title: trying to use cookies in my react app but it gets re-rendered all the time
body: <p>I have a react app with sign in/out functionality. I want the application to keep logged in after reloading, and for that I'm using cookies.
  The problem is that after I implemented what I thought should work, I get a "warning, maximum update depth exceeded. it can happen when a component calls setState inside useEffect, but useEffect either doesn't have a dependency array, or one of the dependencies changes on every render" message.</p>
  
  <p>What am I doing wrong?</p>
  
  <p>Thanks a lot!!</p>
  
  <p>Here is the code.</p>
  
  <p>sessions.ts</p>
  
  <pre><code>import React from "react";
  import * as Cookies from "js-cookie";
  
  export const setSessionCookie = (session: any): void =&gt; {
    Cookies.remove("session");
    Cookies.set("session", session, { expires: 14 });
  };
  
  export const getSessionCookie: any = () =&gt; {
    const sessionCookie = Cookies.get("session");
  
    if (sessionCookie === undefined) {
      return {};
    } else {
      return JSON.parse(sessionCookie);
    }
  };
  
  export const SessionContext = React.createContext(getSessionCookie());
  </code></pre>
  
  <p>main.tsx</p>
  
  <pre><code>import React, { useState, useEffect } from "react";
  import { Switch, Route, Router } from "react-router-dom";
  import Comp1 from "./components";
  import Comp2 from "./components";
  
  import { getSessionCookie, SessionContext } from "./session";
  import { createBrowserHistory } from "history";
  
  export default function Main() {
    const [session, setSession] = useState(getSessionCookie());
    useEffect(() =&gt; {
      setSession(getSessionCookie());
    }, [session]);
  
    const history = createBrowserHistory();
  
    return (
      &lt;SessionContext.Provider value={session}&gt;
        &lt;Router history={history}&gt;
        &lt;Switch&gt;
          &lt;Route exact path="/" component={Comp1} /&gt;
          &lt;Route path="/comp2" component={Comp2} /&gt;
        &lt;/Switch&gt;
        &lt;/Router&gt;
      &lt;/SessionContext.Provider&gt;
    );
  }
  </code></pre>