Pages declare brief tours in code, keyed to stable data-tour anchors. The layout resolves each visitor's access signals (intelligence and logistics qualifications, admin-panel access, feature flags) and step filtering hides what a user cannot reach, mirroring the sidebar. A tour auto-starts the first time a browser visits its page; dismissals are remembered per browser in localStorage. The header gains a replay control for on-demand runs on toured routes, the tour card gains Skip all tours on this device to opt a browser out of auto-starts, and the Account page holds the re-enable toggle. The card and spotlight get a distinct overlay treatment (glow, accent strip, outlined target).
38 lines
1.1 KiB
TypeScript
38 lines
1.1 KiB
TypeScript
import config from "@payload-config";
|
|
import { getPayload } from "payload";
|
|
import type { Shipment } from "@/payload-types";
|
|
import { TruckIcon } from "lucide-react";
|
|
import { ShipmentsList } from "@/components/frontend/logistics/ShipmentsList";
|
|
|
|
export const metadata = {
|
|
title: "Shipments: Polaris Task Force",
|
|
};
|
|
|
|
export default async function ShipmentsPage() {
|
|
const payload = await getPayload({ config });
|
|
|
|
const shipmentsRes = await payload.find({
|
|
collection: "shipments",
|
|
sort: "-dispatchedAt",
|
|
limit: 100,
|
|
depth: 2,
|
|
});
|
|
|
|
const shipments = shipmentsRes.docs as unknown as Shipment[];
|
|
|
|
return (
|
|
<div className="p-5 flex flex-col gap-6">
|
|
<div className="flex flex-col gap-1" data-tour="page-header">
|
|
<div className="flex items-center gap-2">
|
|
<TruckIcon className="size-5 text-muted-foreground" />
|
|
<h1 className="text-lg font-semibold">Shipments</h1>
|
|
</div>
|
|
<p className="text-sm text-muted-foreground">
|
|
{shipments.length} shipment{shipments.length !== 1 ? "s" : ""} tracked.
|
|
</p>
|
|
</div>
|
|
|
|
<ShipmentsList shipments={shipments} />
|
|
</div>
|
|
);
|
|
}
|