feat: ipfs-http-client -> kubo-rpc-client

package.json

@@ -58,22 +58,22 @@
     "i18next-browser-languagedetector": "^6.1.3",
     "i18next-chained-backend": "^3.0.2",
     "i18next-http-backend": "^1.3.2",
-    "i18next-icu": "^2.0.3",
+    "i18next-icu": "2.0.3",
     "i18next-localstorage-backend": "^3.1.3",
     "internal-nav-helper": "^3.1.0",
-    "intl-messageformat": "^9.11.3",
+    "intl-messageformat": "9.12.0",
     "ip": "^1.1.5",
     "ipfs-css": "^1.4.0",
     "ipfs-geoip": "9.0.1",
-    "ipfs-http-client": "^49.0.2",
     "ipfs-provider": "^2.1.0",
-    "ipld-explorer-components": "^2.4.1",
+    "ipld-explorer-components": "^3.0.3",
     "is-ipfs": "^3.0.0",
     "istextorbinary": "^6.0.0",
     "it-all": "^1.0.5",
     "it-first": "^1.0.6",
     "it-last": "^1.0.5",
     "it-map": "^1.0.5",
+    "kubo-rpc-client": "^3.0.0",
     "milliseconds": "^1.0.3",
     "money-clip": "^3.0.5",
     "multiaddr": "^8.1.2",
@@ -173,7 +173,7 @@
     "esm": "^3.2.25",
     "fake-indexeddb": "^3.1.8",
     "get-port": "^5.1.1",
-    "go-ipfs": "0.16.0",
+    "go-ipfs": "^0.18.1",
     "http-proxy": "^1.18.1",
     "http-server": "^0.12.3",
     "ipfs": "0.58.3",
@@ -187,6 +187,7 @@
     "os-browserify": "^0.3.0",
     "patch-package": "^6.4.7",
     "path-browserify": "^1.0.1",
+    "peer-id": "^0.16.0",
     "playwright-chromium": "^1.27.1",
     "postcss-flexbugs-fixes": "^5.0.2",
     "run-script-os": "^1.1.6",

patches/ipld-explorer-components+3.0.3.patch

