Add the Leaflet map page and client (markers, labels, layer toggles, shipment interpolation), the placement and authoring server actions, the map-features and map-import API routes, and the map styles including leaflet pane isolation so portals stack correctly. Ultraworked with [Sisyphus](https://github.com/code-yeongyu/oh-my-openagent) Co-authored-by: Sisyphus <clio-agent@sisyphuslabs.ai>
50 lines
1.9 KiB
TypeScript
50 lines
1.9 KiB
TypeScript
import config from "@payload-config";
|
|
import { getPayload } from "payload";
|
|
import { headers } from "next/headers";
|
|
import type { Metadata } from "next";
|
|
import { Map as MapIcon } from "lucide-react";
|
|
import { hasPermission } from "@/utils/access-control/hasPermission";
|
|
import { hasLogisticsQualification } from "@/utils/access-control/hasLogisticsQualification";
|
|
import { MapLoader } from "./MapLoader";
|
|
|
|
export const metadata: Metadata = {
|
|
title: "World Map: Polaris Task Force",
|
|
};
|
|
|
|
export default async function MapPage() {
|
|
const payload = await getPayload({ config: await config });
|
|
const { user } = await payload.auth({ headers: await headers(), canSetHeaders: false });
|
|
|
|
const [mapsRes, canEdit, canPlace] = await Promise.all([
|
|
payload.find({
|
|
collection: "maps",
|
|
where: { isActive: { equals: true } },
|
|
sort: "name",
|
|
limit: 100,
|
|
depth: 0,
|
|
overrideAccess: true,
|
|
}),
|
|
user ? hasPermission(payload, user, "maps:update") : Promise.resolve(false),
|
|
user ? hasLogisticsQualification(payload, user) : Promise.resolve(false),
|
|
]);
|
|
|
|
const maps = mapsRes.docs.map((map) => ({ id: map.id, name: map.name }));
|
|
|
|
return (
|
|
<div className="relative flex min-h-[240px] flex-1 flex-col">
|
|
<div className="flex items-center justify-between gap-3 border-b border-white/15 bg-black/50 px-5 py-2 backdrop-blur-sm">
|
|
<div className="flex items-center gap-2">
|
|
<MapIcon className="size-4 text-muted-foreground" />
|
|
<h1 className="text-sm font-semibold uppercase tracking-[0.2em]">World Map</h1>
|
|
</div>
|
|
<div className="flex items-center gap-4 font-mono text-[9px] uppercase tracking-[0.2em] text-white/60">
|
|
<span>PTF Unit Command // Tactical Grid</span>
|
|
<span>
|
|
{maps.length} Active Grid{maps.length === 1 ? "" : "s"}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
<MapLoader maps={maps} canEdit={canEdit} canPlace={canPlace} />
|
|
</div>
|
|
);
|
|
}
|