Skip to content

Commit

Permalink
Merge pull request #16 from Help-M-Ssaem/feat/#11
Browse files Browse the repository at this point in the history
[Fix] Vercel deploy error
  • Loading branch information
uiop5809 authored Aug 8, 2024
2 parents f5dc113 + ee2b480 commit 405aa93
Show file tree
Hide file tree
Showing 3 changed files with 74 additions and 84 deletions.
4 changes: 2 additions & 2 deletions src/app/board/page.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -9,9 +9,9 @@ import { useState } from 'react'

const BoardPage = () => {
const [mbti, setMbti] = useState<string>('all')
const [page, setPage] = useState<number>(0)
// const [page, setPage] = useState<number>(0)

const { data } = useBoardList(mbti, page, 6)
const { data } = useBoardList(mbti, 0, 6)

return (
<>
Expand Down
152 changes: 71 additions & 81 deletions src/app/chatting/page.tsx
Original file line number Diff line number Diff line change
@@ -1,88 +1,78 @@
'use client'

import React, { useState, useEffect, useRef } from 'react'

const Chatting = () => {
const chatRoomId = 1
const member = 1
const [messages, setMessages] = useState<string[]>([])
const [input, setInput] = useState<string>('')
const [isConnected, setIsConnected] = useState<boolean>(false)
const socketRef = useRef<WebSocket | null>(null)

useEffect(() => {
const socket = new WebSocket(
`wss://lc3cc1cnma.execute-api.ap-northeast-2.amazonaws.com/mssaem?chatRoomId=${chatRoomId}&member=${member}`,
)

socket.onopen = () => {
console.log('WebSocket Opened')
setIsConnected(true)
}

socket.onmessage = (event: MessageEvent<string>) => {
console.log('WebSocket Message:', event.data)
setMessages((prev) => [...prev, event.data])
}

socket.onerror = (error: Event) => {
console.error('WebSocket Error:', error)
}

socket.onclose = () => {
console.log('WebSocket is closed')
setIsConnected(false)
}

socketRef.current = socket

return () => {
socket.close()
}
}, [chatRoomId, member])

const sendMessage = () => {
if (socketRef.current && input.trim() !== '') {
const message = {
action: 'sendMessage',
chatRoomId: 1,
message: input,
}
socketRef.current.send(JSON.stringify(message))
setInput('')
}
}

const disconnect = () => {
if (socketRef.current) {
socketRef.current.close()
socketRef.current = null
setIsConnected(false)
}
}
// const chatRoomId = 1
// const member = 1
// const [messages, setMessages] = useState<string[]>([])
// const [input, setInput] = useState<string>('')
// const [isConnected, setIsConnected] = useState<boolean>(false)
// const socketRef = useRef<WebSocket | null>(null)
// useEffect(() => {
// const socket = new WebSocket(
// `wss://lc3cc1cnma.execute-api.ap-northeast-2.amazonaws.com/mssaem?chatRoomId=${chatRoomId}&member=${member}`,
// )
// socket.onopen = () => {
// console.log('WebSocket Opened')
// setIsConnected(true)
// }
// socket.onmessage = (event: MessageEvent<string>) => {
// console.log('WebSocket Message:', event.data)
// setMessages((prev) => [...prev, event.data])
// }
// socket.onerror = (error: Event) => {
// console.error('WebSocket Error:', error)
// }
// socket.onclose = () => {
// console.log('WebSocket is closed')
// setIsConnected(false)
// }
// socketRef.current = socket
// return () => {
// socket.close()
// }
// }, [chatRoomId, member])
// const sendMessage = () => {
// if (socketRef.current && input.trim() !== '') {
// const message = {
// action: 'sendMessage',
// chatRoomId: 1,
// message: input,
// }
// socketRef.current.send(JSON.stringify(message))
// setInput('')
// }
// }
// const disconnect = () => {
// if (socketRef.current) {
// socketRef.current.close()
// socketRef.current = null
// setIsConnected(false)
// }
// }
// return (
// <div>
// <h1>Chatting</h1>
// <div>
// {messages.map((msg, index) => (
// <div key={index}>{msg}</div>
// ))}
// </div>
// <input
// type="text"
// value={input}
// onChange={(e) => setInput(e.target.value)}
// onKeyPress={(e) => {
// if (e.key === 'Enter') {
// sendMessage()
// }
// }}
// />
// {/* <button onClick={sendMessage}>Send</button>
// {isConnected && <button onClick={disconnect}>Disconnect</button>} */}
// </div>
// )

return (
<div>
<h1>Chatting</h1>
<div>
{messages.map((msg, index) => (
<div key={index}>{msg}</div>
))}
</div>
<input
type="text"
value={input}
onChange={(e) => setInput(e.target.value)}
onKeyPress={(e) => {
if (e.key === 'Enter') {
sendMessage()
}
}}
/>
<button onClick={sendMessage}>Send</button>
{isConnected && <button onClick={disconnect}>Disconnect</button>}
</div>
)
return <div>test</div>
}

export default Chatting
2 changes: 1 addition & 1 deletion src/components/home/HotBoardBox.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ const HotBoardBox = () => {
{data && (
<>
{data.map((board) => (
<HotBoard hotBoard={board} key={board.id} />
<HotBoard hotBoard={board} key={board.title} />
))}
</>
)}
Expand Down

0 comments on commit 405aa93

Please sign in to comment.