removed console logs from frontend and a logs from locationService

This commit is contained in:
jackiettran
2025-11-26 15:01:00 -05:00
parent 8b10103ae4
commit fab79e64ee
6 changed files with 344 additions and 275 deletions

View File

@@ -1,9 +1,9 @@
import React, { useState, useEffect } from 'react';
import { Conversation, Message, User } from '../types';
import { messageAPI } from '../services/api';
import { useAuth } from '../contexts/AuthContext';
import { useSocket } from '../contexts/SocketContext';
import ChatWindow from '../components/ChatWindow';
import React, { useState, useEffect } from "react";
import { Conversation, Message, User } from "../types";
import { messageAPI } from "../services/api";
import { useAuth } from "../contexts/AuthContext";
import { useSocket } from "../contexts/SocketContext";
import ChatWindow from "../components/ChatWindow";
const Messages: React.FC = () => {
const { user } = useAuth();
@@ -23,17 +23,16 @@ const Messages: React.FC = () => {
if (!isConnected) return;
const cleanup = onNewMessage((newMessage: Message) => {
console.log('[Messages] Received new message:', newMessage);
setConversations((prevConversations) => {
// Determine conversation partner
const partnerId = newMessage.senderId === user?.id
? newMessage.receiverId
: newMessage.senderId;
const partnerId =
newMessage.senderId === user?.id
? newMessage.receiverId
: newMessage.senderId;
// Find existing conversation
const existingIndex = prevConversations.findIndex(
c => c.partnerId === partnerId
(c) => c.partnerId === partnerId
);
if (existingIndex !== -1) {
@@ -46,7 +45,7 @@ const Messages: React.FC = () => {
content: newMessage.content,
senderId: newMessage.senderId,
createdAt: newMessage.createdAt,
isRead: newMessage.isRead
isRead: newMessage.isRead,
};
conv.lastMessageAt = newMessage.createdAt;
@@ -58,20 +57,21 @@ const Messages: React.FC = () => {
updated[existingIndex] = conv;
// Re-sort by most recent
updated.sort((a, b) =>
new Date(b.lastMessageAt).getTime() - new Date(a.lastMessageAt).getTime()
updated.sort(
(a, b) =>
new Date(b.lastMessageAt).getTime() -
new Date(a.lastMessageAt).getTime()
);
console.log('[Messages] Updated existing conversation');
return updated;
} else {
// New conversation - add to top
const partner = newMessage.senderId === user?.id
? newMessage.receiver!
: newMessage.sender!;
const partner =
newMessage.senderId === user?.id
? newMessage.receiver!
: newMessage.sender!;
if (!partner) {
console.warn('[Messages] Partner data missing from new message');
return prevConversations;
}
@@ -83,13 +83,13 @@ const Messages: React.FC = () => {
content: newMessage.content,
senderId: newMessage.senderId,
createdAt: newMessage.createdAt,
isRead: newMessage.isRead
isRead: newMessage.isRead,
},
unreadCount: newMessage.receiverId === user?.id && !newMessage.isRead ? 1 : 0,
lastMessageAt: newMessage.createdAt
unreadCount:
newMessage.receiverId === user?.id && !newMessage.isRead ? 1 : 0,
lastMessageAt: newMessage.createdAt,
};
console.log('[Messages] Created new conversation');
return [newConv, ...prevConversations];
}
});
@@ -103,16 +103,17 @@ const Messages: React.FC = () => {
if (!isConnected) return;
const cleanup = onMessageRead((data: any) => {
console.log('[Messages] Message read:', data);
setConversations((prevConversations) => {
return prevConversations.map(conv => {
return prevConversations.map((conv) => {
// If this is the conversation and the last message was marked as read
if (conv.lastMessage.id === data.messageId && !conv.lastMessage.isRead) {
if (
conv.lastMessage.id === data.messageId &&
!conv.lastMessage.isRead
) {
return {
...conv,
lastMessage: { ...conv.lastMessage, isRead: true },
unreadCount: Math.max(0, conv.unreadCount - 1)
unreadCount: Math.max(0, conv.unreadCount - 1),
};
}
return conv;
@@ -127,10 +128,8 @@ const Messages: React.FC = () => {
try {
const response = await messageAPI.getConversations();
setConversations(response.data);
console.log('[Messages] Fetched conversations:', response.data.length);
} catch (err: any) {
console.error('[Messages] Failed to fetch conversations:', err);
setError(err.response?.data?.error || 'Failed to fetch conversations');
setError(err.response?.data?.error || "Failed to fetch conversations");
} finally {
setLoading(false);
}
@@ -142,11 +141,17 @@ const Messages: React.FC = () => {
const diffInHours = (now.getTime() - date.getTime()) / (1000 * 60 * 60);
if (diffInHours < 24) {
return date.toLocaleTimeString('en-US', { hour: 'numeric', minute: '2-digit' });
return date.toLocaleTimeString("en-US", {
hour: "numeric",
minute: "2-digit",
});
} else if (diffInHours < 48) {
return 'Yesterday';
return "Yesterday";
} else {
return date.toLocaleDateString('en-US', { month: 'short', day: 'numeric' });
return date.toLocaleDateString("en-US", {
month: "short",
day: "numeric",
});
}
};
@@ -156,14 +161,10 @@ const Messages: React.FC = () => {
};
const handleMessagesRead = (partnerId: string, count: number) => {
console.log(`[Messages] ${count} messages marked as read for partner ${partnerId}`);
// Update the conversation's unread count
setConversations(prevConversations =>
prevConversations.map(conv =>
conv.partnerId === partnerId
? { ...conv, unreadCount: 0 }
: conv
setConversations((prevConversations) =>
prevConversations.map((conv) =>
conv.partnerId === partnerId ? { ...conv, unreadCount: 0 } : conv
)
);
};
@@ -201,23 +202,29 @@ const Messages: React.FC = () => {
{conversations.length === 0 ? (
<div className="text-center py-5">
<i className="bi bi-envelope" style={{ fontSize: '3rem', color: '#ccc' }}></i>
<i
className="bi bi-envelope"
style={{ fontSize: "3rem", color: "#ccc" }}
></i>
<p className="text-muted mt-2">No conversations yet</p>
</div>
) : (
<div className="list-group">
{conversations.map((conversation) => {
const isUnread = conversation.unreadCount > 0;
const isLastMessageFromPartner = conversation.lastMessage.senderId === conversation.partnerId;
const isLastMessageFromPartner =
conversation.lastMessage.senderId === conversation.partnerId;
return (
<div
key={conversation.partnerId}
className={`list-group-item list-group-item-action ${isUnread ? 'border-start border-primary border-4' : ''}`}
className={`list-group-item list-group-item-action ${
isUnread ? "border-start border-primary border-4" : ""
}`}
onClick={() => handleConversationClick(conversation)}
style={{
cursor: 'pointer',
backgroundColor: isUnread ? '#f0f7ff' : 'white'
cursor: "pointer",
backgroundColor: isUnread ? "#f0f7ff" : "white",
}}
>
<div className="d-flex w-100 justify-content-between align-items-start">
@@ -228,12 +235,16 @@ const Messages: React.FC = () => {
src={conversation.partner.profileImage}
alt={`${conversation.partner.firstName} ${conversation.partner.lastName}`}
className="rounded-circle me-3"
style={{ width: '50px', height: '50px', objectFit: 'cover' }}
style={{
width: "50px",
height: "50px",
objectFit: "cover",
}}
/>
) : (
<div
className="rounded-circle bg-secondary d-flex align-items-center justify-content-center me-3"
style={{ width: '50px', height: '50px' }}
style={{ width: "50px", height: "50px" }}
>
<i className="bi bi-person-fill text-white"></i>
</div>
@@ -242,18 +253,25 @@ const Messages: React.FC = () => {
<div className="flex-grow-1" style={{ minWidth: 0 }}>
{/* User Name and Unread Badge */}
<div className="d-flex align-items-center mb-1">
<h6 className={`mb-0 ${isUnread ? 'fw-bold' : ''}`}>
{conversation.partner.firstName} {conversation.partner.lastName}
<h6 className={`mb-0 ${isUnread ? "fw-bold" : ""}`}>
{conversation.partner.firstName}{" "}
{conversation.partner.lastName}
</h6>
{isUnread && (
<span className="badge bg-primary ms-2">{conversation.unreadCount}</span>
<span className="badge bg-primary ms-2">
{conversation.unreadCount}
</span>
)}
</div>
{/* Last Message Preview */}
<p
className={`mb-0 text-truncate ${isUnread && isLastMessageFromPartner ? 'fw-semibold' : 'text-muted'}`}
style={{ maxWidth: '100%' }}
className={`mb-0 text-truncate ${
isUnread && isLastMessageFromPartner
? "fw-semibold"
: "text-muted"
}`}
style={{ maxWidth: "100%" }}
>
{conversation.lastMessage.senderId === user?.id && (
<span className="me-1">You: </span>
@@ -264,7 +282,10 @@ const Messages: React.FC = () => {
</div>
{/* Timestamp */}
<div className="text-end ms-3" style={{ minWidth: 'fit-content' }}>
<div
className="text-end ms-3"
style={{ minWidth: "fit-content" }}
>
<small className="text-muted d-block">
{formatDate(conversation.lastMessageAt)}
</small>