fix: broken svgs and move STABLE config to reserve patches config (#1072

) * fix: fix sorting for some stable assets * fix: properly configure svgo otherwise e.g. lighting on frax will be broken as they overwrite each other
aave · Sep 2, 2022 · bbc840d · bbc840d
1 parent 2a71a8b
commit bbc840d
Show file tree

Hide file tree

Showing 3 changed files with 35 additions and 24 deletions.
diff --git a/next.config.js b/next.config.js
@@ -13,7 +13,16 @@ module.exports = withBundleAnalyzer({
     config.module.rules.push({
       test: /\.svg$/i,
       issuer: /\.[jt]sx?$/,
-      use: ['@svgr/webpack'],
+      use: [
+        {
+          loader: '@svgr/webpack',
+          options: {
+            svgoConfig: {
+              plugins: ['prefixIds'],
+            },
+          },
+        },
+      ],
     });
     config.experiments = { topLevelAwait: true };
     return config;

diff --git a/src/hooks/app-data-provider/useAppDataProvider.tsx b/src/hooks/app-data-provider/useAppDataProvider.tsx
@@ -9,7 +9,7 @@ import {
 import BigNumber from 'bignumber.js';
 import React, { useContext } from 'react';
 import { useWeb3Context } from 'src/libs/hooks/useWeb3Context';
-import { fetchIconSymbolAndName } from 'src/ui-config/reservePatches';
+import { fetchIconSymbolAndName, STABLE_ASSETS } from 'src/ui-config/reservePatches';
 
 import { useCurrentTimestamp } from '../useCurrentTimestamp';
 import { useProtocolDataContext } from '../useProtocolDataContext';
@@ -240,29 +240,9 @@ export const AppDataProvider: React.FC = ({ children }) => {
 
 export const useAppDataContext = () => useContext(AppDataContext);
 
-// tokens flagged stable will be sorted on top when no other sorting is selected
-const stable = [
-  'DAI',
-  'TUSD',
-  'BUSD',
-  'GUSD',
-  'USDC',
-  'USDT',
-  'EUROS',
-  'FEI',
-  'FRAX',
-  'PAX',
-  'USDP',
-  'SUSD',
-  'UST',
-  'EURS',
-  'JEUR',
-  'AGEUR',
-];
-
 const reserveSortFn = (a: { iconSymbol: string }, b: { iconSymbol: string }) => {
-  const aIsStable = stable.includes(a.iconSymbol.toUpperCase());
-  const bIsStable = stable.includes(b.iconSymbol.toUpperCase());
+  const aIsStable = STABLE_ASSETS.includes(a.iconSymbol.toUpperCase());
+  const bIsStable = STABLE_ASSETS.includes(b.iconSymbol.toUpperCase());
   if (aIsStable && !bIsStable) return -1;
   if (!aIsStable && bIsStable) return 1;
   return a.iconSymbol.toUpperCase() > b.iconSymbol.toUpperCase() ? 1 : -1;

diff --git a/src/ui-config/reservePatches.ts b/src/ui-config/reservePatches.ts
@@ -120,3 +120,25 @@ export function fetchIconSymbolAndName({
     symbol,
   };
 }
+
+// tokens flagged stable will be sorted on top when no other sorting is selected
+export const STABLE_ASSETS = [
+  'DAI',
+  'TUSD',
+  'BUSD',
+  'GUSD',
+  'USDC',
+  'USDT',
+  'EUROS',
+  'FEI',
+  'FRAX',
+  'PAX',
+  'USDP',
+  'SUSD',
+  'UST',
+  'EURS',
+  'JEUR',
+  'AGEUR',
+  'LUSD',
+  'MAI',
+];