Creating story for account-mismatch-warning (#19460)

* Creating story for account-mismatch-warning

* Removed line break

---------

Co-authored-by: George Marshall <george.marshall@consensys.net>

ui/components/ui/account-mismatch-warning/account-mismatch-warning.component.js

@@ -5,7 +5,7 @@ import Tooltip from '../tooltip';
 import { getSelectedAccount } from '../../../selectors';
 import InfoIcon from '../icon/info-icon.component';
 import { useI18nContext } from '../../../hooks/useI18nContext';
-import { SEVERITIES } from '../../../helpers/constants/design-system';
+import { Severity } from '../../../helpers/constants/design-system';
 
 export default function AccountMismatchWarning({ address }) {
   const selectedAccount = useSelector(getSelectedAccount);
@@ -25,7 +25,7 @@ export default function AccountMismatchWarning({ address }) {
         className="account-mismatch-warning__tooltip-container-icon"
         data-testid="account-mismatch-warning-tooltip"
       >
-        <InfoIcon severity={SEVERITIES.WARNING} />
+        <InfoIcon severity={Severity.Warning} />
       </div>
     </Tooltip>
   );

ui/components/ui/account-mismatch-warning/account-mismatch-warning.stories.js

@@ -0,0 +1,19 @@
+import React from 'react';
+import AccountMismatchWarning from './account-mismatch-warning.component';
+
+export default {
+  title: 'Components/UI/AccountMismatchWarning',
+  component: AccountMismatchWarning,
+  argTypes: {
+    address: {
+      control: 'text',
+    },
+  },
+};
+
+export const DefaultStory = (args) => <AccountMismatchWarning {...args} />;
+
+DefaultStory.storyName = 'Default';
+DefaultStory.args = {
+  address: '0x5CfE73b6021E818B776b421B1c4Db2474086a7e1',
+};