diff --git a/apps/edr-freight-web/portal/src/pages/bookings/EditBookingPage.tsx b/apps/edr-freight-web/portal/src/pages/bookings/EditBookingPage.tsx index edd83df15..b81cc455a 100644 --- a/apps/edr-freight-web/portal/src/pages/bookings/EditBookingPage.tsx +++ b/apps/edr-freight-web/portal/src/pages/bookings/EditBookingPage.tsx @@ -1,8 +1,7 @@ -import { useMemo, useRef, type ReactNode } from "react"; -import { Controller, useForm } from "react-hook-form"; -import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query"; +import { api } from "@/services/api"; +import type { CreateBookingPayload } from "@/services/bookings.service"; +import type { Freight } from "@edr/types"; import { zodResolver } from "@hookform/resolvers/zod"; -import { useNavigate, useParams } from "react-router-dom"; import { ActionIcon, Alert, @@ -21,6 +20,7 @@ import { TextInput, Title, } from "@mantine/core"; +import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query"; import { AlertCircle, AlertTriangle, @@ -34,12 +34,17 @@ import { Upload, X, } from "lucide-react"; -import type { Freight } from "@edr/types"; -import { api } from "@/services/api"; -import type { CreateBookingPayload } from "@/services/bookings.service"; +import { useMemo, useRef, type ReactNode } from "react"; +import { Controller, useForm } from "react-hook-form"; +import { useNavigate, useParams } from "react-router-dom"; +import { + CountChip, + DocRow, + IconSquare, +} from "./BookingDetailPage/components/Documents"; import { - BookingFormInputValues, BOOKING_DOCS_SETTING, + BookingFormInputValues, bookingFormSchema, getRouteDirection, initialBookingFormValues, @@ -48,11 +53,6 @@ import { } from "./new-booking-form/schema"; import { SelectField } from "./new-booking-form/shared"; import { Step5CargoDetails } from "./new-booking-form/steps"; -import { - CountChip, - DocRow, - IconSquare, -} from "./BookingDetailPage/components/Documents"; function yardNameFromBooking( yard: { label?: string; code?: string; name?: string } | undefined | null, @@ -117,8 +117,6 @@ function mapBookingToFormValues( shippingLine: (booking as any).shippingLine?.name ?? "", consolidationEnabled: booking.allowConsolidation ?? false, notes: "", - // Terms were accepted at creation; editing shouldn't re-gate on them. - termsAccepted: true, containers: [], } as BookingFormInputValues; diff --git a/apps/edr-freight-web/portal/src/pages/bookings/new-booking-form/schema.ts b/apps/edr-freight-web/portal/src/pages/bookings/new-booking-form/schema.ts index 3d1a7a0bf..3a59e5715 100644 --- a/apps/edr-freight-web/portal/src/pages/bookings/new-booking-form/schema.ts +++ b/apps/edr-freight-web/portal/src/pages/bookings/new-booking-form/schema.ts @@ -121,7 +121,6 @@ export const bookingFormSchema = z consolidationEnabled: z.boolean(), documents: z.record(z.string(), z.any()).default({}), notes: z.string(), - termsAccepted: z.boolean(), }) .refine( (data) => @@ -165,10 +164,6 @@ export const bookingFormSchema = z (data) => !(data.cargoType === "container" && data.containers.length === 0), { message: "Add at least one container.", path: ["containers"] }, ) - .refine((data) => data.termsAccepted, { - message: "Accept the freight contract terms to submit.", - path: ["termsAccepted"], - }) .superRefine((data, ctx) => { if (data.cargoType === "bulk") { if (!data.cargoTypePath[0]) { @@ -237,7 +232,6 @@ export const initialBookingFormValues: DeepPartial = { consolidationEnabled: false, documents: {}, notes: "", - termsAccepted: false, }; export const stepFields: Record>> = { @@ -265,7 +259,7 @@ export const stepFields: Record>> = { ], 5: ["scheduledDate", "trainScheduleId"], 6: ["documents"], - 7: ["notes", "termsAccepted"], + 7: ["notes"], }; export interface ContainerConfig { diff --git a/apps/edr-freight-web/portal/src/pages/bookings/new-booking-form/step8-review.tsx b/apps/edr-freight-web/portal/src/pages/bookings/new-booking-form/step8-review.tsx index bbfd1cc34..278698f83 100644 --- a/apps/edr-freight-web/portal/src/pages/bookings/new-booking-form/step8-review.tsx +++ b/apps/edr-freight-web/portal/src/pages/bookings/new-booking-form/step8-review.tsx @@ -3,15 +3,15 @@ import { Box, Button, Card, - Checkbox, Divider, Group, Loader, SimpleGrid, + Stack, Text, Textarea, } from "@mantine/core"; -import { Check, Send, XCircle } from "lucide-react"; +import { Check, Send, XCircle, FileText, Route, Package, Truck } from "lucide-react"; import { BookingFormInputValues, BOOKING_DOCS_SETTING, @@ -54,12 +54,11 @@ export function Step8Review({ abortPending?: boolean; }) { const values = form.watch(); - const errors = form.formState.errors; const serviceType = referenceData?.service.find( (s) => s.id === values.serviceTypeId, ); - function Row({ + function CompactRow({ label, value, target, @@ -69,19 +68,19 @@ export function Step8Review({ target: number; }) { return ( -
-
- +
+
+ {label} - + {value || "—"}
@@ -89,6 +88,28 @@ export function Step8Review({ ); } + function CompactCard({ + icon: Icon, + title, + children, + }: { + icon: React.ReactNode; + title: string; + children: React.ReactNode; + }) { + return ( + + + {Icon} + + {title} + + + {children} + + ); + } + const containerSummary = values.cargoType === "container" && values.containers.length > 0 ? values.containers @@ -122,186 +143,24 @@ export function Step8Review({ return child ? `${group.name} — ${child.name}` : group.name; })(); - function ReviewCard({ - title, - children, - }: { - title: string; - children: React.ReactNode; - }) { - return ( - - - - {title} - - - - {children} - - - ); - } + const originYardName = referenceData?.yard.find( + (y) => y.id === values.originYard, + )?.name ?? values.originYard; + + const destinationYardName = referenceData?.yard.find( + (y) => y.id === values.destinationYard, + )?.name ?? values.destinationYard; return ( -
+ - - - - - - - - - - - - - - - - - - - - - - - - 0 ? `${totalVgm.toFixed(1)} tons` : ""} - target={4} - /> - - - - 0 - ? `${docsAttached} of ${docsTotal} attached` - : "None — upload later from the booking page" - } - target={5} - /> - - - - ( -