lucasvbr/meeting-app
1
0
Fork 0
mirror of https://github.com/LucasVbr/meeting-app.git synced 2026-07-09 15:08:06 +00:00
Code Issues Packages Projects Releases Wiki Activity

Send Messages in chat

Browse Source 
TODO:
- use socket to reload
- use Redux do avoid props drilling

Took 1 hour 44 minutes
This commit is contained in:
Lucàs
2023-04-02 23:50:46 +02:00
parent 2dfe2cac7b
commit 7f48ea2964
8 changed files with 3531 additions and 3456 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/chat/[id].tsx
+15 -32
View File
@@ -1,53 +1,36 @@
import {Container, Flex, Text} from '@chakra-ui/react';
import {Container, Flex, Input, Text} from '@chakra-ui/react';
import Head from 'next/head';
import {websiteName} from '@/lib/constants';
import {useSession} from 'next-auth/react';
import {useRouter} from 'next/router';
import {useEffect} from 'react';
import Message from '@/components/Message';
import {useEffect, useState} from 'react';
export default function Chat() {
import MessageList from '@/components/chat/MessageList';
import FormMessage from '@/components/form/FormMessage';
export default function ChatId() {
const router = useRouter();
const {data: session, status} = useSession();
const {id} = router.query;
const [messages, setMessages] = useState([])
useEffect(() => {
switch (status) {
case 'loading':
return;
case 'unauthenticated':
return router.push('/login');
case 'authenticated':
fetch(`/api/chats/${id}`).then(res => res.json()).then(chat => {
if (!chat.UserID.contain(session?.user?.id)) router.push('/login');
});
return;
}
if (status === "authenticated")
fetch(`/api/messages?where={"ChatID": "${id}"}`)
.then(res => res.json())
.then(msgs => setMessages(msgs))
}, [status]);
if (status === "loading") return <Text>Loading...</Text>
const messages = [
{sender: "me", message: "salut"},
{sender: "other", message: "salut"},
{sender: "me", message: "salut"},
{sender: "other", message: "salut"},
{sender: "me", message: "salut"},
{sender: "other", message: "salut"},
]
if (status === 'loading') return <Text>Loading...</Text>;
if (session && messages)
return (
<>
<Head><title>{websiteName}</title></Head>
<Container>
<Flex direction={'column'}>
{
messages.map(m => <Message sender={m.sender} message={m.message}/>)
}
</Flex>
<Text>Hello World {session?.user?.firstName ?? ""}</Text>
<MessageList user={session.user} messages={messages}/>
<FormMessage user={session.user} chatId={id} />
</Container>
</>
);
src/pages/chat/index.tsx
+17
View File
@@ -0,0 +1,17 @@
import {Button, Text} from '@chakra-ui/react';
import {useSession} from 'next-auth/react';
import {useRouter} from 'next/router';
export default function Chat() {
const router = useRouter();
const {data: session, status} = useSession()
if (session)
return (
<>
{
session.user.ChatID.map((id: string, index: number) => <Button key={index} onClick={() => router.push(`/chat/${id}`)} >{id}</Button>)
}
</>
)
}