diff --git a/ui/src/app/containers/Onboarding.tsx b/ui/src/app/containers/Onboarding.tsx index 36cdc9f52..b9ecb6153 100644 --- a/ui/src/app/containers/Onboarding.tsx +++ b/ui/src/app/containers/Onboarding.tsx @@ -23,7 +23,7 @@ import Arcade from "public/icons/arcade.svg"; import { indexAddress, formatCurrency, displayAddress } from "@/app/lib/utils"; import { useBurner } from "@/app/lib/burner"; import ArcadeLoader from "@/app/components/animations/ArcadeLoader"; -import useUIStore from "@/app/hooks/useUIStore"; +import useUIStore, { ScreenPage } from "@/app/hooks/useUIStore"; import { useUiSounds, soundSelector } from "@/app/hooks/useUiSound"; type Section = "connect" | "eth" | "lords" | "arcade"; @@ -58,6 +58,7 @@ interface SectionContentProps { listConnectors: () => any[]; updateConnectors: () => void; handleOnboarded: () => void; + setScreen: (value: ScreenPage) => void; } const SectionContent = ({ @@ -82,6 +83,7 @@ const SectionContent = ({ listConnectors, updateConnectors, handleOnboarded, + setScreen, }: SectionContentProps) => { console.log(lordsGameCost * 25); switch (section) { @@ -377,6 +379,7 @@ const SectionContent = ({ updateConnectors(); setFullDeployment(false); handleOnboarded(); + setScreen("start"); } catch (e) { console.log("Arcade deployment cancelled"); } @@ -586,6 +589,7 @@ const Onboarding = ({ const [step, setStep] = useState(1); const handleOnboarded = useUIStore((state) => state.handleOnboarded); + const setScreen = useUIStore((state) => state.setScreen); const eth = Number(ethBalance); const lords = Number(lordsBalance); @@ -642,7 +646,10 @@ const Onboarding = ({ @@ -679,6 +686,7 @@ const Onboarding = ({ listConnectors={listConnectors} updateConnectors={updateConnectors} handleOnboarded={handleOnboarded} + setScreen={setScreen} />
@@ -705,6 +713,7 @@ const Onboarding = ({ listConnectors={listConnectors} updateConnectors={updateConnectors} handleOnboarded={handleOnboarded} + setScreen={setScreen} />
@@ -731,6 +740,7 @@ const Onboarding = ({ listConnectors={listConnectors} updateConnectors={updateConnectors} handleOnboarded={handleOnboarded} + setScreen={setScreen} />
@@ -757,6 +767,7 @@ const Onboarding = ({ listConnectors={listConnectors} updateConnectors={updateConnectors} handleOnboarded={handleOnboarded} + setScreen={setScreen} />
@@ -798,6 +809,7 @@ const Onboarding = ({ listConnectors={listConnectors} updateConnectors={updateConnectors} handleOnboarded={handleOnboarded} + setScreen={setScreen} /> )} {step == 2 && ( @@ -823,6 +835,7 @@ const Onboarding = ({ listConnectors={listConnectors} updateConnectors={updateConnectors} handleOnboarded={handleOnboarded} + setScreen={setScreen} /> )} {step == 3 && ( @@ -848,6 +861,7 @@ const Onboarding = ({ listConnectors={listConnectors} updateConnectors={updateConnectors} handleOnboarded={handleOnboarded} + setScreen={setScreen} /> )} {step == 4 && ( @@ -873,6 +887,7 @@ const Onboarding = ({ listConnectors={listConnectors} updateConnectors={updateConnectors} handleOnboarded={handleOnboarded} + setScreen={setScreen} /> )} diff --git a/ui/src/app/page.tsx b/ui/src/app/page.tsx index 4e6d36986..6cfe19458 100644 --- a/ui/src/app/page.tsx +++ b/ui/src/app/page.tsx @@ -134,6 +134,7 @@ function Home({ updateConnectors }: HomeProps) { const calls = useTransactionCartStore((state) => state.calls); const screen = useUIStore((state) => state.screen); const setScreen = useUIStore((state) => state.setScreen); + const handleOnboarded = useUIStore((state) => state.handleOnboarded); const deathDialog = useUIStore((state) => state.deathDialog); const hasBeast = useAdventurerStore((state) => state.computed.hasBeast); const hasStatUpgrades = useAdventurerStore( @@ -470,12 +471,14 @@ function Home({ updateConnectors }: HomeProps) { }, [account, accountChainId, isConnected]); useEffect(() => { + console.log(arcadeConnectors.length, onboarded); if (arcadeConnectors.length === 0 && !onboarded) { setScreen("onboarding"); - } else { + } else if (!onboarded) { + handleOnboarded(); setScreen("start"); } - }, [arcadeConnectors, onboarded]); + }, [arcadeConnectors]); useEffect(() => { resetCalls();