Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 | 66x 66x 66x 66x | import { useParams } from "@tanstack/react-router";
import { AdminPageHead } from "../../components/admin/AdminPageHead";
import { MarketplaceTraffic } from "../../components/analytics/MarketplaceTraffic";
import { Breadcrumb } from "../../components/ui/breadcrumb";
import { useAdminPro } from "../../hooks/queries/useAdminQueries";
/**
* `/admin/pros/$proId/analytics` — one pro's marketplace listing, as an
* operator sees it.
*
* THIS PAGE USED TO BE 333 LINES OF JSX that `pages/insights.tsx` also had,
* panel for panel, off the same `ProStats` shape. The six panels now live in
* `components/analytics/MarketplaceTraffic.tsx`, which takes the
* `context: "pro" | "admin"` prop that decides the data hook and the link
* targets — the pattern `components/projects/ProjectDetailContainer.tsx`
* already established in this codebase. What is left here is what is genuinely
* admin-only: the breadcrumb back to the pro, and the pro's name in the title.
*
* `pages/insights.tsx` is owned by another group in this phase and still has
* its own copy of the Marketplace section; replacing it with
* `<MarketplaceTraffic context="pro" proId={proId} bandAction={…} />` is a
* one-line swap and is reported rather than made here.
*/
export function AdminProAnalyticsPage() {
const { proId } = useParams({ strict: false });
const { data: pro, isLoading } = useAdminPro(proId ?? null);
const studioName = isLoading ? "Loading..." : pro?.businessName || "Pro";
return (
<div className="space-y-8">
<Breadcrumb
items={[
{ label: "Pros", href: "/admin/pros" },
{ label: pro?.businessName || "Pro", href: `/admin/pros/${proId}` },
{ label: "Analytics" },
]}
/>
{/*
* One page head for the whole admin surface: the `.title`-capped h1
* and the one index-red page rule. Display LG/XL is for empty states
* and auth only.
*/}
<AdminPageHead
title={`${studioName} analytics`}
description="Marketplace listing performance for this studio."
/>
<MarketplaceTraffic
context="admin"
proId={proId ?? null}
errorMessage="Failed to load analytics data"
/>
</div>
);
}
|