diff options
Diffstat (limited to 'packages/frontend/src/components')
5 files changed, 66 insertions, 22 deletions
diff --git a/packages/frontend/src/components/global/MkAcct.stories.impl.ts b/packages/frontend/src/components/global/MkAcct.stories.impl.ts new file mode 100644 index 0000000000..3fce64c51d --- /dev/null +++ b/packages/frontend/src/components/global/MkAcct.stories.impl.ts @@ -0,0 +1,40 @@ +/* eslint-disable @typescript-eslint/explicit-function-return-type */ +/* eslint-disable import/no-duplicates */ +import { StoryObj } from '@storybook/vue3'; +import { userDetailed } from '../../../.storybook/fakes'; +import MkAcct from './MkAcct.vue'; +export const Default = { + render(args) { + return { + components: { + MkAcct, + }, + setup() { + return { + args, + }; + }, + computed: { + props() { + return { + ...args, + }; + }, + }, + template: '<MkAcct v-bind="props" />', + }; + }, + args: { + user: userDetailed, + }, + parameters: { + layout: 'centered', + }, +} satisfies StoryObj<typeof MkAcct>; +export const Detail = { + ...Default, + args: { + ...Default.args, + detail: true, + }, +} satisfies StoryObj<typeof MkAcct>; diff --git a/packages/frontend/src/components/global/MkAcct.stories.ts b/packages/frontend/src/components/global/MkAcct.stories.ts index 90f66bc182..adac7e0c3e 100644 --- a/packages/frontend/src/components/global/MkAcct.stories.ts +++ b/packages/frontend/src/components/global/MkAcct.stories.ts @@ -1,11 +1,16 @@ /* eslint-disable @typescript-eslint/explicit-function-return-type */ /* eslint-disable import/no-default-export */ -import { Meta, StoryObj } from '@storybook/vue3'; -import MkAcct from './MkAcct.vue'; +import { Meta } from '@storybook/vue3'; const meta = { title: 'components/global/MkAcct', component: MkAcct, } satisfies Meta<typeof MkAcct>; +export default meta; +/* eslint-disable @typescript-eslint/explicit-function-return-type */ +/* eslint-disable import/no-duplicates */ +import { StoryObj } from '@storybook/vue3'; +import { userDetailed } from '../../../.storybook/fakes'; +import MkAcct from './MkAcct.vue'; export const Default = { render(args) { return { @@ -27,8 +32,17 @@ export const Default = { template: '<MkAcct v-bind="props" />', }; }, + args: { + user: userDetailed, + }, parameters: { layout: 'centered', }, } satisfies StoryObj<typeof MkAcct>; -export default meta; +export const Detail = { + ...Default, + args: { + ...Default.args, + detail: true, + }, +} satisfies StoryObj<typeof MkAcct>; diff --git a/packages/frontend/src/components/global/MkAcct.vue b/packages/frontend/src/components/global/MkAcct.vue index 2a43ded9e1..6d68072c07 100644 --- a/packages/frontend/src/components/global/MkAcct.vue +++ b/packages/frontend/src/components/global/MkAcct.vue @@ -1,7 +1,7 @@ <template> <span> <span>@{{ user.username }}</span> - <span v-if="user.host || detail || $store.state.showFullAcct" style="opacity: 0.5;">@{{ user.host || host }}</span> + <span v-if="user.host || detail || showFullAcct" style="opacity: 0.5;">@{{ user.host || host }}</span> </span> </template> @@ -9,6 +9,7 @@ import * as misskey from 'misskey-js'; import { toUnicode } from 'punycode/'; import { host as hostRaw } from '@/config'; +import { defaultStore } from '@/store'; defineProps<{ user: misskey.entities.UserDetailed; @@ -16,5 +17,5 @@ defineProps<{ }>(); const host = toUnicode(hostRaw); +const showFullAcct = $ref(defaultStore.state.showFullAcct); </script> - diff --git a/packages/frontend/src/components/global/MkAvatar.stories.impl.ts b/packages/frontend/src/components/global/MkAvatar.stories.impl.ts index 6de5768af8..e92db93bf5 100644 --- a/packages/frontend/src/components/global/MkAvatar.stories.impl.ts +++ b/packages/frontend/src/components/global/MkAvatar.stories.impl.ts @@ -1,6 +1,7 @@ /* eslint-disable @typescript-eslint/explicit-function-return-type */ /* eslint-disable import/no-duplicates */ import { StoryObj } from '@storybook/vue3'; +import { userDetailed } from '../../../.storybook/fakes'; import MkAvatar from './MkAvatar.vue'; export const Default = { render(args) { @@ -25,9 +26,7 @@ export const Default = { }, args: { size: 48, - user: { - avatarUrl: 'https://github.com/misskey-dev/misskey/blob/master/packages/frontend/assets/about-icon.png?raw=true', - }, + user: userDetailed, }, decorators: [ (Story, context) => ({ @@ -45,10 +44,6 @@ export const ProfilePage = { ...Default.args, size: 120, indicator: true, - user: { - ...Default.args.user, - onlineStatus: 'unknown', - }, }, }; export const ProfilePageCat = { @@ -56,7 +51,7 @@ export const ProfilePageCat = { args: { ...ProfilePage.args, user: { - ...ProfilePage.args.user, + ...userDetailed, isCat: true, }, }, diff --git a/packages/frontend/src/components/global/MkAvatar.stories.ts b/packages/frontend/src/components/global/MkAvatar.stories.ts index 4d819982ee..20ae0b23b4 100644 --- a/packages/frontend/src/components/global/MkAvatar.stories.ts +++ b/packages/frontend/src/components/global/MkAvatar.stories.ts @@ -9,6 +9,7 @@ export default meta; /* eslint-disable @typescript-eslint/explicit-function-return-type */ /* eslint-disable import/no-duplicates */ import { StoryObj } from '@storybook/vue3'; +import { userDetailed } from '../../../.storybook/fakes'; import MkAvatar from './MkAvatar.vue'; export const Default = { render(args) { @@ -33,10 +34,7 @@ export const Default = { }, args: { size: 48, - user: { - avatarUrl: - 'https://github.com/misskey-dev/misskey/blob/master/packages/frontend/assets/about-icon.png?raw=true', - }, + user: userDetailed, }, decorators: [ (Story, context) => ({ @@ -54,10 +52,6 @@ export const ProfilePage = { ...Default.args, size: 120, indicator: true, - user: { - ...Default.args.user, - onlineStatus: 'unknown', - }, }, }; export const ProfilePageCat = { @@ -65,7 +59,7 @@ export const ProfilePageCat = { args: { ...ProfilePage.args, user: { - ...ProfilePage.args.user, + ...userDetailed, isCat: true, }, }, |