g/ember-market-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

uwu

Browse Source
This commit is contained in:
NotII
2025-05-19 17:51:06 +01:00
parent 02e09003d5
commit 308a816736
6 changed files with 36 additions and 230 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
.gitignore vendored
View File

@@ -43,3 +43,4 @@ env.local
public/git-info.json
*/git-info.json
public/git-info.json
public/git-info.json

2
components/KeepOnline.ts
View File

@@ -11,7 +11,7 @@ const KeepOnline = () => {
clientFetch('/auth/me');
}
updateOnlineStatus();
// Start interval without immediate call
const interval = setInterval(updateOnlineStatus, 1000*60*1);
return () => clearInterval(interval);

212
components/dashboard/ChatNotifications.tsx
View File

@@ -1,212 +0,0 @@
"use client"
import React, { useState, useEffect, useRef } from "react";
import { useRouter } from "next/navigation";
import { Badge } from "@/components/ui/badge";
import { Button } from "@/components/ui/button";
import { Bell } from "lucide-react";
import {
DropdownMenu,
DropdownMenuContent,
DropdownMenuItem,
DropdownMenuTrigger,
} from "@/components/ui/dropdown-menu";
import { clientFetch } from "@/lib/api";
interface UnreadCounts {
totalUnread: number;
chatCounts: Record<string, number>;
}
export default function ChatNotifications() {
const router = useRouter();
const [unreadCounts, setUnreadCounts] = useState<UnreadCounts>({ totalUnread: 0, chatCounts: {} });
const [previousUnreadTotal, setPreviousUnreadTotal] = useState<number>(0);
const [loading, setLoading] = useState(true);
const [chatMetadata, setChatMetadata] = useState<Record<string, { buyerId: string }>>({});
const audioRef = useRef<HTMLAudioElement | null>(null);
useEffect(() => {
audioRef.current = new Audio('/notification.mp3');
// Fallback if notification.mp3 doesn't exist - use browser API for a simple beep
audioRef.current.addEventListener('error', () => {
audioRef.current = null;
});
return () => {
if (audioRef.current) {
audioRef.current = null;
}
};
}, []);
// Function to play notification sound
const playNotificationSound = () => {
if (audioRef.current) {
audioRef.current.currentTime = 0;
audioRef.current.play().catch(err => {
console.log('Error playing sound:', err);
// Fallback to simple beep if audio file fails
try {
const context = new (window.AudioContext || (window as any).webkitAudioContext)();
const oscillator = context.createOscillator();
oscillator.type = 'sine';
oscillator.frequency.setValueAtTime(800, context.currentTime);
oscillator.connect(context.destination);
oscillator.start();
oscillator.stop(context.currentTime + 0.2);
} catch (e) {
console.error('Could not play fallback audio', e);
}
});
} else {
// Fallback to simple beep if audio element is not available
try {
const context = new (window.AudioContext || (window as any).webkitAudioContext)();
const oscillator = context.createOscillator();
oscillator.type = 'sine';
oscillator.frequency.setValueAtTime(800, context.currentTime);
oscillator.connect(context.destination);
oscillator.start();
oscillator.stop(context.currentTime + 0.2);
} catch (e) {
console.error('Could not play fallback audio', e);
}
}
};
// Fetch unread counts
useEffect(() => {
const fetchUnreadCounts = async () => {
try {
// Use clientFetch instead of direct API calls to leverage the Next.js API rewrite rules
// Get vendor info from profile endpoint
const vendorData = await clientFetch('/auth/me');
// Access correct property - the vendor ID is in vendor._id
const vendorId = vendorData.vendor?._id;
if (!vendorId) {
console.error("Vendor ID not found in profile response:", vendorData);
return;
}
const response = await clientFetch(`/chats/vendor/${vendorId}/unread`);
// Check if there are new notifications and play sound if needed
if (!loading && response.totalUnread > previousUnreadTotal) {
playNotificationSound();
}
// Update state - clientFetch already parses the JSON
setUnreadCounts(response);
setPreviousUnreadTotal(response.totalUnread);
if (response.totalUnread > 0) {
const chatIds = Object.keys(response.chatCounts);
if (chatIds.length > 0) {
// Create a simplified metadata object with just needed info
const metadata: Record<string, { buyerId: string }> = {};
// Fetch each chat to get buyer IDs
await Promise.all(
chatIds.map(async (chatId) => {
try {
// Use markAsRead=false to ensure we don't mark messages as read
const chatResponse = await clientFetch(`/chats/${chatId}?markAsRead=false`);
metadata[chatId] = {
buyerId: chatResponse.buyerId,
};
} catch (error) {
console.error(`Error fetching chat ${chatId}:`, error);
}
})
);
setChatMetadata(metadata);
}
}
} catch (error) {
console.error("Error fetching unread counts:", error);
} finally {
setLoading(false);
}
};
fetchUnreadCounts();
// Set polling interval (every 10 seconds for more responsive notifications)
const intervalId = setInterval(fetchUnreadCounts, 10000);
return () => clearInterval(intervalId);
}, [loading, previousUnreadTotal]);
const handleChatClick = (chatId: string) => {
router.push(`/dashboard/chats/${chatId}`);
};
return (
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button variant="ghost" size="icon" className="relative" disabled={loading}>
<Bell className="h-5 w-5" />
{unreadCounts.totalUnread > 0 && (
<Badge
variant="destructive"
className="absolute -top-1 -right-1 px-1.5 py-0.5 text-xs"
>
{unreadCounts.totalUnread}
</Badge>
)}
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent align="end" className="w-72">
<div className="p-2 border-b">
<h3 className="font-medium">Messages</h3>
</div>
{unreadCounts.totalUnread === 0 ? (
<div className="p-4 flex items-center justify-center">
<p className="text-sm text-muted-foreground">No new notifications</p>
</div>
) : (
<>
<div className="max-h-80 overflow-y-auto">
{Object.entries(unreadCounts.chatCounts).map(([chatId, count]) => (
<DropdownMenuItem
key={chatId}
className="p-3 cursor-pointer"
onClick={() => handleChatClick(chatId)}
>
<div className="flex items-center justify-between w-full">
<div>
<p className="font-medium">
Customer {chatMetadata[chatId]?.buyerId.slice(-4) || 'Unknown'}
</p>
<p className="text-sm text-muted-foreground">
{count} new {count === 1 ? 'message' : 'messages'}
</p>
</div>
<Badge variant="destructive">{count}</Badge>
</div>
</DropdownMenuItem>
))}
</div>
<div className="p-2 border-t">
<Button
variant="outline"
className="w-full"
onClick={() => router.push('/dashboard/chats')}
>
View All Chats
</Button>
</div>
</>
)}
</DropdownMenuContent>
</DropdownMenu>
);
}

