From d46bedecfeb4f3d97216605207858f31fc85cf85 Mon Sep 17 00:00:00 2001
From: Cho Young-Hwi <cyh76507707@gmail.com>
Date: Thu, 19 Mar 2026 09:41:01 +0000
Subject: [PATCH] [#346] Send MCV2_Bond creation fee with createStoryline

Fetch creationFee() from MCV2_Bond dynamically and pass as value
in the createStoryline write call. Display fee to user in the
create form. Add value field to WriteCall interface.

Fixes #346

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 src/app/create/page.tsx | 22 ++++++++++++++++++++--
 src/hooks/usePublish.ts |  1 +
 2 files changed, 21 insertions(+), 2 deletions(-)

diff --git a/src/app/create/page.tsx b/src/app/create/page.tsx
index be207abf..5c9d1d86 100644
--- a/src/app/create/page.tsx
+++ b/src/app/create/page.tsx
@@ -14,9 +14,10 @@ import { useChainPlot } from "../../hooks/useChainPlot";
 import { usePublishIntent } from "../../hooks/usePublishIntent";
 import { RecoveryBanner } from "../../components/RecoveryBanner";
 import { storyFactoryAbi, storylineCreatedEvent } from "../../../lib/contracts/abi";
-import { STORY_FACTORY } from "../../../lib/contracts/constants";
+import { STORY_FACTORY, MCV2_BOND } from "../../../lib/contracts/constants";
 import { supabase, type Storyline } from "../../../lib/supabase";
-import { decodeEventLog, encodeEventTopics } from "viem";
+import { publicClient } from "../../../lib/rpc";
+import { decodeEventLog, encodeEventTopics, formatEther } from "viem";
 import Link from "next/link";
 import { ConnectWallet } from "../../components/ConnectWallet";
 import { DropdownSelect } from "../../components/DropdownSelect";
@@ -86,6 +87,19 @@ function CreatePage() {
   const [newContent, setNewContent] = useState("");
   const hasDeadline = true;
 
+  const { data: creationFee = BigInt(0) } = useQuery({
+    queryKey: ["mcv2-creation-fee"],
+    queryFn: async () => {
+      const fee = await publicClient.readContract({
+        address: MCV2_BOND,
+        abi: [{ type: "function", name: "creationFee", stateMutability: "view", inputs: [], outputs: [{ type: "uint256" }] }] as const,
+        functionName: "creationFee",
+      });
+      return fee;
+    },
+    staleTime: 60_000,
+  });
+
   const { state: newState, error: newError, receipt, execute } = usePublish();
   const {
     pendingIntent: newPendingIntent,
@@ -278,6 +292,7 @@ function CreatePage() {
                     functionName: "createStoryline",
                     args: [newTitle.trim(), cid, contentHash, hasDeadline],
                     gas: BigInt(16_000_000),
+                    value: creationFee,
                   }),
                   metadata: { genre, language },
                   onIntentSave: newSaveIntent,
@@ -341,6 +356,9 @@ function CreatePage() {
 
             <p className="text-muted text-xs">
               All storylines have a 7-day deadline &mdash; the story sunsets if no new plot is added within 7 days.
+              {creationFee > BigInt(0) && (
+                <> Creation fee: {formatEther(creationFee)} ETH.</>
+              )}
             </p>
 
             {newState === "error" && (
diff --git a/src/hooks/usePublish.ts b/src/hooks/usePublish.ts
index 4ffbbf74..a5490f2b 100644
--- a/src/hooks/usePublish.ts
+++ b/src/hooks/usePublish.ts
@@ -21,6 +21,7 @@ interface WriteCall {
   functionName: string;
   args: readonly unknown[];
   gas?: bigint;
+  value?: bigint;
 }
 
 interface PublishOptions {