feat: replace ipfs with pinata

.env.sample

@@ -1,3 +1,4 @@
 PINATA_API_SECRET=""
 PINATA_API_KEY=""
-PINATA_GATEWAY=""
+PINATA_GATEWAY=""
+PINATA_GATEWAY_KEY=""

readme.md

@@ -5,7 +5,9 @@ TLSN Explorer is server that will handle the social discovery and visualization
 ## Set up .env
 1. `cp .env.sample .env`
 2. Create an API key in [Pinata.cloud](https://docs.pinata.cloud/quickstart/node-js#generate-your-api-keys)
-3. Update `PINATA_JWT` in your `.env` file
+3. Create a new Gateway in [Pinata.cloud](https://app.pinata.cloud/gateway)
+4. Create a new Gateway access token in [Pinata.cloud](https://app.pinata.cloud/developers/gateway-settings)
+5. Update your `.env` file
 
 ## Development
 ```bash

server/index.ts

@@ -32,7 +32,7 @@ app.post('/api/upload', async (req, res) => {
     // @ts-ignore
     const data = file.data;
     const cid = await addBytes(data);
-    res.send(cid);
+    res.json(cid);
     return;
   }
 
@@ -42,6 +42,7 @@ app.post('/api/upload', async (req, res) => {
 app.get('/gateway/ipfs/:cid', async (req, res) => {
   const cid = req.params.cid;
   const file = await getCID(req.params.cid);
+  console.log(file);
   const readStream = new stream.PassThrough();
   readStream.end(Buffer.from(file));
   res.set('Content-Type', 'application/octet-stream');

server/services/ipfs.ts

@@ -20,6 +20,12 @@ export async function addBytes(file: Buffer) {
 }
 
 export async function getCID(hash: string) {
-  const res = await fetch(process.env.PINATA_GATEWAY + '/' + hash);
+  console.log(process.env.PINATA_GATEWAY + '/' + hash);
+  const res = await fetch(process.env.PINATA_GATEWAY + '/ipfs/' + hash, {
+    headers: {
+      'x-pinata-gateway-token': process.env.PINATA_GATEWAY_KEY!,
+    }
+  });
+
   return res.text();
 }

web/components/ProofDetails/index.tsx

@@ -60,7 +60,9 @@ const ProofDetails: React.FC<ProofDetailsProps> = ({proof, cid, file}): ReactEle
   };
 
   const proofToDisplay = selectedProof?.proof || proof;
-  const inputValue = process.env.NODE_ENV === "development" ? `http://localhost:3000/${selectedProof?.ipfsCID ? selectedProof?.ipfsCID : cid}` : `www.tlsnexplorer.com/${selectedProof?.ipfsCID ? selectedProof?.ipfsCID : cid}`;
+  const inputValue = process.env.NODE_ENV === "development"
+    ? `http://localhost:3000/${selectedProof?.ipfsCID ? selectedProof?.ipfsCID : cid}`
+    : `www.tlsnexplorer.com/${selectedProof?.ipfsCID ? selectedProof?.ipfsCID : cid}`;
 
   // TODO - Format proof details for redacted data
 

web/components/SharedProof/index.tsx

@@ -20,7 +20,7 @@ export default function SharedProof(): ReactElement {
         setErrors('No CID provided');
         return;
       }
-      const response = await fetch(`/ipfs/${cid}`);
+      const response = await fetch(`/gateway/ipfs/${cid}`);
       if (!response.ok) {
         setErrors('Failed to fetch file from IPFS');
         throw new Error('Failed to fetch file from IPFS');
@@ -28,6 +28,7 @@ export default function SharedProof(): ReactElement {
       const data = await response.json();
       try {
         const proof = await verify(data, notaryKey);
+        console.log(data);
         setVerifiedProof(proof);
 
       } catch (e) {

web/store/upload.ts

@@ -11,7 +11,7 @@ export const uploadFileToIpfs = (file: File) => {
     formData.append('file', file);
 
     try {
-      const response = await fetch('/upload', {
+      const response = await fetch('/api/upload', {
         method: 'POST',
         body: formData
       });