46
components/notifications/UnifiedNotifications.tsx
View File

@@ -54,6 +54,7 @@ export default function UnifiedNotifications() {
const [loading, setLoading] = useState(true);
const [activeTab, setActiveTab] = useState<string>("all");
const audioRef = useRef<HTMLAudioElement | null>(null);
const vendorIdRef = useRef<string | null>(null);
// Total notifications count
const totalNotifications = unreadCounts.totalUnread + newOrders.length;
@@ -73,6 +74,34 @@ export default function UnifiedNotifications() {
};
}, []);
// Get vendor ID from JWT token
const getVendorIdFromToken = () => {
if (vendorIdRef.current) {
return vendorIdRef.current;
}
const authToken = getCookie("Authorization") || "";
if (!authToken) {
throw new Error("No auth token found");
}
const tokenParts = authToken.split(".");
if (tokenParts.length !== 3) {
throw new Error("Invalid token format");
}
const payload = JSON.parse(atob(tokenParts[1]));
const vendorId = payload.id;
if (!vendorId) {
throw new Error("Vendor ID not found in token");
}
vendorIdRef.current = vendorId;
return vendorId;
};
// Function to play notification sound
const playNotificationSound = () => {
if (audioRef.current) {
@@ -107,8 +136,6 @@ export default function UnifiedNotifications() {
yesterday.setDate(yesterday.getDate() - 1);
const timestamp = yesterday.toISOString();
// Use orderDate parameter instead of 'after' to avoid backend casting errors
// The error logs show that the 'after' parameter is being interpreted as 'orderId' incorrectly
const orderData = await clientFetch(`/orders?status=paid&limit=10&orderDate[gte]=${timestamp}`);
const orders: Order[] = orderData.orders || [];
@@ -175,19 +202,8 @@ export default function UnifiedNotifications() {
const fetchUnreadCounts = async () => {
try {
// Use clientFetch instead of direct API calls to leverage the API rewrite rules
// This will route through Next.js rewrites instead of calling the API directly
// Get vendor info from profile endpoint
const vendorData = await clientFetch('/auth/me');
// Access correct property - the vendor ID is in vendor._id
const vendorId = vendorData.vendor?._id;
if (!vendorId) {
console.error("Vendor ID not found in profile response:", vendorData);
return;
}
// Get vendor ID from token
const vendorId = getVendorIdFromToken();
// Use clientFetch which will properly route through Next.js API rewrites
const response = await clientFetch(`/chats/vendor/${vendorId}/unread`);

1
next.config.mjs
View File

@@ -1,6 +1,7 @@
/** @type {import('next').NextConfig} */
const nextConfig = {
output: 'standalone',
reactStrictMode: false,
images: {
remotePatterns: [
{

4
public/git-info.json
View File

@@ -1,4 +1,4 @@
{
"commitHash": "f8e3173",
"buildTime": "2025-05-17T21:10:37.604Z"
"commitHash": "02e0900",
"buildTime": "2025-05-19T00:35:36.962Z"
}