12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697 |
- import React from 'react';
- import { ComponentStory, ComponentMeta } from '@storybook/react';
- import { RecoilRoot } from 'recoil';
- import { ChatModerationActionMenu } from './ChatModerationActionMenu';
- const mocks = {
- mocks: [
- {
- // The "matcher" determines if this
- // mock should respond to the current
- // call to fetch().
- matcher: {
- name: 'response',
- url: 'glob:/api/moderation/chat/user/*',
- },
- // If the "matcher" matches the current
- // fetch() call, the fetch response is
- // built using this "response".
- response: {
- status: 200,
- body: {
- user: {
- id: 'hjFPU967R',
- displayName: 'focused-snyder',
- displayColor: 2,
- createdAt: '2022-07-12T13:08:31.406505322-07:00',
- previousNames: ['focused-snyder'],
- scopes: ['MODERATOR'],
- isBot: false,
- authenticated: false,
- },
- connectedClients: [
- {
- messageCount: 3,
- userAgent:
- 'Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/100.0.4896.127 Safari/537.36',
- connectedAt: '2022-07-20T16:45:07.796685618-07:00',
- geo: 'N/A',
- },
- ],
- messages: [
- {
- id: 'bQp8UJR4R',
- timestamp: '2022-07-20T16:53:41.938083228-07:00',
- user: null,
- body: 'test message 3',
- },
- {
- id: 'ubK88Jg4R',
- timestamp: '2022-07-20T16:53:39.675531279-07:00',
- user: null,
- body: 'test message 2',
- },
- {
- id: '20v8UJRVR',
- timestamp: '2022-07-20T16:53:37.551084121-07:00',
- user: null,
- body: 'test message 1',
- },
- ],
- },
- },
- },
- ],
- };
- export default {
- title: 'owncast/Chat/Moderation menu',
- component: ChatModerationActionMenu,
- parameters: {
- fetchMock: mocks,
- docs: {
- description: {
- component: `This should be a popup that is activated from a user's chat message. It should have actions to:
- - Remove single message
- - Ban user completely
- - Open modal to see user details
- `,
- },
- },
- },
- } as ComponentMeta<typeof ChatModerationActionMenu>;
- // eslint-disable-next-line @typescript-eslint/no-unused-vars
- const Template: ComponentStory<typeof ChatModerationActionMenu> = () => (
- <RecoilRoot>
- <ChatModerationActionMenu
- accessToken="abc123"
- messageID="xxx"
- userDisplayName="Fake-User"
- userID="abc123"
- />
- </RecoilRoot>
- );
- // eslint-disable-next-line @typescript-eslint/no-unused-vars
- export const Basic = Template.bind({});
|