From d403219210b0d73f1ba223b20c375dcbb6c89286 Mon Sep 17 00:00:00 2001
From: Harsh Shukla <125105825+PrgrmrHarshShukla@users.noreply.github.com>
Date: Tue, 25 Apr 2023 18:58:22 +0530
Subject: [PATCH] Part of #17670 for file network-statistics.js (#18644)

* Part of #17670 Replace Typography with Text component.

* Worked on the mentioned lint issues.

* Upgrading to enum version.

Co-authored-by: George Marshall <georgewrmarshall@gmail.com>

* Upgrading to enum version.

Co-authored-by: George Marshall <georgewrmarshall@gmail.com>

---------

Co-authored-by: George Marshall <georgewrmarshall@gmail.com>
Co-authored-by: George Marshall <george.marshall@consensys.net>
---
 .../network-statistics/network-statistics.js      | 15 ++++++++-------
 1 file changed, 8 insertions(+), 7 deletions(-)

diff --git a/ui/components/app/edit-gas-fee-popover/network-statistics/network-statistics.js b/ui/components/app/edit-gas-fee-popover/network-statistics/network-statistics.js
index 43baa0606..6a14f655b 100644
--- a/ui/components/app/edit-gas-fee-popover/network-statistics/network-statistics.js
+++ b/ui/components/app/edit-gas-fee-popover/network-statistics/network-statistics.js
@@ -1,14 +1,14 @@
 import React, { useContext } from 'react';
 import {
-  FONT_WEIGHT,
+  FontWeight,
   TextColor,
-  TypographyVariant,
+  TextVariant,
 } from '../../../../helpers/constants/design-system';
 import { isNullish } from '../../../../helpers/utils/util';
 import { formatGasFeeOrFeeRange } from '../../../../helpers/utils/gas';
 import { I18nContext } from '../../../../contexts/i18n';
 import { useGasFeeContext } from '../../../../contexts/gasFee';
-import Typography from '../../../ui/typography/typography';
+import { Text } from '../../../component-library';
 import { BaseFeeTooltip, PriorityFeeTooltip } from './tooltips';
 import StatusSlider from './status-slider';
 
@@ -29,15 +29,16 @@ const NetworkStatistics = () => {
 
   return (
     <div className="network-statistics">
-      <Typography
+      <Text
         color={TextColor.textAlternative}
-        fontWeight={FONT_WEIGHT.BOLD}
+        fontWeight={FontWeight.Bold}
         marginTop={3}
         marginBottom={3}
-        variant={TypographyVariant.H8}
+        variant={TextVariant.bodyXs}
+        as="h6"
       >
         {t('networkStatus')}
-      </Typography>
+      </Text>
       <div className="network-statistics__info">
         {isNullish(formattedLatestBaseFee) ? null : (
           <div