diff --git a/src/components/dashboard/Dashboard.tsx b/src/components/dashboard/Dashboard.tsx index 752c5a2..3020ce3 100644 --- a/src/components/dashboard/Dashboard.tsx +++ b/src/components/dashboard/Dashboard.tsx @@ -10,7 +10,7 @@ import { import FootprintChart from "@/components/charts/FootprintChart"; import ComparisonSection from "@/components/dashboard/ComparisonSection"; import ShareButton from "@/components/ui/ShareButton"; -import { getUserFootprints } from "@/lib/firebase/firestore"; +import { getUserFootprints, subscribeToUserActivitiesCount } from "@/lib/firebase/firestore"; import { exportToCSV, ActivityHistoryEntry } from "@/utils/exportCSV"; import { ArrowDownTrayIcon } from "@heroicons/react/24/outline"; @@ -29,11 +29,12 @@ interface StatCardProps { change?: number; icon: string; color: string; + tooltip?: string; } -function StatCard({ title, value, change, icon, color }: StatCardProps) { +function StatCard({ title, value, change, icon, color, tooltip }: StatCardProps) { return ( -
{title}
@@ -100,6 +101,7 @@ export default function Dashboard({ null ); const [loading, setLoading] = useState(true); + const [activitiesCount, setActivitiesCount] = useState(0); const [exportStatus, setExportStatus] = useState<{ show: boolean; success: boolean; @@ -212,6 +214,12 @@ export default function Dashboard({ } }, [propDashboardData]); + // Real-time subscription to activities count + useEffect(() => { + if (!user) return; + const unsubscribe = subscribeToUserActivitiesCount(user.id, setActivitiesCount); + return () => unsubscribe(); + }, [user, activityHistory.length]); // Handle CSV export const handleExportCSV = () => { const result = exportToCSV(activityHistory as ActivityHistoryEntry[]); @@ -259,6 +267,11 @@ export default function Dashboard({ const equivalentIcons = ["🚗", "📱", "☕", "💡"]; + // Format join date for tooltip + const joinDateLabel = user?.createdAt + ? new Date(user.createdAt).toLocaleDateString() + : ''; + return (