diff --git a/pages/_app.tsx b/pages/_app.tsx index 18f25b4..1b17ecc 100644 --- a/pages/_app.tsx +++ b/pages/_app.tsx @@ -15,6 +15,7 @@ import state from "../state"; import TimeAgo from "javascript-time-ago"; import en from "javascript-time-ago/locale/en.json"; +import { useSnapshot } from "valtio"; TimeAgo.addDefaultLocale(en); function MyApp({ Component, pageProps: { session, ...pageProps } }: AppProps) { @@ -25,15 +26,29 @@ function MyApp({ Component, pageProps: { session, ...pageProps } }: AppProps) { const origin = "https://xrpl-hooks-ide.vercel.app"; // TODO: Change when site is deployed const shareImg = "/share-image.png"; + const snap = useSnapshot(state); useEffect(() => { if (gistId && router.isReady) { fetchFiles(gistId); } else { - if (!gistId && router.isReady && !router.pathname.includes("/sign-in")) { + if ( + !gistId && + router.isReady && + !router.pathname.includes("/sign-in") && + !snap.files.length && + !snap.mainModalShowed + ) { state.mainModalOpen = true; + state.mainModalShowed = true; } } - }, [gistId, router.isReady, router.pathname]); + }, [ + gistId, + router.isReady, + router.pathname, + snap.files, + snap.mainModalShowed, + ]); return ( <> diff --git a/state/index.ts b/state/index.ts index cff1c20..ee56557 100644 --- a/state/index.ts +++ b/state/index.ts @@ -65,6 +65,7 @@ export interface IState { client: XrplClient | null; clientStatus: "offline" | "online"; mainModalOpen: boolean; + mainModalShowed: boolean; accounts: IAccount[]; } @@ -93,6 +94,7 @@ let initialState: IState = { client: null, clientStatus: "offline" as "offline", mainModalOpen: false, + mainModalShowed: false, accounts: [], };