Reduce dependencies (#2480)

* Added build:analyze script

* removed pinata package and added custom api call function (#1993)

* removed pinata package and added custom api function

* added type and move url to const

* added requested PR changes

* Optimize bn.js package (#2479)

* Use modified paraswap package version (#2493)

craco.config.js

@@ -1,13 +1,19 @@
 /* eslint-disable @typescript-eslint/no-var-requires */
 const path = require('path')
 const SentryWebpackPlugin = require('@sentry/webpack-plugin')
+const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin
 const { version } = require('./package.json')
 
 // see https://github.com/gsoft-inc/craco/blob/master/packages/craco/README.md#configuration-overview
 
 const plugins = []
 const SENTRY_AUTH_TOKEN = process.env.REACT_APP_SENTRY_AUTH_TOKEN
 const SENTRY_RELEASE_VERSION = 'CowSwap@v' + version
+const ANALYZE_BUNDLE = process.env.REACT_APP_ANALYZE_BUNDLE
+
+if (ANALYZE_BUNDLE) {
+  plugins.push(new BundleAnalyzerPlugin())
+}
 
 if (SENTRY_AUTH_TOKEN) {
   plugins.push(
@@ -42,6 +48,7 @@ module.exports = {
     plugins,
     alias: {
       '@src': path.resolve(__dirname, 'src'),
+      'bn.js': path.resolve(__dirname, 'node_modules/bn.js/lib/bn.js'),
     },
     // https://webpack.js.org/configuration
     configure: (webpackConfig) => ({

package.json

@@ -150,6 +150,10 @@
     "use-count-up": "^2.2.5",
     "wcag-contrast": "^3.0.0",
     "web-vitals": "^2.1.0",
+    "web3": "^1.7.0",
+    "web3-providers-http": "^1.7.0",
+    "web3-providers-ws": "^1.7.0",
+    "webpack-bundle-analyzer": "^4.5.0",
     "workbox-core": "^6.1.0",
     "workbox-precaching": "^6.1.0",
     "workbox-routing": "^6.1.0"
@@ -164,6 +168,7 @@
     "start:service-worker": "yarn build && yarn serve",
     "mock": "REACT_APP_MOCK=true yarn start",
     "build": "yarn i18n:compile && craco build && yarn writeVersion",
+    "build:analyze": "cross-env REACT_APP_ANALYZE_BUNDLE=true yarn craco build && yarn writeVersion",
     "ipfs:build": "cross-env PUBLIC_URL=\".\" yarn build",
     "ipfs:publish": "ipfs-deploy build -p infura -O",
     "test": "NODE_PATH=src/custom craco test --env=jsdom",
@@ -215,7 +220,6 @@
     "@gnosis.pm/dex-js": "^0.14.0",
     "@gnosis.pm/gp-v2-contracts": "^1.1.2",
     "@gnosis.pm/safe-service-client": "^0.1.1",
-    "@pinata/sdk": "^1.1.23",
     "@sentry/react": "^6.11.0",
     "@sentry/tracing": "^6.11.0",
     "@uniswap/default-token-list": "^2.0.0",
@@ -224,7 +228,7 @@
     "fast-safe-stringify": "^2.0.8",
     "firebase": "^9.1.3",
     "ipfs-http-client": "^52.0.3",
-    "paraswap": "^5.0.1",
+    "paraswap": "npm:@nenad91/paraswap#5.1.0",
     "react-appzi": "^1.0.4",
     "react-inlinesvg": "^2.3.0",
     "react-router-hash-link": "^2.4.0",

src/custom/api/ipfs/index.ts

@@ -1,8 +1,37 @@
-import pinataSDK, { PinataPinResponse } from '@pinata/sdk'
-import { PINATA_API_KEY, PINATA_SECRET_API_KEY } from 'constants/ipfs'
+import { PINATA_API_KEY, PINATA_SECRET_API_KEY, PINATA_API_URL } from 'constants/ipfs'
 
-const pinata = pinataSDK(PINATA_API_KEY, PINATA_SECRET_API_KEY)
+type PinataPinResponse = {
+  IpfsHash: string
+  PinSize: number
+  Timestamp: string
+}
+
+const pinataUrl = `${PINATA_API_URL}/pinning/pinJSONToIPFS`
+
+const headers = new Headers({
+  'Content-Type': 'application/json',
+  pinata_api_key: PINATA_API_KEY,
+  pinata_secret_api_key: PINATA_SECRET_API_KEY,
+})
 
 export async function pinJSONToIPFS(file: any): Promise<PinataPinResponse> {
-  return pinata.pinJSONToIPFS(file, { pinataMetadata: { name: 'appData-affiliate' } })
+  const body = JSON.stringify({
+    pinataContent: file,
+    pinataMetadata: { name: 'appData-affiliate' },
+  })
+
+  const request = new Request(pinataUrl, {
+    method: 'POST',
+    headers,
+    body,
+  })
+
+  const response = await fetch(request)
+  const data = await response.json()
+
+  if (response.status !== 200) {
+    throw new Error(data.error.details || data.error)
+  }
+
+  return data
 }

src/custom/constants/ipfs.ts

@@ -1,3 +1,4 @@
 export const PINATA_API_KEY = process.env.REACT_APP_PINATA_API_KEY as string
 export const PINATA_SECRET_API_KEY = process.env.REACT_APP_PINATA_SECRET_API_KEY as string
+export const PINATA_API_URL = process.env.REACT_APP_PINATA_API_URL || 'https://api.pinata.cloud'
 export const IPFS_URI = process.env.REACT_APP_IPFS_URI || 'https://ipfs.infura.io:5001/api/v0'