Merge pull request #340 from kleros/chore/upload-to-ipfs-function-point-to-court-functions

chore: point-upload-to-ipfs-function-to-court-function

Author: kemuru

.env.example

@@ -5,6 +5,7 @@ REACT_APP_METAMASK_SITE_URL=https://metamask.io
 REACT_APP_TRUST_SITE_URL=https://trustwallet.com
 REACT_APP_DEFAULT_NETWORK=1
 REACT_APP_REJECT_ALL_POLICY_URI="/ipfs/QmZ7RVU7re1g8nXDbAFMHV99pyie3dn4cY7Ga2X4h8mDpV/reject-all-policy.pdf"
+REACT_APP_COURT_FUNCTIONS_URL=https://kleros-api.netlify.app
 
 # All fields below this line are optional -------------
 

netlify.toml

@@ -5,14 +5,14 @@
 [build.environment]
   NODE_VERSION='16.20.2'
   REACT_APP_IPFS_GATEWAY="https://cdn.kleros.link"
-  REACT_APP_HOSTED_GRAPH_IPFS_ENDPOINT="https://api.thegraph.com/ipfs"
   REACT_APP_DEFAULT_NETWORK="1"
 
   REACT_APP_REJECT_ALL_POLICY_URI='/ipfs/QmZ7RVU7re1g8nXDbAFMHV99pyie3dn4cY7Ga2X4h8mDpV/reject-all-policy.pdf'
   REACT_APP_METAMASK_SITE_URL='https://metamask.io'
   REACT_APP_TRUST_SITE_URL='https://trustwallet.com'
   REACT_APP_WALLETCONNECT_BRIDGE_URL='https://bridge.walletconnect.org'
   REACT_APP_INSTRUCTION_VIDEO='https://www.youtube.com/embed/DKPVWzhh8Y8'
+  REACT_APP_COURT_FUNCTIONS_URL='https://kleros-api.netlify.app'
 
 [[redirects]]
   from = "/*"

netlify/functions/uploadToIPFS.ts

