Fix unread badge refresh and reply thread UI
This commit is contained in:
@@ -126,12 +126,16 @@ export default function ChatPage() {
|
|||||||
|
|
||||||
const markAsRead = async (conversationId: string) => {
|
const markAsRead = async (conversationId: string) => {
|
||||||
try {
|
try {
|
||||||
await fetch('/api/swarm/chat/messages', {
|
const res = await fetch('/api/swarm/chat/messages', {
|
||||||
method: 'PATCH',
|
method: 'PATCH',
|
||||||
headers: { 'Content-Type': 'application/json' },
|
headers: { 'Content-Type': 'application/json' },
|
||||||
body: JSON.stringify({ conversationId })
|
body: JSON.stringify({ conversationId })
|
||||||
});
|
});
|
||||||
|
if (!res.ok) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
setConversations(prev => prev.map(c => c.id === conversationId ? { ...c, unreadCount: 0 } : c));
|
setConversations(prev => prev.map(c => c.id === conversationId ? { ...c, unreadCount: 0 } : c));
|
||||||
|
window.dispatchEvent(new Event('synapsis:chat-updated'));
|
||||||
} catch { }
|
} catch { }
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|||||||
@@ -69,6 +69,7 @@ export default function NotificationsPage() {
|
|||||||
throw new Error('Failed to mark notifications as read');
|
throw new Error('Failed to mark notifications as read');
|
||||||
}
|
}
|
||||||
setNotifications(prev => prev.map(n => ({ ...n, readAt: new Date().toISOString() })));
|
setNotifications(prev => prev.map(n => ({ ...n, readAt: new Date().toISOString() })));
|
||||||
|
window.dispatchEvent(new Event('synapsis:notifications-updated'));
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
console.error('Failed to mark notifications as read:', err);
|
console.error('Failed to mark notifications as read:', err);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -473,7 +473,6 @@ export function PostCard({ post, onLike, onRepost, onComment, onDelete, onHide,
|
|||||||
showThread={false}
|
showThread={false}
|
||||||
isThreadParent={true}
|
isThreadParent={true}
|
||||||
/>
|
/>
|
||||||
<div className="thread-line" />
|
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
<article className={`post ${isDetail ? 'detail' : ''}`}>
|
<article className={`post ${isDetail ? 'detail' : ''}`}>
|
||||||
|
|||||||
+38
-20
@@ -1,6 +1,6 @@
|
|||||||
'use client';
|
'use client';
|
||||||
|
|
||||||
import { useState, useEffect } from 'react';
|
import { useState, useEffect, useCallback } from 'react';
|
||||||
import Link from 'next/link';
|
import Link from 'next/link';
|
||||||
import Image from 'next/image';
|
import Image from 'next/image';
|
||||||
import { usePathname, useRouter } from 'next/navigation';
|
import { usePathname, useRouter } from 'next/navigation';
|
||||||
@@ -31,43 +31,61 @@ export function Sidebar() {
|
|||||||
});
|
});
|
||||||
}, []);
|
}, []);
|
||||||
|
|
||||||
// Fetch unread notification count
|
const fetchUnreadNotifications = useCallback(() => {
|
||||||
useEffect(() => {
|
|
||||||
if (!user) return;
|
|
||||||
|
|
||||||
const fetchUnread = () => {
|
|
||||||
fetch('/api/notifications?unread=true&limit=50')
|
fetch('/api/notifications?unread=true&limit=50')
|
||||||
.then(res => res.json())
|
.then(res => res.json())
|
||||||
.then(data => {
|
.then(data => {
|
||||||
setUnreadCount(data.notifications?.length || 0);
|
setUnreadCount(data.notifications?.length || 0);
|
||||||
})
|
})
|
||||||
.catch(() => { });
|
.catch(() => { });
|
||||||
};
|
}, []);
|
||||||
|
|
||||||
fetchUnread();
|
const fetchUnreadChats = useCallback(() => {
|
||||||
// Poll every 30 seconds
|
|
||||||
const interval = setInterval(fetchUnread, 30000);
|
|
||||||
return () => clearInterval(interval);
|
|
||||||
}, [user]);
|
|
||||||
|
|
||||||
// Fetch unread chat count
|
|
||||||
useEffect(() => {
|
|
||||||
if (!user) return;
|
|
||||||
|
|
||||||
const fetchUnreadChats = () => {
|
|
||||||
fetch('/api/chat/unread')
|
fetch('/api/chat/unread')
|
||||||
.then(res => res.json())
|
.then(res => res.json())
|
||||||
.then(data => {
|
.then(data => {
|
||||||
setUnreadChatCount(data.unreadCount || 0);
|
setUnreadChatCount(data.unreadCount || 0);
|
||||||
})
|
})
|
||||||
.catch(() => { });
|
.catch(() => { });
|
||||||
|
}, []);
|
||||||
|
|
||||||
|
// Fetch unread notification count
|
||||||
|
useEffect(() => {
|
||||||
|
if (!user) return;
|
||||||
|
|
||||||
|
fetchUnreadNotifications();
|
||||||
|
|
||||||
|
const handleUnreadRefresh = () => {
|
||||||
|
fetchUnreadNotifications();
|
||||||
};
|
};
|
||||||
|
|
||||||
|
window.addEventListener('synapsis:notifications-updated', handleUnreadRefresh);
|
||||||
|
// Poll every 30 seconds
|
||||||
|
const interval = setInterval(fetchUnreadNotifications, 30000);
|
||||||
|
return () => {
|
||||||
|
clearInterval(interval);
|
||||||
|
window.removeEventListener('synapsis:notifications-updated', handleUnreadRefresh);
|
||||||
|
};
|
||||||
|
}, [user, fetchUnreadNotifications]);
|
||||||
|
|
||||||
|
// Fetch unread chat count
|
||||||
|
useEffect(() => {
|
||||||
|
if (!user) return;
|
||||||
|
|
||||||
fetchUnreadChats();
|
fetchUnreadChats();
|
||||||
|
|
||||||
|
const handleUnreadRefresh = () => {
|
||||||
|
fetchUnreadChats();
|
||||||
|
};
|
||||||
|
|
||||||
|
window.addEventListener('synapsis:chat-updated', handleUnreadRefresh);
|
||||||
// Poll every 10 seconds
|
// Poll every 10 seconds
|
||||||
const interval = setInterval(fetchUnreadChats, 10000);
|
const interval = setInterval(fetchUnreadChats, 10000);
|
||||||
return () => clearInterval(interval);
|
return () => {
|
||||||
}, [user]);
|
clearInterval(interval);
|
||||||
|
window.removeEventListener('synapsis:chat-updated', handleUnreadRefresh);
|
||||||
|
};
|
||||||
|
}, [user, fetchUnreadChats]);
|
||||||
|
|
||||||
// Home is exact match
|
// Home is exact match
|
||||||
const isHome = pathname === '/';
|
const isHome = pathname === '/';
|
||||||
|
|||||||
Reference in New Issue
Block a user