71 lines
1.7 KiB
TypeScript
71 lines
1.7 KiB
TypeScript
'use client';
|
|
|
|
import { useEffect, useState } from 'react';
|
|
import Dashboard from "@/components/dashboard/dashboard";
|
|
import Content from "@/components/dashboard/content";
|
|
import { fetchClient } from '@/lib/client-service';
|
|
|
|
// ✅ Corrected Vendor Type
|
|
interface Vendor {
|
|
_id: string;
|
|
username: string;
|
|
storeId: string;
|
|
pgpKey: string;
|
|
__v: number;
|
|
}
|
|
|
|
interface User {
|
|
vendor: Vendor;
|
|
}
|
|
|
|
interface OrderStats {
|
|
totalOrders: number;
|
|
pendingOrders: number;
|
|
completedOrders: number;
|
|
cancelledOrders: number;
|
|
}
|
|
|
|
export default function DashboardPage() {
|
|
const [vendor, setVendor] = useState<Vendor | null>(null);
|
|
const [orderStats, setOrderStats] = useState<OrderStats | null>(null);
|
|
const [loading, setLoading] = useState(true);
|
|
const [error, setError] = useState<string | null>(null);
|
|
|
|
useEffect(() => {
|
|
async function fetchData() {
|
|
try {
|
|
setLoading(true);
|
|
|
|
// Fetch data from API using relative URLs and client-side fetch
|
|
const [userResponse, stats] = await Promise.all([
|
|
fetchClient<User>("auth/me"),
|
|
fetchClient<OrderStats>("orders/stats"),
|
|
]);
|
|
|
|
setVendor(userResponse.vendor);
|
|
setOrderStats(stats);
|
|
} catch (err) {
|
|
console.error('Error fetching dashboard data:', err);
|
|
setError('Failed to load dashboard data');
|
|
} finally {
|
|
setLoading(false);
|
|
}
|
|
}
|
|
|
|
fetchData();
|
|
}, []);
|
|
|
|
if (loading) {
|
|
return <Dashboard><div>Loading dashboard...</div></Dashboard>;
|
|
}
|
|
|
|
if (error || !vendor || !orderStats) {
|
|
return <Dashboard><div>Error: {error || 'Failed to load data'}</div></Dashboard>;
|
|
}
|
|
|
|
return (
|
|
<Dashboard>
|
|
<Content username={vendor.username} orderStats={orderStats} />
|
|
</Dashboard>
|
|
);
|
|
} |