fix: code improvements + reviews suggestions

Author: MartianGreed

examples/vanilla/phaser/package.json

@@ -11,6 +11,7 @@
     "devDependencies": {
         "typescript": "^5.5.4",
         "vite": "^5.3.5",
+        "vite-plugin-top-level-await": "^1.4.2",
         "vite-plugin-wasm": "^3.3.0"
     },
     "dependencies": {

examples/vanilla/phaser/src/dojo/defineContractSystems.ts

@@ -16,7 +16,7 @@ const handleError = (action: string, error: unknown) => {
 
 export type IWorld = Awaited<ReturnType<typeof setupWorld>>;
 
-export async function setupWorld(provider: DojoProvider, config: Config) {
+export async function setupWorld(provider: DojoProvider, _config: Config) {
     const actions = () => ({
         spawn: async ({ account }: { account: AccountInterface }) => {
             try {

examples/vanilla/phaser/src/dojo/setup.ts

@@ -10,57 +10,90 @@ import { setupWorld } from "./defineContractSystems.ts";
 
 import { DojoProvider } from "@dojoengine/core";
 import { BurnerManager } from "@dojoengine/create-burner";
-import { Account, RpcProvider, wallet } from "starknet";
-import { createClientComponents } from "./createClientComponent.ts";
+import { Account, RpcProvider } from "starknet";
+import {
+    ClientComponents,
+    createClientComponents,
+} from "./createClientComponent.ts";
 
 export type SetupResult = Awaited<ReturnType<typeof setup>>;
 export type IDojo = Awaited<ReturnType<typeof setup>>;
 
 export async function setup({ ...config }: Config) {
     // torii client
-    const toriiClient = await torii.createClient({
-        rpcUrl: config.rpcUrl,
-        toriiUrl: config.toriiUrl,
-        relayUrl: "",
-        worldAddress: config.manifest.world.address || "",
-    });
+    let toriiClient = null;
+    try {
+        toriiClient = await torii.createClient({
+            rpcUrl: config.rpcUrl,
+            toriiUrl: config.toriiUrl,
+            relayUrl: "",
+            worldAddress: config.manifest.world.address || "",
+        });
+    } catch (e) {
+        console.error("Failed to create torii client:", e);
+        throw e;
+    }
 
     // create contract components
-    const contractModels = createClientComponents({
-        contractComponents: defineContractComponents(world),
-    });
+    let contractModels = null;
+    try {
+        contractModels = createClientComponents({
+            contractComponents: defineContractComponents(world),
+        });
+    } catch (e) {
+        console.error("Failed to create contract components:", e);
+        throw e;
+    }
 
     // create client components
     const { models: clientModels } = models({ contractModels });
 
     // fetch all existing entities from torii
-    const sync = await getSyncEntities(
-        toriiClient,
-        contractModels as any,
-        [],
-        1000
-    );
+    let sync = null;
+    try {
+        sync = await getSyncEntities(
+            toriiClient,
+            contractModels as any,
+            [],
+            1000
+        );
+    } catch (e) {
+        console.error("Failed to fetch sync:", e);
+        throw e;
+    }
 
-    const client = await setupWorld(
-        new DojoProvider(config.manifest, config.rpcUrl),
-        config
-    );
+    let client = null;
+    try {
+        client = await setupWorld(
+            new DojoProvider(config.manifest, config.rpcUrl),
+            config
+        );
+    } catch (e) {
+        console.error("Failed to create client:", e);
+        throw e;
+    }
 
     const rpcProvider = new RpcProvider({
         nodeUrl: config.rpcUrl,
     });
 
-    const burnerManager = new BurnerManager({
-        masterAccount: new Account(
-            rpcProvider,
-            config.masterAddress,
-            config.masterPrivateKey
-        ),
-        feeTokenAddress: config.feeTokenAddress,
-        accountClassHash: config.accountClassHash,
+    let burnerManager = null;
+    try {
+        burnerManager = new BurnerManager({
+            masterAccount: new Account(
+                rpcProvider,
+                config.masterAddress,
+                config.masterPrivateKey
+            ),
+            feeTokenAddress: config.feeTokenAddress,
+            accountClassHash: config.accountClassHash,
 
-        rpcProvider,
-    });
+            rpcProvider,
+        });
+    } catch (e) {
+        console.log("Failed to create burner manager:", e);
+        throw e;
+    }
 
     try {
         await burnerManager.init();
@@ -72,7 +105,7 @@ export async function setup({ ...config }: Config) {
     }
     const actions = systems({
         client,
-        clientModels,
+        clientModels: clientModels as ClientComponents,
         contractComponents: contractModels,
     });
     const account = burnerManager.getActiveAccount();

examples/vanilla/phaser/src/dojo/systems.ts

@@ -45,22 +45,19 @@ export function systems({
             });
 
             try {
-                const { transaction_hash } = await client.actions.spawn({
+                const { transaction_hash } = (await client.actions.spawn({
                     account,
-                });
-                //   setComponentsFromEvents(
-                //     contractComponents,
-                //     getEvents(
-                //       await account.waitForTransaction(transaction_hash, {
-                //         retryInterval: 100,
-                //       })
-                //     )
-                //   );
+                })) as { transaction_hash: string };
+                setComponentsFromEvents(
+                    contractComponents,
+                    getEvents(
+                        await account.waitForTransaction(transaction_hash, {
+                            retryInterval: 100,
+                        })
+                    )
+                );
             } catch (e) {
-                console.log(e);
-                Position.removeOverride(positionId);
-                Moves.removeOverride(movesId);
-            } finally {
+                console.error(e);
                 Position.removeOverride(positionId);
                 Moves.removeOverride(movesId);
             }
@@ -74,7 +71,6 @@ export function systems({
                 BigInt(account.address),
             ]) as Entity;
 
-            console.log(direction, getComponentValue(Position, entityId));
             const positionId = uuid();
             Position.addOverride(positionId, {
                 entity: entityId,
@@ -99,10 +95,10 @@ export function systems({
             });
 
             try {
-                const { transaction_hash } = await client.actions.move({
+                const { transaction_hash } = (await client.actions.move({
                     account,
                     direction,
-                });
+                })) as { transaction_hash: string };
 
                 setComponentsFromEvents(
                     contractComponents,
@@ -116,9 +112,6 @@ export function systems({
                 console.error(e);
                 Position.removeOverride(positionId);
                 Moves.removeOverride(movesId);
-            } finally {
-                Position.removeOverride(positionId);
-                Moves.removeOverride(movesId);
             }
         };
         return { spawn, move };

examples/vanilla/phaser/src/dojo/utils.ts

@@ -9,8 +9,6 @@ export function updatePositionWithDirection(
     direction: Direction,
     value: { vec: { x: number; y: number } }
 ) {
-    console.log(value);
-    debugger;
     switch (direction) {
         case Direction.Left:
             value.vec.x--;

examples/vanilla/phaser/src/scenes/scene-main.ts

@@ -8,7 +8,7 @@ export default class SceneMain extends Scene {
     tileSize: number;
     cameraSpeed: number;
     followPoint?: Phaser.Math.Vector2;
-    chunks: Chunk[];
+    chunks: Map<String, Chunk>;
     keyW: Phaser.Input.Keyboard.Key | null;
     keyS: Phaser.Input.Keyboard.Key | null;
     keyA: Phaser.Input.Keyboard.Key | null;
@@ -21,11 +21,12 @@ export default class SceneMain extends Scene {
         this.chunkSize = 16;
         this.tileSize = 16;
         this.cameraSpeed = 2;
-        this.chunks = [];
+        this.chunks = new Map<string, Chunk>();
         this.keyW = null;
         this.keyS = null;
         this.keyA = null;
         this.keyD = null;
+        this.followPoint = new Phaser.Math.Vector2(0, 0);
     }
     preload() {
         this.load.spritesheet("sprWater", "assets/sprWater.png", {
@@ -75,11 +76,9 @@ export default class SceneMain extends Scene {
     }
 
     getChunk(x: number, y: number) {
-        var chunk = null;
-        for (var i = 0; i < this.chunks.length; i++) {
-            if (this.chunks[i].x == x && this.chunks[i].y == y) {
-                chunk = this.chunks[i];
-            }
+        let chunk = this.chunks.get(`${x},${y}`);
+        if (chunk === undefined) {
+            return null;
         }
         return chunk;
     }
@@ -88,10 +87,7 @@ export default class SceneMain extends Scene {
         if (this.followPoint === null || this.followPoint === undefined) {
             throw new Error("failed to initialize followPoint");
         }
-        if (
-            this.checkInputs([this.keyA, this.keyD, this.keyW, this.keyS]) ===
-            false
-        ) {
+        if (!this.checkInputs([this.keyA, this.keyD, this.keyW, this.keyS])) {
             throw new Error("failed to initialize inputs");
         }
         var snappedChunkX =
@@ -106,19 +102,19 @@ export default class SceneMain extends Scene {
         snappedChunkX = snappedChunkX / this.chunkSize / this.tileSize;
         snappedChunkY = snappedChunkY / this.chunkSize / this.tileSize;
 
-        for (var x = snappedChunkX - 2; x < snappedChunkX + 2; x++) {
-            for (var y = snappedChunkY - 2; y < snappedChunkY + 2; y++) {
-                var existingChunk = this.getChunk(x, y);
+        for (let x = snappedChunkX - 2; x < snappedChunkX + 2; x++) {
+            for (let y = snappedChunkY - 2; y < snappedChunkY + 2; y++) {
+                const existingChunk = this.getChunk(x, y);
 
-                if (existingChunk == null) {
-                    var newChunk = new Chunk(this, x, y);
-                    this.chunks.push(newChunk);
+                if (existingChunk !== null) {
+                    continue;
                 }
+                this.chunks.set(`${x},${y}`, new Chunk(this, x, y));
             }
         }
 
-        for (var i = 0; i < this.chunks.length; i++) {
-            var chunk = this.chunks[i];
+        for (const [_, chunk] of this.chunks) {
+            if (chunk === null) continue;
 
             if (
                 Phaser.Math.Distance.Between(
@@ -128,14 +124,10 @@ export default class SceneMain extends Scene {
                     chunk.y
                 ) < 3
             ) {
-                if (chunk !== null) {
-                    chunk.load();
-                }
-            } else {
-                if (chunk !== null) {
-                    chunk.unload();
-                }
+                chunk.load();
+                continue;
             }
+            chunk.unload();
         }
 
         if (null !== this.keyW && this.keyW.isDown) {
@@ -167,7 +159,7 @@ export default class SceneMain extends Scene {
     }
 
     private checkInputs(inputs: (Phaser.Input.Keyboard.Key | null)[]): boolean {
-        for (var i = 0; i < inputs.length; i++) {
+        for (let i = 0; i < inputs.length; i++) {
             if (inputs[i] === null || inputs[i] === undefined) {
                 return false;
             }

examples/vanilla/phaser/vite.config.ts

@@ -1,10 +1,11 @@
 import path from "path";
 import { defineConfig } from "vite";
 import wasm from "vite-plugin-wasm";
+import topLevelAwait from "vite-plugin-top-level-await";
 
 // https://vitejs.dev/config/
 export default defineConfig({
-    plugins: [wasm()],
+    plugins: [wasm(), topLevelAwait()],
     resolve: {
         alias: {
             "@": path.resolve(__dirname, "./src"),