build(#10336): write stories for MkAcct

This commit is contained in:
Acid Chicken (硫酸鶏) 2023-03-31 01:01:53 +09:00
parent 5393436403
commit 98fd6b5879
No known key found for this signature in database
GPG key ID: 3E87B98A3F6BAB99
9 changed files with 128 additions and 140 deletions

View file

@ -0,0 +1,54 @@
import type { entities } from 'misskey-js'
export const userDetailed = {
id: 'someuserid',
username: 'miskist',
host: null,
name: 'Misskey User',
onlineStatus: 'unknown',
avatarUrl: 'https://github.com/misskey-dev/misskey/blob/master/packages/frontend/assets/about-icon.png?raw=true',
avatarBlurhash: 'eQFRshof5NWBRi},juayfPju53WB?0ofs;s*a{ofjuay^SoMEJR%ay',
emojis: [],
bannerBlurhash: 'eQA^IW^-MH8w9tE8I=S^o{$*R4RikXtSxutRozjEnNR.RQadoyozog',
bannerColor: '#000000',
bannerUrl: 'https://github.com/misskey-dev/misskey/blob/master/packages/frontend/assets/fedi.jpg?raw=true',
birthday: '2014-06-20',
createdAt: '2016-12-28T22:49:51.000Z',
description: 'I am a cool user!',
ffVisibility: 'public',
fields: [
{
name: 'Website',
value: 'https://misskey-hub.net',
},
],
followersCount: 1024,
followingCount: 16,
hasPendingFollowRequestFromYou: false,
hasPendingFollowRequestToYou: false,
isAdmin: false,
isBlocked: false,
isBlocking: false,
isBot: false,
isCat: false,
isFollowed: false,
isFollowing: false,
isLocked: false,
isModerator: false,
isMuted: false,
isSilenced: false,
isSuspended: false,
lang: 'en',
location: 'Fediverse',
notesCount: 65536,
pinnedNoteIds: [],
pinnedNotes: [],
pinnedPage: null,
pinnedPageId: null,
publicReactions: false,
securityKeys: false,
twoFactorEnabled: false,
updatedAt: null,
uri: null,
url: null,
} satisfies entities.UserDetailed

View file

@ -21,9 +21,6 @@ const config = {
core: {
disableTelemetry: true,
},
features: {
interactionsDebugger: true,
},
async viteFinal(config, options) {
return mergeConfig(config, {
plugins: [

View file

@ -76,7 +76,7 @@
"@storybook/addon-interactions": "7.0.0-rc.10",
"@storybook/addon-links": "7.0.0-rc.10",
"@storybook/addon-storysource": "7.0.0-rc.10",
"@storybook/addons": "7.0.0-rc.5",
"@storybook/addons": "7.0.0-rc.10",
"@storybook/blocks": "7.0.0-rc.10",
"@storybook/core-events": "7.0.0-rc.10",
"@storybook/jest": "0.0.10",

View file

@ -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>;

View file

@ -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>;

View file

@ -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>

View file

@ -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,
},
},

View file

@ -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,
},
},

View file

@ -779,8 +779,8 @@ importers:
specifier: 7.0.0-rc.10
version: 7.0.0-rc.10(react-dom@18.2.0)(react@18.2.0)
'@storybook/addons':
specifier: 7.0.0-rc.5
version: 7.0.0-rc.5(react-dom@18.2.0)(react@18.2.0)
specifier: 7.0.0-rc.10
version: 7.0.0-rc.10(react-dom@18.2.0)(react@18.2.0)
'@storybook/blocks':
specifier: 7.0.0-rc.10
version: 7.0.0-rc.10(react-dom@18.2.0)(react@18.2.0)
@ -5064,15 +5064,15 @@ packages:
regenerator-runtime: 0.13.11
dev: true
/@storybook/addons@7.0.0-rc.5(react-dom@18.2.0)(react@18.2.0):
resolution: {integrity: sha512-KDSoMW/y39eAMbeSmwmYEiYu3KomabJCYdsfmD65i0DqwuOFrkG3im3wPkF3F88rZDuzWzVZMl3Z15n56uVXKA==}
/@storybook/addons@7.0.0-rc.10(react-dom@18.2.0)(react@18.2.0):
resolution: {integrity: sha512-3funGKp6w/uqrTl/0Vsz/oTMmOziSl+JEotjf0G5SBJfaa6gBaz2feddUcRl47I9MNfRYRV01m5a4bCR1QJnwQ==}
peerDependencies:
react: ^16.8.0 || ^17.0.0 || ^18.0.0
react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0
dependencies:
'@storybook/manager-api': 7.0.0-rc.5(react-dom@18.2.0)(react@18.2.0)
'@storybook/preview-api': 7.0.0-rc.5
'@storybook/types': 7.0.0-rc.5
'@storybook/manager-api': 7.0.0-rc.10(react-dom@18.2.0)(react@18.2.0)
'@storybook/preview-api': 7.0.0-rc.10
'@storybook/types': 7.0.0-rc.10
react: 18.2.0
react-dom: 18.2.0(react@18.2.0)
dev: true
@ -5216,17 +5216,6 @@ packages:
telejson: 7.0.4
dev: true
/@storybook/channel-postmessage@7.0.0-rc.5:
resolution: {integrity: sha512-NBnIKiACAnLpsVe7bf9B2XE4tH+4HgTJh8Mvj1Dpu1jxu2cJ3j20x3IGgELXCXSEicUbXCqr+O1Zc7CHBXYV+g==}
dependencies:
'@storybook/channels': 7.0.0-rc.5
'@storybook/client-logger': 7.0.0-rc.5
'@storybook/core-events': 7.0.0-rc.5
'@storybook/global': 5.0.0
qs: 6.11.1
telejson: 7.0.4
dev: true
/@storybook/channel-websocket@7.0.0-rc.10:
resolution: {integrity: sha512-18xZYdV3CqiGpxIF8os5Vm+T76p+5lx0t8fRTpiPuOfuPF72QYdqmUuXF/tLH4hzj/qwPp56y6Nb7My7pcGPug==}
dependencies:
@ -5248,10 +5237,6 @@ packages:
resolution: {integrity: sha512-LNjI2etxaK5hbBHziNbDzK5VajGU0BLcD04CO3LbGRC14hJvDfVnvymJeDbbgT1b7RPUwl/vv/azO1kVHDax/A==}
dev: true
/@storybook/channels@7.0.0-rc.5:
resolution: {integrity: sha512-/T4iJQsTj42bs+d2sG8aLyInKh1IjZeK0vPoJRK9gvy3YfxTj3yodZ60s2yywKJCgGjg5zJMFxYMWqSVmHIdnw==}
dev: true
/@storybook/cli@7.0.0-rc.10:
resolution: {integrity: sha512-UTncMAUO6+WvXW0IrUDBlN94X5BDCre4qvlZLnPU6LDDZ53MOjESO4U+k/3B/ARRNFaFoiDh+hfkBLg3ulLqgg==}
hasBin: true
@ -5314,12 +5299,6 @@ packages:
'@storybook/global': 5.0.0
dev: true
/@storybook/client-logger@7.0.0-rc.5:
resolution: {integrity: sha512-YkqjJb2jK6/jT4zm9cmdMVZeOyzoDxiyK3BedhoXKMRDMz+7+E7tcOZEXsuvTGekJe459TTnwYLfvUvObaXNKw==}
dependencies:
'@storybook/global': 5.0.0
dev: true
/@storybook/codemod@7.0.0-rc.10:
resolution: {integrity: sha512-BHAtI/G5/TyjV/714W06oMaEa3A7GGTGK4KGlEvC/g1i3bCeXMCGWCR1fp850OFX/AyQF5iETtAZx+vk7mvurQ==}
dependencies:
@ -5401,10 +5380,6 @@ packages:
resolution: {integrity: sha512-Z4S6H1E5FuG7eiVozqcqNBSADt0kCDZeXlpR/gIOYLmTd/BDIQ2QhLt+G41BbEvck8nRnC7lZ9DXuref8V3pDA==}
dev: true
/@storybook/core-events@7.0.0-rc.5:
resolution: {integrity: sha512-n9+TqgrgkXN5V+mNdgdnojUVqhKOsyL3DNfOmAsbLEewhg5z6+QDYxOe/FBe1usGI2DV+ihwb/knMZzuYXN5ow==}
dev: true
/@storybook/core-server@7.0.0-rc.10:
resolution: {integrity: sha512-S+E8WRU4vik+lNbXukVSsZPrRgsujFpy9RvgLckH/QI4T2SYe94mAuKGVkW/720jBD4DNss+IUGQQvkafLPl5A==}
dependencies:
@ -5582,31 +5557,6 @@ packages:
ts-dedent: 2.2.0
dev: true
/@storybook/manager-api@7.0.0-rc.5(react-dom@18.2.0)(react@18.2.0):
resolution: {integrity: sha512-MsNj/cPIOlL7HJ8ReYahUvJVfvZDtNfacUYSFuQjQwdnp0u3pbC5mGZPd32tAGj7lLaLzcqqo1yR+NAgwpZUBw==}
peerDependencies:
react: ^16.8.0 || ^17.0.0 || ^18.0.0
react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0
dependencies:
'@storybook/channels': 7.0.0-rc.5
'@storybook/client-logger': 7.0.0-rc.5
'@storybook/core-events': 7.0.0-rc.5
'@storybook/csf': 0.0.2-next.10
'@storybook/global': 5.0.0
'@storybook/router': 7.0.0-rc.5(react-dom@18.2.0)(react@18.2.0)
'@storybook/theming': 7.0.0-rc.5(react-dom@18.2.0)(react@18.2.0)
'@storybook/types': 7.0.0-rc.5
dequal: 2.0.3
lodash: 4.17.21
memoizerific: 1.11.3
react: 18.2.0
react-dom: 18.2.0(react@18.2.0)
semver: 7.3.8
store2: 2.14.2
telejson: 7.0.4
ts-dedent: 2.2.0
dev: true
/@storybook/manager@7.0.0-rc.10:
resolution: {integrity: sha512-WmGyBFPCaW7ee57nSaPCb5teeI3mUBL+cRY3wXi7n+tzCHuWlYM/AWmQgOtb2goMgt7iZn76+uL9JUfTbvfRCg==}
dev: true
@ -5648,27 +5598,6 @@ packages:
util-deprecate: 1.0.2
dev: true
/@storybook/preview-api@7.0.0-rc.5:
resolution: {integrity: sha512-cuyFIT/4MXfoqN6d5AK/KH7Yp0cifuOmcBj4+9xrmrPK47m4F8eHZ/mX6rXE6rVFNsWv65Al5An6WCM1CDImJg==}
dependencies:
'@storybook/channel-postmessage': 7.0.0-rc.5
'@storybook/channels': 7.0.0-rc.5
'@storybook/client-logger': 7.0.0-rc.5
'@storybook/core-events': 7.0.0-rc.5
'@storybook/csf': 0.0.2-next.10
'@storybook/global': 5.0.0
'@storybook/types': 7.0.0-rc.5
'@types/qs': 6.9.7
dequal: 2.0.3
lodash: 4.17.21
memoizerific: 1.11.3
qs: 6.11.1
slash: 3.0.0
synchronous-promise: 2.0.17
ts-dedent: 2.2.0
util-deprecate: 1.0.2
dev: true
/@storybook/preview@7.0.0-rc.10:
resolution: {integrity: sha512-885uU20XL54s31lAyIu5MaiD4t23gJ0X/JEMz2/LTvfluYDtQg66gXhMibKqEPgMHcPOND5ZrGoYPdaLDG20Dw==}
dev: true
@ -5777,19 +5706,6 @@ packages:
react-dom: 18.2.0(react@18.2.0)
dev: true
/@storybook/router@7.0.0-rc.5(react-dom@18.2.0)(react@18.2.0):
resolution: {integrity: sha512-s23O2OOQ4+CvySk3QC/PXhDJChc4jjyQu/h3gLMKF7bfWx0bd5KR4LnP3rCKLIMkxoJYFPUayPMgwEEeN/ENSw==}
peerDependencies:
react: ^16.8.0 || ^17.0.0 || ^18.0.0
react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0
dependencies:
'@storybook/client-logger': 7.0.0-rc.5
memoizerific: 1.11.3
qs: 6.11.1
react: 18.2.0
react-dom: 18.2.0(react@18.2.0)
dev: true
/@storybook/semver@7.3.2:
resolution: {integrity: sha512-SWeszlsiPsMI0Ps0jVNtH64cI5c0UF3f7KgjVKJoNP30crQ6wUSddY2hsdeczZXEKVJGEn50Q60flcGsQGIcrg==}
engines: {node: '>=10'}
@ -5869,20 +5785,6 @@ packages:
react-dom: 18.2.0(react@18.2.0)
dev: true
/@storybook/theming@7.0.0-rc.5(react-dom@18.2.0)(react@18.2.0):
resolution: {integrity: sha512-OzwybDA2+4FWg85tcTNQkVI0JnHkwCRG9HM1qx9hOZJHNRfxmJFjJePOnBoXM6CjVlz0S1PJUwCmMHNH8OTvEw==}
peerDependencies:
react: ^16.8.0 || ^17.0.0 || ^18.0.0
react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0
dependencies:
'@emotion/use-insertion-effect-with-fallbacks': 1.0.0(react@18.2.0)
'@storybook/client-logger': 7.0.0-rc.5
'@storybook/global': 5.0.0
memoizerific: 1.11.3
react: 18.2.0
react-dom: 18.2.0(react@18.2.0)
dev: true
/@storybook/types@7.0.0-rc.10:
resolution: {integrity: sha512-aKyz4eJaWsywqX8kL2syTL8jGZFildIw/Z5o5S13KZwR+Vdijss2sNoDIAUK5XgSi9vxG/Jd13CS5zTEBaSpMA==}
dependencies:
@ -5892,15 +5794,6 @@ packages:
file-system-cache: 2.0.2
dev: true
/@storybook/types@7.0.0-rc.5:
resolution: {integrity: sha512-gLKUY7EfPYenz0Y1jw90AUAUlKTHOj9p7J3d8GcI5x5buHdU+M7Q1jotPWzDwRFI24y3Ob31oyCBhysIw8S2Aw==}
dependencies:
'@storybook/channels': 7.0.0-rc.5
'@types/babel__core': 7.20.0
'@types/express': 4.17.17
file-system-cache: 2.0.2
dev: true
/@storybook/vue3-vite@7.0.0-rc.10(react-dom@18.2.0)(react@18.2.0)(typescript@5.0.2)(vite@4.2.1)(vue@3.2.47):
resolution: {integrity: sha512-gNUlREXPv9C61VqmLW9MmlAFAgki9o60+CKwMDLp3Ey/WxEwH+JGOmhc5ne6H4du9FZLnDbBa3zphkS0Ve7qWw==}
engines: {node: ^14.18 || >=16}