m/metamask-extension
1
0
Fork 0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-11-22 01:47:00 +01:00
Code

deprecating Dialog in favour of BannerAlert (#20623)

Browse Source
This commit is contained in:
Dhruv 2023-08-29 04:33:41 +05:30 committed by GitHub
parent 0cbd22d0e4
commit 7e1ed4bb0b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 27 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
ui/components/ui/dialog/dialog.stories.js
View File

@ -1,4 +1,6 @@
import React from 'react'; import React from 'react';
import { BannerAlert } from '../../component-library';
import { Severity } from '../../../helpers/constants/design-system';
import README from './README.mdx'; import README from './README.mdx';
import Dialog from '.'; import Dialog from '.';
@ -19,9 +21,22 @@ export default {
}, },
}; };
export const DefaultDialog = (args) => { export const DefaultDialog = (args) => (
return <Dialog {...args} />; <>
}; <BannerAlert
severity={Severity.Warning}
title="Deprecated"
description="The <Dialog> component has been deprecated in favor of the new <BannerAlert> component from the component-library.
If you would like to help with the replacement of the old Dialog component, please submit a pull request to metamask-extension"
actionButtonLabel="See details"
actionButtonProps={{
href: 'https://github.com/MetaMask/metamask-extension/issues/20463',
}}
marginBottom={4}
/>
<Dialog {...args} />
</>
);
DefaultDialog.storyName = 'Default'; DefaultDialog.storyName = 'Default';
DefaultDialog.args = { DefaultDialog.args = {

9
ui/components/ui/dialog/index.js
View File

@ -2,6 +2,15 @@ import React from 'react';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import classnames from 'classnames'; import classnames from 'classnames';
/**
* @deprecated The `<Dialog />` component has been deprecated in favor of the new `<BannerAlert>` component from the component-library.
* Please update your code to use the new `<BannerAlert>` component instead, which can be found at ui/components/component-library/banner-alert/banner-alert.js.
* You can find documentation for the new `BannerAlert` component in the MetaMask Storybook:
* {@link https://metamask.github.io/metamask-storybook/?path=/docs/components-componentlibrary-banneralert--docs}
* If you would like to help with the replacement of the old `Dialog` component, please submit a pull request against this GitHub issue:
* {@link https://github.com/MetaMask/metamask-extension/issues/20463}
*/
export default function Dialog(props) { export default function Dialog(props) {
const { children, type, className, onClick } = props; const { children, type, className, onClick } = props;
return ( return (