create-mud 2.2.15-7482a5ae322f26278722081838b6103ce6d264e6 → 2.2.15-7fa68f6717ecd3fc2c734ca31c842c1242175cbe

package/dist/templates/react/packages/contracts/src/codegen/world/IWorld.sol

@@ -4,7 +4,7 @@ pragma solidity >=0.8.24;
 /* Autogenerated file. Do not edit manually. */
 
 import { IBaseWorld } from "@latticexyz/world/src/codegen/interfaces/IBaseWorld.sol";
-import { IMoveSystem } from "./IMoveSystem.sol";
+import { ITasksSystem } from "./ITasksSystem.sol";
 
 /**
  * @title IWorld
@@ -13,4 +13,4 @@ import { IMoveSystem } from "./IMoveSystem.sol";
  * that are dynamically registered in the World during deployment.
  * @dev This is an autogenerated file; do not edit manually.
  */
-interface IWorld is IBaseWorld, IMoveSystem {}
+interface IWorld is IBaseWorld, ITasksSystem {}

package/dist/templates/react/packages/contracts/src/systems/TasksSystem.sol

@@ -0,0 +1,24 @@
+// SPDX-License-Identifier: MIT
+pragma solidity >=0.8.24;
+
+import { System } from "@latticexyz/world/src/System.sol";
+import { Tasks, TasksData } from "../codegen/index.sol";
+
+contract TasksSystem is System {
+  function addTask(string memory description) public returns (bytes32 id) {
+    id = keccak256(abi.encode(block.prevrandao, _msgSender(), description));
+    Tasks.set(id, TasksData({ description: description, createdAt: block.timestamp, completedAt: 0 }));
+  }
+
+  function completeTask(bytes32 id) public {
+    Tasks.setCompletedAt(id, block.timestamp);
+  }
+
+  function resetTask(bytes32 id) public {
+    Tasks.setCompletedAt(id, 0);
+  }
+
+  function deleteTask(bytes32 id) public {
+    Tasks.deleteRecord(id);
+  }
+}

package/dist/templates/react/packages/contracts/test/TasksTest.t.sol

@@ -0,0 +1,30 @@
+// SPDX-License-Identifier: MIT
+pragma solidity >=0.8.24;
+
+import "forge-std/Test.sol";
+import { MudTest } from "@latticexyz/world/test/MudTest.t.sol";
+
+import { IWorld } from "../src/codegen/world/IWorld.sol";
+import { Tasks, TasksData } from "../src/codegen/index.sol";
+
+contract TasksTest is MudTest {
+  function testWorldExists() public {
+    uint256 codeSize;
+    address addr = worldAddress;
+    assembly {
+      codeSize := extcodesize(addr)
+    }
+    assertTrue(codeSize > 0);
+  }
+
+  function testTasks() public {
+    // Expect task to exist that we created during PostDeploy script
+    TasksData memory task = Tasks.get("1");
+    assertEq(task.description, "Walk the dog");
+    assertEq(task.completedAt, 0);
+
+    // Expect the task to be completed after calling completeTask from our TasksSystem
+    IWorld(worldAddress).app__completeTask("1");
+    assertEq(Tasks.getCompletedAt("1"), block.timestamp);
+  }
+}

package/dist/templates/react/packages/contracts/worlds.json

