mirror of
https://github.com/owncast/owncast.git
synced 2024-11-22 04:40:37 +03:00
97 lines
2.8 KiB
TypeScript
97 lines
2.8 KiB
TypeScript
import React from 'react';
|
|
import { ComponentStory, ComponentMeta } from '@storybook/react';
|
|
import { RecoilRoot } from 'recoil';
|
|
import ChatModerationActionMenu from '../components/chat/ChatModerationActionMenu/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> = args => (
|
|
<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({});
|