43 lines
1.3 KiB
TypeScript
43 lines
1.3 KiB
TypeScript
'use client';
|
|
|
|
import { IconButton } from '@/components/ui/button';
|
|
import Input from './Input';
|
|
import MessageList from './MessageList';
|
|
import SettingDialog from './Drawer';
|
|
import { useStreamChatStore } from '@/app/(main)/chat/[id]/stream-chat';
|
|
import { useParams } from 'next/navigation';
|
|
import { useEffect, useState } from 'react';
|
|
|
|
export default function ChatPage() {
|
|
const { id } = useParams();
|
|
const [settingOpen, setSettingOpen] = useState(false);
|
|
const switchToChannel = useStreamChatStore((s) => s.switchToChannel);
|
|
const client = useStreamChatStore((s) => s.client);
|
|
|
|
useEffect(() => {
|
|
if (id && client) {
|
|
switchToChannel(id as string);
|
|
}
|
|
}, [id, client]);
|
|
|
|
return (
|
|
<div className="flex h-full">
|
|
<div className="relative px-4 w-full flex-1 flex justify-center">
|
|
<div className="max-w-[752px] w-full h-full flex flex-col">
|
|
<MessageList />
|
|
<Input />
|
|
</div>
|
|
<IconButton
|
|
onClick={() => setSettingOpen(!settingOpen)}
|
|
className="absolute top-1 right-1"
|
|
variant="ghost"
|
|
size="small"
|
|
>
|
|
<i className="iconfont-v2 iconv2-zhedie" />
|
|
</IconButton>
|
|
</div>
|
|
<SettingDialog open={settingOpen} onOpenChange={setSettingOpen} />
|
|
</div>
|
|
);
|
|
}
|