feat!: use ipld-explorer-components@4.0.0

.eslintrc.cjs

@@ -11,16 +11,16 @@ module.exports = {
   // ignore .ts files because it fails to parse it.
   ignorePatterns: 'src/**/*.ts',
   rules: {
-    'import/esm-extensions': 'error',
+    // 'import/esm-extensions': 'error',
     'react/prop-types': [0, { ignore: ['className'], customValidators: [], skipUndeclared: true }] // TODO: set this rule to error when all issues are resolved.
   },
   overrides: [
     {
       files: ['src/**/*.stories.js'],
       excludedFiles: '*.test.js',
       rules: {
-        'import/no-anonymous-default-export': 'off',
-        'import/esm-extensions': 'error'
+        'import/no-anonymous-default-export': 'off'
+        // 'import/esm-extensions': 'error'
       }
     }
   ]

.github/workflows/build.yml

@@ -6,18 +6,15 @@ jobs:
     name: build
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v2
+      - uses: actions/checkout@v3.5.2
 
       - name: Setup node
-        uses: actions/setup-node@v2
+        uses: actions/setup-node@v3.6.0
         with:
-          node-version: 16.12.0
-      - name: Setup npm@8.1.0
-        run: |
-          npm install -g npm@8.1.0
+          node-version: 18.14.0
 
       - name: Cache bigger downloads
-        uses: actions/cache@v2
+        uses: actions/cache@v3.3.1
         id: cache
         with:
           path: ${{ github.workspace }}/.cache
@@ -32,7 +29,7 @@ jobs:
       # Separate cache for build dir, we reuse it in release publish workflow
       - name: Cache build output
         if: startsWith(github.ref, 'refs/tags/v')
-        uses: actions/cache@v2
+        uses: actions/cache@v3.3.1
         id: build-cache
         with:
           path: build

.github/workflows/ci.yml

@@ -30,15 +30,12 @@ jobs:
     outputs:
       cid: ${{ steps.ipfs.outputs.cid }}
     steps:
-      - uses: actions/checkout@v2
+      - uses: actions/checkout@v3.5.2
 
       - name: Setup node
-        uses: actions/setup-node@v2
+        uses: actions/setup-node@v3.6.0
         with:
-          node-version: 16.12.0
-      - name: Setup npm@8.1.0
-        run: |
-          npm install -g npm@8.1.0
+          node-version: 18.14.0
 
       - name: Download build artifact
         uses: actions/download-artifact@v2
@@ -47,7 +44,7 @@ jobs:
           path: build
 
       - name: Cache bigger downloads
-        uses: actions/cache@v2
+        uses: actions/cache@v3.3.1
         id: cache
         with:
           path: ${{ github.workspace }}/.cache
@@ -176,12 +173,12 @@ jobs:
     needs: [build, publishPreview, eslint, typecheck, test-e2e, test-unit, test-storybook]
     steps:
       - name: Checkout 🛎️
-        uses: actions/checkout@v2
+        uses: actions/checkout@v3.5.2
         with:
           persist-credentials: false
 
       - name: Cache bigger downloads
-        uses: actions/cache@v2
+        uses: actions/cache@v3.3.1
         id: cache
         with:
           path: ${{ github.workspace }}/.cache
@@ -191,7 +188,7 @@ jobs:
             ${{ runner.os }}-
 
       - name: Cache build dir
-        uses: actions/cache@v2
+        uses: actions/cache@v3.3.1
         id: build-cache
         with:
           path: build
@@ -205,12 +202,9 @@ jobs:
           echo ${{ needs.publishPreview.outputs.cid }} > .cid
 
       - name: Setup node
-        uses: actions/setup-node@v2
+        uses: actions/setup-node@v3.6.0
         with:
-          node-version: 16.12.0
-      - name: Setup npm@8.1.0
-        run: |
-          npm install -g npm@8.1.0
+          node-version: 18.14.0
 
       - name: Install dependencies
         run: npm ci --prefer-offline --no-audit --progress=false --cache ${{ github.workspace }}/.cache/npm

.github/workflows/eslint.yml

@@ -6,18 +6,15 @@ jobs:
     name: eslint
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v1
+      - uses: actions/checkout@v3.5.2
 
       - name: Setup node
-        uses: actions/setup-node@v1
+        uses: actions/setup-node@v3.6.0
         with:
-          node-version: 16.12.0
-      - name: Setup npm@8.1.0
-        run: |
-          npm install -g npm@8.1.0
+          node-version: 18.14.0
 
       - name: Cache bigger downloads
-        uses: actions/cache@v2
+        uses: actions/cache@v3.3.1
         id: cache
         with:
           path: ${{ github.workspace }}/.cache

.github/workflows/node-test.yml

@@ -37,10 +37,10 @@ jobs:
       node-version: ${{ steps.node_version.outputs.version }}
     steps:
 
-    - uses: actions/checkout@v2
+    - uses: actions/checkout@v3.5.2
 
     - name: Use Node.js ${{ inputs.gh-node-version }}
-      uses: actions/setup-node@v1
+      uses: actions/setup-node@v3.6.0
       with:
         node-version: ${{ inputs.gh-node-version }}
 
@@ -54,7 +54,7 @@ jobs:
         echo "version=$(node --version)" >> $GITHUB_OUTPUT
 
     - name: Cache bigger downloads
-      uses: actions/cache@v2
+      uses: actions/cache@v3.3.1
       id: cache
       with:
         path: ${{ github.workspace }}/.cache

.github/workflows/test-e2e.yml

@@ -11,18 +11,15 @@ jobs:
       matrix:
         backend: [go] # TODO: add 'js' – see https://github.com/ipfs/ipfs-webui/issues/1737
     steps:
-      - uses: actions/checkout@v2
+      - uses: actions/checkout@v3.5.2
 
       - name: Setup node
-        uses: actions/setup-node@v1
+        uses: actions/setup-node@v3.6.0
         with:
-          node-version: 16.12.0
-      - name: Setup npm@8.1.0
-        run: |
-          npm install -g npm@8.1.0
+          node-version: 18.14.0
 
       - name: Cache bigger downloads
-        uses: actions/cache@v2
+        uses: actions/cache@v3.3.1
         id: cache
         with:
           path: ${{ github.workspace }}/.cache

.github/workflows/test-storybook.yml

@@ -7,18 +7,15 @@ jobs:
     name: 'test:storybook'
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v3.5.2
 
       - name: Setup node
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v3.6.0
         with:
-          node-version: 16.12.0
-      - name: Setup npm@8.1.0
-        run: |
-          npm install -g npm@8.1.0
+          node-version: 18.14.0
 
       - name: Cache bigger downloads
-        uses: actions/cache@v2
+        uses: actions/cache@v3.3.1
         id: cache
         with:
           path: ${{ github.workspace }}/.cache

.github/workflows/test-unit.yml

@@ -6,18 +6,15 @@ jobs:
     name: 'test:unit'
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v2
+      - uses: actions/checkout@v3.5.2
 
       - name: Setup node
-        uses: actions/setup-node@v2
+        uses: actions/setup-node@v3.6.0
         with:
-          node-version: 16.12.0
-      - name: Setup npm@8.1.0
-        run: |
-          npm install -g npm@8.1.0
+          node-version: 18.14.0
 
       - name: Cache bigger downloads
-        uses: actions/cache@v2
+        uses: actions/cache@v3.3.1
         id: cache
         with:
           path: ${{ github.workspace }}/.cache

.github/workflows/tx-pull.yml

@@ -8,7 +8,7 @@ jobs:
   tx-sync:
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v2
+    - uses: actions/checkout@v3.5.2
     - name: Install Transifex client
       run: |
         curl -o- https://raw.githubusercontent.com/transifex/cli/master/install.sh | bash

.github/workflows/typecheck.yml

@@ -7,18 +7,15 @@ jobs:
     name: typecheck
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v1
+      - uses: actions/checkout@v3.5.2
 
       - name: Setup node
-        uses: actions/setup-node@v1
+        uses: actions/setup-node@v3.6.0
         with:
-          node-version: 16.12.0
-      - name: Setup npm@8.1.0
-        run: |
-          npm install -g npm@8.1.0
+          node-version: 18.14.0
 
       - name: Cache bigger downloads
-        uses: actions/cache@v2
+        uses: actions/cache@v3.3.1
         id: cache
         with:
           path: ${{ github.workspace }}/.cache

.npmrc

@@ -1 +1,2 @@
-engine-strict=true
+engine-strict=false
+node-options="--openssl-legacy-provider"

config-overrides.js

@@ -7,7 +7,10 @@
 import webpack from 'webpack'
 
 const PURE_ESM_MODULES = [
-  'ipfs-geoip'
+  'ipfs-geoip',
+  // 'ipld-explorer-components',
+  '@chainsafe/is-ip',
+  'dag-jose'
 ]
 
 /**
@@ -74,7 +77,8 @@ function webpackOverride (config) {
   Object.assign(fallback, {
     stream: 'stream-browserify',
     os: 'os-browserify/browser',
-    path: 'path-browserify'
+    path: 'path-browserify',
+    crypto: 'crypto-browserify'
   })
 
   config.resolve.fallback = fallback
@@ -103,9 +107,18 @@ function webpackOverride (config) {
   })
 
   // Instrument for code coverage in development mode
-  const REACT_APP_ENV = process.env.REACT_APP_ENV ?? process.env.NODE_ENV ?? 'production'
+  const REACT_APP_ENV = process.env.REACT_APP_ENV ?? process.env.NODE_ENV ?? 'development'
   if (REACT_APP_ENV === 'test') {
     config.module.rules = modifyBabelLoaderRuleForTest(config.module.rules)
+  } else if (REACT_APP_ENV === 'development') {
+    config.optimization = {
+      ...config.optimization,
+      minimize: false,
+      mangleExports: false,
+      innerGraph: false,
+      moduleIds: 'named'
+    }
+    config.devtool = 'source-map'
   }
 
   return config
@@ -122,8 +135,7 @@ const configOverride = {
       setupFiles: [...config.setupFiles, 'fake-indexeddb/auto'],
       moduleNameMapper: {
         ...config.moduleNameMapper,
-        'multiformats/basics': '<rootDir>/node_modules/multiformats/cjs/src/basics.js',
-        'multiformats/bases/(.*)$': '<rootDir>/node_modules/multiformats/cjs/src/bases/$1.js'
+        'multiformats/basics': '<rootDir>/node_modules/multiformats/src/basics.js'
       }
     })
   }