Initial commit with 🏗️ Scaffold-ETH 2 @ 1.0.5

2026-01-10 18:17:37 +07:00
commit 98751c5b87
165 changed files with 29073 additions and 0 deletions
--- a/packages/nextjs/app/ipfsUpload/page.tsx
+++ b/packages/nextjs/app/ipfsUpload/page.tsx
@@ -0,0 +1,81 @@
+"use client";
+
+import { lazy, useEffect, useState } from "react";
+import type { NextPage } from "next";
+import { notification } from "~~/utils/scaffold-eth";
+import { addToIPFS } from "~~/utils/tokenization/ipfs-fetch";
+import nftsMetadata from "~~/utils/tokenization/nftsMetadata";
+
+const LazyReactJson = lazy(() => import("react-json-view"));
+
+const IpfsUpload: NextPage = () => {
+  const [yourJSON, setYourJSON] = useState<object>(nftsMetadata[0]);
+  const [loading, setLoading] = useState(false);
+  const [uploadedIpfsPath, setUploadedIpfsPath] = useState("");
+  const [mounted, setMounted] = useState(false);
+  useEffect(() => {
+    setMounted(true);
+  }, []);
+
+  const handleIpfsUpload = async () => {
+    setLoading(true);
+    const notificationId = notification.loading("Uploading to IPFS...");
+    try {
+      const uploadedItem = await addToIPFS(yourJSON);
+      notification.remove(notificationId);
+      notification.success("Uploaded to IPFS");
+
+      setUploadedIpfsPath(uploadedItem.path);
+    } catch (error) {
+      notification.remove(notificationId);
+      notification.error("Error uploading to IPFS");
+      console.log(error);
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  return (
+    <>
+      <div className="flex items-center flex-col flex-grow pt-10">
+        <h1 className="text-center mb-4">
+          <span className="block text-4xl font-bold">Upload to IPFS</span>
+        </h1>
+
+        {mounted && (
+          <LazyReactJson
+            style={{ padding: "1rem", borderRadius: "0.75rem" }}
+            src={yourJSON}
+            theme="solarized"
+            enableClipboard={false}
+            onEdit={edit => {
+              setYourJSON(edit.updated_src);
+            }}
+            onAdd={add => {
+              setYourJSON(add.updated_src);
+            }}
+            onDelete={del => {
+              setYourJSON(del.updated_src);
+            }}
+          />
+        )}
+        <button
+          className={`btn btn-secondary mt-4 ${loading ? "loading" : ""}`}
+          disabled={loading}
+          onClick={handleIpfsUpload}
+        >
+          Upload to IPFS
+        </button>
+        {uploadedIpfsPath && (
+          <div className="mt-4">
+            <a href={`https://ipfs.io/ipfs/${uploadedIpfsPath}`} target="_blank" rel="noreferrer">
+              {`https://ipfs.io/ipfs/${uploadedIpfsPath}`}
+            </a>
+          </div>
+        )}
+      </div>
+    </>
+  );
+};
+
+export default IpfsUpload;