Update UI styles and dashboard product display
All checks were successful
Build Frontend / build (push) Successful in 1m10s
All checks were successful
Build Frontend / build (push) Successful in 1m10s
Refined color scheme in AnimatedStatsSection to use indigo instead of pink, and improved gradient backgrounds. In dashboard/content.tsx, updated TopProduct price to support arrays and display revenue per product. UnifiedNotifications received minor style and layout adjustments for better consistency and usability.
This commit is contained in:
@@ -18,7 +18,7 @@ import { useNotifications } from "@/lib/notification-context";
|
||||
export default function UnifiedNotifications() {
|
||||
const router = useRouter();
|
||||
const [activeTab, setActiveTab] = useState<string>("all");
|
||||
|
||||
|
||||
// Get notification state from context
|
||||
const {
|
||||
unreadCounts,
|
||||
@@ -33,11 +33,11 @@ export default function UnifiedNotifications() {
|
||||
const handleChatClick = (chatId: string) => {
|
||||
router.push(`/dashboard/chats/${chatId}`);
|
||||
};
|
||||
|
||||
|
||||
const handleOrderClick = (orderId: string) => {
|
||||
router.push(`/dashboard/orders/${orderId}`);
|
||||
};
|
||||
|
||||
|
||||
// Format the price as currency
|
||||
const formatPrice = (price: number) => {
|
||||
return `£${price.toFixed(2)}`;
|
||||
@@ -49,8 +49,8 @@ export default function UnifiedNotifications() {
|
||||
<Button variant="ghost" size="icon" className="relative" disabled={loading}>
|
||||
<BellRing className="h-5 w-5" />
|
||||
{totalNotifications > 0 && (
|
||||
<Badge
|
||||
variant="destructive"
|
||||
<Badge
|
||||
variant="destructive"
|
||||
className="absolute -top-1 -right-1 px-1.5 py-0.5 text-xs"
|
||||
>
|
||||
{totalNotifications}
|
||||
@@ -58,12 +58,12 @@ export default function UnifiedNotifications() {
|
||||
)}
|
||||
</Button>
|
||||
</DropdownMenuTrigger>
|
||||
<DropdownMenuContent align="end" className="w-80">
|
||||
<DropdownMenuContent align="end" className="w-80" collisionPadding={10}>
|
||||
<div className="p-2 border-b">
|
||||
<Tabs defaultValue="all" value={activeTab} onValueChange={setActiveTab}>
|
||||
<TabsList className="grid w-full grid-cols-3">
|
||||
<TabsTrigger value="all" className="text-xs">
|
||||
All
|
||||
All
|
||||
{totalNotifications > 0 && (
|
||||
<Badge variant="secondary" className="ml-1">
|
||||
{totalNotifications}
|
||||
@@ -87,7 +87,7 @@ export default function UnifiedNotifications() {
|
||||
)}
|
||||
</TabsTrigger>
|
||||
</TabsList>
|
||||
|
||||
|
||||
<TabsContent value="all" className="m-0">
|
||||
{totalNotifications === 0 ? (
|
||||
<div className="p-4 flex items-center justify-center">
|
||||
@@ -102,7 +102,7 @@ export default function UnifiedNotifications() {
|
||||
Unread Messages
|
||||
</div>
|
||||
{Object.entries(unreadCounts.chatCounts).slice(0, 3).map(([chatId, count]) => (
|
||||
<DropdownMenuItem
|
||||
<DropdownMenuItem
|
||||
key={`chat-${chatId}`}
|
||||
className="p-3 cursor-pointer"
|
||||
onClick={() => handleChatClick(chatId)}
|
||||
@@ -130,15 +130,15 @@ export default function UnifiedNotifications() {
|
||||
)}
|
||||
</>
|
||||
)}
|
||||
|
||||
|
||||
{/* Orders Section */}
|
||||
{newOrders.length > 0 && (
|
||||
<>
|
||||
<div className="px-3 py-2 text-xs font-medium bg-muted/50 flex justify-between items-center">
|
||||
<span>New Paid Orders</span>
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="sm"
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="sm"
|
||||
onClick={(e) => {
|
||||
e.stopPropagation();
|
||||
clearOrderNotifications();
|
||||
@@ -149,7 +149,7 @@ export default function UnifiedNotifications() {
|
||||
</Button>
|
||||
</div>
|
||||
{newOrders.slice(0, 3).map((order) => (
|
||||
<DropdownMenuItem
|
||||
<DropdownMenuItem
|
||||
key={`order-${order._id}`}
|
||||
className="p-3 cursor-pointer"
|
||||
onClick={() => handleOrderClick(order._id)}
|
||||
@@ -178,7 +178,7 @@ export default function UnifiedNotifications() {
|
||||
</div>
|
||||
)}
|
||||
</TabsContent>
|
||||
|
||||
|
||||
<TabsContent value="messages" className="m-0">
|
||||
{unreadCounts.totalUnread === 0 ? (
|
||||
<div className="p-4 flex items-center justify-center">
|
||||
@@ -188,7 +188,7 @@ export default function UnifiedNotifications() {
|
||||
<>
|
||||
<div className="max-h-96 overflow-y-auto">
|
||||
{Object.entries(unreadCounts.chatCounts).map(([chatId, count]) => (
|
||||
<DropdownMenuItem
|
||||
<DropdownMenuItem
|
||||
key={`chat-tab-${chatId}`}
|
||||
className="p-3 cursor-pointer"
|
||||
onClick={() => handleChatClick(chatId)}
|
||||
@@ -211,8 +211,8 @@ export default function UnifiedNotifications() {
|
||||
))}
|
||||
</div>
|
||||
<div className="p-2 border-t">
|
||||
<Button
|
||||
variant="outline"
|
||||
<Button
|
||||
variant="outline"
|
||||
className="w-full"
|
||||
onClick={() => router.push('/dashboard/chats')}
|
||||
>
|
||||
@@ -222,7 +222,7 @@ export default function UnifiedNotifications() {
|
||||
</>
|
||||
)}
|
||||
</TabsContent>
|
||||
|
||||
|
||||
<TabsContent value="orders" className="m-0">
|
||||
{newOrders.length === 0 ? (
|
||||
<div className="p-4 flex items-center justify-center">
|
||||
@@ -232,9 +232,9 @@ export default function UnifiedNotifications() {
|
||||
<>
|
||||
<div className="px-3 py-2 text-xs font-medium bg-muted/50 flex justify-between items-center">
|
||||
<span>New Paid Orders</span>
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="sm"
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="sm"
|
||||
onClick={(e) => {
|
||||
e.stopPropagation();
|
||||
clearOrderNotifications();
|
||||
@@ -246,7 +246,7 @@ export default function UnifiedNotifications() {
|
||||
</div>
|
||||
<div className="max-h-96 overflow-y-auto">
|
||||
{newOrders.map((order) => (
|
||||
<DropdownMenuItem
|
||||
<DropdownMenuItem
|
||||
key={`order-tab-${order._id}`}
|
||||
className="p-3 cursor-pointer"
|
||||
onClick={() => handleOrderClick(order._id)}
|
||||
@@ -267,8 +267,8 @@ export default function UnifiedNotifications() {
|
||||
))}
|
||||
</div>
|
||||
<div className="p-2 border-t">
|
||||
<Button
|
||||
variant="outline"
|
||||
<Button
|
||||
variant="outline"
|
||||
className="w-full"
|
||||
onClick={() => router.push('/dashboard/orders')}
|
||||
>
|
||||
|
||||
Reference in New Issue
Block a user