@@ -15,7 +15,6 @@
   },
   "dependencies": {
     "@apollo/client": "^3.4.8",
-    "@filebase/client": "^0.0.5",
     "@fortawesome/fontawesome-svg-core": "^1.2.25",
     "@fortawesome/free-brands-svg-icons": "^5.9.0",
     "@fortawesome/free-solid-svg-icons": "^5.11.2",
@@ -28,11 +27,9 @@
     "@loadable/component": "^5.10.1",
     "@walletconnect/qrcode-modal": "^1.0.0-beta.35",
     "@walletconnect/web3-subprovider": "^1.0.0-beta.35",
-    "amqplib": "^0.10.3",
     "antd": "^3.20.1",
     "bn.js": "^5.0.0",
     "body-scroll-lock": "^3.0.2",
-    "busboy": "^1.6.0",
     "cross-fetch": "^4.0.0",
     "ethers": "^4.0.33",
     "fast-deep-equal": "^3.1.3",
@@ -67,9 +64,6 @@
     "@babel/helper-define-map": "^7.15.4",
     "@commitlint/cli": "^8.0.0",
     "@commitlint/config-conventional": "^8.0.0",
-    "@netlify/functions": "^1.6.0",
-    "@types/amqplib": "^0.10.4",
-    "@types/busboy": "^1.5.3",
     "@types/humanize-duration": "^3.27.1",
     "@types/loadable__component": "^5.13.4",
     "@types/mime": "^3.0.0",

package.json

@@ -3,4 +3,12 @@ export interface IPFSResultObject {
 }
 
 export const getIPFSPath = (ipfsResultObject: IPFSResultObject): string =>
-  `/ipfs/${ipfsResultObject.cids[0].split('ipfs://')[1]}`
+  getFormattedPath(ipfsResultObject.cids[0])
+
+/**
+ *
+ * @param url an ipfs cid
+ * @returns formats an ipfs cid to be in /ipfs/hash format, reolaces ipfs://, ipfs/, with /ipfs/
+ */
+export const getFormattedPath = (url: string) =>
+  url.replace(/^(ipfs:\/\/|ipfs\/?)/, '/ipfs/')

src/utils/get-ipfs-path.ts

@@ -1,4 +1,3 @@
-import deepEqual from 'fast-deep-equal/es6'
 import { uploadFormDataToIPFS } from './upload-form-data-to-ipfs'
 
 const mirroredExtensions = ['.json']
@@ -19,102 +18,18 @@ export default async function ipfsPublish(fileName, data) {
   fileFormData.append('data', blobFile, fileName)
 
   if (!mirroredExtensions.some(ext => fileName.endsWith(ext))) {
-    const klerosResult = await uploadFormDataToIPFS(fileFormData)
-    const klerosResultJSON = await klerosResult.json()
-    return klerosResultJSON
+    const result = await uploadFormDataToIPFS(fileFormData)
+    return result
   }
 
-  const [klerosResult, theGraphResult] = await Promise.all([
-    uploadFormDataToIPFS(fileFormData),
-    publishToTheGraphNode(fileName, data)
-  ])
+  const result = await uploadFormDataToIPFS(fileFormData, 'file', true)
 
-  const klerosResultJSON = await klerosResult.json()
-  const klerosHash = klerosResultJSON.cids[0].split('ipfs://')[1].split('/')[0]
-
-  const normalizedKlerosResult = {
-    hash: klerosHash
-  }
-
-  const normalizedTheGraphResult = {
-    hash: theGraphResult[1].hash
-  }
-
-  if (!deepEqual(normalizedKlerosResult, normalizedTheGraphResult)) {
+  if (result.inconsistentCids.length > 0) {
     console.warn('IPFS upload result is different:', {
-      kleros: normalizedKlerosResult,
-      theGraph: normalizedTheGraphResult
+      inconsistentCids: result.inconsistentCids
     })
     throw new Error('IPFS upload result is different.')
   }
 
-  return klerosResultJSON
-}
-
-/**
- * Send file to IPFS network via The Graph hosted IPFS node
- * @param {string} fileName - The name that will be used to store the file. This is useful to preserve extension type.
- * @param {ArrayBuffer} data - The raw data from the file to upload.
- * @returns {object} ipfs response. Should include the hash and path of the stored item.
- */
-async function publishToTheGraphNode(fileName, data) {
-  const url = `${process.env.REACT_APP_HOSTED_GRAPH_IPFS_ENDPOINT}/api/v0/add?wrap-with-directory=true`
-
-  const payload = new FormData()
-  payload.append('file', new Blob([data]), fileName)
-
-  const response = await fetch(url, {
-    method: 'POST',
-    body: payload
-  })
-
-  const result = await jsonStreamToPromise(response.body)
-
-  return result.map(({ Name, Hash }) => ({
-    hash: Hash,
-    path: `/${Name}`
-  }))
-}
-
-/**
- * Accumulates a JSON stream body into an array of JSON objects.
- * @param {ReadableStream} stream The stream to read from.
- * @returns {Promise<any>} An array of all JSON objects emitted by the stream.
- */
-async function jsonStreamToPromise(stream) {
-  const reader = stream.getReader()
-  const decoder = new TextDecoder('utf-8')
-
-  const deferred = {
-    resolve: undefined,
-    reject: undefined
-  }
-
-  const result = new Promise((resolve, reject) => {
-    deferred.resolve = resolve
-    deferred.reject = reject
-  })
-
-  const acc = []
-  const start = async () => {
-    reader
-      .read()
-      .then(({ done, value }) => {
-        if (done) return deferred.resolve(acc)
-
-        // Each `read` can produce one or more lines...
-        const lines = decoder.decode(value).split(/\n/)
-        const objects = lines
-          .filter(line => line.trim() !== '')
-          .map(line => JSON.parse(line))
-        acc.push(...objects)
-
-        return start()
-      })
-      .catch(err => deferred.reject(err))
-  }
-
-  start()
-
   return result
 }

src/utils/ipfs-publish.js

@@ -1,21 +1,23 @@
 import { fetch } from 'cross-fetch'
 
-export function uploadFormDataToIPFS(
+export async function uploadFormDataToIPFS(
   formData: FormData,
-  operation: string = 'evidence'
+  operation: string = 'evidence',
+  pinToGraph = false
 ): Promise<Response> {
-  const url = `/.netlify/functions/uploadToIPFS?dapp=curate&key=curate-v1&operation=${operation}`
+  const url = `${process.env.REACT_APP_COURT_FUNCTIONS_URL}/.netlify/functions/upload-to-ipfs?operation=${operation}&pinToGraph=${pinToGraph}`
 
-  return fetch(url, {
+  const response = await fetch(url, {
     method: 'POST',
     body: formData
-  }).then(async response => {
-    if (response.status !== 200) {
-      const error = await response
-        .json()
-        .catch(() => ({ message: 'Error uploading to IPFS' }))
-      throw new Error(error.message)
-    }
-    return response
   })
+
+  if (response.status !== 200) {
+    const error = await response
+      .json()
+      .catch(() => ({ message: 'Error uploading to IPFS' }))
+    throw new Error(error.message)
+  }
+  const data = await response.json()
+  return data
 }