- types.ts: ChatInterfaceProps - useChatInterface: state, wsService, loadMessages, loadChatStats, handleSendMessage, formatTimestamp - ChatInterfaceHeader, ChatInterfaceMessages, ChatInterfaceInput - ChatInterfaceSkeleton for Loading state - Stories: Default, ProductionRoom, Loading (Skeleton) - Decorator h-[600px] -> min-h-layout-page - Re-export from ChatInterface.tsx Co-authored-by: Cursor <cursoragent@cursor.com>
39 lines
852 B
TypeScript
39 lines
852 B
TypeScript
import type { Meta, StoryObj } from '@storybook/react';
|
|
import { ChatInterface } from './ChatInterface';
|
|
import { ChatInterfaceSkeleton } from './chat-interface';
|
|
|
|
const meta = {
|
|
title: 'Components/Features/Chat/ChatInterface',
|
|
component: ChatInterface,
|
|
tags: ['autodocs'],
|
|
argTypes: {
|
|
onRoomChange: { action: 'room changed' },
|
|
},
|
|
decorators: [
|
|
(Story) => (
|
|
<div className="min-h-layout-page border rounded-lg overflow-hidden">
|
|
<Story />
|
|
</div>
|
|
),
|
|
],
|
|
} satisfies Meta<typeof ChatInterface>;
|
|
|
|
export default meta;
|
|
type Story = StoryObj<typeof meta>;
|
|
|
|
export const Default: Story = {
|
|
args: {
|
|
room: 'general',
|
|
},
|
|
};
|
|
|
|
export const ProductionRoom: Story = {
|
|
args: {
|
|
room: 'production-help',
|
|
},
|
|
};
|
|
|
|
export const Loading: Story = {
|
|
name: 'Loading',
|
|
render: () => <ChatInterfaceSkeleton />,
|
|
};
|