m/metamask-extension
1
0
Fork 0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-23 09:52:26 +01:00
Code

issue-18714: Replaced deprecated constants with enum in EthSignModal and HoldToRevealModal Component (#19499)

Browse Source 
* issue-18714: Replaced deprecated constants with enum in eth-sign-modal.js

* issue-18714: Replaced deprecated constants with enum in hold-to-reveal-modal.js
This commit is contained in:
Suraj Jadhav 2023-06-08 16:35:16 +05:30 committed by GitHub
parent f3147bcfb7
commit 6ede0422ca
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 36 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
ui/components/app/modals/eth-sign-modal/eth-sign-modal.js
View File

@ -18,11 +18,11 @@ import {
} from '../../../component-library'; } from '../../../component-library';
import { import {
AlignItems, AlignItems,
DISPLAY, Display,
FLEX_DIRECTION, FlexDirection,
IconColor, IconColor,
JustifyContent, JustifyContent,
SEVERITIES, Severity,
Size, Size,
TextAlign, TextAlign,
TextVariant, TextVariant,
@ -63,14 +63,14 @@ const EthSignModal = ({ hideModal }) => {
return ( return (
<Box <Box
className="eth-sign-modal" className="eth-sign-modal"
display={DISPLAY.FLEX} display={Display.Flex}
flexDirection={FLEX_DIRECTION.COLUMN} flexDirection={FlexDirection.Column}
justifyContent={JustifyContent.flexStart} justifyContent={JustifyContent.flexStart}
padding={4} padding={4}
> >
<Box <Box
display={DISPLAY.FLEX} display={Display.Flex}
flexDirection={FLEX_DIRECTION.ROW} flexDirection={FlexDirection.Row}
marginBottom={4} marginBottom={4}
justifyContent={JustifyContent.center} justifyContent={JustifyContent.center}
> >
@ -105,7 +105,7 @@ const EthSignModal = ({ hideModal }) => {
{t('learnMoreUpperCase')} {t('learnMoreUpperCase')}
</ButtonLink> </ButtonLink>
</Text> </Text>
<BannerAlert severity={SEVERITIES.DANGER} marginTop={6} marginBottom={6}> <BannerAlert severity={Severity.Danger} marginTop={6} marginBottom={6}>
{t('toggleEthSignModalBannerText')} {t('toggleEthSignModalBannerText')}
{t('toggleEthSignModalBannerBoldText')} {t('toggleEthSignModalBannerBoldText')}
</BannerAlert> </BannerAlert>
@ -125,7 +125,7 @@ const EthSignModal = ({ hideModal }) => {
/> />
) : ( ) : (
<Box <Box
flexDirection={FLEX_DIRECTION.ROW} flexDirection={FlexDirection.Row}
alignItems={AlignItems.flexStart} alignItems={AlignItems.flexStart}
gap={2} gap={2}
> >
@ -146,8 +146,8 @@ const EthSignModal = ({ hideModal }) => {
</Box> </Box>
)} )}
<Box <Box
display={DISPLAY.FLEX} display={Display.Flex}
flexDirection={FLEX_DIRECTION.ROW} flexDirection={FlexDirection.Row}
justifyContent={JustifyContent.spaceBetween} justifyContent={JustifyContent.spaceBetween}
gap={4} gap={4}
marginTop={6} marginTop={6}

24
ui/components/app/modals/hold-to-reveal-modal/hold-to-reveal-modal.js
View File

@ -12,8 +12,8 @@ import {
} from '../../../component-library'; } from '../../../component-library';
import { import {
AlignItems, AlignItems,
DISPLAY, Display,
FLEX_DIRECTION, FlexDirection,
JustifyContent, JustifyContent,
Size, Size,
TextVariant, TextVariant,
@ -58,8 +58,8 @@ const HoldToRevealModal = ({
const renderHoldToRevealPrivateKeyContent = () => { const renderHoldToRevealPrivateKeyContent = () => {
return ( return (
<Box <Box
display={DISPLAY.FLEX} display={Display.Flex}
flexDirection={FLEX_DIRECTION.COLUMN} flexDirection={FlexDirection.Column}
gap={4} gap={4}
marginBottom={6} marginBottom={6}
> >
@ -80,7 +80,7 @@ const HoldToRevealModal = ({
key="hold-to-reveal-4" key="hold-to-reveal-4"
variant={TextVariant.bodyMd} variant={TextVariant.bodyMd}
as="span" as="span"
display={DISPLAY.INLINE} display={Display.Inline}
> >
{t('holdToRevealContent4')} {t('holdToRevealContent4')}
</Text>, </Text>,
@ -103,8 +103,8 @@ const HoldToRevealModal = ({
const renderHoldToRevealSRPContent = () => { const renderHoldToRevealSRPContent = () => {
return ( return (
<Box <Box
display={DISPLAY.FLEX} display={Display.Flex}
flexDirection={FLEX_DIRECTION.COLUMN} flexDirection={FlexDirection.Column}
gap={4} gap={4}
marginBottom={6} marginBottom={6}
> >
@ -125,7 +125,7 @@ const HoldToRevealModal = ({
key="hold-to-reveal-4" key="hold-to-reveal-4"
variant={TextVariant.bodyMd} variant={TextVariant.bodyMd}
as="span" as="span"
display={DISPLAY.INLINE} display={Display.Inline}
> >
{t('holdToRevealContent4')} {t('holdToRevealContent4')}
</Text>, </Text>,
@ -148,14 +148,14 @@ const HoldToRevealModal = ({
return ( return (
<Box <Box
className="hold-to-reveal-modal" className="hold-to-reveal-modal"
display={DISPLAY.FLEX} display={Display.Flex}
flexDirection={FLEX_DIRECTION.COLUMN} flexDirection={FlexDirection.Column}
justifyContent={JustifyContent.flexStart} justifyContent={JustifyContent.flexStart}
padding={6} padding={6}
> >
<Box <Box
display={DISPLAY.FLEX} display={Display.Flex}
flexDirection={FLEX_DIRECTION.ROW} flexDirection={FlexDirection.Row}
alignItems={AlignItems.center} alignItems={AlignItems.center}
justifyContent={JustifyContent.spaceBetween} justifyContent={JustifyContent.spaceBetween}
marginBottom={6} marginBottom={6}

13
ui/components/app/modals/hold-to-reveal-modal/hold-to-reveal-modal.stories.js Normal file
View File

@ -0,0 +1,13 @@
import React from 'react';
import HoldToRevealModal from './hold-to-reveal-modal';
export default {
title: 'Components/App/Modals/HoldToRevealModal',
component: HoldToRevealModal,
};
const Template = (args) => <HoldToRevealModal {...args} />;
export const DefaultStory = Template.bind({});
DefaultStory.storyName = 'Default';