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

Declared <IconWithFallback/> as deprecated (#20656)

Browse Source 
* Add the deprecation JSDoc format below to the deprecated code and added deprecation notice to the icon-with-fallback.stories.js

* Declared <IconWithFallback/> as deprecated
This commit is contained in:
Subhajit Ghosh 2023-08-30 22:17:12 +05:30 committed by GitHub
parent 982a1b2c51
commit 8b93092e0e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 38 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
ui/components/ui/icon-with-fallback/icon-with-fallback.component.js
View File

@ -2,6 +2,15 @@ import React, { useState } from 'react';
import PropTypes from 'prop-types';
import classnames from 'classnames';
/**
* @deprecated The `<IconWithFallback />` component has been deprecated in favor of the new `<AvatarNetwork />` or `<AvatarFavicon />` component from the component-library.
* Please update your code to use the new `<AvatarNetwork />` or `<AvatarFavicon />` component instead, which can be found at ui/components/component-library.
* You can find documentation for the new `AvatarNetwork` or `AvatarFavicon` component in the MetaMask Storybook:
* {@link https://metamask.github.io/metamask-storybook/?path=/docs/components-componentlibrary-avatarnetwork--docs}
* {@link https://metamask.github.io/metamask-storybook/?path=/docs/components-componentlibrary-avatarfavicon--docs}
* If you would like to help with the replacement of the old `IconWithFallback` component, please submit a pull request
*/
const IconWithFallback = ({
name = '',
icon = null,

32
ui/components/ui/icon-with-fallback/icon-with-fallback.stories.js
View File

@ -1,8 +1,26 @@
import React from 'react';
import PropTypes from 'prop-types';
import { BannerAlert } from '../../component-library';
import { Severity } from '../../../helpers/constants/design-system';
import README from './README.mdx';
import IconWithFallback from '.';
const Deprecated = ({ children }) => (
<>
<BannerAlert
severity={Severity.Warning}
title="Deprecated"
description="<IconWithFallback/> has been deprecated in favor of <AvatarNetwork/>"
marginBottom={4}
/>
{children}
</>
);
Deprecated.propTypes = {
children: PropTypes.node,
};
export default {
title: 'Components/UI/IconWithFallback',
@ -31,7 +49,11 @@ export default {
},
};
export const DefaultStory = (args) => <IconWithFallback {...args} />;
export const DefaultStory = (args) => (
<Deprecated>
<IconWithFallback {...args} />
</Deprecated>
);
DefaultStory.storyName = 'Default';
@ -41,7 +63,11 @@ DefaultStory.args = {
size: 24,
};
export const Fallback = (args) => <IconWithFallback {...args} />;
export const Fallback = (args) => (
<Deprecated>
<IconWithFallback {...args} />
</Deprecated>
);
Fallback.args = {
name: 'ast',