From 1c16597b5afb8814d370be3a6500cf9ea7a9b879 Mon Sep 17 00:00:00 2001
From: Nam Nguyen <nam.nguyen@kyber.network>
Date: Fri, 28 Jul 2023 10:10:10 +0700
Subject: [PATCH] refactor: skeleton loading instead of block page loading

---
 .nvmrc                              |  2 ++
 package.json                        |  5 ++++-
 src/App.js                          | 11 +----------
 src/components/GlobalChart/index.js |  2 +-
 src/components/GlobalStats/index.js |  2 +-
 5 files changed, 9 insertions(+), 13 deletions(-)
 create mode 100644 .nvmrc

diff --git a/.nvmrc b/.nvmrc
new file mode 100644
index 000000000..929191879
--- /dev/null
+++ b/.nvmrc
@@ -0,0 +1,2 @@
+v16
+v14
\ No newline at end of file
diff --git a/package.json b/package.json
index 8f98960b1..0b7d014f8 100644
--- a/package.json
+++ b/package.json
@@ -2,6 +2,9 @@
   "name": "@uniswap/info",
   "private": true,
   "homepage": "/classic",
+  "engines": {
+    "node": "14 || 16"
+  },
   "devDependencies": {
     "@popperjs/core": "^2.4.2",
     "@reach/dialog": "^0.15.3",
@@ -97,4 +100,4 @@
     "deepmerge": "^4.2.2",
     "swr": "^1.0.1"
   }
-}
+}
\ No newline at end of file
diff --git a/src/App.js b/src/App.js
index 0dad2ca1f..8a5dc7e46 100644
--- a/src/App.js
+++ b/src/App.js
@@ -141,16 +141,7 @@ function AppLogicWrapper(props) {
           </WarningBanner>
         </WarningWrapper>
       )}
-      {latestBlocks[0] &&
-      globalData[0] &&
-      Object.keys(globalData[0]).length > 0 &&
-      globalChartData[0] &&
-      Object.keys(globalChartData[0]).length > 0 ? (
-        props.children
-      ) : (
-        <LocalLoader fill='true' size='200px' />
-      )}
-      {/* {props.children} */}
+      {props.children}
     </AppWrapper>
   )
 }
diff --git a/src/components/GlobalChart/index.js b/src/components/GlobalChart/index.js
index 82e52c81d..4868121c3 100644
--- a/src/components/GlobalChart/index.js
+++ b/src/components/GlobalChart/index.js
@@ -42,7 +42,7 @@ const GlobalChart = ({ display }) => {
     liquidityChangeUSD,
     oneWeekVolume,
     weeklyVolumeChange,
-  } = globalDatas[1] ? aggregateGlobalData(globalDatas) : globalDatas[0]
+  } = globalDatas[1] ? aggregateGlobalData(globalDatas) : globalDatas[0] || {}
 
   // based on window, get starttim
   let utcStartTime = getTimeframe(timeWindow)
diff --git a/src/components/GlobalStats/index.js b/src/components/GlobalStats/index.js
index 3fb1fe680..7db377d21 100644
--- a/src/components/GlobalStats/index.js
+++ b/src/components/GlobalStats/index.js
@@ -28,7 +28,7 @@ export default function GlobalStats() {
   const globalDatas = useGlobalData()
   const { oneDayTxns, oneDayFeeUSD, oneDayFeeChange, txnChange } = globalDatas[1]
     ? aggregateGlobalData(globalDatas)
-    : globalDatas[0]
+    : globalDatas[0] || {}
   const oneDayFees = oneDayFeeUSD ? formattedNum(oneDayFeeUSD, true) : ''
   const theme = useTheme()
   const aggregatorVolume = useAggregatorVolume()