From b85feb47c43d1ff2c6a57d1492b27b6031a1eb9b Mon Sep 17 00:00:00 2001 From: Matthias Kretschmann Date: Thu, 24 Oct 2019 13:46:06 +0200 Subject: [PATCH] IPFS fixes * disable progress for now * stream files when adding --- package-lock.json | 38 +++++++++++++++++++------------------- package.json | 10 +++++----- src/components/Add.tsx | 4 ++-- src/utils.ts | 34 ++++++++++++++++++++++------------ 4 files changed, 48 insertions(+), 38 deletions(-) diff --git a/package-lock.json b/package-lock.json index db5b3dd..782fb62 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1106,9 +1106,9 @@ } }, "@types/node": { - "version": "12.11.2", - "resolved": "https://registry.npmjs.org/@types/node/-/node-12.11.2.tgz", - "integrity": "sha512-dsfE4BHJkLQW+reOS6b17xhZ/6FB1rB8eRRvO08nn5o+voxf3i74tuyFWNH6djdfgX7Sm5s6LD8t6mJug4dpDw==", + "version": "12.11.6", + "resolved": "https://registry.npmjs.org/@types/node/-/node-12.11.6.tgz", + "integrity": "sha512-4uPUyY1Aofo1YzoypalYHNd2SnKYxH2b6LzXwpryZCJKA2XlagZSynXx5C8sfPH0r1cSltUpaVHV2q5sYXschQ==", "dev": true }, "@types/prop-types": { @@ -5514,9 +5514,9 @@ } }, "ipfs-http-client": { - "version": "39.0.1", - "resolved": "https://registry.npmjs.org/ipfs-http-client/-/ipfs-http-client-39.0.1.tgz", - "integrity": "sha512-+/nBgfPzyjUFbvvuQoz07hQtu/a5/sSloqvbIYwWhNKiWDYCXd14+n0QZCzckXHwgk6omB5KMiaiHW8wXixRdg==", + "version": "39.0.2", + "resolved": "https://registry.npmjs.org/ipfs-http-client/-/ipfs-http-client-39.0.2.tgz", + "integrity": "sha512-logfyeSMD2XJCqhKv8hVnSOb/NH2KDECoLeAkwIjWMYK9Yd7eqci0ZDLP4qed0wZ91GFJ09qgCO+6J8ApKrAaQ==", "requires": { "abort-controller": "^3.0.0", "async": "^2.6.1", @@ -7228,9 +7228,9 @@ } }, "next-seo": { - "version": "2.2.0", - "resolved": "https://registry.npmjs.org/next-seo/-/next-seo-2.2.0.tgz", - "integrity": "sha512-wV0itPQBetnifEvs32y2tEuYytBR7Gg+TuIEHrfZEahXUBJVTYUlQvLiA3Sz87V981odQ9eGKFAhrQWFFKYdqg==" + "version": "2.2.1", + "resolved": "https://registry.npmjs.org/next-seo/-/next-seo-2.2.1.tgz", + "integrity": "sha512-q7mz7Jbm+7EFV9FSwDKFj6VKhHNIt13l9wTn7tKSzhwaTP3CAuMciQzyNY5WVEk+I0QUzBl0y7fn1XNTaDqfRg==" }, "next-svgr": { "version": "0.0.2", @@ -9175,9 +9175,9 @@ } }, "react": { - "version": "16.10.2", - "resolved": "https://registry.npmjs.org/react/-/react-16.10.2.tgz", - "integrity": "sha512-MFVIq0DpIhrHFyqLU0S3+4dIcBhhOvBE8bJ/5kHPVOVaGdo0KuiQzpcjCPsf585WvhypqtrMILyoE2th6dT+Lw==", + "version": "16.11.0", + "resolved": "https://registry.npmjs.org/react/-/react-16.11.0.tgz", + "integrity": "sha512-M5Y8yITaLmU0ynd0r1Yvfq98Rmll6q8AxaEe88c8e7LxO8fZ2cNgmFt0aGAS9wzf1Ao32NKXtCl+/tVVtkxq6g==", "requires": { "loose-envify": "^1.1.0", "object-assign": "^4.1.1", @@ -9185,14 +9185,14 @@ } }, "react-dom": { - "version": "16.10.2", - "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-16.10.2.tgz", - "integrity": "sha512-kWGDcH3ItJK4+6Pl9DZB16BXYAZyrYQItU4OMy0jAkv5aNqc+mAKb4TpFtAteI6TJZu+9ZlNhaeNQSVQDHJzkw==", + "version": "16.11.0", + "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-16.11.0.tgz", + "integrity": "sha512-nrRyIUE1e7j8PaXSPtyRKtz+2y9ubW/ghNgqKFHHAHaeP0fpF5uXR+sq8IMRHC+ZUxw7W9NyCDTBtwWxvkb0iA==", "requires": { "loose-envify": "^1.1.0", "object-assign": "^4.1.1", "prop-types": "^15.6.2", - "scheduler": "^0.16.2" + "scheduler": "^0.17.0" } }, "react-dropzone": { @@ -9578,9 +9578,9 @@ "integrity": "sha512-NqVDv9TpANUjFm0N8uM5GxL36UgKi9/atZw+x7YFnQ8ckwFGKrl4xX4yWtrey3UJm5nP1kUbnYgLopqWNSRhWw==" }, "scheduler": { - "version": "0.16.2", - "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.16.2.tgz", - "integrity": "sha512-BqYVWqwz6s1wZMhjFvLfVR5WXP7ZY32M/wYPo04CcuPM7XZEbV2TBNW7Z0UkguPTl0dWMA59VbNXxK6q+pHItg==", + "version": "0.17.0", + "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.17.0.tgz", + "integrity": "sha512-7rro8Io3tnCPuY4la/NuI5F2yfESpnfZyT6TtkXnSWVkcu0BCDJ+8gk5ozUaFaxpIyNuWAPXrH0yFcSi28fnDA==", "requires": { "loose-envify": "^1.1.0", "object-assign": "^4.1.1" diff --git a/package.json b/package.json index daf7739..8d4e12b 100644 --- a/package.json +++ b/package.json @@ -18,17 +18,17 @@ "@oceanprotocol/typographies": "^0.1.0", "@zeit/next-css": "^1.0.1", "axios": "^0.19.0", - "ipfs-http-client": "^39.0.1", + "ipfs-http-client": "^39.0.2", "next": "9.1.1", - "next-seo": "^2.2.0", + "next-seo": "^2.2.1", "next-svgr": "^0.0.2", - "react": "^16.10.2", - "react-dom": "^16.10.2", + "react": "^16.11.0", + "react-dom": "^16.11.0", "react-dropzone": "^10.1.10" }, "devDependencies": { "@types/next-seo": "^1.10.0", - "@types/node": "^12.11.2", + "@types/node": "^12.11.6", "@types/react": "^16.9.9", "@typescript-eslint/eslint-plugin": "^2.5.0", "@typescript-eslint/parser": "^2.5.0", diff --git a/src/components/Add.tsx b/src/components/Add.tsx index d53bda1..6f97003 100644 --- a/src/components/Add.tsx +++ b/src/components/Add.tsx @@ -21,7 +21,7 @@ export default function Add() { const [message, setMessage] = useState() const [error, setError] = useState() const [fileSize, setFileSize] = useState() - const [fileSizeReceived, setFileSizeReceived] = useState('') + const [fileSizeReceived] = useState('') useEffect(() => { setMessage( @@ -40,7 +40,7 @@ export default function Add() { setFileSize(totalSize) try { - const cid = await addToIpfs(acceptedFiles, setFileSizeReceived, ipfs) + const cid = await addToIpfs(acceptedFiles, ipfs) if (!cid) return setFileHash(cid) setLoading(false) diff --git a/src/utils.ts b/src/utils.ts index 3a83bf5..3eab321 100644 --- a/src/utils.ts +++ b/src/utils.ts @@ -9,21 +9,31 @@ export function formatBytes(a: number, b: number) { return parseFloat((a / Math.pow(c, f)).toFixed(d)) + ' ' + e[f] } -export async function addToIpfs( - files: File[], - setFileSizeReceived: (size: string) => void, - ipfs: any -) { +const streamFiles = (ipfs: any, file: any) => + new Promise((resolve, reject) => { + const stream = ipfs.addReadableStream({ + wrapWithDirectory: true + // progress: (length: number) => setFileSizeReceived(formatBytes(length, 0)) + }) + + stream.on('data', (data: any) => { + console.log(`Added ${data.path} hash: ${data.hash}`) + + // The last data event will contain the directory hash + if (data.path === '') resolve(data.hash) + }) + + stream.on('error', reject) + stream.write(file) + stream.end() + }) + +export async function addToIpfs(files: File[], ipfs: any) { const file = [...files][0] const fileDetails = { path: file.name, content: file } - const response = await ipfs.add(fileDetails, { - wrapWithDirectory: true, - progress: (length: number) => setFileSizeReceived(formatBytes(length, 0)) - }) - - // CID of wrapping directory is returned last - const cid = `${response[response.length - 1].hash}/${file.name}` + const directoryCid = await streamFiles(ipfs, fileDetails) + const cid = `${directoryCid}/${file.name}` return cid }