A react hook for mobx-state-tree that preserves the last state when reloading

useMyStore.ts

import { getSnapshot, Instance } from "mobx-state-tree";
import { createContext, useEffect, useState } from "react";
import { MyStore } from "./MyStore";

export const useMyStore = () => {
  const [state, setState] = useState(() => MyStore.create());

  useEffect(() => {
    if ((window as any).reentrant) {
      const newState = MyStore.create(getSnapshot(state));
      setState(newState);
    }

    return () => {
      (window as any).reentrant = true;
    };
  }, []);

  return state;
};

export const MyStoreContext = createContext<Instance<typeof MyStore>>(
  undefined as any
);