Feat: Integrate ipfs storage to org register page

.env.example

@@ -0,0 +1,3 @@
+PINATA_JWT=
+NEXT_PUBLIC_GATEWAY_URL=
+NEXT_PUBLIC_RPC_URL=

package.json

@@ -1,65 +1,66 @@
 {
-    "name": "littlefinger_frontend",
-    "version": "0.1.0",
-    "private": true,
-    "scripts": {
-        "dev": "next dev",
-        "build": "next build",
-        "start": "next start",
-        "lint": "next lint",
-        "format": "npx prettier . --write"
-    },
-    "dependencies": {
-        "@argent/x-shared": "^1.0.0",
-        "@hookform/resolvers": "^5.0.1",
-        "@radix-ui/react-avatar": "^1.1.10",
-        "@radix-ui/react-collapsible": "^1.1.11",
-        "@radix-ui/react-dialog": "^1.1.14",
-        "@radix-ui/react-dropdown-menu": "^2.1.15",
-        "@radix-ui/react-label": "^2.1.7",
-        "@radix-ui/react-popover": "^1.1.14",
-        "@radix-ui/react-progress": "^1.1.7",
-        "@radix-ui/react-select": "^2.2.5",
-        "@radix-ui/react-separator": "^1.1.7",
-        "@radix-ui/react-slot": "^1.2.3",
-        "@radix-ui/react-switch": "^1.2.5",
-        "@radix-ui/react-tabs": "^1.1.12",
-        "@radix-ui/react-toast": "^1.2.14",
-        "@radix-ui/react-tooltip": "^1.2.7",
-        "@starknet-react/chains": "^3.0.0",
-        "@starknet-react/core": "^3.7.4",
-        "@tanstack/react-table": "^8.12.0",
-        "@types/react-blockies": "^1.4.4",
-        "bignumber.js": "^9.1.2",
-        "class-variance-authority": "^0.7.1",
-        "clsx": "^2.1.1",
-        "cmdk": "^0.2.1",
-        "date-fns": "^4.1.0",
-        "lucide-react": "^0.331.0",
-        "next": "14.1.3",
-        "react": "^18",
-        "react-blockies": "^1.4.1",
-        "react-day-picker": "^8.10.1",
-        "react-dom": "^18",
-        "react-hook-form": "^7.56.4",
-        "react-hot-toast": "^2.5.2",
-        "react-icons": "^5.5.0",
-        "sonner": "^2.0.6",
-        "starknet": "^7.6.2",
-        "starknetkit": "^1.1.9",
-        "tailwind-merge": "^2.2.1",
-        "tailwindcss-animate": "^1.0.7"
-    },
-    "devDependencies": {
-        "@types/node": "^20",
-        "@types/react": "^18",
-        "@types/react-dom": "^18",
-        "autoprefixer": "^10.0.1",
-        "eslint-config-next": "14.0.4",
-        "postcss": "^8",
-        "prettier": "^3.3.3",
-        "prettier-plugin-tailwindcss": "^0.6.6",
-        "tailwindcss": "^3.3.0",
-        "typescript": "^5"
-    }
-}
+  "name": "littlefinger_frontend",
+  "version": "0.1.0",
+  "private": true,
+  "scripts": {
+    "dev": "next dev",
+    "build": "next build",
+    "start": "next start",
+    "lint": "next lint",
+    "format": "npx prettier . --write"
+  },
+  "dependencies": {
+    "@argent/x-shared": "^1.0.0",
+    "@hookform/resolvers": "^5.0.1",
+    "@radix-ui/react-avatar": "^1.1.10",
+    "@radix-ui/react-collapsible": "^1.1.11",
+    "@radix-ui/react-dialog": "^1.1.14",
+    "@radix-ui/react-dropdown-menu": "^2.1.15",
+    "@radix-ui/react-label": "^2.1.7",
+    "@radix-ui/react-popover": "^1.1.14",
+    "@radix-ui/react-progress": "^1.1.7",
+    "@radix-ui/react-select": "^2.2.5",
+    "@radix-ui/react-separator": "^1.1.7",
+    "@radix-ui/react-slot": "^1.2.3",
+    "@radix-ui/react-switch": "^1.2.5",
+    "@radix-ui/react-tabs": "^1.1.12",
+    "@radix-ui/react-toast": "^1.2.14",
+    "@radix-ui/react-tooltip": "^1.2.7",
+    "@starknet-react/chains": "^3.0.0",
+    "@starknet-react/core": "^3.7.4",
+    "@tanstack/react-table": "^8.12.0",
+    "@types/react-blockies": "^1.4.4",
+    "bignumber.js": "^9.1.2",
+    "class-variance-authority": "^0.7.1",
+    "clsx": "^2.1.1",
+    "cmdk": "^0.2.1",
+    "date-fns": "^4.1.0",
+    "lucide-react": "^0.331.0",
+    "next": "14.1.3",
+    "pinata": "^2.4.9",
+    "react": "^18",
+    "react-blockies": "^1.4.1",
+    "react-day-picker": "^8.10.1",
+    "react-dom": "^18",
+    "react-hook-form": "^7.56.4",
+    "react-hot-toast": "^2.5.2",
+    "react-icons": "^5.5.0",
+    "sonner": "^2.0.6",
+    "starknet": "^7.6.2",
+    "starknetkit": "^1.1.9",
+    "tailwind-merge": "^2.2.1",
+    "tailwindcss-animate": "^1.0.7"
+  },
+  "devDependencies": {
+    "@types/node": "^20",
+    "@types/react": "^18",
+    "@types/react-dom": "^18",
+    "autoprefixer": "^10.0.1",
+    "eslint-config-next": "14.0.4",
+    "postcss": "^8",
+    "prettier": "^3.3.3",
+    "prettier-plugin-tailwindcss": "^0.6.6",
+    "tailwindcss": "^3.3.0",
+    "typescript": "^5"
+  }
+}

