feat: Implement conversation mute and favorite features with UI, API, and state management.

This commit is contained in:
pradeepkumar
2026-03-19 17:03:25 +05:30
parent 51fd050945
commit 19b90285da
5 changed files with 99 additions and 4 deletions

View File

@@ -148,6 +148,8 @@ export function MessagingPage({ initialConversationId }: { initialConversationId
markAllAsRead,
deleteConversation,
clearMessages,
toggleMute,
toggleFavorite,
} = useMessaging();
const [searchQuery, setSearchQuery] = useState('');
@@ -796,9 +798,17 @@ export function MessagingPage({ initialConversationId }: { initialConversationId
{/* Content */}
<div className="flex-1 min-w-0">
<div className="flex items-center gap-2 mb-1">
{(userRole === 'AGENT' ? conversation.agentFavorited : conversation.userFavorited) && (
<Image src="/assets/icons/star-filled-icon.svg" alt="Starred" width={14} height={14} className="flex-shrink-0" />
)}
<p className="font-fractul font-medium text-[14px] leading-[17px] text-[#00293D]">
{conversation.otherParty?.name || 'Unknown'}
</p>
{(userRole === 'AGENT' ? conversation.agentMuted : conversation.userMuted) && (
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" className="flex-shrink-0 text-[#00293D]/40">
<path d="M11 5L6 9H2v6h4l5 4V5zM23 9l-6 6M17 9l6 6" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"/>
</svg>
)}
{conversation.unreadCount > 0 && (
<span className="bg-[#e58625] text-white text-xs font-bold px-2 py-0.5 rounded-full min-w-[20px] text-center">
{conversation.unreadCount}
@@ -829,9 +839,13 @@ export function MessagingPage({ initialConversationId }: { initialConversationId
{...selectedUserInfo}
isTyping={typingUserNames.length > 0}
typingText={typingUserNames.length > 0 ? `${typingUserNames.join(', ')} is typing...` : undefined}
isMuted={userRole === 'AGENT' ? (currentConversation?.agentMuted || false) : (currentConversation?.userMuted || false)}
isStarred={userRole === 'AGENT' ? (currentConversation?.agentFavorited || false) : (currentConversation?.userFavorited || false)}
onClearChat={clearMessages}
onDeleteConversation={handleDeleteConversation}
onReportUser={() => setIsReportModalOpen(true)}
onToggleMute={(muted) => currentConversation && toggleMute(currentConversation.id, muted)}
onToggleStar={(starred) => currentConversation && toggleFavorite(currentConversation.id, starred)}
/>
{/* Messages area wrapper */}