@@ -1,5 +1,5 @@
 {
   "31337": {
-    "address": "0xfdf868ea710ffd8cd33b829c5aff79edd15ecd5f"
+    "address": "0x8d8b6b8414e1e3dcfd4168561b9be6bd3bf6ec4b"
   }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-mud",
-  "version": "2.2.15-7482a5ae322f26278722081838b6103ce6d264e6",
+  "version": "2.2.15-7fa68f6717ecd3fc2c734ca31c842c1242175cbe",
   "description": "Create a new MUD project",
   "license": "MIT",
   "author": "Lattice <mud@lattice.xyz>",

package/dist/templates/react/packages/client/postcss.config.cjs

@@ -1,6 +0,0 @@
-module.exports = {
-  plugins: {
-    tailwindcss: {},
-    autoprefixer: {},
-  },
-};

package/dist/templates/react/packages/client/src/GameMap.tsx

@@ -1,78 +0,0 @@
-import { serialize, useAccount } from "wagmi";
-import { useKeyboardMovement } from "./useKeyboardMovement";
-import { Address, Hex, hexToBigInt, keccak256 } from "viem";
-import { ArrowDownIcon } from "./ui/icons/ArrowDownIcon";
-import { twMerge } from "tailwind-merge";
-import { Direction } from "./common";
-import mudConfig from "contracts/mud.config";
-
-export type Props = {
-  readonly players?: readonly {
-    readonly player: Address;
-    readonly x: number;
-    readonly y: number;
-  }[];
-
-  readonly onMove?: (direction: Direction) => void;
-};
-
-const size = 40;
-const scale = 100 / size;
-
-function getColorAngle(seed: Hex) {
-  return Number(hexToBigInt(keccak256(seed)) % 360n);
-}
-
-const rotateClassName = {
-  North: "rotate-0",
-  East: "rotate-90",
-  South: "rotate-180",
-  West: "-rotate-90",
-} as const satisfies Record<Direction, `${"" | "-"}rotate-${number}`>;
-
-export function GameMap({ players = [], onMove }: Props) {
-  const { address: userAddress } = useAccount();
-  useKeyboardMovement(onMove);
-  return (
-    <div className="aspect-square w-full max-w-[40rem]">
-      <div className="relative w-full h-full border-8 border-black/10">
-        {onMove
-          ? mudConfig.enums.Direction.map((direction) => (
-              <button
-                key={direction}
-                title={`Move ${direction.toLowerCase()}`}
-                className={twMerge(
-                  "outline-0 absolute inset-0 cursor-pointer grid p-4",
-                  rotateClassName[direction],
-                  "transition bg-gradient-to-t from-transparent via-transparent to-blue-50 text-blue-400 opacity-0 hover:opacity-40 active:opacity-100",
-                )}
-                style={{ clipPath: "polygon(0% 0%, 100% 0%, 50% 50%)" }}
-                onClick={() => onMove(direction)}
-              >
-                <ArrowDownIcon className="rotate-180 text-4xl self-start justify-self-center" />
-              </button>
-            ))
-          : null}
-
-        {players.map((player) => (
-          <div
-            key={player.player}
-            className="absolute bg-current"
-            style={{
-              color: `hwb(${getColorAngle(player.player)} 40% 20%)`,
-              width: `${scale}%`,
-              height: `${scale}%`,
-              left: `${((((player.x + size / 2) % size) + size) % size) * scale}%`,
-              top: `${((size - ((player.y + size / 2) % size)) % size) * scale}%`,
-            }}
-            title={serialize(player, null, 2)}
-          >
-            {player.player.toLowerCase() === userAddress?.toLowerCase() ? (
-              <div className="w-full h-full bg-current animate-ping opacity-50" />
-            ) : null}
-          </div>
-        ))}
-      </div>
-    </div>
-  );
-}

package/dist/templates/react/packages/client/src/Providers.tsx

@@ -1,44 +0,0 @@
-import { WagmiProvider } from "wagmi";
-import { QueryClientProvider, QueryClient } from "@tanstack/react-query";
-import { ReactNode } from "react";
-import { createSyncAdapter } from "@latticexyz/store-sync/internal";
-import { SyncProvider } from "@latticexyz/store-sync/react";
-import { stash } from "./mud/stash";
-import { Address } from "viem";
-import { defineConfig, EntryKitProvider } from "@latticexyz/entrykit/internal";
-import { wagmiConfig } from "./wagmiConfig";
-import { chainId } from "./common";
-
-const queryClient = new QueryClient();
-
-export type Props = {
-  worldDeploy: {
-    address: Address;
-    blockNumber: bigint | null;
-  };
-  children: ReactNode;
-};
-
-export function Providers({ worldDeploy, children }: Props) {
-  return (
-    <WagmiProvider config={wagmiConfig}>
-      <QueryClientProvider client={queryClient}>
-        <EntryKitProvider
-          config={defineConfig({
-            chainId,
-            worldAddress: worldDeploy.address,
-          })}
-        >
-          <SyncProvider
-            chainId={chainId}
-            address={worldDeploy.address}
-            startBlock={worldDeploy.blockNumber ?? undefined}
-            adapter={createSyncAdapter({ stash })}
-          >
-            {children}
-          </SyncProvider>
-        </EntryKitProvider>
-      </QueryClientProvider>
-    </WagmiProvider>
-  );
-}

package/dist/templates/react/packages/client/src/common.ts

@@ -1,6 +0,0 @@
-import mudConfig from "contracts/mud.config";
-
-export const chainId = parseInt(import.meta.env.VITE_CHAIN_ID) || 31337;
-export const url = new URL(window.location.href);
-
-export type Direction = (typeof mudConfig.enums.Direction)[number];

package/dist/templates/react/packages/client/src/mud/Explorer.tsx

@@ -1,32 +0,0 @@
-import { useState } from "react";
-import { twMerge } from "tailwind-merge";
-import { useEntryKitConfig } from "@latticexyz/entrykit/internal";
-import { MUDIcon } from "../ui/icons/MUDIcon";
-
-export function Explorer() {
-  const [open, setOpen] = useState(false);
-  const { chain, worldAddress } = useEntryKitConfig();
-  const explorerUrl = chain.blockExplorers?.worldsExplorer?.url;
-  if (!explorerUrl) return null;
-
-  return (
-    <div className="fixed bottom-0 inset-x-0 flex flex-col opacity-80 transition hover:opacity-100">
-      <button
-        type="button"
-        onClick={() => setOpen(!open)}
-        className="outline-none flex justify-end gap-2 p-2 font-medium leading-none text-black"
-      >
-        {open ? (
-          <>Close</>
-        ) : (
-          <>
-            Explore <MUDIcon className="text-orange-500" />
-          </>
-        )}
-      </button>
-      {open ? (
-        <iframe src={`${explorerUrl}/${worldAddress}`} className={twMerge("bg-black", open ? "h-[50vh]" : "h-0")} />
-      ) : null}
-    </div>
-  );
-}

package/dist/templates/react/packages/client/src/mud/getWorldDeploy.ts

@@ -1,23 +0,0 @@
-import { Address } from "viem";
-
-export async function getWorldDeploy(chainId: number): Promise<{
-  chainId: number;
-  address: Address;
-  blockNumber: bigint | null;
-}> {
-  // TODO: figure out how to catch vite:import-analysis error when this file is missing
-  const { default: worlds } = await import("contracts/worlds.json").catch((error) => {
-    console.debug("Could not import worlds.json", error);
-    return { default: null };
-  });
-  const deploy = worlds?.[`${chainId}`];
-  if (!deploy) {
-    throw new Error(`No world deploy found for chain ${chainId} in "worlds.json".`);
-  }
-  console.log("chain:", chainId, "world:", deploy);
-  return {
-    chainId,
-    address: deploy.address,
-    blockNumber: deploy.blockNumber != null ? BigInt(deploy.blockNumber) : null,
-  };
-}

package/dist/templates/react/packages/client/src/mud/stash.ts

@@ -1,4 +0,0 @@
-import { createStash } from "@latticexyz/stash/internal";
-import config from "contracts/mud.config";
-
-export const stash = createStash(config);

package/dist/templates/react/packages/client/src/mud/useSyncProgress.ts

@@ -1,21 +0,0 @@
-import { stash } from "./stash";
-import { initialProgress, SyncProgress } from "@latticexyz/store-sync/internal";
-import { SyncStep } from "@latticexyz/store-sync";
-import { useMemo } from "react";
-import { useRecord } from "@latticexyz/stash/react";
-
-export function useSyncProgress() {
-  const progress = useRecord({
-    stash,
-    table: SyncProgress,
-    key: {},
-    defaultValue: initialProgress,
-  });
-  return useMemo(
-    () => ({
-      ...progress,
-      isLive: progress.step === SyncStep.LIVE,
-    }),
-    [progress],
-  );
-}

package/dist/templates/react/packages/client/src/mud/useWorldContract.ts

@@ -1,45 +0,0 @@
-import { useClient } from "wagmi";
-import { chainId } from "../common";
-import { Account, Chain, Client, GetContractReturnType, Transport, getContract } from "viem";
-import { useQuery } from "@tanstack/react-query";
-import { useSessionClient, useEntryKitConfig } from "@latticexyz/entrykit/internal";
-import { observer } from "@latticexyz/explorer/observer";
-import worldAbi from "contracts/out/IWorld.sol/IWorld.abi.json";
-
-export function useWorldContract():
-  | GetContractReturnType<
-      typeof worldAbi,
-      {
-        public: Client<Transport, Chain>;
-        wallet: Client<Transport, Chain, Account>;
-      }
-    >
-  | undefined {
-  const { worldAddress } = useEntryKitConfig();
-  const client = useClient({ chainId });
-  const { data: sessionClient } = useSessionClient();
-
-  const { data: worldContract } = useQuery({
-    queryKey: ["worldContract", worldAddress, client?.uid, sessionClient?.uid],
-    queryFn: () => {
-      if (!client || !sessionClient) {
-        throw new Error("Not connected.");
-      }
-
-      return getContract({
-        abi: worldAbi,
-        address: worldAddress,
-        client: {
-          public: client,
-          wallet: sessionClient.extend(observer()),
-        },
-      });
-    },
-    staleTime: Infinity,
-    refetchOnMount: false,
-    refetchOnReconnect: false,
-    refetchOnWindowFocus: false,
-  });
-
-  return worldContract;
-}

package/dist/templates/react/packages/client/src/ui/icons/ArrowDownIcon.tsx

@@ -1,22 +0,0 @@
-import { DetailedHTMLProps, SVGAttributes } from "react";
-import { twMerge } from "tailwind-merge";
-
-export type Props = DetailedHTMLProps<SVGAttributes<SVGSVGElement>, SVGSVGElement>;
-
-export function ArrowDownIcon({ className, ...props }: Props) {
-  return (
-    <svg
-      className={twMerge("h-[1em] w-[1em]", className)}
-      xmlns="http://www.w3.org/2000/svg"
-      viewBox="0 0 16 16"
-      fill="currentColor"
-      {...props}
-    >
-      <path
-        fillRule="evenodd"
-        d="M8 2a.75.75 0 0 1 .75.75v8.69l3.22-3.22a.75.75 0 1 1 1.06 1.06l-4.5 4.5a.75.75 0 0 1-1.06 0l-4.5-4.5a.75.75 0 0 1 1.06-1.06l3.22 3.22V2.75A.75.75 0 0 1 8 2Z"
-        clipRule="evenodd"
-      />
-    </svg>
-  );
-}

package/dist/templates/react/packages/client/src/ui/icons/MUDIcon.tsx

@@ -1,25 +0,0 @@
-import { DetailedHTMLProps, SVGAttributes } from "react";
-import { twMerge } from "tailwind-merge";
-
-export type Props = DetailedHTMLProps<SVGAttributes<SVGSVGElement>, SVGSVGElement>;
-
-export function MUDIcon({ className, ...props }: Props) {
-  return (
-    <svg
-      xmlns="http://www.w3.org/2000/svg"
-      viewBox="0 0 8 8"
-      fill="currentColor"
-      shapeRendering="crispEdges"
-      className={twMerge("-my-[0.125em] h-[1.25em] w-[1.25em]", className)}
-      {...props}
-    >
-      {/* eslint-disable-next-line max-len */}
-      <path d="M0 0h1v1H0zm0 1h1v1H0zm0 1h1v1H0zm0 1h1v1H0zm0 1h1v1H0zm0 1h1v1H0zm0 1h1v1H0zm0 1h1v1H0zm1 0h1v1H1zm1 0h1v1H2zm1 0h1v1H3zm1 0h1v1H4zm1 0h1v1H5zm2-1h1v1H7zm0 1h1v1H7zM6 7h1v1H6zm1-2h1v1H7zm0-1h1v1H7zm0-1h1v1H7z" />
-      <path
-        d="M2 2h1v1H2zm0 1h1v1H2zm0 1h1v1H2zm0 1h1v1H2zm1-3h1v1H3zm1 0h1v1H4zm1 0h1v1H5zm0 1h1v1H5zm0 1h1v1H5zm0 1h1v1H5zM4 5h1v1H4zM3 5h1v1H3z"
-        opacity=".5"
-      />
-      <path d="M7 2h1v1H7zm0-1h1v1H7zM1 0h1v1H1zm1 0h1v1H2zm1 0h1v1H3zm1 0h1v1H4zm1 0h1v1H5zm1 0h1v1H6zm1 0h1v1H7z" />
-    </svg>
-  );
-}

package/dist/templates/react/packages/client/src/useKeyboardMovement.ts

@@ -1,26 +0,0 @@
-import { useEffect } from "react";
-import { Direction } from "./common";
-
-const keys = new Map<KeyboardEvent["key"], Direction>([
-  ["ArrowUp", "North"],
-  ["ArrowRight", "East"],
-  ["ArrowDown", "South"],
-  ["ArrowLeft", "West"],
-]);
-
-export const useKeyboardMovement = (move: undefined | ((direction: Direction) => void)) => {
-  useEffect(() => {
-    if (!move) return;
-
-    const listener = (event: KeyboardEvent) => {
-      const direction = keys.get(event.key);
-      if (direction == null) return;
-
-      event.preventDefault();
-      move(direction);
-    };
-
-    window.addEventListener("keydown", listener);
-    return () => window.removeEventListener("keydown", listener);
-  }, [move]);
-};

package/dist/templates/react/packages/client/src/wagmiConfig.ts

@@ -1,49 +0,0 @@
-import { Chain, http, webSocket } from "viem";
-import { anvil } from "viem/chains";
-import { createWagmiConfig } from "@latticexyz/entrykit/internal";
-import { rhodolite, garnet, redstone } from "@latticexyz/common/chains";
-import { chainId } from "./common";
-
-const chains = [
-  redstone,
-  garnet,
-  rhodolite,
-  {
-    ...anvil,
-    contracts: {
-      ...anvil.contracts,
-      paymaster: {
-        address: "0xf03E61E7421c43D9068Ca562882E98d1be0a6b6e",
-      },
-    },
-    blockExplorers: {
-      default: {} as never,
-      worldsExplorer: {
-        name: "MUD Worlds Explorer",
-        url: "http://localhost:13690/anvil/worlds",
-      },
-    },
-  },
-] as const satisfies Chain[];
-
-const transports = {
-  [anvil.id]: webSocket(),
-  [garnet.id]: http(),
-  [rhodolite.id]: http(),
-  [redstone.id]: http(),
-} as const;
-
-export const wagmiConfig = createWagmiConfig({
-  chainId,
-  // TODO: swap this with another default project ID or leave empty
-  walletConnectProjectId: "14ce88fdbc0f9c294e26ec9b4d848e44",
-  appName: document.title,
-  chains,
-  transports,
-  pollingInterval: {
-    [anvil.id]: 2000,
-    [garnet.id]: 2000,
-    [rhodolite.id]: 2000,
-    [redstone.id]: 2000,
-  },
-});

package/dist/templates/react/packages/client/tailwind.config.ts

@@ -1,10 +0,0 @@
-import { Config } from "tailwindcss/types/config";
-
-export default {
-  content: ["./**/*.{html,js,jsx,ts,tsx}", "!./node_modules"],
-  theme: {},
-  plugins: [],
-  future: {
-    hoverOnlyWhenSupported: true,
-  },
-} satisfies Config;