|
|
|
|
@@ -44,13 +44,26 @@ export const Layout: React.FC<{ children: React.ReactNode }> = ({ children }) =>
|
|
|
|
|
const [notifications, setNotifications] = useState<any[]>([]);
|
|
|
|
|
const [showNotifications, setShowNotifications] = useState(false);
|
|
|
|
|
const unreadCount = notifications.filter(n => !n.is_read).length;
|
|
|
|
|
const previousUnreadCountRef = React.useRef(unreadCount);
|
|
|
|
|
const previousUnreadCountRef = React.useRef(0);
|
|
|
|
|
const isInitialLoadRef = React.useRef(true);
|
|
|
|
|
|
|
|
|
|
// Pre-initialize audio to ensure it's loaded and ready
|
|
|
|
|
const audioRef = React.useRef<HTMLAudioElement | null>(null);
|
|
|
|
|
useEffect(() => {
|
|
|
|
|
// Determine base path correctly whether in prod or dev
|
|
|
|
|
const basePath = import.meta.env.PROD ? '' : 'http://localhost:3001';
|
|
|
|
|
audioRef.current = new Audio(`${basePath}/audio/notification.mp3`);
|
|
|
|
|
audioRef.current.volume = 0.5;
|
|
|
|
|
}, []);
|
|
|
|
|
|
|
|
|
|
const playNotificationSound = () => {
|
|
|
|
|
if (currentUser?.sound_enabled !== false) {
|
|
|
|
|
const audio = new Audio('/audio/notification.mp3');
|
|
|
|
|
audio.volume = 0.5;
|
|
|
|
|
audio.play().catch(e => console.log('Audio play failed (browser policy):', e));
|
|
|
|
|
if (currentUser?.sound_enabled !== false && audioRef.current) {
|
|
|
|
|
// Reset time to 0 to allow rapid replays
|
|
|
|
|
audioRef.current.currentTime = 0;
|
|
|
|
|
const playPromise = audioRef.current.play();
|
|
|
|
|
if (playPromise !== undefined) {
|
|
|
|
|
playPromise.catch(e => console.log('Audio play blocked by browser policy:', e));
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
@@ -58,12 +71,15 @@ export const Layout: React.FC<{ children: React.ReactNode }> = ({ children }) =>
|
|
|
|
|
const data = await getNotifications();
|
|
|
|
|
setNotifications(data);
|
|
|
|
|
|
|
|
|
|
// Check if there are new unread notifications
|
|
|
|
|
const newUnreadCount = data.filter((n: any) => !n.is_read).length;
|
|
|
|
|
if (newUnreadCount > previousUnreadCountRef.current) {
|
|
|
|
|
|
|
|
|
|
// Only play sound if it's NOT the first load AND the count actually increased
|
|
|
|
|
if (!isInitialLoadRef.current && newUnreadCount > previousUnreadCountRef.current) {
|
|
|
|
|
playNotificationSound();
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
previousUnreadCountRef.current = newUnreadCount;
|
|
|
|
|
isInitialLoadRef.current = false;
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
useEffect(() => {
|
|
|
|
|
@@ -110,7 +126,7 @@ export const Layout: React.FC<{ children: React.ReactNode }> = ({ children }) =>
|
|
|
|
|
};
|
|
|
|
|
fetchCurrentUser();
|
|
|
|
|
loadNotifications();
|
|
|
|
|
const interval = setInterval(loadNotifications, 60000);
|
|
|
|
|
const interval = setInterval(loadNotifications, 10000);
|
|
|
|
|
return () => clearInterval(interval);
|
|
|
|
|
}, [navigate]);
|
|
|
|
|
|
|
|
|
|
|