/* ============================================================ AfricaMart — Buyer & Supplier dashboards ============================================================ */ function DashboardPage({ nav, params, showToast }) { const [authUser, setAuthUser] = useState(null); const [authChecked, setAuthChecked] = useState(!window.supabaseClient); const [section, setSection] = useState("overview"); useEffect(() => { if (!window.supabaseClient) return; DB.auth.getSession().then(session => { if (session && session.user) setAuthUser(session.user); else nav("auth", { mode: "login" }); }).catch(() => {}).finally(() => setAuthChecked(true)); }, []); const authState = authUser ? DB.auth.buildAuthState(authUser) : null; const myRole = authState ? authState.role : "buyer"; const role = params.role || myRole; const isOwnRole = role === myRole; useEffect(() => { setSection("overview"); }, [role]); if (!authChecked) { return
; } if (window.supabaseClient && !authUser) return null; const buyerNav = [ ["overview", "Overview", "layout-dashboard"], ["rfqs", "My RFQs", "file-text"], ["saved", "Saved & wishlist", "heart"], ["inquiries", "Inquiries & chat", "messages-square"], ["settings", "Profile settings", "settings"], ]; const supplierNav = [ ["overview", "Overview", "layout-dashboard"], ["products", "Products", "package"], ["store", "Store page", "store"], ["inbox", "Inquiry inbox", "inbox"], ["analytics", "Analytics", "bar-chart-3"], ["settings", "Profile settings", "settings"], ]; const menu = role === "supplier" ? supplierNav : buyerNav; const displayName = isOwnRole && authState ? (role === "supplier" ? (authState.company || authState.name) : authState.name) : (role === "supplier" ? "Savannah Steel Works" : "Amina Okoye"); const displaySub = isOwnRole && authState ? (authState.company || authState.email) : "Rift Valley Co."; const displayInitials = isOwnRole && authState ? authState.initials : (role === "supplier" ? "SW" : "AO"); const signOut = async () => { if (window.supabaseClient && DB.auth) { try { await DB.auth.signOut(); } catch (e) {} } nav("home"); }; return (
{/* sidebar */} {/* content */}
{role === "buyer" ? : }
); } function DashHead({ title, sub, action }) { return (

{title}

{sub &&

{sub}

}
{action}
); } function KPI({ label, value, delta, icon }) { return (
{label}
{value}
{delta &&
{delta}
}
); } /* ---------------- BUYER ---------------- */ function BuyerSection({ section, nav, showToast, authUser, authState, isOwnRole }) { const [rfqs, setRfqs] = useState(null); useEffect(() => { if (!isOwnRole || !window.supabaseClient || !DB.auth || !DB.dashboard) return; DB.auth.ensureBuyerRecord(authUser) .then(buyer => DB.dashboard.getBuyerRFQs(buyer.id)) .then(setRfqs) .catch(() => {}); }, [isOwnRole, authUser]); const myRfqs = rfqs !== null ? rfqs : AM.RFQS; const firstName = isOwnRole && authState ? authState.name.split(" ")[0] : "Amina"; if (section === "overview") return ( <> nav("rfq")}> Post RFQ} />
r.status === "open").length)} icon="file-text" /> sum + (r.quotes || 0), 0)) : "19"} delta={rfqs === null ? "+7 this week" : null} icon="inbox" />

Recent quotes

{myRfqs.length === 0 &&

No RFQs posted yet.

} {myRfqs.slice(0, 3).map(r => (
{r.title}
{r.quotes} quotes · deadline {r.deadline}
))}

Saved suppliers

{AM.SUPPLIERS.slice(0, 3).map(s => (
nav("store", { slug: s.slug })}>
{s.name.split(" ").map(w => w[0]).slice(0, 2).join("")}
{s.name}
{s.rating}
))}
); if (section === "rfqs") return ( <> nav("rfq")}> New RFQ} />
{["RFQ", "Quantity", "Quotes", "Deadline", "Status"].map(h => )} {myRfqs.length === 0 && } {myRfqs.slice(0, 4).map(r => ( ))}
{h}
You haven't posted any RFQs yet.
{r.title} {r.qty} {r.quotes} {r.deadline} {r.status.charAt(0).toUpperCase() + r.status.slice(1)}
); if (section === "saved") return ( <>

Wishlisted products

{AM.PRODUCTS.slice(0, 3).map(p => )}

Saved suppliers

{AM.SUPPLIERS.slice(0, 3).map(s => )}
); if (section === "inquiries") return ; return ; } /* ---------------- SUPPLIER ---------------- */ function SupplierSection({ section, nav, showToast, authUser, authState, isOwnRole }) { const seedProducts = AM.PRODUCTS.filter(p => p.supplier === "s1"); const [products, setProducts] = useState(seedProducts); const [inquiries, setInquiries] = useState(null); const [supplierName, setSupplierName] = useState(null); useEffect(() => { if (!isOwnRole || !window.supabaseClient || !DB.auth || !DB.storefront || !DB.dashboard) return; DB.auth.ensureSupplierRecord(authUser).then(sup => { setSupplierName(sup.name); DB.storefront.getProductsBySupplier(sup.id).then(setProducts).catch(() => {}); DB.dashboard.getSupplierInquiries(sup.id).then(setInquiries).catch(() => {}); }).catch(() => {}); }, [isOwnRole, authUser]); const staticRecent = [ { who: "Rift Valley Construction", subj: "Y16 rebar — 80 MT", status: "New", time: "2h" }, { who: "Coastal Builders", subj: "IBR roofing — 4,000 m", status: "Replied", time: "5h" }, { who: "Kampala Infra", subj: "Galvanized sheet pricing", status: "New", time: "1d" }, ]; const recentList = (inquiries || staticRecent).slice(0, 3); if (section === "overview") return ( <> showToast("Add product")}> Add product} />
{recentList.length === 0 &&

No inquiries yet.

} {recentList.map((it, i) => (
{it.who.split(" ").map(w => w[0]).slice(0, 2).join("")}
{it.who}
{it.subj}
{it.status} {it.time}
))}
); if (section === "products") return ; if (section === "store") return ; if (section === "inbox") return ; if (section === "analytics") return ( <>

Product views (30 days)

{[42, 55, 48, 70, 62, 80, 75, 90, 84, 96, 88, 100].map((h, i) => (
))}
30 days agoToday
); return ; } Object.assign(window, { DashboardPage, DashHead, KPI, BuyerSection, SupplierSection });