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 60 61 62 63 64 65 66 | 23x 23x 23x 23x 23x 23x 1x 22x 2x 20x | import { useParams } from "@tanstack/react-router";
import { TriangleAlert } from "lucide-react";
import { Skeleton } from "../../../../components/ui/skeleton";
import { STATUS_INK } from "../../../../components/ui/status-ink";
import { WhatsAppPageLayout } from "../../../../components/whatsapp/WhatsAppPageLayout";
import { cn } from "../../../../lib/utils";
import {
useCampaignRecipients,
useWhatsAppCampaign,
} from "../../../../hooks/queries/useWhatsAppQueries";
import { CampaignDetailView } from "./CampaignDetailView.subcomponent";
/**
* `/admin/whatsapp/campaigns/$campaignId` — the campaign read view.
*
* One request for the campaign, its template, its recipient count and whether
* it can be stopped; a second, paginated one for the recipient rows. The data,
* the API and the rendering all existed before this file; the route did not,
* which is why "View details" used to take an admin into the create wizard
* with a `?viewId=` on the end.
*/
export function WhatsAppCampaignDetailPage() {
const { campaignId } = useParams({ strict: false }) as {
campaignId?: string;
};
const id = Number(campaignId);
const validId = Number.isFinite(id) && id > 0 ? id : null;
const { data: detail, isLoading, isError } = useWhatsAppCampaign(validId);
const { data: recipients = [] } = useCampaignRecipients(validId);
if (isLoading) {
return (
<WhatsAppPageLayout>
<div className="max-w-3xl space-y-3">
<Skeleton className="h-7 w-64" />
<Skeleton className="h-5 w-40" />
<Skeleton className="h-16 w-full" />
<Skeleton className="h-40 w-full" />
</div>
</WhatsAppPageLayout>
);
}
if (isError || !detail) {
return (
<WhatsAppPageLayout>
<div className="flex max-w-3xl flex-col items-center gap-2 py-12 text-center">
<TriangleAlert
aria-hidden="true"
className={cn("h-7 w-7", STATUS_INK.error)}
/>
<p className="text-sm font-semibold text-foreground-default">
Could not load this campaign
</p>
<p className="text-xs text-foreground-muted">
It may have been deleted. Nothing has been sent or changed.
</p>
</div>
</WhatsAppPageLayout>
);
}
return <CampaignDetailView detail={detail} recipients={recipients} />;
}
|