From e14ffb9ee7ab1429c47868449eb3ed1025ddbe2c Mon Sep 17 00:00:00 2001
From: mistakia <1823355+mistakia@users.noreply.github.com>
Date: Sat, 9 Mar 2024 20:48:16 -0500
Subject: [PATCH] feat: remove nanolooker dependency & add confirmation latency
 stats to network section

---
 api/routes/network.mjs                  |  1 +
 src/views/components/network/index.js   | 23 ++++++--
 src/views/components/network/network.js | 75 ++++++++++++++++++++++---
 3 files changed, 84 insertions(+), 15 deletions(-)

diff --git a/api/routes/network.mjs b/api/routes/network.mjs
index ba16232e..cf1f5044 100644
--- a/api/routes/network.mjs
+++ b/api/routes/network.mjs
@@ -32,6 +32,7 @@ const load_network = async () => {
     nanobrowse_monitors_request,
     coingecko_request
   ])
+
   const fulfilled_responses = [
     nanodb_response,
     nanobrowse_stats_response,
diff --git a/src/views/components/network/index.js b/src/views/components/network/index.js
index 347dc15d..5a2daf6b 100644
--- a/src/views/components/network/index.js
+++ b/src/views/components/network/index.js
@@ -1,5 +1,6 @@
 import { connect } from 'react-redux'
 import { createSelector } from 'reselect'
+import BigNumber from 'bignumber.js'
 
 import { getNetwork, getNetworkStats, getNetworkWattHour } from '@core/network'
 import { getNetworkUnconfirmedBlockCount } from '@core/accounts'
@@ -11,12 +12,22 @@ const mapStateToProps = createSelector(
   getNetworkStats,
   getNetworkWattHour,
   getNetworkUnconfirmedBlockCount,
-  (network, stats, wattHour, unconfirmed_block_pool_count) => ({
-    network,
-    stats,
-    wattHour,
-    unconfirmed_block_pool_count
-  })
+  (network, stats, wattHour, unconfirmed_block_pool_count) => {
+    const send_volume_raw = network.getIn(
+      ['stats', 'nanodb', 'send_volume_last_24_hours'],
+      0
+    )
+    const send_volume_nano = BigNumber(send_volume_raw)
+      .shiftedBy(-30)
+      .toNumber()
+    return {
+      network,
+      stats,
+      wattHour,
+      unconfirmed_block_pool_count,
+      send_volume_nano
+    }
+  }
 )
 
 export default connect(mapStateToProps)(Network)
diff --git a/src/views/components/network/network.js b/src/views/components/network/network.js
index d515fc5a..9fde787d 100644
--- a/src/views/components/network/network.js
+++ b/src/views/components/network/network.js
@@ -11,8 +11,13 @@ const formatNumber = (x) => x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',')
 
 export default class Network extends React.Component {
   render() {
-    const { network, wattHour, stats, unconfirmed_block_pool_count } =
-      this.props
+    const {
+      network,
+      wattHour,
+      stats,
+      unconfirmed_block_pool_count,
+      send_volume_nano
+    } = this.props
 
     const prText =
       'as observed across the networks principal representatives: voting nodes with more than 0.1% of the online voting weight delegated to them'
@@ -23,7 +28,7 @@ export default class Network extends React.Component {
       'Total amount of value settled by the network over the last 24 hours'
     const throughputText = `Median number of transactions confirmed per second in the last minute ${prText}`
     const speedText =
-      'Time in milliseconds for a test transaction to get confirmed'
+      'Median time in seconds for a block to get confirmed (across all buckets)'
     const unconfirmed_pool_text = `Number of blocks waiting to be confirmed ${prText}`
     const stakeText =
       'Percentage of delegated Nano weight actively participating in voting'
@@ -47,7 +52,10 @@ export default class Network extends React.Component {
           </div>
           <div>
             {formatNumber(
-              network.getIn(['stats', 'TOTAL_CONFIRMATIONS_24H'], 0)
+              network.getIn(
+                ['stats', 'nanodb', 'confirmations_last_24_hours'],
+                0
+              )
             )}
           </div>
         </div>
@@ -62,8 +70,8 @@ export default class Network extends React.Component {
             $
             {formatNumber(
               (
-                network.getIn(['stats', 'TOTAL_VOLUME_24H'], 0) *
-                network.getIn(['stats', 'currentPrice'], 0)
+                send_volume_nano *
+                network.getIn(['stats', 'current_price_usd'], 0)
               ).toFixed(0)
             )}
           </div>
@@ -85,17 +93,63 @@ export default class Network extends React.Component {
             </Tooltip>
           </div>
           <div>
+            {/* TODO remove this nanoticker dependency */}
             {network.getIn(['stats', 'CPSMedian_pr'], 0).toFixed(1)} CPS
           </div>
         </div>
         <div className='network__stat'>
           <div>
-            Tx Speed
+            Tx Speed (24h)
             <Tooltip title={speedText}>
               <HelpOutlineIcon fontSize='inherit' />
             </Tooltip>
           </div>
-          <div>{network.getIn(['stats', 'speedTest'])} ms</div>
+          {/* TODO remove this nanoticker dependency */}
+          <div>
+            {Math.round(
+              network.getIn(
+                ['stats', 'nanodb', 'median_latency_ms_last_24_hours'],
+                0
+              ) / 1000
+            )}{' '}
+            s
+          </div>
+        </div>
+        <div className='network__stat'>
+          <div>
+            Tx Speed (1h)
+            <Tooltip title={speedText}>
+              <HelpOutlineIcon fontSize='inherit' />
+            </Tooltip>
+          </div>
+          {/* TODO remove this nanoticker dependency */}
+          <div>
+            {Math.round(
+              network.getIn(
+                ['stats', 'nanodb', 'median_latency_ms_last_hour'],
+                0
+              ) / 1000
+            )}{' '}
+            s
+          </div>
+        </div>
+        <div className='network__stat'>
+          <div>
+            Tx Speed (10m)
+            <Tooltip title={speedText}>
+              <HelpOutlineIcon fontSize='inherit' />
+            </Tooltip>
+          </div>
+          {/* TODO remove this nanoticker dependency */}
+          <div>
+            {Math.round(
+              network.getIn(
+                ['stats', 'nanodb', 'median_latency_ms_last_10_mins'],
+                0
+              ) / 1000
+            )}{' '}
+            s
+          </div>
         </div>
         <div className='network__stat'>
           <div>
@@ -104,6 +158,7 @@ export default class Network extends React.Component {
               <HelpOutlineIcon fontSize='inherit' />
             </Tooltip>
           </div>
+          {/* TODO remove this nanoticker dependency */}
           <div>{formatNumber(unconfirmed_block_pool_count || 0)}</div>
         </div>
         <div className='network__stat'>
@@ -114,6 +169,7 @@ export default class Network extends React.Component {
             </Tooltip>
           </div>
           <div>
+            {/* TODO remove this nanoticker dependency */}
             {network.getIn(['stats', 'pStakeTotalStat'], 0).toFixed(1)}%
           </div>
         </div>
@@ -174,5 +230,6 @@ Network.propTypes = {
   network: ImmutablePropTypes.map,
   stats: PropTypes.object,
   wattHour: PropTypes.number,
-  unconfirmed_block_pool_count: PropTypes.number
+  unconfirmed_block_pool_count: PropTypes.number,
+  send_volume_nano: PropTypes.number
 }