@@ -0,0 +1,117 @@
+diff --git a/node_modules/ipld-explorer-components/dist/bundles/explore.js b/node_modules/ipld-explorer-components/dist/bundles/explore.js
+index 123bc7f..b5b4fe4 100644
+--- a/node_modules/ipld-explorer-components/dist/bundles/explore.js
++++ b/node_modules/ipld-explorer-components/dist/bundles/explore.js
+@@ -388,6 +388,8 @@ function getIpld() {
+
+ function _getIpld() {
+   _getIpld = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee3() {
++    var _ipldEthereum$default;
++
+     var ipldDeps, _ipldDeps$map, _ipldDeps$map2, ipld, formats, ipldEthereum, ipldJson;
+
+     return regeneratorRuntime.wrap(function _callee3$(_context4) {
+@@ -405,34 +407,48 @@ function _getIpld() {
+             /* webpackChunkName: "ipld" */
+             'ipld-git'), import(
+             /* webpackChunkName: "ipld" */
+-            'ipld-raw'), import(
+-            /* webpackChunkName: "ipld" */
+-            'ipld-ethereum')]);
++            'ipld-raw')]);
+
+           case 2:
+             ipldDeps = _context4.sent;
+             // CommonJs exports object is .default when imported ESM style
+             _ipldDeps$map = ipldDeps.map(function (mod) {
+-              return mod["default"];
++              var _mod$default;
++
++              var actualModule = (_mod$default = mod["default"]) !== null && _mod$default !== void 0 ? _mod$default : mod;
++
++              if (actualModule.name != null && actualModule.code != null && actualModule.codec == null) {
++                // fix throw new Error(`Resolver already exists for codec "${codecName}"`) from ipld when `codecName` is undefined
++                actualModule.codec = actualModule.code;
++              }
++
++              return actualModule;
+             }), _ipldDeps$map2 = _toArray(_ipldDeps$map), ipld = _ipldDeps$map2[0], formats = _ipldDeps$map2.slice(1); // ipldEthereum is an Object, each key points to a ipld format impl
+
+-            ipldEthereum = formats.pop();
+-            formats.push.apply(formats, _toConsumableArray(Object.values(ipldEthereum))); // ipldJson uses the new format, use the conversion tool
++            _context4.next = 6;
++            return import(
++            /* webpackChunkName: "ipld" */
++            'ipld-ethereum');
++
++          case 6:
++            ipldEthereum = _context4.sent;
++            formats.push.apply(formats, _toConsumableArray(Object.values((_ipldEthereum$default = ipldEthereum["default"]) !== null && _ipldEthereum$default !== void 0 ? _ipldEthereum$default : ipldEthereum))); // ipldJson uses the new format, use the conversion tool
+
+-            _context4.next = 8;
++            _context4.next = 10;
+             return import(
+             /* webpackChunkName: "ipld" */
+             '@ipld/dag-json');
+
+-          case 8:
++          case 10:
+             ipldJson = _context4.sent;
+             formats.push(convert(ipldJson));
++            console.log('formats: ', formats);
+             return _context4.abrupt("return", {
+               ipld: ipld,
+               formats: formats
+             });
+
+-          case 11:
++          case 14:
+           case "end":
+             return _context4.stop();
+         }
+diff --git a/node_modules/ipld-explorer-components/dist/components/object-info/ObjectInfo.js b/node_modules/ipld-explorer-components/dist/components/object-info/ObjectInfo.js
+index c4bcf4e..cd8112e 100644
+--- a/node_modules/ipld-explorer-components/dist/components/object-info/ObjectInfo.js
++++ b/node_modules/ipld-explorer-components/dist/components/object-info/ObjectInfo.js
+@@ -15,6 +15,7 @@ import { withTranslation } from 'react-i18next';
+ import { ObjectInspector, chromeLight } from '@tableflip/react-inspector';
+ import filesize from 'filesize';
+ import LinksTable from './LinksTable';
++import multicodec from 'multicodec';
+ var humansize = filesize.partial({
+   round: 0
+ });
+@@ -77,16 +78,30 @@ var nodeStyles = {
+     color: '#383838'
+   }
+ };
++/**
++ * Support getting the style object for a node type using the codec number by redirecting the number to the name
++ */
++
++var nodeStylesProxy = new Proxy(nodeStyles, {
++  get: function get(target, prop) {
++    if (isNaN(prop)) {
++      return target[prop];
++    }
++
++    console.log("getting codec name from code number for ".concat(prop, ": "), multicodec.getNameFromCode(prop));
++    return target[multicodec.getNameFromCode(prop)];
++  }
++});
+ export function shortNameForNode(type) {
+-  var style = nodeStyles[type];
++  var style = nodeStylesProxy[type];
+   return style && style.shortName || 'DAG';
+ }
+ export function nameForNode(type) {
+-  var style = nodeStyles[type];
++  var style = nodeStylesProxy[type];
+   return style && style.name || 'DAG Node';
+ }
+ export function colorForNode(type) {
+-  var style = nodeStyles[type];
++  var style = nodeStylesProxy[type];
+   return style && style.color || '#ea5037';
+ } // '/a/b' => ['$', '$.a', '$.a.b']
+ // See: https://github.com/xyc/react-inspector#api

patches/kubo-rpc-client+3.0.0.patch

