Files
owncast/web/components/ui/Sidebar/Sidebar.tsx

29 lines
926 B
TypeScript

import Sider from 'antd/lib/layout/Sider';
import { useRecoilValue } from 'recoil';
import { ChatMessage } from '../../../interfaces/chat-message.model';
import ChatContainer from '../../chat/ChatContainer';
import { chatMessages, chatVisibility as chatVisibilityAtom } from '../../stores/ClientConfigStore';
import { ChatVisibilityState } from '../../../interfaces/application-state';
import ChatTextField from '../../chat/ChatTextField';
export default function Sidebar() {
const messages = useRecoilValue<ChatMessage[]>(chatMessages);
const chatVisibility = useRecoilValue<ChatVisibilityState>(chatVisibilityAtom);
return (
<Sider
collapsed={chatVisibility === ChatVisibilityState.Hidden}
width={300}
style={{
position: 'fixed',
right: 0,
top: 0,
bottom: 0,
}}
>
<ChatContainer messages={messages} />
<ChatTextField />
</Sider>
);
}