wip

web/manifest.json

@@ -1551,7 +1551,7 @@
     {
       "name": "rollyourown::config::config::config",
       "address": "0x73e5a7b0f2ff860ae67f9edc7709d3dbbee30f84afcccf1f8e3963e128e1bc5",
-      "class_hash": "0x6b4878e20f74c38e424c4dc69013c18a1a02847e4b2a66e090e32b2754f0423",
+      "class_hash": "0x4cb81dfced9540cd5b38d7691ea5a9930d04ffcef72f6cd027318129aba94d5",
       "abi": [
         {
           "type": "impl",

web/src/components/layout/Header.tsx

@@ -1,6 +1,6 @@
 import { MediaPlayer, MobileMenu } from "@/components/layout";
 import { Connect } from "@/components/wallet";
-import { useConfigStore, useDojoContext, useGameStore, useRouterContext } from "@/dojo/hooks";
+import { useConfigStore, useGameStore, useRouterContext } from "@/dojo/hooks";
 import { initSoundStore } from "@/hooks/sound";
 import { headerStyles } from "@/theme/styles";
 import { IsMobile, formatCashHeader } from "@/utils/ui";
@@ -22,9 +22,6 @@ export const Header = observer(({ back }: HeaderProps) => {
 
   const { router, gameId } = useRouterContext();
 
-  const {
-    burner: { create: createBurner, isDeploying: isBurnerDeploying },
-  } = useDojoContext();
   const { account } = useAccount();
 
   const { game, gameInfos } = useGameStore();
@@ -49,7 +46,7 @@ export const Header = observer(({ back }: HeaderProps) => {
     >
       <HStack gap={3} flex="1" /*justify={["left", "right"]}*/>
         <Connect />
-        <ChainSelector />
+        <ChainSelector canChange={!gameId} />
 
         {/* {!game && (
           <>
@@ -78,7 +75,6 @@ export const Header = observer(({ back }: HeaderProps) => {
                 <HealthIndicator health={game.player.health} maxHealth={100} />
                 <Divider orientation="vertical" borderColor="neon.600" h="12px" />
                 <DayIndicator day={game.player.turn} max={gameInfos?.max_turns} />
-                {/* <WantedIndicator wanted={game.wanted.getValueByTick(game.player.wanted)} /> */}
               </HStack>
             </Flex>
           </HStack>
@@ -92,21 +88,7 @@ export const Header = observer(({ back }: HeaderProps) => {
           </>
         )}
 
-        {/* {!account && (
-          <Button
-            h="48px"
-            sx={headerButtonStyles}
-            isLoading={isBurnerDeploying}
-            onClick={() => {
-              if (!account) {
-                createBurner();
-              }
-            }}
-          >
-            Create Burner
-          </Button>
-        )} */}
-
+
         {!isMobile && account && game && <ProfileLink />}
         {isMobile && <MobileMenu />}
       </HStack>

web/src/components/pages/home/HallOfFame.tsx

@@ -45,12 +45,12 @@ const HallOfFameEntry = ({ entry, account }: { entry: Leaderboard; account: Acco
   }, [account?.address, entry.claimed, game?.player_id]);
 
   const onClick = useCallback(() => {
-    router.push(`/0x${entry.game_id.toString(16)}/logs?playerId=${game?.player_id}`);
+    router.push(`/0x${entry.game_id.toString(16)}/logs`);
   }, [entry.game_id, game?.player_id, router]);
 
   if (!isFetched) return null;
   return (
-    <Card position="relative" p={3} cursor="pointer">
+    <Card position="relative" p={3} >
       <VStack alignItems="flex-start" gap={0}>
         <HStack w="full" justifyContent="space-between" borderBottom="solid 1px" borderColor="neon.700" pb={2} mb={2}>
           <Text>SEASON {entry.version}</Text>
@@ -61,7 +61,7 @@ const HallOfFameEntry = ({ entry, account }: { entry: Leaderboard; account: Acco
 
         {game && (
           <HStack w="full" gap={3}>
-            <HustlerIcon hustler={game?.hustler_id} width="48px" height="48px" onClick={onClick} />
+            <HustlerIcon hustler={game?.hustler_id} width="48px" height="48px"  cursor="pointer" onClick={onClick} />
 
             <VStack w="full" alignItems="flex-start" gap={1}>
               <Text>{shortString.decodeShortString(game?.player_name)}</Text>

web/src/components/pages/home/Leaderboard.tsx

@@ -157,7 +157,7 @@ export const Leaderboard = observer(({ nameEntry, ...props }: { nameEntry?: bool
                         flexShrink={0}
                         style={{ marginTop: "-8px" }}
                         cursor="pointer"
-                        onClick={() => router.push(`/${entry.gameId}/logs?playerId=${entry.playerId}`)}
+                        onClick={() => router.push(`/${entry.gameId}/logs`)}
                       >
                         {entry.health === 0 ? (
                           <Skull color={avatarColor} hasCrown={index === 0} />

web/src/components/pages/home/Tutorial.tsx

@@ -1,6 +1,5 @@
 import { Button } from "@/components/common";
 import { useRouterContext } from "@/dojo/hooks";
-import { useDojoContext } from "@/dojo/hooks/useDojoContext";
 import { Sounds } from "@/hooks/sound";
 import {
   Box,
@@ -67,17 +66,10 @@ export const Tutorial = ({ isOpen, close }: { isOpen: boolean; close: () => void
   const { router } = useRouterContext();
 
   const [currentStep, setCurrentStep] = useState(1);
-  const {
-    account,
-    burner: { create: createBurner, isDeploying: isBurnerDeploying },
-  } = useDojoContext();
-
+
   const onNext = async () => {
     if (currentStep == steps.length) {
-      if (!account) {
-        await createBurner();
-      }
-      router.push(`/create/new`);
+          router.push(`/create/new`);
 
       close();
     } else {
@@ -119,7 +111,7 @@ export const Tutorial = ({ isOpen, close }: { isOpen: boolean; close: () => void
               onClick={onNext}
               w="full"
               hoverSound={undefined}
-              isLoading={isBurnerDeploying}
+              // isLoading={isBurnerDeploying}
               clickSound={currentStep == steps.length ? Sounds.Magnum357 : Sounds.HoverClick}
             >
               {currentStep == steps.length ? "READY TO HUSTLE" : "NEXT"}

web/src/components/wallet/ChainSelector.tsx

@@ -3,7 +3,7 @@ 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 = ({ ...props }) => {
+export const ChainSelector = ({ canChange = false }: { canChange: boolean }) => {
   // const { chain } = useNetwork();
   const {
     chains: { dojoContextConfig, selectedChain, setSelectedChain },
@@ -17,25 +17,35 @@ export const ChainSelector = ({ ...props }) => {
   };
 
   return (
-    <Menu >
-      <MenuButton as={Button} variant="pixelated" h="48px" /*rightIcon={<Arrow direction='down' />}*/>
-        {selectedChain.name}
-      </MenuButton>
-      <MenuList>
-        {Object.keys(dojoContextConfig).map((key: string) => {
-          const dojoChainConfig: DojoChainConfig = dojoContextConfig[key as SupportedChainIds];
+    <>
+      {!canChange && (
+        <Button variant="pixelated" h="48px" cursor="not-allowed">
+          {selectedChain.name}
+        </Button>
+      )}
 
-          if (dojoChainConfig === selectedChain) return;
-          const isMainnet = dojoChainConfig.chainConfig.network === "mainnet";
-          return (
-            <MenuItem key={key} onClick={() => onSelectChain(dojoChainConfig)}>
-              <Text>
-                {dojoChainConfig.name} ({isMainnet ? "RANKED" : "FREE"})
-              </Text>
-            </MenuItem>
-          );
-        })}
-      </MenuList>
-    </Menu>
+      {canChange && (
+        <Menu>
+          <MenuButton as={Button} variant="pixelated" h="48px" /*rightIcon={<Arrow direction='down' />}*/>
+            {selectedChain.name}
+          </MenuButton>
+          <MenuList>
+            {Object.keys(dojoContextConfig).map((key: string) => {
+              const dojoChainConfig: DojoChainConfig = dojoContextConfig[key as SupportedChainIds];
+
+              if (dojoChainConfig === selectedChain) return;
+              const isMainnet = dojoChainConfig.chainConfig.network === "mainnet";
+              return (
+                <MenuItem key={key} onClick={() => onSelectChain(dojoChainConfig)}>
+                  <Text>
+                    {dojoChainConfig.name} ({isMainnet ? "RANKED" : "FREE"})
+                  </Text>
+                </MenuItem>
+              );
+            })}
+          </MenuList>
+        </Menu>
+      )}
+    </>
   );
 };

web/src/components/wallet/Connect.tsx

@@ -15,7 +15,6 @@ import {
   Text,
   VStack,
 } from "@chakra-ui/react";
-import { BurnerConnector } from "@dojoengine/create-burner";
 import { Connector, useAccount, /*useBalance,*/ useConnect, useDisconnect, useExplorer } from "@starknet-react/core";
 import { ReactNode, useMemo, useState } from "react";
 import { AccountInterface } from "starknet";
@@ -179,17 +178,13 @@ const ConnectModal = ({
   onClose: VoidFunction;
 }) => {
   const {
-    burner: { create: createBurner, clear: clearBurner, isDeploying: isBurnerDeploying, account },
     chains: { selectedChain },
+    burnerManager,
   } = useDojoContext();
 
-  const hasBurnerConnector = useMemo(() => {
-    return connectors.find((i) => i instanceof BurnerConnector);
-  }, [connectors]);
-
-  const onCreateBurner = async () => {
-    await createBurner();
-  };
+  const isKatana = useMemo(() => {
+    return selectedChain.chainConfig.network === "katana";
+  }, [selectedChain]);
 
   return (
     <Modal motionPreset="slideInBottom" isCentered isOpen={isOpen} onClose={onClose}>
@@ -200,23 +195,18 @@ const ConnectModal = ({
         </ModalHeader>
         <ModalBody p={3}>
           <VStack w="full">
-            {/* {isKatana && !hasBurnerConnector && (
-              <Button
-                variant="pixelated"
-                w="full"
-                fontSize="14px"
-                isLoading={isBurnerDeploying}
-                onClick={onCreateBurner}
-              >
-                <HStack w="full" justifyItems="flex-start">
-                   <Image src={connector.icon.dark} width="24px" height="24px" alt={connector.name} /> 
-                  <Text ml="120px">Create Burner</Text>
-                </HStack>
-              </Button>
-            )} */}
             {connectors.map((connector) => {
-              const isBurner = connector instanceof BurnerConnector;
-              // const isDeployedOnCurrentChain = chain.id === connector.chainId()
+              const isBurner = connector.id === "dojoburner";
+              if (isBurner && !isKatana) {
+                // burner not on katana
+                return null;
+              }
+
+              if (!isBurner && isKatana) {
+                // not burner on katana
+                return null;
+              }
+
               return (
                 <HStack w="full" key={connector.id}>
                   <Button
@@ -235,9 +225,7 @@ const ConnectModal = ({
                     <HStack w="full" justifyItems="flex-start">
                       <Image src={connector.icon.dark} width="24px" height="24px" alt={connector.name} />
                       <Text ml="120px">
-                        {connector.available()
-                          ? `${connector.name} ${isBurner ? frenlyAddress(connector.id) : ""}`
-                          : `Install ${connector.name}`}
+                        {connector.available() ? `${connector.name}` : `Install ${connector.name}`}
                       </Text>
                       {!connector.available() && <ExternalLink ml="auto" />}
                     </HStack>
@@ -246,7 +234,7 @@ const ConnectModal = ({
                     <Cigarette
                       cursor="pointer"
                       onClick={() => {
-                        clearBurner();
+                        burnerManager.clear()
                       }}
                     />
                   )} */}

web/src/components/wallet/StarknetProvider.tsx

@@ -5,10 +5,9 @@ import {
   StarknetConfig,
   argent,
   braavos,
-  injected,
   jsonRpcProvider,
   starkscan,
-  useInjectedConnectors,
+  useInjectedConnectors
 } from "@starknet-react/core";
 import { ReactNode, useState } from "react";
 
@@ -28,7 +27,7 @@ export function StarknetProvider({ children }: { children: ReactNode }) {
 
   const { connectors } = useInjectedConnectors({
     // Show these connectors if the user has no connector installed.
-    recommended: [ injected({id:"dojoburner"}) ,argent(), braavos()],
+    recommended: [ /*injected({id:"dojoburner"}) */,argent(), braavos()],
     // Hide recommended connectors if the user has any connector installed.
     includeRecommended: "always",
     // Randomize the order of the connectors.

web/src/components/wallet/inpage/index.ts

@@ -10,7 +10,8 @@ const attach = () => {
         // set read only property to window
         Object.defineProperty(window, name, {
             value: starknetWindowObject,
-            // writable: false,
+            writable: true,
+            //writable: false,
         })
     } catch { /* ignore*/ }
     try { (window as any)[name] = starknetWindowObject } catch {  /* ignore*/ }

web/src/components/wallet/inpage/starknetWindowObject.ts

@@ -25,13 +25,13 @@ export class DojoBurnerStarknetWindowObject implements IStarknetWindowObject{
 
     setBurnerManager(burnerManager: BurnerManager){
         this.burnerManager = burnerManager
-
+
+        this.chainId = this.burnerManager.chainId
         this.provider = this.burnerManager.provider
-        this.account = this.burnerManager.masterAccount
-
-        this.selectedAddress = this.account.address
-        this.chainId = "KATANA"//network.chainId
-        this.isConnected = true
+
+        this.account = this.burnerManager.getActiveAccount()
+        this.selectedAddress = this.account?.address
+        //this.isConnected = true
     }
 
     ///@ts-ignore
@@ -43,8 +43,10 @@ export class DojoBurnerStarknetWindowObject implements IStarknetWindowObject{
     async enable({ starknetVersion = "v5" } = {}) {
         console.log("enable")
 
-        if(!this.account) return
-
+        if(!this.account) {
+            this.account = await this.burnerManager?.create();
+        }
+
         this.isConnected = true
 
         return [this.account.address]