From 4847632f686ae863891228f36d90c3b701bc4ee0 Mon Sep 17 00:00:00 2001
From: aki-0517 <akki.pp.777@gmail.com>
Date: Fri, 6 Dec 2024 00:18:05 +0900
Subject: [PATCH] =?UTF-8?q?=E3=81=A4=E3=81=AA=E3=81=8E=E8=BE=BC=E3=81=BF?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../nextjs/app/enterpreneur/form/fieldSet.tsx | 146 ++++++++++++------
 .../hooks/scaffold-eth/useERC721Mintbatch.ts  |   2 +
 2 files changed, 101 insertions(+), 47 deletions(-)

diff --git a/packages/nextjs/app/enterpreneur/form/fieldSet.tsx b/packages/nextjs/app/enterpreneur/form/fieldSet.tsx
index 22b17f9..a033eec 100644
--- a/packages/nextjs/app/enterpreneur/form/fieldSet.tsx
+++ b/packages/nextjs/app/enterpreneur/form/fieldSet.tsx
@@ -7,12 +7,15 @@ import Grid from "@mui/material/Grid";
 import Radio from "@mui/material/Radio";
 import RadioGroup from "@mui/material/RadioGroup";
 import TextField from "@mui/material/TextField";
+import { useERC721MintBatch } from "~~/hooks/scaffold-eth/useERC721Mintbatch";
+import { useAccount } from "wagmi";
 
 type FiledSetProps = {
   title: string;
 };
 
 export const FiledSet: FC<FiledSetProps> = ({ title }) => {
+  const { address } = useAccount();
   const [amount, setAmount] = useState<string>("");
   const [startDate, setStartDate] = useState<string>("");
   const [endDate, setEndDate] = useState<string>("");
@@ -20,54 +23,103 @@ export const FiledSet: FC<FiledSetProps> = ({ title }) => {
   const [details, setDetails] = useState<string>("");
   const [storeName, setStoreName] = useState<string>("");
 
+  const { mintBatch, isMinting } = useERC721MintBatch();
+
+  const handleMint = async () => {
+    if (!address) {
+      console.error("ウォレットが接続されていません。");
+      return;
+    }
+
+    try {
+      const numberOfTokens = 1n;
+      const issueDate = BigInt(Math.floor(new Date(startDate).getTime() / 1000));
+      const expiryDate = BigInt(Math.floor(new Date(endDate).getTime() / 1000));
+      const amountBigInt = BigInt(amount);
+
+      await mintBatch(
+        address,
+        numberOfTokens,
+        title,
+        issueDate,
+        amountBigInt,
+        expiryDate,
+        usage === "店舗名入力" ? storeName : usage
+      );
+    } catch (error) {
+      console.error("ミント中にエラーが発生しました:", error);
+    }
+  };
+
   return (
-    <>
-      <Grid item xs={12} md={6}>
-        <Box sx={{ width: "100%", maxWidth: 400 }}>
-          <TextField fullWidth label={title} value={amount} onChange={e => setAmount(e.target.value)} sx={{ mb: 2 }} />
-          <Grid container spacing={2}>
-            <Grid item xs={6}>
-              <TextField
-                fullWidth
-                label="開始期間"
-                type="date"
-                InputLabelProps={{ shrink: true }}
-                value={startDate}
-                onChange={e => setStartDate(e.target.value)}
-              />
-            </Grid>
-            <Grid item xs={6}>
-              <TextField
-                fullWidth
-                label="有効期限"
-                type="date"
-                InputLabelProps={{ shrink: true }}
-                value={endDate}
-                onChange={e => setEndDate(e.target.value)}
-              />
-            </Grid>
+    <Grid item xs={12} md={6}>
+      <Box sx={{ width: "100%", maxWidth: 400 }}>
+        <TextField
+          fullWidth
+          label={title}
+          value={amount}
+          onChange={e => setAmount(e.target.value)}
+          sx={{ mb: 2 }}
+        />
+        <Grid container spacing={2}>
+          <Grid item xs={6}>
+            <TextField
+              fullWidth
+              label="開始期間"
+              type="date"
+              InputLabelProps={{ shrink: true }}
+              value={startDate}
+              onChange={e => setStartDate(e.target.value)}
+            />
+          </Grid>
+          <Grid item xs={6}>
+            <TextField
+              fullWidth
+              label="有効期限"
+              type="date"
+              InputLabelProps={{ shrink: true }}
+              value={endDate}
+              onChange={e => setEndDate(e.target.value)}
+            />
           </Grid>
-          <RadioGroup row value={usage} onChange={e => setUsage(e.target.value)} sx={{ mt: 2, mb: 2 }}>
-            <FormControlLabel value="会社全体" control={<Radio />} label="会社全体" />
-            <Box sx={{ display: "flex", alignItems: "center" }}>
-              <FormControlLabel value="店舗名入力" control={<Radio />} label="店舗名入力" />
-              <TextField label="店舗名" value={storeName} onChange={e => setStoreName(e.target.value)} sx={{ ml: 2 }} />
-            </Box>
-          </RadioGroup>
-          <TextField
-            fullWidth
-            label="詳細情報"
-            multiline
-            rows={4}
-            value={details}
-            onChange={e => setDetails(e.target.value)}
-            sx={{ mb: 2 }}
-          />
-          <Button variant="contained" color="error" fullWidth sx={{ fontWeight: "bold" }}>
-            クーポンを発行する
-          </Button>
-        </Box>
-      </Grid>
-    </>
+        </Grid>
+        <RadioGroup
+          row
+          value={usage}
+          onChange={e => setUsage(e.target.value)}
+          sx={{ mt: 2, mb: 2 }}
+        >
+          <FormControlLabel value="会社全体" control={<Radio />} label="会社全体" />
+          <Box sx={{ display: "flex", alignItems: "center" }}>
+            <FormControlLabel value="店舗名入力" control={<Radio />} label="店舗名入力" />
+            <TextField
+              label="店舗名"
+              value={storeName}
+              onChange={e => setStoreName(e.target.value)}
+              sx={{ ml: 2 }}
+            />
+          </Box>
+        </RadioGroup>
+        <TextField
+          fullWidth
+          label="詳細情報"
+          multiline
+          rows={4}
+          value={details}
+          onChange={e => setDetails(e.target.value)}
+          sx={{ mb: 2 }}
+        />
+        <Button
+          variant="contained"
+          color="error"
+          fullWidth
+          sx={{ fontWeight: "bold" }}
+          onClick={handleMint}
+          disabled={isMinting}
+        >
+          {isMinting ? "ミント中..." : "クーポンを発行する"}
+        </Button>
+      </Box>
+    </Grid>
   );
 };
diff --git a/packages/nextjs/hooks/scaffold-eth/useERC721Mintbatch.ts b/packages/nextjs/hooks/scaffold-eth/useERC721Mintbatch.ts
index 68f926f..beea3f9 100644
--- a/packages/nextjs/hooks/scaffold-eth/useERC721Mintbatch.ts
+++ b/packages/nextjs/hooks/scaffold-eth/useERC721Mintbatch.ts
@@ -1,3 +1,5 @@
+"use client";
+
 import { useState } from "react";
 import { useScaffoldWriteContract } from "~~/hooks/scaffold-eth";