Ship the delivery platform UI under modules/delivery with thin app routes, BFF proxy, CRUD for phase 10.0-10.1 APIs, and capability-gated future screens. Co-authored-by: Cursor <cursoragent@cursor.com>
57 lines
2.5 KiB
TypeScript
57 lines
2.5 KiB
TypeScript
"use client";
|
||
|
||
import { MapPin, Navigation, Layers } from "lucide-react";
|
||
import { Card, CardContent, Badge } from "@/components/ds";
|
||
import { DeliveryBreadcrumbs } from "@/modules/delivery/components/DeliveryBreadcrumbs";
|
||
import { createDeliveryPhasePage } from "@/modules/delivery/components/DeliveryPhaseGate";
|
||
import { useDeliveryCapabilities } from "@/modules/delivery/hooks/useDeliveryCapabilities";
|
||
import { DeliveryPageLoader } from "@/modules/delivery/pages/shared";
|
||
import type { PhaseGateConfig } from "@/modules/delivery/types";
|
||
|
||
function MapSkeleton({ title }: { title: string }) {
|
||
return (
|
||
<div className="space-y-4">
|
||
<DeliveryBreadcrumbs current={title} />
|
||
<div className="relative overflow-hidden rounded-2xl border border-[var(--border)] bg-[var(--surface-muted)]">
|
||
<div className="flex aspect-[16/9] min-h-[320px] flex-col items-center justify-center gap-3 p-6 text-center">
|
||
<Layers className="h-12 w-12 text-[var(--delivery-accent)] opacity-60" />
|
||
<p className="text-sm font-medium text-secondary">رابط نقشه عملیاتی</p>
|
||
<p className="max-w-md text-xs text-[var(--muted)]">
|
||
مارکر رانندگان، pickup، delivery، خوشهبندی، ترافیک و پیشنمایش مسیر.
|
||
</p>
|
||
<div className="flex gap-2">
|
||
<Badge tone="info">
|
||
<MapPin className="ml-1 inline h-3 w-3" />
|
||
Live Markers
|
||
</Badge>
|
||
<Badge tone="info">
|
||
<Navigation className="ml-1 inline h-3 w-3" />
|
||
Route Preview
|
||
</Badge>
|
||
</div>
|
||
</div>
|
||
<div className="absolute inset-0 bg-[radial-gradient(circle_at_30%_40%,var(--delivery-accent-soft),transparent_50%)]" />
|
||
</div>
|
||
<Card>
|
||
<CardContent className="p-4 text-sm text-[var(--muted)]">
|
||
اتصال WebSocket/SSE برای بهروزرسانی لحظهای موقعیت در فاز ۱۰.۷ پیادهسازی میشود.
|
||
</CardContent>
|
||
</Card>
|
||
</div>
|
||
);
|
||
}
|
||
|
||
export function createDeliveryMapPage(config: PhaseGateConfig, title?: string) {
|
||
const pageTitle = title ?? config.title;
|
||
const PhasePage = createDeliveryPhasePage(config, true);
|
||
|
||
return function DeliveryMapPage() {
|
||
const caps = useDeliveryCapabilities();
|
||
if (caps.isLoading) return <DeliveryPageLoader />;
|
||
if (caps.data?.features?.[config.feature] === true) {
|
||
return <MapSkeleton title={pageTitle} />;
|
||
}
|
||
return <PhasePage />;
|
||
};
|
||
}
|