diff --git a/packages/client/package.json b/packages/client/package.json index 0fd937b0..826f3468 100644 --- a/packages/client/package.json +++ b/packages/client/package.json @@ -23,6 +23,7 @@ "@latticexyz/world": "2.0.0-next.4", "@openzeppelin/contracts": "^4.9.3", "@types/node": "^18.15.11", + "@vitejs/plugin-react": "^4.1.1", "antd": "^5.9.2", "buffer": "^6.0.3", "contracts": "workspace:*", diff --git a/packages/client/src/index.tsx b/packages/client/src/index.tsx index ad134a85..1185300f 100644 --- a/packages/client/src/index.tsx +++ b/packages/client/src/index.tsx @@ -7,38 +7,33 @@ import { world } from "@/mud/world"; import { MUDProvider } from "@/mud/MUDContext"; const { network } = await setup(); -// Components expose a stream that triggers when the component is updated. - const rootElement = document.getElementById("root"); +if (!rootElement) throw new Error("React root not found"); +const root = ReactDOM.createRoot(rootElement); + setup().then(async (result) => { root.render( ); + const { mount: mountDevTools } = await import("@latticexyz/dev-tools"); + const comp = []; + network.world.components.forEach((c) => { + if (comp.findIndex((item) => item.id === c.id) === -1) { + comp.push(c); + } + }); + network.world.components = comp; + mountDevTools({ + config: mudConfig, + publicClient: network.publicClient, + walletClient: network.walletClient, + latestBlock$: network.latestBlock$, + blockStorageOperations$: network.blockStorageOperations$, + worldAddress: network.worldContract.address, + worldAbi: network.worldContract.abi, + write$: network.write$, + recsWorld: network.world, + }); }); -if (!rootElement) throw new Error("React root not found"); - -const root = ReactDOM.createRoot(rootElement); - -// https://vitejs.dev/guide/env-and-mode.html -const { mount: mountDevTools } = await import("@latticexyz/dev-tools"); -const comp = []; -network.world.components.forEach((c) => { - if (comp.findIndex((item) => item.id === c.id) === -1) { - comp.push(c); - } -}); -network.world.components = comp; -mountDevTools({ - config: mudConfig, - publicClient: network.publicClient, - walletClient: network.walletClient, - latestBlock$: network.latestBlock$, - blockStorageOperations$: network.blockStorageOperations$, - worldAddress: network.worldContract.address, - worldAbi: network.worldContract.abi, - write$: network.write$, - recsWorld: network.world, -}); -console.log("mounted"); diff --git a/packages/client/vite.config.ts b/packages/client/vite.config.ts index f54701c6..c8555fab 100644 --- a/packages/client/vite.config.ts +++ b/packages/client/vite.config.ts @@ -1,7 +1,9 @@ import { defineConfig } from "vite"; import path from 'path'; +import react from "@vitejs/plugin-react"; export default defineConfig({ + plugins: [react()], server: { port: 3000, fs: { diff --git a/packages/contracts/worlds.json b/packages/contracts/worlds.json index 844be088..292d80c8 100644 --- a/packages/contracts/worlds.json +++ b/packages/contracts/worlds.json @@ -4,7 +4,7 @@ "blockNumber": 29407241 }, "31337": { - "address": "0x607c2d79E406a5DC2D1E01b6820dd5a72FbA58C7" + "address": "0x46d4674578a2daBbD0CEAB0500c6c7867999db34" }, "421613": { "address": "0x2Bc1034975c3df48D6f3026802f372677844b85d",