Replace connection parameter

Author: JunichiSugiura

packages/keychain/src/components/DeployController.stories.tsx

@@ -3,21 +3,23 @@ import type { Meta, StoryObj } from "@storybook/react";
 import { DeployController } from "./DeployController";
 import { constants, num } from "starknet";
 import { JsControllerError } from "@cartridge/account-wasm/controller";
-import Controller from "#utils/controller";
+import { useConnection, createMockConnection } from "#hooks/connection.mock";
 
 const meta = {
   component: DeployController,
-  parameters: {
-    connection: {
-      controller: {
-        chainId: () => constants.StarknetChainId.SN_SEPOLIA as string,
-        callContract: () =>
-          Promise.resolve([num.toHex("2000000000000000000"), "0x0"]),
-        username: () => "test-account",
-        address: () =>
-          "0x0000000000000000000000000000000000000000000000000000000000000000",
-      } as Partial<Controller>,
-    },
+  beforeEach: () => {
+    useConnection.mockReturnValue(
+      createMockConnection({
+        controller: {
+          chainId: () => constants.StarknetChainId.SN_SEPOLIA as string,
+          callContract: () =>
+            Promise.resolve([num.toHex("2000000000000000000"), "0x0"]),
+          username: () => "test-account",
+          address: () =>
+            "0x0000000000000000000000000000000000000000000000000000000000000000",
+        },
+      }),
+    );
   },
 } satisfies Meta<typeof DeployController>;
 

packages/keychain/src/components/connect/SessionConsent.stories.tsx

@@ -1,14 +1,17 @@
 import type { Meta, StoryObj } from "@storybook/react";
 
 import { SessionConsent } from "./SessionConsent";
+import { useConnection, createMockConnection } from "#hooks/connection.mock";
 
 const meta = {
   // tags: ["autodocs"],
   component: SessionConsent,
-  parameters: {
-    connection: {
-      origin: "https://cartridge.gg",
-    },
+  beforeEach: () => {
+    useConnection.mockReturnValue(
+      createMockConnection({
+        origin: "https://cartridge.gg",
+      }),
+    );
   },
   args: {
     isVerified: true,

packages/keychain/src/components/funding/index.stories.tsx

@@ -2,16 +2,19 @@ import type { Meta, StoryObj } from "@storybook/react";
 
 import { Funding } from ".";
 import { num } from "starknet";
+import { useConnection, createMockConnection } from "#hooks/connection.mock";
 
 const meta = {
   component: Funding,
-  parameters: {
-    connection: {
-      controller: {
-        callContract: () =>
-          Promise.resolve([num.toHex("2000000000000000000"), "0x0"]),
-      },
-    },
+  beforeEach: () => {
+    useConnection.mockReturnValue(
+      createMockConnection({
+        controller: {
+          callContract: () =>
+            Promise.resolve([num.toHex("2000000000000000000"), "0x0"]),
+        },
+      }),
+    );
   },
 } satisfies Meta<typeof Funding>;
 

packages/keychain/src/components/slot/fund.stories.tsx

@@ -2,17 +2,20 @@ import type { Meta, StoryObj } from "@storybook/react";
 
 import { Fund } from "./fund";
 import { num } from "starknet";
+import { useConnection, createMockConnection } from "#hooks/connection.mock";
 
 const meta: Meta<typeof Fund> = {
   component: Fund,
   decorators: [(Story) => <Story />],
-  parameters: {
-    connection: {
-      controller: {
-        callContract: () =>
-          Promise.resolve([num.toHex("2000000000000000000"), "0x0"]),
-      },
-    },
+  beforeEach: () => {
+    useConnection.mockReturnValue(
+      createMockConnection({
+        controller: {
+          callContract: () =>
+            Promise.resolve([num.toHex("2000000000000000000"), "0x0"]),
+        },
+      }),
+    );
   },
 };