채팅 피드백

[DevelopSoo]

1. type은 컴포넌트 밖에서 선언해주세요. 컴포넌트가 렌더링될 때마다 타입이 생성되는 문제가 있습니다.
   

   chatting/src/components/Chat.tsx

   Lines 20 to 26 in 8fb8a47

   	type MessageType = {
   	id: string;
   	chat_room_id: string;
   	sender_id: string;
   	content: string;
   	created_at: string;
   	};

2. 이름이 좀 이상하네요. isSession(세션이니?) 라는 뜻으로 보이는데 isSession에 user.id가 있는 것이 이상합니다.
   

   chatting/src/components/Chat.tsx

   Line 45 in 8fb8a47

   const userId = isSession?.user.id;

3. chatGPT 쓴 거 너무 티내지 맙시당. 회사에선 잘 지웁시다.
   

   chatting/src/components/Chat.tsx

   Line 47 in 8fb8a47

   // Check if a chat room already exists

4. 해당 로직이 무슨 뜻인지 정확히 이해하고 넘어갑시다.
   

   chatting/src/components/Chat.tsx

   Lines 48 to 53 in 8fb8a47

   	const { data: existingRooms, error } = await supabase
   	.from('chat_room')
   	.select('id')
   	.or(
   	`and(user1_id.eq.${userId},user2_id.eq.${selectedFriendId}),and(user1_id.eq.${selectedFriendId},user2_id.eq.${userId})`
   	);

5. 하나만 가져올 거라면 처음부터 배열이 아니라 하나만 가져오게 할 수 있습니다.
   

   chatting/src/components/Chat.tsx

   Lines 59 to 61 in 8fb8a47

   	if (existingRooms.length > 0) {
   	setChatRoomId(existingRooms[0].id);
   	} else {

6. 버튼 클릭 시 해당 채팅방으로 들어가거나, 채팅이 없으면 생성하는 버튼을 만들어 로직들이 분리되어도 되는데, 굳이 useEffect로 만들어야 할까요? useEffect가 너무 많아 로직이 복잡해보여서요.
   

   chatting/src/components/Chat.tsx

   Lines 43 to 78 in 8fb8a47

   	useEffect(() => {
   	const createOrFetchChatRoom = async () => {
   	const userId = isSession?.user.id;
   	// Check if a chat room already exists
   	const { data: existingRooms, error } = await supabase
   	.from('chat_room')
   	.select('id')
   	.or(
   	`and(user1_id.eq.${userId},user2_id.eq.${selectedFriendId}),and(user1_id.eq.${selectedFriendId},user2_id.eq.${userId})`
   	);
   	if (error) {
   	return;
   	}
   	if (existingRooms.length > 0) {
   	setChatRoomId(existingRooms[0].id);
   	} else {
   	// Create a new chat room
   	const { data: newRoom, error: createError } = await supabase
   	.from('chat_room')
   	.insert([{ user1_id: userId, user2_id: selectedFriendId }])
   	.select() // 여기서 새로 생성된 채팅방의 데이터를 반환
   	.single();
   	if (createError) {
   	return;
   	} else {
   	setChatRoomId(newRoom.id);
   	}
   	}
   	};
   	createOrFetchChatRoom();
   	}, [selectedFriendId]);