mirror of
https://github.com/Tria-plc/edr-platform.git
synced 2026-09-07 18:55:42 +00:00
implement booking flow
This commit is contained in:
@@ -0,0 +1,268 @@
|
||||
import type { LucideIcon } from "lucide-react";
|
||||
import {
|
||||
Ban,
|
||||
Check,
|
||||
FileSignature,
|
||||
FileText,
|
||||
MessageSquareWarning,
|
||||
Play,
|
||||
ShieldCheck,
|
||||
Truck,
|
||||
Wallet,
|
||||
XCircle,
|
||||
} from "lucide-react";
|
||||
|
||||
import type {
|
||||
BookingApprovalStep,
|
||||
BookingDetail,
|
||||
BookingStatus,
|
||||
} from "@/types/booking";
|
||||
|
||||
export type BookingActionId =
|
||||
| "accept"
|
||||
| "requestChanges"
|
||||
| "reject"
|
||||
| "approve"
|
||||
| "rejectApproval"
|
||||
| "generateContract"
|
||||
| "viewContract"
|
||||
| "generatePnr"
|
||||
| "verifyPayment"
|
||||
| "startTransit"
|
||||
| "complete";
|
||||
|
||||
export type BookingActionInputKind = "note" | "reason";
|
||||
|
||||
export interface BookingActionDef {
|
||||
id: BookingActionId;
|
||||
label: string;
|
||||
shortLabel: string;
|
||||
description: string;
|
||||
confirmTitle: string;
|
||||
confirmDescription: string;
|
||||
variant: "default" | "destructive" | "outline";
|
||||
icon: LucideIcon;
|
||||
input?: BookingActionInputKind;
|
||||
inputLabel?: string;
|
||||
inputPlaceholder?: string;
|
||||
primary?: boolean;
|
||||
}
|
||||
|
||||
export type BookingActionContext = Pick<
|
||||
BookingDetail,
|
||||
"status" | "paymentCurrency" | "approvalSteps" | "reference"
|
||||
>;
|
||||
|
||||
export function getNextPendingApprovalStep(
|
||||
steps?: BookingApprovalStep[] | null,
|
||||
): BookingApprovalStep | undefined {
|
||||
if (!steps?.length) return undefined;
|
||||
return [...steps]
|
||||
.sort((a, b) => a.stepOrder - b.stepOrder)
|
||||
.find((s) => s.status === "PENDING");
|
||||
}
|
||||
|
||||
function approvalActions(
|
||||
steps?: BookingApprovalStep[] | null,
|
||||
): BookingActionDef[] {
|
||||
const next = getNextPendingApprovalStep(steps);
|
||||
if (!next) return [];
|
||||
return [
|
||||
{
|
||||
id: "approve",
|
||||
label: `Approve (${next.requiredRole})`,
|
||||
shortLabel: "Approve",
|
||||
description: `Complete step ${next.stepOrder} as ${next.requiredRole}`,
|
||||
confirmTitle: `Approve as ${next.requiredRole}?`,
|
||||
confirmDescription:
|
||||
"This records your approval and advances the booking to the next step in the chain.",
|
||||
variant: "default",
|
||||
icon: Check,
|
||||
primary: true,
|
||||
},
|
||||
{
|
||||
id: "rejectApproval",
|
||||
label: "Reject approval",
|
||||
shortLabel: "Reject",
|
||||
description: "Reject at the current approval step",
|
||||
confirmTitle: "Reject at approval step?",
|
||||
confirmDescription:
|
||||
"The booking will be marked rejected. This action cannot be undone from the UI.",
|
||||
variant: "destructive",
|
||||
icon: XCircle,
|
||||
input: "reason",
|
||||
inputLabel: "Rejection reason",
|
||||
inputPlaceholder: "Explain why this booking is rejected…",
|
||||
},
|
||||
];
|
||||
}
|
||||
|
||||
const SUBMITTED_ACTIONS: BookingActionDef[] = [
|
||||
{
|
||||
id: "accept",
|
||||
label: "Accept for approval",
|
||||
shortLabel: "Accept",
|
||||
description: "Start the formal approval chain",
|
||||
confirmTitle: "Accept submission?",
|
||||
confirmDescription:
|
||||
"The booking moves to pending approval and approval steps are created from the rule engine.",
|
||||
variant: "default",
|
||||
icon: ShieldCheck,
|
||||
primary: true,
|
||||
},
|
||||
{
|
||||
id: "requestChanges",
|
||||
label: "Request changes",
|
||||
shortLabel: "Changes",
|
||||
description: "Ask the customer to update and resubmit",
|
||||
confirmTitle: "Request changes from customer?",
|
||||
confirmDescription:
|
||||
"The customer will see your note and can edit the booking before resubmitting.",
|
||||
variant: "outline",
|
||||
icon: MessageSquareWarning,
|
||||
input: "note",
|
||||
inputLabel: "Message to customer",
|
||||
inputPlaceholder: "Describe what needs to be corrected or added…",
|
||||
},
|
||||
{
|
||||
id: "reject",
|
||||
label: "Reject booking",
|
||||
shortLabel: "Reject",
|
||||
description: "Reject this submission",
|
||||
confirmTitle: "Reject booking?",
|
||||
confirmDescription:
|
||||
"The booking will be marked rejected and removed from active queues.",
|
||||
variant: "destructive",
|
||||
icon: Ban,
|
||||
input: "reason",
|
||||
inputLabel: "Rejection reason",
|
||||
inputPlaceholder: "Reason for rejection…",
|
||||
},
|
||||
];
|
||||
|
||||
/** Actions available for the current booking status (detail or list). */
|
||||
export function getBookingActions(ctx: BookingActionContext): BookingActionDef[] {
|
||||
const { status, paymentCurrency, approvalSteps } = ctx;
|
||||
|
||||
switch (status) {
|
||||
case "SUBMITTED":
|
||||
return SUBMITTED_ACTIONS;
|
||||
case "PENDING_APPROVAL":
|
||||
case "APPROVED_PENDING_SIGNATURE":
|
||||
return approvalActions(approvalSteps);
|
||||
case "APPROVED":
|
||||
return [
|
||||
{
|
||||
id: "generateContract",
|
||||
label: "Generate contract",
|
||||
shortLabel: "Contract",
|
||||
description: "Create contract document",
|
||||
confirmTitle: "Generate contract?",
|
||||
confirmDescription:
|
||||
"A contract will be generated and the booking moves to contract ready.",
|
||||
variant: "default",
|
||||
icon: FileText,
|
||||
primary: true,
|
||||
},
|
||||
];
|
||||
case "CONTRACT_READY":
|
||||
case "SIGNED_CUSTOMER":
|
||||
case "FULLY_EXECUTED":
|
||||
return [
|
||||
{
|
||||
id: "viewContract",
|
||||
label:
|
||||
status === "SIGNED_CUSTOMER"
|
||||
? "View & sign contract (staff)"
|
||||
: status === "CONTRACT_READY"
|
||||
? "View contract"
|
||||
: "View executed contract",
|
||||
shortLabel: "Contract",
|
||||
description: "Open contract document and signatures",
|
||||
confirmTitle: "",
|
||||
confirmDescription: "",
|
||||
variant: "default",
|
||||
icon: FileSignature,
|
||||
primary: true,
|
||||
},
|
||||
];
|
||||
case "FULLY_EXECUTED":
|
||||
if (paymentCurrency === "ETB") {
|
||||
return [
|
||||
{
|
||||
id: "generatePnr",
|
||||
label: "Generate PNR",
|
||||
shortLabel: "PNR",
|
||||
description: "Issue PNR for ETB bank payment",
|
||||
confirmTitle: "Generate PNR?",
|
||||
confirmDescription:
|
||||
"A payment reference number will be issued for the customer.",
|
||||
variant: "default",
|
||||
icon: Wallet,
|
||||
primary: true,
|
||||
},
|
||||
];
|
||||
}
|
||||
return [];
|
||||
case "PAYMENT_VERIFICATION_IN_PROGRESS":
|
||||
return [
|
||||
{
|
||||
id: "verifyPayment",
|
||||
label: "Verify payment",
|
||||
shortLabel: "Verify",
|
||||
description: "Confirm USD payment proof",
|
||||
confirmTitle: "Verify payment?",
|
||||
confirmDescription:
|
||||
"Finance confirms the uploaded proof and marks the booking as paid.",
|
||||
variant: "default",
|
||||
icon: Check,
|
||||
primary: true,
|
||||
},
|
||||
];
|
||||
case "PAID":
|
||||
case "PNR_GENERATED":
|
||||
return [
|
||||
{
|
||||
id: "startTransit",
|
||||
label: "Start transit",
|
||||
shortLabel: "Transit",
|
||||
description: "Begin rail movement",
|
||||
confirmTitle: "Start transit?",
|
||||
confirmDescription: "The booking will move to in transit status.",
|
||||
variant: "default",
|
||||
icon: Truck,
|
||||
primary: true,
|
||||
},
|
||||
];
|
||||
case "IN_TRANSIT":
|
||||
return [
|
||||
{
|
||||
id: "complete",
|
||||
label: "Complete booking",
|
||||
shortLabel: "Complete",
|
||||
description: "Mark journey finished",
|
||||
confirmTitle: "Complete booking?",
|
||||
confirmDescription:
|
||||
"Marks the booking as completed. No further staff transitions apply.",
|
||||
variant: "default",
|
||||
icon: Play,
|
||||
primary: true,
|
||||
},
|
||||
];
|
||||
default:
|
||||
return [];
|
||||
}
|
||||
}
|
||||
|
||||
export function listRowHasActions(row: {
|
||||
status: BookingStatus;
|
||||
paymentCurrency: string;
|
||||
}): boolean {
|
||||
const actions = getBookingActions({
|
||||
status: row.status,
|
||||
paymentCurrency: row.paymentCurrency,
|
||||
reference: "",
|
||||
});
|
||||
if (actions.length > 0) return true;
|
||||
return row.status === "FULLY_EXECUTED" && row.paymentCurrency === "USD";
|
||||
}
|
||||
@@ -0,0 +1,260 @@
|
||||
import type { BookingStatus } from "@/types/booking";
|
||||
|
||||
export interface StatusStyle {
|
||||
label: string;
|
||||
color: string;
|
||||
}
|
||||
|
||||
export const BOOKING_STATUS_STYLES: Record<string, StatusStyle> = {
|
||||
DRAFT: {
|
||||
label: "Draft",
|
||||
color: "bg-slate-100 text-slate-700 border-slate-300",
|
||||
},
|
||||
SUBMITTED: {
|
||||
label: "Submitted",
|
||||
color: "bg-amber-50 text-amber-700 border-amber-200",
|
||||
},
|
||||
CHANGES_REQUESTED: {
|
||||
label: "Changes Requested",
|
||||
color: "bg-orange-50 text-orange-700 border-orange-200",
|
||||
},
|
||||
PENDING_APPROVAL: {
|
||||
label: "Pending Approval",
|
||||
color: "bg-amber-50 text-amber-700 border-amber-200",
|
||||
},
|
||||
APPROVED_PENDING_SIGNATURE: {
|
||||
label: "Pending Signature",
|
||||
color: "bg-sky-50 text-sky-700 border-sky-200",
|
||||
},
|
||||
APPROVED: {
|
||||
label: "Approved",
|
||||
color: "bg-emerald-50 text-emerald-700 border-emerald-200",
|
||||
},
|
||||
CONTRACT_READY: {
|
||||
label: "Contract Ready",
|
||||
color: "bg-indigo-50 text-indigo-700 border-indigo-200",
|
||||
},
|
||||
SIGNED_CUSTOMER: {
|
||||
label: "Customer Signed",
|
||||
color: "bg-sky-50 text-sky-700 border-sky-200",
|
||||
},
|
||||
FULLY_EXECUTED: {
|
||||
label: "Fully Executed",
|
||||
color: "bg-indigo-50 text-indigo-700 border-indigo-200",
|
||||
},
|
||||
PNR_GENERATED: {
|
||||
label: "PNR Generated",
|
||||
color: "bg-violet-50 text-violet-700 border-violet-200",
|
||||
},
|
||||
PAYMENT_VERIFICATION_IN_PROGRESS: {
|
||||
label: "Payment Verification",
|
||||
color: "bg-amber-50 text-amber-800 border-amber-200",
|
||||
},
|
||||
PAID: {
|
||||
label: "Paid",
|
||||
color: "bg-emerald-50 text-emerald-700 border-emerald-200",
|
||||
},
|
||||
IN_TRANSIT: {
|
||||
label: "In Transit",
|
||||
color: "bg-sky-50 text-sky-700 border-sky-200",
|
||||
},
|
||||
COMPLETED: {
|
||||
label: "Completed",
|
||||
color: "bg-indigo-50 text-indigo-700 border-indigo-200",
|
||||
},
|
||||
REJECTED: {
|
||||
label: "Rejected",
|
||||
color: "bg-red-50 text-red-700 border-red-200",
|
||||
},
|
||||
CANCELLED: {
|
||||
label: "Cancelled",
|
||||
color: "bg-red-50 text-red-700 border-red-200",
|
||||
},
|
||||
PENDING_CONSOLIDATION: {
|
||||
label: "Pending Consolidation",
|
||||
color: "bg-amber-50 text-amber-700 border-amber-200",
|
||||
},
|
||||
CONSOLIDATED: {
|
||||
label: "Consolidated",
|
||||
color: "bg-indigo-50 text-indigo-700 border-indigo-200",
|
||||
},
|
||||
};
|
||||
|
||||
export interface StatusMeta {
|
||||
title: string;
|
||||
description: string;
|
||||
color: string;
|
||||
stage: number;
|
||||
}
|
||||
|
||||
export const BOOKING_STATUS_META: Record<string, StatusMeta> = {
|
||||
DRAFT: {
|
||||
title: "Draft",
|
||||
description: "Booking is being prepared by the customer.",
|
||||
color: "text-slate-500",
|
||||
stage: 0,
|
||||
},
|
||||
SUBMITTED: {
|
||||
title: "Submitted",
|
||||
description: "Awaiting staff review.",
|
||||
color: "text-amber-600",
|
||||
stage: 0,
|
||||
},
|
||||
CHANGES_REQUESTED: {
|
||||
title: "Changes Requested",
|
||||
description: "Returned to customer for updates.",
|
||||
color: "text-orange-600",
|
||||
stage: 0,
|
||||
},
|
||||
PENDING_APPROVAL: {
|
||||
title: "Pending Approval",
|
||||
description: "Moving through internal approval chain.",
|
||||
color: "text-amber-600",
|
||||
stage: 1,
|
||||
},
|
||||
APPROVED_PENDING_SIGNATURE: {
|
||||
title: "Pending Signature",
|
||||
description: "Awaiting director or CEO signature steps.",
|
||||
color: "text-sky-600",
|
||||
stage: 1,
|
||||
},
|
||||
APPROVED: {
|
||||
title: "Approved",
|
||||
description: "Ready to generate contract.",
|
||||
color: "text-emerald-600",
|
||||
stage: 2,
|
||||
},
|
||||
CONTRACT_READY: {
|
||||
title: "Contract Ready",
|
||||
description: "Contract generated; awaiting customer signature.",
|
||||
color: "text-indigo-600",
|
||||
stage: 2,
|
||||
},
|
||||
SIGNED_CUSTOMER: {
|
||||
title: "Customer Signed",
|
||||
description: "Awaiting contract execution.",
|
||||
color: "text-sky-600",
|
||||
stage: 2,
|
||||
},
|
||||
FULLY_EXECUTED: {
|
||||
title: "Fully Executed",
|
||||
description: "Contract locked; proceed to payment.",
|
||||
color: "text-indigo-600",
|
||||
stage: 3,
|
||||
},
|
||||
PNR_GENERATED: {
|
||||
title: "PNR Generated",
|
||||
description: "ETB payment reference issued.",
|
||||
color: "text-violet-600",
|
||||
stage: 3,
|
||||
},
|
||||
PAYMENT_VERIFICATION_IN_PROGRESS: {
|
||||
title: "Payment Verification",
|
||||
description: "USD payment proof under review.",
|
||||
color: "text-amber-700",
|
||||
stage: 3,
|
||||
},
|
||||
PAID: {
|
||||
title: "Paid",
|
||||
description: "Payment confirmed; ready for operations.",
|
||||
color: "text-emerald-600",
|
||||
stage: 4,
|
||||
},
|
||||
IN_TRANSIT: {
|
||||
title: "In Transit",
|
||||
description: "Shipment is on the railway network.",
|
||||
color: "text-sky-600",
|
||||
stage: 4,
|
||||
},
|
||||
COMPLETED: {
|
||||
title: "Completed",
|
||||
description: "Booking fulfilled.",
|
||||
color: "text-indigo-600",
|
||||
stage: 5,
|
||||
},
|
||||
REJECTED: {
|
||||
title: "Rejected",
|
||||
description: "Booking was rejected.",
|
||||
color: "text-red-600",
|
||||
stage: -1,
|
||||
},
|
||||
CANCELLED: {
|
||||
title: "Cancelled",
|
||||
description: "Booking was cancelled.",
|
||||
color: "text-red-600",
|
||||
stage: -1,
|
||||
},
|
||||
PENDING_CONSOLIDATION: {
|
||||
title: "Pending Consolidation",
|
||||
description: "Waiting for consolidation partner.",
|
||||
color: "text-amber-600",
|
||||
stage: 4,
|
||||
},
|
||||
CONSOLIDATED: {
|
||||
title: "Consolidated",
|
||||
description: "Paired with another booking.",
|
||||
color: "text-indigo-600",
|
||||
stage: 4,
|
||||
},
|
||||
};
|
||||
|
||||
export const BOOKING_LIST_TABS = [
|
||||
{ key: "all", label: "All bookings", status: null },
|
||||
{ key: "SUBMITTED", label: "Submitted", status: "SUBMITTED" },
|
||||
{ key: "PENDING_APPROVAL", label: "Pending Approval", status: "PENDING_APPROVAL" },
|
||||
{
|
||||
key: "APPROVED_PENDING_SIGNATURE",
|
||||
label: "Pending Signature",
|
||||
status: "APPROVED_PENDING_SIGNATURE",
|
||||
},
|
||||
{ key: "SIGNED_CUSTOMER", label: "Customer Signed", status: "SIGNED_CUSTOMER" },
|
||||
{
|
||||
key: "PAYMENT_VERIFICATION_IN_PROGRESS",
|
||||
label: "Payment Verification",
|
||||
status: "PAYMENT_VERIFICATION_IN_PROGRESS",
|
||||
},
|
||||
] as const;
|
||||
|
||||
export type BookingStatusTabKey = (typeof BOOKING_LIST_TABS)[number]["key"];
|
||||
|
||||
export const WORKFLOW_STAGES = [
|
||||
{ label: "Submission", statuses: ["DRAFT", "SUBMITTED", "CHANGES_REQUESTED"] },
|
||||
{
|
||||
label: "Approval",
|
||||
statuses: ["PENDING_APPROVAL", "APPROVED_PENDING_SIGNATURE"],
|
||||
},
|
||||
{
|
||||
label: "Contract",
|
||||
statuses: ["APPROVED", "CONTRACT_READY", "SIGNED_CUSTOMER", "FULLY_EXECUTED"],
|
||||
},
|
||||
{
|
||||
label: "Payment",
|
||||
statuses: [
|
||||
"PNR_GENERATED",
|
||||
"PAYMENT_VERIFICATION_IN_PROGRESS",
|
||||
"PAID",
|
||||
],
|
||||
},
|
||||
{
|
||||
label: "Operations",
|
||||
statuses: ["IN_TRANSIT", "PENDING_CONSOLIDATION", "CONSOLIDATED"],
|
||||
},
|
||||
{ label: "Done", statuses: ["COMPLETED"] },
|
||||
] as const;
|
||||
|
||||
export function getStatusMeta(status: BookingStatus | string): StatusMeta {
|
||||
return (
|
||||
BOOKING_STATUS_META[status] ?? {
|
||||
title: status,
|
||||
description: "",
|
||||
color: "text-muted-foreground",
|
||||
stage: 0,
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
export function getWorkflowStageIndex(status: BookingStatus | string): number {
|
||||
const meta = getStatusMeta(status);
|
||||
if (meta.stage < 0) return -1;
|
||||
return meta.stage;
|
||||
}
|
||||
@@ -0,0 +1,34 @@
|
||||
import type { BookingDetail, BookingListRow } from "@/types/booking";
|
||||
|
||||
function labelFromRef(
|
||||
ref?: { name?: string; label?: string; code?: string; companyName?: string },
|
||||
fallback = "—",
|
||||
): string {
|
||||
if (!ref) return fallback;
|
||||
return (
|
||||
ref.companyName ??
|
||||
ref.label ??
|
||||
ref.name ??
|
||||
ref.code ??
|
||||
fallback
|
||||
);
|
||||
}
|
||||
|
||||
export function toBookingListRow(booking: BookingDetail): BookingListRow {
|
||||
return {
|
||||
id: booking.id,
|
||||
reference: booking.reference,
|
||||
customerLabel: labelFromRef(booking.customer, booking.customerId),
|
||||
status: booking.status,
|
||||
scheduledDate: booking.scheduledDate,
|
||||
totalAmount: Number(booking.totalAmount),
|
||||
paymentCurrency: booking.paymentCurrency,
|
||||
paymentStatus: booking.paymentStatus,
|
||||
tradeDirection: booking.tradeDirection,
|
||||
freightType: booking.freightType,
|
||||
originLabel: labelFromRef(booking.originYard),
|
||||
destinationLabel: labelFromRef(booking.destinationYard),
|
||||
priorityScore: booking.priorityScore ?? 0,
|
||||
createdAt: booking.createdAt,
|
||||
};
|
||||
}
|
||||
Reference in New Issue
Block a user