Improve account components stories

Joystream · Jun 15, 2024 · 000cf57 · 000cf57
1 parent bcccaae
commit 000cf57
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 12 deletions.
diff --git a/packages/ui/src/accounts/components/AccountInfo.stories.tsx b/packages/ui/src/accounts/components/AccountInfo.stories.tsx
@@ -1,10 +1,10 @@
 import { Meta } from '@storybook/react'
 
-import { AccountInfo as Component } from './AccountInfo'
+import { AccountInfo } from './AccountInfo'
 
 export default {
   title: 'Accounts/AccountInfo',
-  component: Component,
+  component: AccountInfo,
   args: {
     account: {
       name: 'Alice',
@@ -14,4 +14,6 @@ export default {
   },
 } as Meta
 
-export const AccountInfo = {}
+export const Default = {
+  name: 'AccountInfo',
+}
diff --git a/packages/ui/src/accounts/components/AnonymousAccount.stories.tsx b/packages/ui/src/accounts/components/AnonymousAccount.stories.tsx
@@ -1,11 +1,11 @@
-import { Meta, StoryFn } from '@storybook/react'
+import { Meta, StoryObj } from '@storybook/react'
 import BN from 'bn.js'
 import React from 'react'
 
 import { Row } from '@/common/components/storybookParts/previewStyles'
 import { joy } from '@/mocks/helpers'
 
-import { AnonymousAccount as Component } from './AnonymousAccount'
+import { AnonymousAccount } from './AnonymousAccount'
 
 type Args = {
   address: string
@@ -14,16 +14,19 @@ type Args = {
 
 export default {
   title: 'Accounts/AnonymousAccount',
-  component: Component,
+  component: AnonymousAccount,
   args: {
     address: 'j4VdDQVdwFYfQ2MvEdLT2EYZx4ALPQQ6yMyZopKoZEQmXcJrT',
     amount: 10,
   },
 } as Meta<Args>
 
-export const AnonymousAccount: StoryFn<Args> = ({ address, amount }) => (
-  <Row>
-    <Component address={address} amount={amount ? new BN(joy(amount)) : undefined} />
-    <Component address={address} />
-  </Row>
-)
+export const Default: StoryObj<Args> = {
+  name: 'AnonymousAccount',
+  render: ({ address, amount }) => (
+    <Row>
+      <AnonymousAccount address={address} amount={amount ? new BN(joy(amount)) : undefined} />
+      <AnonymousAccount address={address} />
+    </Row>
+  ),
+}