@@ -0,0 +1,13 @@
+diff --git a/node_modules/kubo-rpc-client/src/key/gen.js b/node_modules/kubo-rpc-client/src/key/gen.js
+index 18eaf08..1859a95 100644
+--- a/node_modules/kubo-rpc-client/src/key/gen.js
++++ b/node_modules/kubo-rpc-client/src/key/gen.js
+@@ -4,7 +4,7 @@ import { toUrlSearchParams } from '../lib/to-url-search-params.js'
+
+ /** @type {import('ipfs-core-types/src/key').GenOptions} */
+ const defaultOptions = {
+-  type: 'Ed25519'
++  type: 'ed25519'
+ }
+
+ export const createGen = configure(api => {

src/bundles/identity.test.js

@@ -31,7 +31,7 @@ describe.skip('identity.js', function () {
     beforeAll(async () => {
       // const kuboRpcModule = await import('kubo-rpc-client')
       // console.log('kuboRpcModule: ', kuboRpcModule)
-      const ipfsHttpModule = await import('ipfs-http-client')
+      const kuboRpcModule = await import('kubo-rpc-client')
       const { createController } = await import('ipfsd-ctl')
       const ipfsBin = (await import('go-ipfs')).default.path()
       console.log('ipfsBin: ', ipfsBin)
@@ -44,16 +44,13 @@ describe.skip('identity.js', function () {
         ipfsd = await createController({
           type: 'go',
           ipfsBin,
-          ipfsHttpModule: ipfsHttpModule.default,
-          // kuboRpcModule: kuboRpcModule.default,
+          kuboRpcModule,
           test: true,
           disposable: true
         })
         ipfs = ipfsd.api
       } else {
-        console.log('else')
-        // ipfs = kuboRpcModule(`http://localhost:${KUBO_PORT}`)
-        ipfs = ipfsHttpModule(`http://localhost:${KUBO_PORT}`)
+        ipfs = kuboRpcModule(`http://localhost:${KUBO_PORT}`)
       }
     })
 

src/bundles/ipfs-provider.js

@@ -359,7 +359,7 @@ const actions = {
         }
         */
       }
-      const ipfshttpModule = await import('ipfs-http-client')
+      const kuboRpcModule = await import('kubo-rpc-client')
 
       if (typeof apiAddress === 'string') {
         ipfsOptions = {
@@ -390,7 +390,7 @@ const actions = {
 
           return true
         },
-        loadHttpClientModule: () => ipfshttpModule.default,
+        loadHttpClientModule: () => kuboRpcModule,
         providers: [
           providers.httpClient(ipfsOptions)
         ]

src/components/address/Address.js

@@ -4,10 +4,7 @@ import Multiaddr from 'multiaddr'
 const Address = ({ value }) => {
   if (!value) return null
 
-  // future-proofing interop for multiaddr > 8.x
-  value = value.buffer || value
-
-  const ma = Multiaddr(value)
+  const ma = Multiaddr(value.toString())
   const protos = ma.protoNames().concat(['ipfs', 'p2p'])
   const parts = ma.toString().split('/')
 

src/components/cid/Cid.js

@@ -3,7 +3,7 @@ import { Identicon } from '../identicon/Identicon.js'
 import ErrorBoundary from '../error/ErrorBoundary.js'
 
 export function cidStartAndEnd (value) {
-  const chars = value.split('')
+  const chars = value.toString().split('')
   if (chars.length <= 9) return value
   const start = chars.slice(0, 4).join('')
   const end = chars.slice(chars.length - 4).join('')

src/status/NodeInfo.js

@@ -27,7 +27,7 @@ class NodeInfo extends React.Component {
 
     return (
       <DefinitionList>
-        <Definition term={t('terms.peerId')} desc={this.getField(identity, 'id')} />
+        <Definition term={t('terms.peerId')} desc={this.getField(identity, 'id').toString()} />
         <Definition term={t('terms.agent')} desc={<VersionLink agentVersion={this.getField(identity, 'agentVersion')} />} />
         <Definition term={t('terms.ui')} desc={process.env.REACT_APP_GIT_REV} />
       </DefinitionList>

test/e2e/explore.test.js

@@ -1,7 +1,7 @@
 import { test, expect } from './setup/coverage.js'
 import { readFileSync } from 'fs'
 import { join, dirname } from 'path'
-import ipfsHttpClient from 'ipfs-http-client'
+import * as kuboRpcModule from 'kubo-rpc-client'
 import { fileURLToPath } from 'url'
 const __filename = fileURLToPath(import.meta.url)
 const __dirname = dirname(__filename)
@@ -21,7 +21,7 @@ test.describe('Explore screen', () => {
     // add a local file to repo so test is fast and works in offline mode
     const cid = 'bafkreicgkmwhdunxgdqwqveecdo3wqmgulb4azm6sfnrtvd7g47mnrixji'
     const expectedData = readFileSync(join(__dirname, '../../LICENSE'), 'utf8')
-    const ipfs = ipfsHttpClient(process.env.IPFS_RPC_ADDR)
+    const ipfs = kuboRpcModule.create(process.env.IPFS_RPC_ADDR)
     const result = await ipfs.add(expectedData, { cidVersion: 1 })
     await expect(result.cid.toString()).toStrictEqual(cid)
 

test/e2e/files.test.js

@@ -2,9 +2,7 @@ import { test } from './setup/coverage.js'
 import { fixtureData } from './fixtures/index.js'
 import all from 'it-all'
 import filesize from 'filesize'
-// const ipfsHttpModule = require('ipfs-http-client')
-// import { create as kuboRpcClient } from 'kubo-rpc-client'
-import ipfsHttpModule from 'ipfs-http-client'
+import * as kuboRpcModule from 'kubo-rpc-client'
 
 test.describe('Files screen', () => {
   test.beforeEach(async ({ page }) => {
@@ -45,7 +43,7 @@ test.describe('Files screen', () => {
     await page.waitForSelector('text=file2.txt')
 
     // expect valid CID to be present on the page
-    const ipfs = ipfsHttpModule(process.env.IPFS_RPC_ADDR)
+    const ipfs = kuboRpcModule.create(process.env.IPFS_RPC_ADDR)
     const [result1, result2] = await all(ipfs.addAll([file1.data, file2.data]))
     await page.waitForSelector(`text=${result1.cid.toString()}`)
     await page.waitForSelector(`text=${result2.cid.toString()}`)

test/e2e/ipns.test.js

@@ -1,8 +1,7 @@
 import { test, expect } from './setup/coverage.js'
 import { createController } from 'ipfsd-ctl'
-import ipfsHttpModule from 'ipfs-http-client'
 import { path as getGoIpfsPath } from 'go-ipfs'
-// import { create as kuboRpcClient } from 'kubo-rpc-client'
+import * as kuboRpcModule from 'kubo-rpc-client'
 
 test.describe('IPNS publishing', () => {
   let ipfsd
@@ -13,10 +12,7 @@ test.describe('IPNS publishing', () => {
     ipfsd = await createController({
       type: 'go',
       ipfsBin: getGoIpfsPath(),
-      ipfsHttpModule: {
-        create: ipfsHttpModule
-      },
-      // kuboRpcModule,
+      kuboRpcModule,
       test: true,
       disposable: true
     })
@@ -27,7 +23,7 @@ test.describe('IPNS publishing', () => {
   test.describe('Settings screen', () => {
     let ipfs
     test.beforeEach(async ({ page }) => {
-      ipfs = ipfsHttpModule(process.env.IPFS_RPC_ADDR)
+      ipfs = kuboRpcModule.create(process.env.IPFS_RPC_ADDR)
       await page.goto('/#/settings')
     })
     test('should list IPNS keys', async ({ page }) => {
@@ -77,7 +73,7 @@ test.describe('IPNS publishing', () => {
     let ipfs
     test.beforeEach(async ({ page }) => {
       keyName = 'pet-name-e2e-ipns-test-' + new Date().getTime()
-      ipfs = ipfsHttpModule(process.env.IPFS_RPC_ADDR)
+      ipfs = kuboRpcModule.create(process.env.IPFS_RPC_ADDR)
       await ipfs.key.gen(keyName)
       await page.goto('/#/files')
       await page.reload()

test/e2e/peers.test.js

@@ -1,7 +1,6 @@
 import { test } from './setup/coverage.js'
 import { createController } from 'ipfsd-ctl'
-// import { create as kuboRpcClient } from 'kubo-rpc-client'
-import ipfsHttpModule from 'ipfs-http-client'
+import * as kuboRpcModule from 'kubo-rpc-client'
 import { path as getGoIpfsPath } from 'go-ipfs'
 
 const addConnection = 'text=Add connection'
@@ -14,18 +13,15 @@ test.describe('Peers screen', () => {
     ipfsd = await createController({
       type: 'go',
       ipfsBin: getGoIpfsPath(),
-      ipfsHttpModule: {
-        create: ipfsHttpModule
-      },
-      // kuboRpcModule,
+      kuboRpcModule,
       test: true,
       disposable: true
     })
     const { addresses } = await ipfsd.api.id()
     peeraddr = addresses.find((ma) => ma.toString().startsWith('/ip4/127.0.0.1')).toString()
 
     // connect ipfs-backend used by webui to this new peer to have something  in the peer table
-    const webuiIpfs = ipfsHttpModule(process.env.IPFS_RPC_ADDR)
+    const webuiIpfs = kuboRpcModule.create(process.env.IPFS_RPC_ADDR)
     await webuiIpfs.swarm.connect(peeraddr)
   })
 

test/e2e/remote-api.test.js

@@ -6,7 +6,7 @@ import httpProxy from 'http-proxy'
 import basicAuth from 'basic-auth'
 import toUri from 'multiaddr-to-uri'
 import { path as getGoIpfsPath } from 'go-ipfs'
-import ipfsHttpModule from 'ipfs-http-client'
+import * as kuboRpcModule from 'kubo-rpc-client'
 const { createProxyServer } = httpProxy
 
 test.describe('Remote API tests', () => {
@@ -33,10 +33,7 @@ test.describe('Remote API tests', () => {
     ipfsd = await createController({
       type: 'go',
       ipfsBin: getGoIpfsPath(),
-      // kuboRpcModule,
-      ipfsHttpModule: {
-        create: ipfsHttpModule
-      },
+      kuboRpcModule,
       test: true,
       disposable: true
     })