Krow/Krow-workspace
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

other modifications days ago

Browse Source
This commit is contained in:
José Salazar
2025-12-26 15:14:51 -05:00
parent ec496fa1ba
commit 5136b1d6b5
56 changed files with 16364 additions and 3094 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
frontend-web/src/pages/VendorDashboard.jsx
View File

@@ -1,4 +1,3 @@
import React, { useState, useMemo, useEffect } from "react";
import { base44 } from "@/api/base44Client";
import { useQuery, useMutation, useQueryClient } from "@tanstack/react-query";
@@ -26,6 +25,7 @@ import { useToast } from "@/components/ui/use-toast";
import { motion, AnimatePresence } from "framer-motion";
import { DragDropContext, Droppable, Draggable } from "@hello-pangea/dnd";
import SmartAssignModal from "@/components/events/SmartAssignModal";
import ClientLoyaltyCard from "@/components/vendor/ClientLoyaltyCard";
const convertTo12Hour = (time24) => {
if (!time24 || time24 === "—") return time24;
@@ -119,6 +119,13 @@ const AVAILABLE_WIDGETS = [
category: 'Analytics',
categoryColor: 'bg-amber-100 text-amber-700',
},
{
id: 'client-loyalty',
title: 'Client Loyalty',
description: 'See which clients are loyal vs at-risk',
category: 'Insights',
categoryColor: 'bg-pink-100 text-pink-700',
},
{
id: 'top-performers',
title: 'Top Performers',
@@ -784,6 +791,10 @@ export default function VendorDashboard() {
</Card>
);
const renderClientLoyalty = () => (
<ClientLoyaltyCard vendorId={user?.id} vendorName={user?.company_name} />
);
const renderGoldVendors = () => (
<Card className="bg-white border-slate-200 shadow-sm">
<CardHeader className="pb-3 border-b border-slate-100">
@@ -839,6 +850,8 @@ export default function VendorDashboard() {
return renderTopClients();
case 'top-performers':
return renderTopPerformers();
case 'client-loyalty':
return renderClientLoyalty();
case 'gold-vendors':
return renderGoldVendors();
case 'quick-actions':
@@ -965,7 +978,7 @@ export default function VendorDashboard() {
</div>
)}
{(visibleWidgetIds.includes('revenue-carousel') || visibleWidgetIds.includes('top-clients') || visibleWidgetIds.includes('top-performers') || visibleWidgetIds.includes('gold-vendors') || visibleWidgetIds.includes('quick-actions')) && (
{(visibleWidgetIds.includes('revenue-carousel') || visibleWidgetIds.includes('top-clients') || visibleWidgetIds.includes('top-performers') || visibleWidgetIds.includes('client-loyalty') || visibleWidgetIds.includes('gold-vendors') || visibleWidgetIds.includes('quick-actions')) && (
<div className="grid grid-cols-3 gap-6">
{(visibleWidgetIds.includes('revenue-carousel') || visibleWidgetIds.includes('quick-actions')) && (
<div className="space-y-4">
@@ -992,7 +1005,7 @@ export default function VendorDashboard() {
</div>
)}
{(visibleWidgetIds.includes('top-clients') || visibleWidgetIds.includes('top-performers') || visibleWidgetIds.includes('gold-vendors')) && (
{(visibleWidgetIds.includes('top-clients') || visibleWidgetIds.includes('top-performers') || visibleWidgetIds.includes('client-loyalty') || visibleWidgetIds.includes('gold-vendors')) && (
<div className={`grid ${visibleWidgetIds.includes('revenue-carousel') || visibleWidgetIds.includes('quick-actions') ? 'col-span-2' : 'col-span-3'} grid-cols-3 gap-4`}>
{visibleWidgetIds.includes('top-clients') && (
<div className="relative group">
@@ -1014,6 +1027,16 @@ export default function VendorDashboard() {
{renderWidget('top-performers')}
</div>
)}
{visibleWidgetIds.includes('client-loyalty') && (
<div className="relative group">
{isCustomizing && (
<button onClick={() => handleRemoveWidget('client-loyalty')} className="absolute -top-3 -right-3 w-8 h-8 bg-red-500 hover:bg-red-600 rounded-full flex items-center justify-center shadow-lg z-10">
<Minus className="w-4 h-4 text-white" />
</button>
)}
{renderWidget('client-loyalty')}
</div>
)}
{visibleWidgetIds.includes('gold-vendors') && (
<div className="relative group">
{isCustomizing && (
@@ -1140,4 +1163,4 @@ export default function VendorDashboard() {
/>
</div>
);
}
}