Show mentioned badges & enable scrolling to mentions in conversations

This commit is contained in:
trevor-signal 2023-05-23 17:59:07 -04:00 committed by GitHub
parent caaeda8abe
commit d012779e87
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
21 changed files with 694 additions and 184 deletions

View file

@ -7,15 +7,17 @@ import { action } from '@storybook/addon-actions';
import { setupI18n } from '../../util/setupI18n';
import enMessages from '../../../_locales/en/messages.json';
import type { Props } from './ScrollDownButton';
import { ScrollDownButton } from './ScrollDownButton';
import type { ScrollDownButtonPropsType } from './ScrollDownButton';
import { ScrollDownButton, ScrollDownButtonVariant } from './ScrollDownButton';
const i18n = setupI18n('en', enMessages);
const createProps = (overrideProps: Partial<Props> = {}): Props => ({
const createProps = (
overrideProps: Partial<ScrollDownButtonPropsType> = {}
): ScrollDownButtonPropsType => ({
variant: ScrollDownButtonVariant.UNREAD_MESSAGES,
i18n,
scrollDown: action('scrollDown'),
conversationId: 'fake-conversation-id',
onClick: action('scrollDown'),
...overrideProps,
});
@ -23,7 +25,7 @@ export default {
title: 'Components/Conversation/ScrollDownButton',
component: ScrollDownButton,
argTypes: {
unreadCount: {
count: {
control: { type: 'radio' },
options: {
None: undefined,
@ -36,10 +38,22 @@ export default {
} as Meta;
// eslint-disable-next-line react/function-component-definition
const Template: Story<Props> = args => <ScrollDownButton {...args} />;
const Template: Story<ScrollDownButtonPropsType> = args => (
<ScrollDownButton {...args} />
);
export const Default = Template.bind({});
Default.args = createProps({});
Default.story = {
name: 'Default',
export const UnreadMessages = Template.bind({});
UnreadMessages.args = createProps({
variant: ScrollDownButtonVariant.UNREAD_MESSAGES,
});
UnreadMessages.story = {
name: 'UnreadMessages',
};
export const UnreadMentions = Template.bind({});
UnreadMentions.args = createProps({
variant: ScrollDownButtonVariant.UNREAD_MENTIONS,
});
UnreadMentions.story = {
name: 'UnreadMentions',
};