diff --git a/app/javascript/mastodon/components/status/status.stories.tsx b/app/javascript/mastodon/components/status/status.stories.tsx index 379e37a54ed..197bb5668fe 100644 --- a/app/javascript/mastodon/components/status/status.stories.tsx +++ b/app/javascript/mastodon/components/status/status.stories.tsx @@ -1,5 +1,4 @@ import type { FC } from 'react'; -import { useMemo } from 'react'; import { Map as ImmutableMap } from 'immutable'; @@ -7,6 +6,7 @@ import type { Meta, StoryObj } from '@storybook/react-vite'; import { fn } from 'storybook/test'; import type { StatusVisibility } from '@/mastodon/api_types/statuses'; +import { useAppSelector } from '@/mastodon/store'; import { accountFactoryImmutable, pollFactoryImmutable, @@ -58,108 +58,47 @@ const otherAccount = accountFactoryImmutable({ const StatusStoryComponent: FC = (props) => { const { - text, - visibility, isReblog, isReply, isPoll, isQuote, - attachment1, - attachment2, - attachment3, contentWarning, - hasFavourited, - hasReblogged, - hasBookmarked, hasFilter, hasVoted, - showTranslate, disableActions = false, contextType, showThread, showCounters, - favouriteCount = 0, - replyCount = 0, - reblogCount = 0, hidden, muted, showPrepend = true, } = props; - const { account, status } = useMemo(() => { - const account = accountFactoryImmutable(); + const account = useAppSelector((state) => state.accounts.get('1')); + const status = useAppSelector((state) => + state.statuses.get('1')?.withMutations((status) => { + status.set('account', account); + status.set('matched_filters', hasFilter ? ['test'] : false); + status.set('matched_media_filters', hasFilter ? ['test'] : false); + status.set('hidden', hidden); - return { - account, - status: statusFactoryImmutable({ - text, - spoiler_text: contentWarning, - visibility, - media_attachments: attachmentFactory( - attachment1, - attachment2, - attachment3, - ), - reblogged: hasReblogged, - favourited: hasFavourited, - bookmarked: hasBookmarked, - in_reply_to_account_id: isReply ? '2' : undefined, - in_reply_to_id: isReply ? '2' : undefined, - quote: isQuote - ? { - state: 'accepted', - quoted_status: { ...statusFactoryAPI(), quote: undefined }, - } - : undefined, - favourites_count: favouriteCount, - reblogs_count: reblogCount, - replies_count: replyCount, - language: showTranslate ? 'xx' : undefined, - }).withMutations((status) => { - status.set('account', account); - status.set('matched_filters', hasFilter ? ['test'] : false); - status.set('matched_media_filters', hasFilter ? ['test'] : false); - status.set('hidden', hidden); + // StatusActionBar checks specifically for null so undefined doesn't work. + if (!status.get('in_reply_to_id')) { + status.set('in_reply_to_id', null); + } - // StatusActionBar checks specifically for null so undefined doesn't work. - if (!status.get('in_reply_to_id')) { - status.set('in_reply_to_id', null); - } - - if (isReblog) { - status.set( - 'reblog', - statusFactoryImmutable({ id: '2' }).set('account', otherAccount), - ); - } - if (isPoll) { - status.set('poll', hasVoted ? '2' : '1'); - } - }), - }; - }, [ - text, - contentWarning, - visibility, - attachment1, - attachment2, - attachment3, - hasReblogged, - hasFavourited, - hasBookmarked, - isReply, - isQuote, - favouriteCount, - reblogCount, - replyCount, - showTranslate, - hasFilter, - hidden, - isReblog, - isPoll, - hasVoted, - ]); + if (isReblog) { + status.set( + 'reblog', + statusFactoryImmutable({ id: '2' }).set('account', otherAccount), + ); + } + if (isPoll) { + status.set('poll', hasVoted ? '2' : '1'); + } + }), + ); return (
@@ -374,6 +313,60 @@ const meta = { }, }, }, + stateFn({ + text, + contentWarning, + visibility, + attachment1, + attachment2, + attachment3, + hasBookmarked, + hasFavourited, + hasReblogged, + isQuote, + isReply, + favouriteCount, + reblogCount, + replyCount, + showTranslate, + }: StatusStoryProps) { + const account = accountFactoryImmutable(); + + const status = statusFactoryImmutable({ + text, + spoiler_text: contentWarning, + visibility, + media_attachments: attachmentFactory( + attachment1, + attachment2, + attachment3, + ), + reblogged: hasReblogged, + favourited: hasFavourited, + bookmarked: hasBookmarked, + in_reply_to_account_id: isReply ? '2' : undefined, + in_reply_to_id: isReply ? '2' : undefined, + quote: isQuote + ? { + state: 'accepted', + quoted_status: { ...statusFactoryAPI(), quote: undefined }, + } + : undefined, + favourites_count: favouriteCount, + reblogs_count: reblogCount, + replies_count: replyCount, + language: showTranslate ? 'xx' : undefined, + }); + + return { + statuses: { + '1': status, + }, + accounts: { + '1': account, + }, + }; + }, controls: { disableSaveFromUI: true, },