From 834752244c87fded755b26d8797b313fc20ecfd7 Mon Sep 17 00:00:00 2001 From: Valentin Dosimont Date: Fri, 24 Jan 2025 15:23:51 +0100 Subject: [PATCH] feat: add vanilla ts example --- examples/example-vite-vanilla-ts/.gitignore | 24 +++ examples/example-vite-vanilla-ts/package.json | 19 ++ .../example-vite-vanilla-ts/src/dojoConfig.ts | 7 + examples/example-vite-vanilla-ts/src/main.ts | 33 ++++ .../src/typescript/contracts.gen.ts | 68 +++++++ .../src/typescript/models.gen.ts | 172 ++++++++++++++++++ .../example-vite-vanilla-ts/tsconfig.json | 24 +++ pnpm-lock.yaml | 59 ++++-- 8 files changed, 386 insertions(+), 20 deletions(-) create mode 100644 examples/example-vite-vanilla-ts/.gitignore create mode 100644 examples/example-vite-vanilla-ts/package.json create mode 100644 examples/example-vite-vanilla-ts/src/dojoConfig.ts create mode 100644 examples/example-vite-vanilla-ts/src/main.ts create mode 100644 examples/example-vite-vanilla-ts/src/typescript/contracts.gen.ts create mode 100644 examples/example-vite-vanilla-ts/src/typescript/models.gen.ts create mode 100644 examples/example-vite-vanilla-ts/tsconfig.json diff --git a/examples/example-vite-vanilla-ts/.gitignore b/examples/example-vite-vanilla-ts/.gitignore new file mode 100644 index 00000000..a547bf36 --- /dev/null +++ b/examples/example-vite-vanilla-ts/.gitignore @@ -0,0 +1,24 @@ +# Logs +logs +*.log +npm-debug.log* +yarn-debug.log* +yarn-error.log* +pnpm-debug.log* +lerna-debug.log* + +node_modules +dist +dist-ssr +*.local + +# Editor directories and files +.vscode/* +!.vscode/extensions.json +.idea +.DS_Store +*.suo +*.ntvs* +*.njsproj +*.sln +*.sw? diff --git a/examples/example-vite-vanilla-ts/package.json b/examples/example-vite-vanilla-ts/package.json new file mode 100644 index 00000000..003c5ea0 --- /dev/null +++ b/examples/example-vite-vanilla-ts/package.json @@ -0,0 +1,19 @@ +{ + "name": "example-vite-vanilla-ts", + "private": true, + "version": "0.0.0", + "type": "module", + "scripts": { + "dev": "node --experimental-transform-types --experimental-modules src/main.ts", + "build": "tsc" + }, + "dependencies": { + "@dojoengine/core": "workspace:", + "@dojoengine/sdk": "workspace:", + "@dojoengine/torii-client": "workspace:", + "starknet": "catalog:" + }, + "devDependencies": { + "typescript": "~5.6.2" + } +} diff --git a/examples/example-vite-vanilla-ts/src/dojoConfig.ts b/examples/example-vite-vanilla-ts/src/dojoConfig.ts new file mode 100644 index 00000000..ad156590 --- /dev/null +++ b/examples/example-vite-vanilla-ts/src/dojoConfig.ts @@ -0,0 +1,7 @@ +import { createDojoConfig } from "@dojoengine/core"; + +import manifest from "../../../worlds/dojo-starter/manifest_dev.json" with { type: "json" }; + +export const dojoConfig = createDojoConfig({ + manifest, +}); diff --git a/examples/example-vite-vanilla-ts/src/main.ts b/examples/example-vite-vanilla-ts/src/main.ts new file mode 100644 index 00000000..03024fb2 --- /dev/null +++ b/examples/example-vite-vanilla-ts/src/main.ts @@ -0,0 +1,33 @@ +// Step 1. Import dojoConfig. This pulls data out of manifest and makes it reusable throughout your entire application. +import { dojoConfig } from "./dojoConfig.ts"; + +import { init } from "@dojoengine/sdk/experimental"; +import { schema, SchemaType } from "./typescript/models.gen.ts"; +import { ClauseBuilder, ToriiQueryBuilder } from "@dojoengine/sdk"; + +async function main() { + // Step 2. Instanciate sdk. It's considered a good practice to instanciate it once and then use this handle. + const sdk = await init({ + client: { + rpcUrl: dojoConfig.rpcUrl, + toriiUrl: dojoConfig.toriiUrl, + relayUrl: dojoConfig.relayUrl, + worldAddress: dojoConfig.manifest.world.address, + }, + domain: { + name: "WORLD_NAME", + version: "1.0", + chainId: "KATANA", + revision: "1", + }, + }); + + const events = await sdk.getEvents( + new ToriiQueryBuilder() + .withClause(new ClauseBuilder().keys([], [undefined]).build()) + .build() + ); + console.log(events); +} + +main().catch(console.error); diff --git a/examples/example-vite-vanilla-ts/src/typescript/contracts.gen.ts b/examples/example-vite-vanilla-ts/src/typescript/contracts.gen.ts new file mode 100644 index 00000000..132621f9 --- /dev/null +++ b/examples/example-vite-vanilla-ts/src/typescript/contracts.gen.ts @@ -0,0 +1,68 @@ +import { DojoProvider, DojoCall } from "@dojoengine/core"; +import { + Account, + AccountInterface, + BigNumberish, + CairoOption, + CairoCustomEnum, + ByteArray, +} from "starknet"; +import * as models from "./models.gen"; + +export function setupWorld(provider: DojoProvider) { + const build_actions_move_calldata = ( + direction: CairoCustomEnum + ): DojoCall => { + return { + contractName: "actions", + entrypoint: "move", + calldata: [direction], + }; + }; + + const actions_move = async ( + snAccount: Account | AccountInterface, + direction: CairoCustomEnum + ) => { + try { + return await provider.execute( + snAccount, + build_actions_move_calldata(direction), + "dojo_starter" + ); + } catch (error) { + console.error(error); + throw error; + } + }; + + const build_actions_spawn_calldata = (): DojoCall => { + return { + contractName: "actions", + entrypoint: "spawn", + calldata: [], + }; + }; + + const actions_spawn = async (snAccount: Account | AccountInterface) => { + try { + return await provider.execute( + snAccount, + build_actions_spawn_calldata(), + "dojo_starter" + ); + } catch (error) { + console.error(error); + throw error; + } + }; + + return { + actions: { + move: actions_move, + buildMoveCalldata: build_actions_move_calldata, + spawn: actions_spawn, + buildSpawnCalldata: build_actions_spawn_calldata, + }, + }; +} diff --git a/examples/example-vite-vanilla-ts/src/typescript/models.gen.ts b/examples/example-vite-vanilla-ts/src/typescript/models.gen.ts new file mode 100644 index 00000000..497a5988 --- /dev/null +++ b/examples/example-vite-vanilla-ts/src/typescript/models.gen.ts @@ -0,0 +1,172 @@ +import type { SchemaType as ISchemaType } from "@dojoengine/sdk"; + +import { + CairoCustomEnum, + CairoOption, + CairoOptionVariant, + BigNumberish, +} from "starknet"; + +type WithFieldOrder = T & { fieldOrder: string[] }; + +// Type definition for `dojo_starter::models::DirectionsAvailable` struct +export interface DirectionsAvailable { + player: string; + directions: Array; +} + +// Type definition for `dojo_starter::models::DirectionsAvailableValue` struct +export interface DirectionsAvailableValue { + directions: Array; +} + +// Type definition for `dojo_starter::models::Moves` struct +export interface Moves { + player: string; + remaining: BigNumberish; + last_direction: CairoOption; + can_move: boolean; +} + +// Type definition for `dojo_starter::models::MovesValue` struct +export interface MovesValue { + remaining: BigNumberish; + last_direction: CairoOption; + can_move: boolean; +} + +// Type definition for `dojo_starter::models::Position` struct +export interface Position { + player: string; + vec: Vec2; +} + +// Type definition for `dojo_starter::models::PositionValue` struct +export interface PositionValue { + vec: Vec2; +} + +// Type definition for `dojo_starter::models::Vec2` struct +export interface Vec2 { + x: BigNumberish; + y: BigNumberish; +} + +// Type definition for `dojo_starter::systems::actions::actions::Moved` struct +export interface Moved { + player: string; + direction: DirectionEnum; +} + +// Type definition for `dojo_starter::systems::actions::actions::MovedValue` struct +export interface MovedValue { + direction: DirectionEnum; +} + +// Type definition for `dojo_starter::models::Direction` enum +export type Direction = { + Left: string; + Right: string; + Up: string; + Down: string; +}; +export type DirectionEnum = CairoCustomEnum; + +export interface SchemaType extends ISchemaType { + dojo_starter: { + DirectionsAvailable: WithFieldOrder; + DirectionsAvailableValue: WithFieldOrder; + Moves: WithFieldOrder; + MovesValue: WithFieldOrder; + Position: WithFieldOrder; + PositionValue: WithFieldOrder; + Vec2: WithFieldOrder; + Moved: WithFieldOrder; + MovedValue: WithFieldOrder; + }; +} +export const schema: SchemaType = { + dojo_starter: { + DirectionsAvailable: { + fieldOrder: ["player", "directions"], + player: "", + directions: [ + new CairoCustomEnum({ + Left: "", + Right: undefined, + Up: undefined, + Down: undefined, + }), + ], + }, + DirectionsAvailableValue: { + fieldOrder: ["directions"], + directions: [ + new CairoCustomEnum({ + Left: "", + Right: undefined, + Up: undefined, + Down: undefined, + }), + ], + }, + Moves: { + fieldOrder: ["player", "remaining", "last_direction", "can_move"], + player: "", + remaining: 0, + last_direction: new CairoOption(CairoOptionVariant.None), + can_move: false, + }, + MovesValue: { + fieldOrder: ["remaining", "last_direction", "can_move"], + remaining: 0, + last_direction: new CairoOption(CairoOptionVariant.None), + can_move: false, + }, + Position: { + fieldOrder: ["player", "vec"], + player: "", + vec: { x: 0, y: 0 }, + }, + PositionValue: { + fieldOrder: ["vec"], + vec: { x: 0, y: 0 }, + }, + Vec2: { + fieldOrder: ["x", "y"], + x: 0, + y: 0, + }, + Moved: { + fieldOrder: ["player", "direction"], + player: "", + direction: new CairoCustomEnum({ + Left: "", + Right: undefined, + Up: undefined, + Down: undefined, + }), + }, + MovedValue: { + fieldOrder: ["direction"], + direction: new CairoCustomEnum({ + Left: "", + Right: undefined, + Up: undefined, + Down: undefined, + }), + }, + }, +}; +export enum ModelsMapping { + Direction = "dojo_starter-Direction", + DirectionsAvailable = "dojo_starter-DirectionsAvailable", + DirectionsAvailableValue = "dojo_starter-DirectionsAvailableValue", + Moves = "dojo_starter-Moves", + MovesValue = "dojo_starter-MovesValue", + Position = "dojo_starter-Position", + PositionValue = "dojo_starter-PositionValue", + Vec2 = "dojo_starter-Vec2", + Moved = "dojo_starter-Moved", + MovedValue = "dojo_starter-MovedValue", +} diff --git a/examples/example-vite-vanilla-ts/tsconfig.json b/examples/example-vite-vanilla-ts/tsconfig.json new file mode 100644 index 00000000..92f8583f --- /dev/null +++ b/examples/example-vite-vanilla-ts/tsconfig.json @@ -0,0 +1,24 @@ +{ + "compilerOptions": { + "target": "ES2020", + "useDefineForClassFields": true, + "module": "ESNext", + "lib": ["ES2020", "DOM", "DOM.Iterable"], + "skipLibCheck": true, + + /* Bundler mode */ + "moduleResolution": "bundler", + "allowImportingTsExtensions": true, + "isolatedModules": true, + "moduleDetection": "force", + "noEmit": true, + + /* Linting */ + "strict": true, + "noUnusedLocals": true, + "noUnusedParameters": true, + "noFallthroughCasesInSwitch": true, + "noUncheckedSideEffectImports": true + }, + "include": ["src"] +} diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index b1bddae2..8c3df6db 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -132,7 +132,7 @@ importers: version: 3.0.11 bun-types: specifier: latest - version: 1.1.45 + version: 1.2.0 graphql: specifier: ^16.9.0 version: 16.10.0 @@ -914,7 +914,7 @@ importers: version: 2.1.1 drizzle-orm: specifier: ^0.38.3 - version: 0.38.3(@libsql/client@0.14.0)(@types/react@18.3.18)(bun-types@1.1.45)(react@18.3.1) + version: 0.38.3(@libsql/client@0.14.0)(@types/react@18.3.18)(bun-types@1.2.0)(react@18.3.1) lucide-react: specifier: ^0.469.0 version: 0.469.0(react@18.3.1) @@ -1243,6 +1243,25 @@ importers: specifier: ^5.4.1 version: 5.4.11(@types/node@22.10.7)(terser@5.37.0) + examples/example-vite-vanilla-ts: + dependencies: + '@dojoengine/core': + specifier: 'workspace:' + version: link:../../packages/core + '@dojoengine/sdk': + specifier: 'workspace:' + version: link:../../packages/sdk + '@dojoengine/torii-client': + specifier: 'workspace:' + version: link:../../packages/torii-client + starknet: + specifier: 'catalog:' + version: 6.21.0(encoding@0.1.13) + devDependencies: + typescript: + specifier: ~5.6.2 + version: 5.6.3 + examples/example-vue-app-recs: dependencies: '@dojoengine/core': @@ -7468,8 +7487,8 @@ packages: buffer@6.0.3: resolution: {integrity: sha512-FTiCpNxtwiZZHEZbcbTIcZjERVICn9yq/pDFkTl95/AxzD1naBctN7YO68riM/gLSDY7sdrMby8hofADYuuqOA==} - bun-types@1.1.45: - resolution: {integrity: sha512-8NT3BYwkyO8nzTG1k+q86VEvucw7s5W1fjRIGs0Y6/XNbTZn+mHEU39LFnuDLj4UmGCMpWCQtXUhLd6cko49Ww==} + bun-types@1.2.0: + resolution: {integrity: sha512-KEaJxyZfbV/c4eyG0vyehDpYmBGreNiQbZIqvVHJwZ4BmeuWlNZ7EAzMN2Zcd7ailmS/tGVW0BgYbGf+lGEpWw==} bundle-require@5.1.0: resolution: {integrity: sha512-3WrrOuZiyaaZPWiEt4G3+IffISVC9HYlWueJEBWED4ZH4aIAC2PnkdnuRrR94M+w6yGWn4AglWtJtBI8YqvgoA==} @@ -17729,7 +17748,7 @@ snapshots: '@octokit/request-error': 3.0.3 '@octokit/types': 9.3.2 is-plain-object: 5.0.0 - node-fetch: 2.6.7(encoding@0.1.13) + node-fetch: 2.7.0(encoding@0.1.13) universal-user-agent: 6.0.1 transitivePeerDependencies: - encoding @@ -18887,7 +18906,7 @@ snapshots: '@scure/bip32@1.3.2': dependencies: '@noble/curves': 1.2.0 - '@noble/hashes': 1.3.2 + '@noble/hashes': 1.3.3 '@scure/base': 1.1.9 '@scure/bip32@1.5.0': @@ -18904,7 +18923,7 @@ snapshots: '@scure/bip39@1.2.1': dependencies: - '@noble/hashes': 1.3.2 + '@noble/hashes': 1.3.3 '@scure/base': 1.1.9 '@scure/bip39@1.4.0': @@ -18920,7 +18939,7 @@ snapshots: '@scure/starknet@1.1.0': dependencies: '@noble/curves': 1.7.0 - '@noble/hashes': 1.6.0 + '@noble/hashes': 1.6.1 '@shikijs/core@1.27.0': dependencies: @@ -21488,7 +21507,7 @@ snapshots: base64-js: 1.5.1 ieee754: 1.2.1 - bun-types@1.1.45: + bun-types@1.2.0: dependencies: '@types/node': 20.12.14 '@types/ws': 8.5.13 @@ -22364,11 +22383,11 @@ snapshots: transitivePeerDependencies: - supports-color - drizzle-orm@0.38.3(@libsql/client@0.14.0)(@types/react@18.3.18)(bun-types@1.1.45)(react@18.3.1): + drizzle-orm@0.38.3(@libsql/client@0.14.0)(@types/react@18.3.18)(bun-types@1.2.0)(react@18.3.1): optionalDependencies: '@libsql/client': 0.14.0 '@types/react': 18.3.18 - bun-types: 1.1.45 + bun-types: 1.2.0 react: 18.3.1 dset@3.1.4: {} @@ -22854,7 +22873,7 @@ snapshots: '@typescript-eslint/parser': 5.62.0(eslint@8.57.1)(typescript@5.7.2) eslint: 8.57.1 eslint-import-resolver-node: 0.3.9 - eslint-import-resolver-typescript: 3.7.0(eslint-plugin-import@2.31.0(@typescript-eslint/parser@5.62.0(eslint@8.57.1)(typescript@5.7.2))(eslint@8.57.1))(eslint@8.57.1) + eslint-import-resolver-typescript: 3.7.0(eslint-plugin-import@2.31.0)(eslint@8.57.1) eslint-plugin-import: 2.31.0(@typescript-eslint/parser@5.62.0(eslint@8.57.1)(typescript@5.7.2))(eslint-import-resolver-typescript@3.7.0)(eslint@8.57.1) eslint-plugin-jsx-a11y: 6.10.2(eslint@8.57.1) eslint-plugin-react: 7.37.3(eslint@8.57.1) @@ -22874,7 +22893,7 @@ snapshots: transitivePeerDependencies: - supports-color - eslint-import-resolver-typescript@3.7.0(eslint-plugin-import@2.31.0(@typescript-eslint/parser@5.62.0(eslint@8.57.1)(typescript@5.7.2))(eslint@8.57.1))(eslint@8.57.1): + eslint-import-resolver-typescript@3.7.0(eslint-plugin-import@2.31.0)(eslint@8.57.1): dependencies: '@nolyfill/is-core-module': 1.0.39 debug: 4.4.0 @@ -22890,14 +22909,14 @@ snapshots: transitivePeerDependencies: - supports-color - eslint-module-utils@2.12.0(@typescript-eslint/parser@5.62.0(eslint@8.57.1)(typescript@5.7.2))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.7.0(eslint-plugin-import@2.31.0(@typescript-eslint/parser@5.62.0(eslint@8.57.1)(typescript@5.7.2))(eslint@8.57.1))(eslint@8.57.1))(eslint@8.57.1): + eslint-module-utils@2.12.0(@typescript-eslint/parser@5.62.0(eslint@8.57.1)(typescript@5.7.2))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.7.0)(eslint@8.57.1): dependencies: debug: 3.2.7 optionalDependencies: '@typescript-eslint/parser': 5.62.0(eslint@8.57.1)(typescript@5.7.2) eslint: 8.57.1 eslint-import-resolver-node: 0.3.9 - eslint-import-resolver-typescript: 3.7.0(eslint-plugin-import@2.31.0(@typescript-eslint/parser@5.62.0(eslint@8.57.1)(typescript@5.7.2))(eslint@8.57.1))(eslint@8.57.1) + eslint-import-resolver-typescript: 3.7.0(eslint-plugin-import@2.31.0)(eslint@8.57.1) transitivePeerDependencies: - supports-color @@ -22912,7 +22931,7 @@ snapshots: doctrine: 2.1.0 eslint: 8.57.1 eslint-import-resolver-node: 0.3.9 - eslint-module-utils: 2.12.0(@typescript-eslint/parser@5.62.0(eslint@8.57.1)(typescript@5.7.2))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.7.0(eslint-plugin-import@2.31.0(@typescript-eslint/parser@5.62.0(eslint@8.57.1)(typescript@5.7.2))(eslint@8.57.1))(eslint@8.57.1))(eslint@8.57.1) + eslint-module-utils: 2.12.0(@typescript-eslint/parser@5.62.0(eslint@8.57.1)(typescript@5.7.2))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.7.0)(eslint@8.57.1) hasown: 2.0.2 is-core-module: 2.16.1 is-glob: 4.0.3 @@ -27299,8 +27318,8 @@ snapshots: picocolors: 1.1.1 sade: 1.8.1 svelte: 4.2.19 - svelte-preprocess: 5.1.4(@babel/core@7.26.0)(postcss-load-config@4.0.2(postcss@8.5.1))(postcss@8.5.1)(svelte@4.2.19)(typescript@5.7.2) - typescript: 5.7.2 + svelte-preprocess: 5.1.4(@babel/core@7.26.0)(postcss-load-config@4.0.2(postcss@8.5.1))(postcss@8.5.1)(svelte@4.2.19)(typescript@5.6.3) + typescript: 5.6.3 transitivePeerDependencies: - '@babel/core' - coffeescript @@ -27316,7 +27335,7 @@ snapshots: dependencies: svelte: 4.2.19 - svelte-preprocess@5.1.4(@babel/core@7.26.0)(postcss-load-config@4.0.2(postcss@8.5.1))(postcss@8.5.1)(svelte@4.2.19)(typescript@5.7.2): + svelte-preprocess@5.1.4(@babel/core@7.26.0)(postcss-load-config@4.0.2(postcss@8.5.1))(postcss@8.5.1)(svelte@4.2.19)(typescript@5.6.3): dependencies: '@types/pug': 2.0.10 detect-indent: 6.1.0 @@ -27328,7 +27347,7 @@ snapshots: '@babel/core': 7.26.0 postcss: 8.5.1 postcss-load-config: 4.0.2(postcss@8.5.1) - typescript: 5.7.2 + typescript: 5.6.3 svelte@4.2.19: dependencies: