From 15bdb32bb6866eea572a151792bb831eb2b2afa2 Mon Sep 17 00:00:00 2001
From: rohit kerkar <129620973+rohiiittttt@users.noreply.github.com>
Date: Tue, 6 Jun 2023 14:21:27 +0530
Subject: [PATCH] replacing depricated constants (#19448)

Co-authored-by: George Marshall <george.marshall@consensys.net>
---
 .../approve-content-card.js                   | 26 +++++++++----------
 1 file changed, 13 insertions(+), 13 deletions(-)

diff --git a/ui/components/app/approve-content-card/approve-content-card.js b/ui/components/app/approve-content-card/approve-content-card.js
index 23b31b4b8..b9b177fe7 100644
--- a/ui/components/app/approve-content-card/approve-content-card.js
+++ b/ui/components/app/approve-content-card/approve-content-card.js
@@ -9,9 +9,9 @@ import EditGasFeeButton from '../edit-gas-fee-button/edit-gas-fee-button';
 import { Text } from '../../component-library';
 import {
   AlignItems,
-  BLOCK_SIZES,
-  DISPLAY,
-  FLEX_DIRECTION,
+  BlockSize,
+  Display,
+  FlexDirection,
   FontWeight,
   JustifyContent,
   TextAlign,
@@ -66,8 +66,8 @@ export default function ApproveContentCard({
     >
       {showHeader && (
         <Box
-          display={DISPLAY.FLEX}
-          flexDirection={FLEX_DIRECTION.ROW}
+          display={Display.Flex}
+          flexDirection={FlexDirection.Row}
           alignItems={AlignItems.center}
           justifyContent={JustifyContent.flexEnd}
           className="approve-content-card-container__card-header"
@@ -88,7 +88,7 @@ export default function ApproveContentCard({
             </>
           )}
           {showEdit && (!showAdvanceGasFeeOptions || !supportsEIP1559) && (
-            <Box width={BLOCK_SIZES.ONE_SIXTH}>
+            <Box width={BlockSize.OneSixth}>
               <Button type="link" onClick={() => onEditClick()}>
                 <Text
                   variant={TextVariant.bodySm}
@@ -124,14 +124,14 @@ export default function ApproveContentCard({
             />
           ) : (
             <Box
-              display={DISPLAY.FLEX}
-              flexDirection={FLEX_DIRECTION.ROW}
+              display={Display.Flex}
+              flexDirection={FlexDirection.Row}
               justifyContent={JustifyContent.spaceBetween}
             >
               {isMultiLayerFeeNetwork ? (
                 <Box
-                  display={DISPLAY.FLEX}
-                  flexDirection={FLEX_DIRECTION.COLUMN}
+                  display={Display.Flex}
+                  flexDirection={FlexDirection.Column}
                   className="approve-content-card-container__transaction-details-extra-content"
                 >
                   <TransactionDetailItem
@@ -174,8 +174,8 @@ export default function ApproveContentCard({
                     </Text>
                   </Box>
                   <Box
-                    display={DISPLAY.FLEX}
-                    flexDirection={FLEX_DIRECTION.COLUMN}
+                    display={Display.Flex}
+                    flexDirection={FlexDirection.Column}
                     alignItems={AlignItems.flexEnd}
                     textAlign={TextAlign.Right}
                   >
@@ -210,7 +210,7 @@ export default function ApproveContentCard({
             </Box>
           ))}
         {renderDataContent && (
-          <Box display={DISPLAY.FLEX} flexDirection={FLEX_DIRECTION.COLUMN}>
+          <Box display={Display.Flex} flexDirection={FlexDirection.Column}>
             <Box>
               <Text
                 variant={TextVariant.bodySm}