Use bgipfs for upload

package.json

@@ -44,6 +44,7 @@
     "test": "yarn hardhat:test",
     "vercel": "yarn workspace @se-2/nextjs vercel",
     "vercel:yolo": "yarn workspace @se-2/nextjs vercel:yolo",
+    "ipfs": "yarn workspace @se-2/nextjs ipfs",
     "vercel:login": "yarn workspace @se-2/nextjs vercel:login",
     "verify": "yarn hardhat:verify"
   },

packages/nextjs/.gitignore

@@ -35,3 +35,5 @@ yarn-error.log*
 
 # typescript
 *.tsbuildinfo
+
+ipfs-upload.config.json

packages/nextjs/next.config.js

@@ -16,4 +16,14 @@ const nextConfig = {
   },
 };
 
+const isIpfs = process.env.NEXT_PUBLIC_IPFS_BUILD === "true";
+
+if (isIpfs) {
+  nextConfig.output = "export";
+  nextConfig.trailingSlash = true;
+  nextConfig.images = {
+    unoptimized: true,
+  };
+}
+
 module.exports = nextConfig;

packages/nextjs/package.json

@@ -12,6 +12,8 @@
     "start": "next dev",
     "vercel": "vercel --build-env YARN_ENABLE_IMMUTABLE_INSTALLS=false --build-env ENABLE_EXPERIMENTAL_COREPACK=1 --build-env VERCEL_TELEMETRY_DISABLED=1",
     "vercel:yolo": "vercel --build-env YARN_ENABLE_IMMUTABLE_INSTALLS=false --build-env ENABLE_EXPERIMENTAL_COREPACK=1 --build-env NEXT_PUBLIC_IGNORE_BUILD_ERROR=true --build-env VERCEL_TELEMETRY_DISABLED=1",
+    "ipfs:init": "bgipfs upload config init -u https://www.bgipfs.com/api/ipfs-proxy",
+    "ipfs": "NEXT_PUBLIC_IPFS_BUILD=true yarn build && yarn bgipfs upload out && echo '🚀 Upload complete! Your site is now available at: https://gateway.bgipfs.com/ipfs/${cid}'",
     "vercel:login": "vercel login"
   },
   "dependencies": {
@@ -23,6 +25,7 @@
     "blo": "^1.2.0",
     "burner-connector": "0.0.9",
     "daisyui": "4.12.10",
+    "kubo-rpc-client": "^5.0.2",
     "next": "^14.2.11",
     "next-nprogress-bar": "^2.3.13",
     "next-themes": "^0.3.0",
@@ -42,6 +45,7 @@
     "@types/react": "^18.3.5",
     "abitype": "1.0.6",
     "autoprefixer": "^10.4.20",
+    "bgipfs": "^0.0.4",
     "eslint": "^8.57.1",
     "eslint-config-next": "^14.2.15",
     "eslint-config-prettier": "^8.10.0",
@@ -54,4 +58,4 @@
     "vercel": "^39.1.3"
   },
   "packageManager": "[email protected]"
-}
+}

packages/nextjs/scripts/deploy-ipfs.mjs

@@ -0,0 +1,64 @@
+import { create } from "kubo-rpc-client";
+import { globSource } from "kubo-rpc-client";
+import { dirname, join } from "path";
+import { fileURLToPath } from "url";
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = dirname(__filename);
+
+const ipfsConfig = {
+  host: "ipfs.nifty.ink",
+  port: 3001,
+  protocol: "https",
+  timeout: 250000,
+};
+
+async function addDirectoryToIpfs(path) {
+  console.log("📦 Adding directory to IPFS via Nifty Ink...");
+
+  try {
+    const ipfs = create(ipfsConfig);
+
+    // Track the root directory CID
+    let rootCid = null;
+
+    // Add the entire directory to IPFS
+    for await (const result of ipfs.addAll(globSource(path, "**/*"), {
+      pin: true,
+      wrapWithDirectory: true, // This is key - it wraps all files in a directory
+    })) {
+      if (result.path === "") {
+        // This is the root directory entry
+        rootCid = result.cid;
+      } else {
+        console.log(`Added ${result.path} - CID: ${result.cid}`);
+      }
+    }
+
+    if (!rootCid) {
+      throw new Error("Failed to get root directory CID");
+    }
+
+    return rootCid.toString();
+  } catch (error) {
+    console.error("Error adding directory to IPFS:", error);
+    throw error;
+  }
+}
+
+async function main() {
+  // Get the path to the out directory
+  const outDir = join(__dirname, "..", "out");
+
+  console.log("🚀 Uploading to Nifty Ink IPFS...");
+  const cid = await addDirectoryToIpfs(outDir);
+
+  console.log("\n✨ Upload complete! Your site is now available at:");
+  console.log(`🔗 Nifty Ink Gateway: https://gateway.nifty.ink:42069/ipfs/${cid}`);
+  console.log("\n💡 Note: Your content is being served through the Nifty Ink IPFS gateway");
+}
+
+main().catch(err => {
+  console.error("Error uploading to IPFS:", err);
+  process.exit(1);
+});