diff --git a/web/public/sounds/Door.mp3 b/web/public/sounds/Door.mp3 new file mode 100644 index 000000000..121d946ee Binary files /dev/null and b/web/public/sounds/Door.mp3 differ diff --git a/web/src/components/RegisterEntities.tsx b/web/src/components/RegisterEntities.tsx index a2dfc1009..c91701311 100644 --- a/web/src/components/RegisterEntities.tsx +++ b/web/src/components/RegisterEntities.tsx @@ -1,5 +1,5 @@ import { DojoEvent } from "@/dojo/class/Events"; -import { HighVolatilityData, MeetOGData } from "@/dojo/events"; +import { HighVolatilityData } from "@/dojo/events"; import { WorldEvents } from "@/dojo/generated/contractEvents"; import { useConfigStore, useDojoContext, useGameStore, useRouterContext } from "@/dojo/hooks"; import { ConfigStoreClass } from "@/dojo/stores/config"; @@ -28,12 +28,7 @@ const RegisterEntities = observer(() => { const toaster = useToast(); useEffect(() => { - // const init = async () => { - // // if (!gameId) { - // // gameStore.reset(); - // // } - // }; - + console.log("RegisterEntities", gameId); if (gameStore && gameId) { @@ -41,7 +36,7 @@ const RegisterEntities = observer(() => { } else { gameStore.reset(); } - }, [gameId, account?.address, playerId, selectedChain, gameStore]); + }, [gameId, gameStore]); // useEffect(() => { @@ -70,11 +65,11 @@ const RegisterEntities = observer(() => { // break; case WorldEvents.MeetOG: - const meetOgEvent = last.parsed as MeetOGData; - setOgId(meetOgEvent.ogId); - setTimeout(() => { - setOgId(undefined); - }, 10_000); + // const meetOgEvent = last.parsed as MeetOGData; + // setOgId(meetOgEvent.ogId); + // setTimeout(() => { + // setOgId(undefined); + // }, 10_000); break; case WorldEvents.HighVolatility: diff --git a/web/src/components/layout/ConnectionError.tsx b/web/src/components/layout/ConnectionError.tsx new file mode 100644 index 000000000..1135baef8 --- /dev/null +++ b/web/src/components/layout/ConnectionError.tsx @@ -0,0 +1,45 @@ +import { Button, Flex, Text, VStack } from "@chakra-ui/react"; +import { useRouter } from "next/router"; +import { ChainSelector } from "../wallet"; + +const ConnectionError = ({ errors }: { errors: string[] }) => { + const router = useRouter(); + + return ( + + + + + Unable to connect + {errors.map((e) => { + if (e) { + return {e}; + } + })} + + + + Try to refresh + + or switch chain + { + router.reload(); + }} + /> + + + + + ); +}; + +export default ConnectionError; diff --git a/web/src/components/layout/Loader.tsx b/web/src/components/layout/Loader.tsx index e3a3ef9df..2457860a4 100644 --- a/web/src/components/layout/Loader.tsx +++ b/web/src/components/layout/Loader.tsx @@ -1,5 +1,10 @@ -import { Image } from "@chakra-ui/react"; +import { Image, Text, VStack } from "@chakra-ui/react"; export const Loader = () => { - return loading; + return ( + + loading + LOADING ... + + ); }; diff --git a/web/src/components/player/Inventory.tsx b/web/src/components/player/Inventory.tsx index 9df101aa6..3a1f783f0 100644 --- a/web/src/components/player/Inventory.tsx +++ b/web/src/components/player/Inventory.tsx @@ -7,6 +7,7 @@ import { observer } from "mobx-react-lite"; import { Tooltip } from "../common"; import { Bag, Cigarette, PawnshopIcon } from "../icons"; +import { Sounds, playSound } from "@/hooks/sound"; import colors from "@/theme/colors"; import { useAccount } from "@starknet-react/core"; import { PowerMeter } from "./PowerMeter"; @@ -98,6 +99,7 @@ export const Inventory = observer(({ hidePawnshop = false, ...props }: StyleProp animation={game.isShopOpen ? `${blinkAnim} 6s linear infinite` : "none"} onClick={() => { if (game.isShopOpen) { + playSound(Sounds.Door, 0.5) router.push(`/${gameId}/pawnshop`); } }} diff --git a/web/src/components/wallet/ChainSelector.tsx b/web/src/components/wallet/ChainSelector.tsx index 642a17664..ba4f83d8c 100644 --- a/web/src/components/wallet/ChainSelector.tsx +++ b/web/src/components/wallet/ChainSelector.tsx @@ -3,7 +3,12 @@ import { DojoChainConfig, SupportedChainIds } from "@/dojo/setup/config"; import { Button, Menu, MenuButton, MenuItem, MenuList, Text } from "@chakra-ui/react"; import { useDisconnect } from "@starknet-react/core"; -export const ChainSelector = ({ canChange = false }: { canChange: boolean }) => { +type ChainSelectorProps = { + canChange: boolean; + onChange: VoidFunction; +}; + +export const ChainSelector = ({ canChange = false, onChange = () => {} }: ChainSelectorProps) => { const { chains: { dojoContextConfig, selectedChain, setSelectedChain }, } = useDojoContext(); @@ -13,10 +18,11 @@ export const ChainSelector = ({ canChange = false }: { canChange: boolean }) => const onSelectChain = async (chain: DojoChainConfig) => { await disconnectAsync(); setSelectedChain(chain); + onChange(); }; const getInfos = (chain: DojoChainConfig) => { - return `RPC: ${chain.rpcUrl}\nTORII: ${chain.toriiUrl}\nTORII WS: ${chain.toriiWsUrl}` + return `RPC: ${chain.rpcUrl}\nTORII: ${chain.toriiUrl}\nTORII WS: ${chain.toriiWsUrl}`; }; return ( @@ -28,27 +34,32 @@ export const ChainSelector = ({ canChange = false }: { canChange: boolean }) => )} {canChange && ( - - }*/> - {selectedChain.name} - - - - {Object.keys(dojoContextConfig).map((key: string) => { - const dojoChainConfig: DojoChainConfig = dojoContextConfig[key as SupportedChainIds]; - - if (dojoChainConfig === selectedChain) return; - const isMainnet = dojoChainConfig.chainConfig.network === "mainnet"; - return ( - onSelectChain(dojoChainConfig)}> - - {dojoChainConfig.name} ({isMainnet ? "RANKED" : "FREE"}) - - - ); - })} - - + + }*/ + > + {selectedChain.name} + + + + {Object.keys(dojoContextConfig).map((key: string) => { + const dojoChainConfig: DojoChainConfig = dojoContextConfig[key as SupportedChainIds]; + + if (dojoChainConfig === selectedChain) return; + const isMainnet = dojoChainConfig.chainConfig.network === "mainnet"; + return ( + onSelectChain(dojoChainConfig)}> + + {dojoChainConfig.name} ({isMainnet ? "RANKED" : "FREE"}) + + + ); + })} + + )} ); diff --git a/web/src/components/wallet/Connect.tsx b/web/src/components/wallet/Connect.tsx index c5aac202b..d0e0e4fa2 100644 --- a/web/src/components/wallet/Connect.tsx +++ b/web/src/components/wallet/Connect.tsx @@ -196,13 +196,13 @@ const ConnectModal = ({ {connectors.map((connector) => { const isBurner = connector.id === "dojoburner"; const isPredeployed = connector.id === "dojopredeployed"; - + if (!isKatana && (isBurner || isPredeployed)) { // burner or predeployed not on katana return null; } - if (isKatana && !(isBurner || isPredeployed )) { + if (isKatana && !(isBurner || isPredeployed)) { // not burner or predeployed on katana return null; } @@ -249,6 +249,8 @@ const ConnectModal = ({ }; export const ChildrenOrConnect = ({ children }: { children: ReactNode }) => { - const { account } = useAccount(); - return <>{account ? children : }; + const { /*account,*/ isConnecting, isReconnecting, isConnected } = useAccount(); + if (isConnecting || isReconnecting) return null; + return <>{isConnected ? children : }; + }; diff --git a/web/src/dojo/context/DojoContext.tsx b/web/src/dojo/context/DojoContext.tsx index afe9de342..cc46e2289 100644 --- a/web/src/dojo/context/DojoContext.tsx +++ b/web/src/dojo/context/DojoContext.tsx @@ -1,10 +1,16 @@ +import RegisterEntities from "@/components/RegisterEntities"; +import ConnectionError from "@/components/layout/ConnectionError"; +import { Loader } from "@/components/layout/Loader"; +import { StarknetProvider } from "@/components/wallet"; +import { Flex, VStack } from "@chakra-ui/react"; import { BurnerManager, PredeployedManager, useBurnerWindowObject, - usePredeployedWindowObject + usePredeployedWindowObject, } from "@dojoengine/create-burner"; -import { ReactNode, createContext, useContext, useEffect, useMemo } from "react"; +import { observer } from "mobx-react-lite"; +import { ReactNode, createContext, useContext, useEffect, useMemo, useState } from "react"; import { QueryClientProvider } from "react-query"; import { Account, AccountInterface } from "starknet"; import { DojoChainsResult, useDojoChains } from "../hooks/useDojoChains"; @@ -25,103 +31,162 @@ interface DojoContextType { export const DojoContext = createContext(null); -export const DojoContextProvider = ({ - children, - dojoContextConfig, -}: { - children: ReactNode; - dojoContextConfig: DojoContextConfig; -}) => { - const currentValue = useContext(DojoContext); - if (currentValue) throw new Error("DojoProvider can only be used once"); +export const DojoContextProvider = observer( + ({ children, dojoContextConfig }: { children: ReactNode; dojoContextConfig: DojoContextConfig }) => { + const currentValue = useContext(DojoContext); + if (currentValue) throw new Error("DojoProvider can only be used once"); - - const defaultChain = - process.env.NODE_ENV === "production" ? dojoContextConfig.KATANA_SLOT_420 : dojoContextConfig.KATANA; - - const { selectedChain, setSelectedChain, isKatana, chains } = useDojoChains(dojoContextConfig, defaultChain); - - const { dojoProvider, queryClient, graphqlClient, graphqlWsClient, rpcProvider } = useDojoClients(selectedChain); - - const masterAccount = useMemo(() => { - if (selectedChain.masterAddress && selectedChain.masterPrivateKey) { - return new Account(rpcProvider, selectedChain.masterAddress, selectedChain.masterPrivateKey, "1"); - } - return undefined; - }, [rpcProvider, selectedChain.masterAddress, selectedChain.masterPrivateKey]); - - const burnerManager = useMemo(() => { - if (!masterAccount) return undefined; - // console.log("new BurnerManager"); - - return new BurnerManager({ - masterAccount: masterAccount!, - accountClassHash: selectedChain.accountClassHash!, - rpcProvider: rpcProvider, + const [configStoreState, setConfigStoreState] = useState({ + isInitialized: false, + isError: false, + error: undefined, }); - }, [masterAccount, selectedChain.accountClassHash, rpcProvider]); - - const predeployedManager = useMemo(() => { - if (!selectedChain.predeployedAccounts || selectedChain.predeployedAccounts.length === 0) return undefined; - // console.log("new BurnerManager"); - return new PredeployedManager({ - rpcProvider: rpcProvider, - predeployedAccounts: selectedChain.predeployedAccounts, - }); - }, [rpcProvider, selectedChain.predeployedAccounts]); - - const { isInitialized: burnerSWOInitialized} = useBurnerWindowObject(burnerManager); - const { isInitialized: predeployedSWOInitialized} = usePredeployedWindowObject(predeployedManager); - - const configStore = useMemo(() => { - return new ConfigStoreClass({ - client: graphqlClient, - dojoProvider: dojoProvider, - manifest: selectedChain.manifest, - }); - }, [graphqlClient, dojoProvider, selectedChain.manifest]); - - const gameStore = useMemo(() => { - return new GameStoreClass({ - client: graphqlClient, - wsClient: graphqlWsClient, - configStore, - }); - }, [graphqlClient, graphqlWsClient, configStore]); - - useEffect(() => { - configStore.init(); - }, [configStore]); - - - if (!(burnerSWOInitialized && predeployedSWOInitialized)) return null; - - return ( - { + if (selectedChain.masterAddress && selectedChain.masterPrivateKey) { + return new Account(rpcProvider, selectedChain.masterAddress, selectedChain.masterPrivateKey, "1"); + } + return undefined; + }, [rpcProvider, selectedChain.masterAddress, selectedChain.masterPrivateKey]); + + const burnerManager = useMemo(() => { + if (!masterAccount) return undefined; + // console.log("new BurnerManager"); + + return new BurnerManager({ + masterAccount: masterAccount!, + accountClassHash: selectedChain.accountClassHash!, + rpcProvider: rpcProvider, + }); + }, [masterAccount, selectedChain.accountClassHash, rpcProvider]); + + const predeployedManager = useMemo(() => { + if (!selectedChain.predeployedAccounts || selectedChain.predeployedAccounts.length === 0) return undefined; + // console.log("new BurnerManager"); + + return new PredeployedManager({ + rpcProvider: rpcProvider, + predeployedAccounts: selectedChain.predeployedAccounts, + }); + }, [rpcProvider, selectedChain.predeployedAccounts]); + + const { + isInitialized: burnerSWOIsInitialized, + isError: burnerSWOIsError, + error: burnerSWOError, + } = useBurnerWindowObject(burnerManager); + + const { + isInitialized: predeployedSWOIsInitialized, + isError: predeployedSWOIsError, + error: predeployedSWOError, + } = usePredeployedWindowObject(predeployedManager); + + const configStore = useMemo(() => { + return new ConfigStoreClass({ + client: graphqlClient, + dojoProvider: dojoProvider, + manifest: selectedChain.manifest, + }); + }, [graphqlClient, dojoProvider, selectedChain.manifest]); + + const gameStore = useMemo(() => { + return new GameStoreClass({ + client: graphqlClient, + wsClient: graphqlWsClient, configStore, - gameStore, - }} - > - {children} - - ); -}; + }); + }, [graphqlClient, graphqlWsClient, configStore]); + + useEffect(() => { + const initAsync = async () => { + if(!configStore) return + try { + await configStore.init(); + setConfigStoreState({ + isInitialized: true, + isError: false, + error: undefined, + }); + } catch (e) { + setConfigStoreState({ + isInitialized: false, + isError: true, + error: "faild to init configStore", + }); + } + }; + initAsync(); + }, [configStore]); + + const isInitialized = burnerSWOIsInitialized && predeployedSWOIsInitialized && configStoreState.isInitialized; + const hasError = burnerSWOIsError || predeployedSWOIsError || configStoreState.isError; + const errors = hasError ? [burnerSWOError, predeployedSWOError, configStoreState.error] : []; + + // console.log("isInitialized", isInitialized); + // console.log("hasError", hasError); + + // is initializing + if (!hasError && !isInitialized) + return ( + + + + + + ); + + return ( + + + {hasError ? ( + + ) : ( + <> + + + {children} + + + )} + + + ); + }, +); diff --git a/web/src/dojo/hooks/useDojoChains.ts b/web/src/dojo/hooks/useDojoChains.ts index 7c2862d5f..c8f40f48e 100644 --- a/web/src/dojo/hooks/useDojoChains.ts +++ b/web/src/dojo/hooks/useDojoChains.ts @@ -1,14 +1,14 @@ import { Chain } from "@starknet-react/chains"; -import { useEffect, useMemo, useState } from "react"; +import { useMemo, useState } from "react"; import { shortString } from "starknet"; import { DojoChainConfig, DojoContextConfig, SupportedChainIds } from "../setup/config"; export type DojoChainsResult = ReturnType; -export const useDojoChains = (dojoContextConfig: DojoContextConfig, defaultChain: DojoChainConfig) => { +export const useDojoChains = (dojoContextConfig: DojoContextConfig, intialChain: DojoChainConfig) => { - const [selected, setSelected] = useState(defaultChain); + const [selected, setSelected] = useState(intialChain); const setSelectedChain = (chain: DojoChainConfig) => { setSelected(chain) @@ -27,15 +27,15 @@ export const useDojoChains = (dojoContextConfig: DojoContextConfig, defaultChain ); - useEffect(() => { - const lastSelectedChainId = (typeof window !== "undefined") ? window?.localStorage?.getItem("lastSelectedChainId") : undefined; - const toSelect = lastSelectedChainId && dojoContextConfig[lastSelectedChainId as SupportedChainIds] ? - dojoContextConfig[lastSelectedChainId as SupportedChainIds] : - defaultChain; + // useEffect(() => { + // const lastSelectedChainId = (typeof window !== "undefined") ? window?.localStorage?.getItem("lastSelectedChainId") : undefined; + // const toSelect = lastSelectedChainId && dojoContextConfig[lastSelectedChainId as SupportedChainIds] ? + // dojoContextConfig[lastSelectedChainId as SupportedChainIds] : + // defaultChain; - setSelected(toSelect) - // eslint-disable-next-line react-hooks/exhaustive-deps - }, []) + // setSelected(toSelect) + // // eslint-disable-next-line react-hooks/exhaustive-deps + // }, []) return { dojoContextConfig, diff --git a/web/src/dojo/stores/config.tsx b/web/src/dojo/stores/config.tsx index 3ca1ddd12..33164016a 100644 --- a/web/src/dojo/stores/config.tsx +++ b/web/src/dojo/stores/config.tsx @@ -90,7 +90,10 @@ export class ConfigStoreClass { manifest: any; config: Config | undefined = undefined; + isLoading = false; + isInitialized = false; + error: any | undefined = undefined; constructor({ client, dojoProvider, manifest }: ConfigStoreProps) { // console.log("new ConfigStoreClass"); @@ -109,100 +112,97 @@ export class ConfigStoreClass { } *init() { + if (this.isInitialized) { + return; + } + this.config = undefined; - this.isLoading = true; - try { - const data = (yield this.client.request(ConfigDocument, {})) as ConfigQuery; + const data = (yield this.client.request(ConfigDocument, {})) as ConfigQuery; + + /*************************************************** */ - /*************************************************** */ + const ryoConfigEdges = data.ryoConfigModels!.edges as RyoConfigEdge[]; + const ryoConfig = ryoConfigEdges[0]!.node as RyoConfig; - const ryoConfigEdges = data.ryoConfigModels!.edges as RyoConfigEdge[]; - const ryoConfig = ryoConfigEdges[0]!.node as RyoConfig; + const ryoAddressEdges = data.ryoAddressModels!.edges as RyoAddressEdge[]; + const ryoAddress = ryoAddressEdges[0]!.node as RyoAddress; - const ryoAddressEdges = data.ryoAddressModels!.edges as RyoAddressEdge[]; - const ryoAddress = ryoAddressEdges[0]!.node as RyoAddress; + /*************************************************** */ - /*************************************************** */ + const drugConfigEdges = data.drugConfigModels!.edges as DrugConfigEdge[]; + const drugConfig = drugConfigEdges.map((i) => i.node as DrugConfig); - const drugConfigEdges = data.drugConfigModels!.edges as DrugConfigEdge[]; - const drugConfig = drugConfigEdges.map((i) => i.node as DrugConfig); + // - // + const locationConfigEdges = data.locationConfigModels!.edges as LocationConfigEdge[]; + const locationConfig = locationConfigEdges.map((i) => i.node as LocationConfig); - const locationConfigEdges = data.locationConfigModels!.edges as LocationConfigEdge[]; - const locationConfig = locationConfigEdges.map((i) => i.node as LocationConfig); + // - // + const hustlerItemBaseConfigEdges = data.hustlerItemBaseConfigModels!.edges as HustlerItemBaseConfigEdge[]; + const hustlerItemBaseConfig = hustlerItemBaseConfigEdges.map((i) => { + return { + ...i.node, + name: shortString.decodeShortString(i.node?.name), + } as HustlerItemBaseConfig; + }); + + // - const hustlerItemBaseConfigEdges = data.hustlerItemBaseConfigModels!.edges as HustlerItemBaseConfigEdge[]; - const hustlerItemBaseConfig = hustlerItemBaseConfigEdges.map((i) => { - return { - ...i.node, - name: shortString.decodeShortString(i.node?.name), - } as HustlerItemBaseConfig; - }); + const hustlerItemTiersConfigEdges = data.hustlerItemTiersConfigModels!.edges as HustlerItemTiersConfigEdge[]; + const hustlerItemTiersConfig = hustlerItemTiersConfigEdges.map((i) => i.node as HustlerItemTiersConfig); - // + /*************************************************** */ - const hustlerItemTiersConfigEdges = data.hustlerItemTiersConfigModels!.edges as HustlerItemTiersConfigEdge[]; - const hustlerItemTiersConfig = hustlerItemTiersConfigEdges.map((i) => i.node as HustlerItemTiersConfig); + const drugConfigFull = drugConfig.map((i) => { + return { + ...i, + name: shortString.decodeShortString(i?.name), // todo: remove when bytes31 is supported + icon: drugIcons[i.drug as drugIconsKeys], + } as DrugConfigFull; + }); - /*************************************************** */ + const locationConfigFull = locationConfig.flatMap((i) => { + if (i.location === "Home") return []; - const drugConfigFull = drugConfig.map((i) => { - return { + return [ + { ...i, name: shortString.decodeShortString(i?.name), // todo: remove when bytes31 is supported - icon: drugIcons[i.drug as drugIconsKeys], - } as DrugConfigFull; - }); - - const locationConfigFull = locationConfig.flatMap((i) => { - if (i.location === "Home") return []; - - return [ - { - ...i, - name: shortString.decodeShortString(i?.name), // todo: remove when bytes31 is supported - icon: locationIcons[i.location as locationIconsKeys], - }, - ] as LocationConfigFull[]; - }); - - /*************************************************** */ - - // const res = await dojoProvider.callContract("rollyourown::config::config::config", "get_config", []); - const contractInfos = this.manifest.contracts.find((i: any) => i.name === "rollyourown::config::config::config")!; - - const contract: TypedContractV2 = new Contract( - contractInfos.abi, - contractInfos.address, - this.dojoProvider.provider, - ).typedv2(configAbi); - - ///@ts-ignore - const getConfig = yield contract.get_config(); - - /*************************************************** */ - - this.config = { - ryo: ryoConfig, - ryoAddress: ryoAddress, - drug: drugConfigFull, - location: locationConfigFull, - items: hustlerItemBaseConfig, - tiers: hustlerItemTiersConfig, - /// @ts-ignore - config: getConfig as GetConfig, - }; - } catch (e: any) { - console.log("ERROR: ConfigStoreClass.init"); - console.log(e); - } + icon: locationIcons[i.location as locationIconsKeys], + }, + ] as LocationConfigFull[]; + }); + + /*************************************************** */ + + // const res = await dojoProvider.callContract("rollyourown::config::config::config", "get_config", []); + const contractInfos = this.manifest.contracts.find((i: any) => i.name === "rollyourown::config::config::config")!; + + const contract: TypedContractV2 = new Contract( + contractInfos.abi, + contractInfos.address, + this.dojoProvider.provider, + ).typedv2(configAbi); - this.isLoading = false; + ///@ts-ignore + const getConfig = yield contract.get_config(); + + /*************************************************** */ + + this.config = { + ryo: ryoConfig, + ryoAddress: ryoAddress, + drug: drugConfigFull, + location: locationConfigFull, + items: hustlerItemBaseConfig, + tiers: hustlerItemTiersConfig, + /// @ts-ignore + config: getConfig as GetConfig, + }; + this.isInitialized = true; // console.log("config:", this.config); } diff --git a/web/src/dojo/stores/game.tsx b/web/src/dojo/stores/game.tsx index ef7811ae1..d3361006c 100644 --- a/web/src/dojo/stores/game.tsx +++ b/web/src/dojo/stores/game.tsx @@ -170,6 +170,7 @@ export class GameStoreClass { wsClient: Client; configStore: ConfigStoreClass; // id: string = null; + isInitialized = false; game: GameClass | null = null; gameEvents: EventClass | null = null; gameInfos: Game | null = null; @@ -203,9 +204,15 @@ export class GameStoreClass { this.gameInfos = null; this.gameEvents = null; this.handles = []; + this.isInitialized = false; } *init(gameId: string /*, playerId: string*/) { + //this.reset() + if(this.isInitialized){ + return + } + yield this.loadGameInfos(gameId); // retrieve playerId from gameInfos @@ -256,6 +263,8 @@ export class GameStoreClass { }, ), ); + + this.isInitialized = true } *loadGameInfos(gameId: string) { diff --git a/web/src/hooks/sound.tsx b/web/src/hooks/sound.tsx index 5a7e66e85..be28351f0 100644 --- a/web/src/hooks/sound.tsx +++ b/web/src/hooks/sound.tsx @@ -27,6 +27,7 @@ export enum Sounds { Ooo = "Ooo.wav", Death = "Flatline.mp3", Punch = "Punch.mp3", + Door = "Door.mp3", } export interface SoundState { diff --git a/web/src/pages/404.tsx b/web/src/pages/404.tsx new file mode 100644 index 000000000..cad17021f --- /dev/null +++ b/web/src/pages/404.tsx @@ -0,0 +1,3 @@ +export default function Custom404() { + return

404 - Page Not Found

; +} diff --git a/web/src/pages/[gameId]/event/consequence.tsx b/web/src/pages/[gameId]/event/consequence.tsx index f0551b7d4..177c408ce 100644 --- a/web/src/pages/[gameId]/event/consequence.tsx +++ b/web/src/pages/[gameId]/event/consequence.tsx @@ -99,6 +99,8 @@ const Consequence = () => { After {encounterResult.rounds} attempt{encounterResult.rounds > 1 ? "s" : ""} )} */} + + {/* {JSON.stringify(encounterResult, 0, 2)} */} {[...Array(encounterResult.rounds)].map((i, idx) => { return ( <> diff --git a/web/src/pages/[gameId]/index.tsx b/web/src/pages/[gameId]/index.tsx index 68a16b23e..fdbdcddeb 100644 --- a/web/src/pages/[gameId]/index.tsx +++ b/web/src/pages/[gameId]/index.tsx @@ -1,7 +1,7 @@ import { Layout } from "@/components/layout"; +import { Loader } from "@/components/layout/Loader"; import { useGameStore, useRouterContext } from "@/dojo/hooks"; import { PlayerStatus } from "@/dojo/types"; -import { Image } from "@chakra-ui/react"; import { useAccount } from "@starknet-react/core"; import { observer } from "mobx-react-lite"; import { useEffect } from "react"; @@ -14,19 +14,21 @@ const Redirector = observer(() => { const { game } = useGameStore(); useEffect(() => { - if (!game) return; - - if (game.player.status === PlayerStatus.Normal) { - router.push(`/${gameId}/${game.player.location.location}`); - } else if (game.player.status === PlayerStatus.BeingArrested || game.player.status === PlayerStatus.BeingMugged) { - // - router.push(`/${gameId}/event/decision`); + if (!game) { + router.push(`/`); + } else { + if (game.player.status === PlayerStatus.Normal) { + router.push(`/${gameId}/${game.player.location.location}`); + } else if (game.player.status === PlayerStatus.BeingArrested || game.player.status === PlayerStatus.BeingMugged) { + // + router.push(`/${gameId}/event/decision`); + } } }, [game, game?.player.status, game?.player.location, router, gameId]); return ( - loading + ); }); diff --git a/web/src/pages/_app.tsx b/web/src/pages/_app.tsx index cf76fda64..c6b6cd800 100644 --- a/web/src/pages/_app.tsx +++ b/web/src/pages/_app.tsx @@ -1,6 +1,4 @@ -import RegisterEntities from "@/components/RegisterEntities"; import { MakeItRain } from "@/components/layout"; -import { StarknetProvider } from "@/components/wallet"; import { DojoContextProvider } from "@/dojo/context/DojoContext"; import { dojoContextConfig } from "@/dojo/setup/config"; import useKonamiCode, { starkpimpSequence } from "@/hooks/useKonamiCode"; @@ -28,26 +26,23 @@ export default function App({ Component, pageProps }: AppProps) { return ( <> - - - - - - - Roll your Own - - - {isRightSequence && } - - - - {/* */} - - - + + + + + + Roll your Own + + + {isRightSequence && } + + + {/* */} + + ); } diff --git a/web/src/pages/_error.tsx b/web/src/pages/_error.tsx new file mode 100644 index 000000000..9bde0130b --- /dev/null +++ b/web/src/pages/_error.tsx @@ -0,0 +1,10 @@ +function Error({ statusCode }) { + return

{statusCode ? `An error ${statusCode} occurred on server` : "An error occurred on client"}

; +} + +Error.getInitialProps = ({ res, err }) => { + const statusCode = res ? res.statusCode : err ? err.statusCode : 404; + return { statusCode }; +}; + +export default Error; diff --git a/web/src/pages/index.tsx b/web/src/pages/index.tsx index 5bf362b79..075af527f 100644 --- a/web/src/pages/index.tsx +++ b/web/src/pages/index.tsx @@ -33,11 +33,7 @@ export default function Home() { play(); } - // if (!account) { - - // } else { router.push(`/create/new`); - // } }; return ( diff --git a/web/turbo.json b/web/turbo.json new file mode 100644 index 000000000..a3e53c6df --- /dev/null +++ b/web/turbo.json @@ -0,0 +1,17 @@ +{ + "$schema": "https://turbo.build/schema.json", + "globalDependencies": ["**/.env.*local"], + "pipeline": { + "build": { + "dependsOn": ["^build"], + "outputs": [".next/**", "!.next/cache/**"] + }, + "lint": { + "dependsOn": ["^lint"] + }, + "dev": { + "cache": false, + "persistent": true + } + } + } \ No newline at end of file