src/app/api/pinata-url/route.ts

@@ -0,0 +1,16 @@
+import { NextResponse } from "next/server";
+import { pinata } from "@/utils/pinata-config"
+
+export const dynamic = "force-dynamic";
+
+export async function GET() {
+  try {
+    const url = await pinata.upload.public.createSignedURL({
+      expires: 30, // URL expires in 30 seconds
+    })
+    return NextResponse.json({ url: url }, { status: 200 });
+  } catch (error) {
+    console.log("Error creating signed URL:", error);
+    return NextResponse.json({ error: "Error creating upload URL" }, { status: 500 });
+  }
+} 

src/app/api/upload-file/route.ts

@@ -0,0 +1,60 @@
+import { NextResponse, type NextRequest } from "next/server";
+import { pinata } from "@/utils/pinata-config";
+
+export const dynamic = "force-dynamic";
+
+export async function POST(request: NextRequest) {
+  try {
+    const data = await request.formData();
+    const file: File | null = data.get("file") as unknown as File;
+
+    if (!file) {
+      return NextResponse.json({ error: "No file provided" }, { status: 400 });
+    }
+
+    // Validate file type
+    const allowedTypes = ["image/jpeg", "image/png", "image/jpg"];
+    if (!allowedTypes.includes(file.type)) {
+      return NextResponse.json(
+        { error: "Please select a valid image file (JPEG, JPG, or PNG)" },
+        { status: 400 }
+      );
+    }
+
+    // Validate file size (5MB limit)
+    const maxSize = 5 * 1024 * 1024; // 5MB in bytes
+    if (file.size > maxSize) {
+      return NextResponse.json(
+        { error: "File size must be less than 5MB" },
+        { status: 400 }
+      );
+    }
+
+    // Upload to Pinata
+    const { cid } = await pinata.upload.public.file(file);
+    const url = await pinata.gateways.public.convert(cid);
+
+    // Return the IPFS URI
+    const ipfsUri = `ipfs://${cid}`;
+
+    return NextResponse.json({
+      success: true,
+      cid: cid,
+      uri: ipfsUri,
+      url: url,
+      fileName: file.name,
+      fileSize: file.size,
+      fileType: file.type,
+    });
+
+  } catch (error) {
+    console.error("File upload error:", error);
+    return NextResponse.json(
+      {
+        error: "Upload failed",
+        details: error instanceof Error ? error.message : String(error),
+      },
+      { status: 500 }
+    );
+  }
+}