fixes

apps/edr-freight-web/backoffice/src/pages/bookings/BookingDetailPage.tsx

@@ -13,7 +13,7 @@ import {
   BookingReviewNotesCard,
   BookingRouteCard,
   detailStyles,
-  type BookingDetailView
+  type BookingDetailView,
 } from "@/components/bookings/detail";
 import Breadcrumbs from "@/components/ui/Breadcrumbs";
 
@@ -101,7 +101,9 @@ const BookingDetailPage = () => {
   };
 
   const approvalSteps = booking.approvalSteps ?? [];
-  const approvedCount = approvalSteps.filter((s) => s.status === "APPROVED").length;
+  const approvedCount = approvalSteps.filter(
+    (s) => s.status === "APPROVED",
+  ).length;
   const totalSteps = approvalSteps.length;
 
   return (
@@ -116,7 +118,7 @@ const BookingDetailPage = () => {
             { label: booking.reference },
           ]}
         />
-{/* 
+        {/* 
         <BookingDetailHeader
           booking={booking}
           approvedCount={approvedCount}
@@ -125,13 +127,18 @@ const BookingDetailPage = () => {
 
         <BookingLifecycleStepper status={booking.status} />
 
-        <Grid gutter="lg">
+        <Grid>
           {/* LEFT — primary content */}
           <Grid.Col span={{ base: 12, lg: 8 }}>
             <Stack gap="lg">
               <BookingRouteCard booking={booking} />
-              <BookingContainersCard containers={booking.bookingContainers ?? []} />
+              <BookingContainersCard
-              <BookingApprovalCard steps={approvalSteps} approvedCount={approvedCount} />
+                containers={booking.bookingContainers ?? []}
+              />
+              <BookingApprovalCard
+                steps={approvalSteps}
+                approvedCount={approvedCount}
+              />
               <BookingReviewNotesCard notes={booking.reviewNotes ?? []} />
             </Stack>
           </Grid.Col>
@@ -139,9 +146,12 @@ const BookingDetailPage = () => {
           {/* RIGHT — summary sidebar */}
           <Grid.Col span={{ base: 12, lg: 4 }}>
             <Stack gap="lg">
-              {booking.status === "SELECTED_FOR_BATCH" && booking.paymentDeadline && (
+              {booking.status === "SELECTED_FOR_BATCH" &&
-                <BookingPaymentCountdownCard paymentDeadline={booking.paymentDeadline} />
+                booking.paymentDeadline && (
-              )}
+                  <BookingPaymentCountdownCard
+                    paymentDeadline={booking.paymentDeadline}
+                  />
+                )}
               <BookingPaymentCard
                 totalAmount={booking.totalAmount}
                 currency={booking.paymentCurrency}

apps/edr-freight-web/portal/src/App.tsx

@@ -75,7 +75,7 @@ function RequireAuth() {
  * Only redirects on a confirmed "no company" response — never on a
  * transient query error.
  */
-function RequireCompany({path}: {path: string}) {
+function RequireCompany() {
   const { customerQuery } = useAuth();
 
   if (customerQuery.isPending) return <FullScreenSpinner />;

apps/edr-freight-web/portal/src/lib/currentCustomer.ts

@@ -1,13 +1,6 @@
 import { customers, type Customer } from "@/pages/customers/customers.mock";
 import { bookings, type Booking } from "@/pages/bookings/bookings.mock";
-import {
+import { shipments, type Shipment } from "@/pages/tracking/shipments.mock";
-  consignments,
-  type Consignment,
-} from "@/pages/consignments/consignments.mock";
-import {
-  shipments,
-  type Shipment,
-} from "@/pages/tracking/shipments.mock";
 import { invoices, type Invoice } from "@/pages/billing/invoices.mock";
 
 /**
@@ -28,12 +21,6 @@ export function getMyBookings(): Booking[] {
   return bookings.filter((b) => b.customerId === me.id);
 }
 
-export function getMyConsignments(): Consignment[] {
-  const me = getCurrentCustomer();
-  const myBookingIds = new Set(getMyBookings().map((b) => b.id));
-  return consignments.filter((c) => myBookingIds.has(c.bookingId));
-}
-
 export function getMyShipments(): Shipment[] {
   const myBookingIds = new Set(getMyBookings().map((b) => b.id));
   return shipments.filter((s) => myBookingIds.has(s.bookingId));

apps/edr-freight-web/portal/src/pages/bookings/NewBookingPage.tsx

@@ -63,11 +63,7 @@ export default function NewBookingPage() {
             You need to complete your company onboarding before you can create
             bookings. Please follow the onboarding process to get started.
           </Text>
-          <Button
+          <Button color="orange" onClick={() => navigate("/settings")} mt="md">
-            color="orange"
-            onClick={() => navigate("/onboarding")}
-            mt="md"
-          >
             Go to Onboarding
           </Button>
         </Alert>
@@ -110,18 +106,15 @@ export default function NewBookingPage() {
   const originYard = form.watch("originYard");
   const destinationYard = form.watch("destinationYard");
 
-  const direction = useMemo(
+  const direction = useMemo(() => {
-    () =>{
+    const origin = referenceData?.yard.find((y) => y.id === originYard);
-      const origin = referenceData?.yard.find((y) => y.id === originYard);
+    const destination = referenceData?.yard.find(
-      const destination = referenceData?.yard.find((y) => y.id === destinationYard);
+      (y) => y.id === destinationYard,
+    );
 
-      const route =  getRouteDirection(
+    const route = getRouteDirection(origin, destination);
-        origin,destination
+    return route;
-      )
+  }, [originYard, destinationYard]);
-      return route
-    },
-    [originYard, destinationYard],
-  );
 
   async function handleContinue() {
     const valid = await form.trigger(stepFields[step], { shouldFocus: true });
@@ -171,8 +164,7 @@ export default function NewBookingPage() {
       .flatMap((g) => g.children ?? [])
       .find((c) => c.id === childId);
 
-    const cargoTypeId =
+    const cargoTypeId = data.cargoType === "bulk" ? childId : undefined;
-      data.cargoType === "bulk" ? childId : undefined;
 
     const cargoFreeText = bulkChild?.show_free_text_box
       ? data.cargoFreeText
@@ -304,7 +296,9 @@ export default function NewBookingPage() {
             </Alert>
           )}
 
-          {step === 1 && <Step1ContractType form={form} referenceData={referenceData} />}
+          {step === 1 && (
+            <Step1ContractType form={form} referenceData={referenceData} />
+          )}
           {step === 2 && (
             <Step2ServiceType referenceData={referenceData} form={form} />
           )}

apps/edr-freight-web/portal/src/pages/bookings/new-booking-form/step1-contract-type.tsx

@@ -4,10 +4,7 @@ import { useQuery } from "@tanstack/react-query";
 import { FileText, RefreshCw } from "lucide-react";
 import { useMemo, useState } from "react";
 import { Controller, type UseFormReturn } from "react-hook-form";
-import {
+import { BookingFormInputValues, type BookingFormValues } from "./schema";
-  BookingFormInputValues,
-  type BookingFormValues,
-} from "./schema";
 import {
   AlertBox,
   AsyncComboboxField,
@@ -16,7 +13,11 @@ import {
   StepHeader,
 } from "./shared";
 
-type BookingForm = UseFormReturn<BookingFormInputValues, any, BookingFormValues>;
+type BookingForm = UseFormReturn<
+  BookingFormInputValues,
+  any,
+  BookingFormValues
+>;
 
 interface PreviousContractOption {
   value: string;
@@ -35,21 +36,24 @@ export function Step1ContractType({
   const previousContractRef = form.watch("previousContractRef");
   const [searchQuery, setSearchQuery] = useState("");
 
-  const { data: bookings, isLoading, error } = useQuery(
+  const {
-api.bookings.list.queryOptions({
+    data: bookings,
-  input: {
+    isLoading,
-
+    error,
+  } = useQuery(
+    api.bookings.list.queryOptions({
+      input: {
         page: 1,
         pageSize: 100,
         sortBy: "createdAt",
         sortOrder: "DESC",
-  }
+      },
-      })
+    }),
   );
 
   const contractOptions = useMemo<PreviousContractOption[]>(() => {
     console.log("Bookings data:", bookings);
-    if(!bookings) return []
+    if (!bookings) return [];
 
     return bookings?.items
       .map((booking) => {
@@ -62,35 +66,120 @@ api.bookings.list.queryOptions({
         };
       })
       .filter((opt) =>
-        opt.label.toLowerCase().includes(searchQuery.toLowerCase())
+        opt.label.toLowerCase().includes(searchQuery.toLowerCase()),
       );
   }, [bookings, searchQuery]);
 
-  const handleSelectContract = async (contractId: string) => {
+  const handleSelectContract = (contractId: string) => {
     const selected = contractOptions.find((opt) => opt.value === contractId);
     if (!selected) return;
 
     form.setValue("previousContractRef", contractId);
 
-    // Auto-fill from previous contract
     const booking = selected.booking;
-    if (booking) {
+    if (!booking) return;
-      form.setValue("serviceTypeId", booking.serviceTypeId);
-      form.setValue("cargoType", booking.freightType === "CONTAINER" ? "container" : "bulk");
-      form.setValue("equipmentReturn", booking.equipmentReturn === "WITH_RETURN" ? "with_return" : "without_return");
-      if (booking.isHazardous) form.setValue("isHazardous", booking.isHazardous);
 
-      // Look up shipping line name from reference data
+    // ── Service type ────────────────────────────────────────────────────
-      if (booking.shippingLineId && referenceData?.shipping_line) {
+    const service = booking.serviceType
-        const shippingLine = referenceData.shipping_line.find(
+      ? referenceData?.service.find((s) => s.code === booking.serviceType)
-          (sl) => sl.id === booking.shippingLineId,
+      : undefined;
-        );
+    const serviceId = service?.id || booking.serviceTypeId;
-        if (shippingLine) {
+    if (serviceId) form.setValue("serviceTypeId", serviceId);
-          form.setValue("shippingLine", shippingLine.name);
+
-        }
+    // ── First / last mile ───────────────────────────────────────────────
+    form.setValue("firstMile.enabled", booking.firstMileEnabled);
+    if (booking.firstMilePickupAddress) {
+      form.setValue("firstMile.pickUpAddress", booking.firstMilePickupAddress);
+    }
+    form.setValue("lastMile.enabled", booking.lastMileEnabled);
+    if (booking.lastMileDeliveryAddress) {
+      form.setValue(
+        "lastMile.deliveryAddress",
+        booking.lastMileDeliveryAddress,
+      );
+    }
+
+    // ── Equipment return ────────────────────────────────────────────────
+    form.setValue(
+      "equipmentReturn",
+      booking.equipmentReturn === "WITH_RETURN"
+        ? "with_return"
+        : "without_return",
+    );
+
+    // ── Customs ─────────────────────────────────────────────────────────
+    if (service) {
+      form.setValue("customsClearingEnabled", service.includesCustoms);
+    }
+
+    // ── Route ───────────────────────────────────────────────────────────
+    if (booking.originYard?.id) {
+      form.setValue("originYard", booking.originYard.id);
+    }
+    if (booking.destinationYard?.id) {
+      form.setValue("destinationYard", booking.destinationYard.id);
+    }
+
+    // ── Shipping line ───────────────────────────────────────────────────
+    if (booking.shippingLineId && referenceData?.shipping_line) {
+      const shippingLine = referenceData.shipping_line.find(
+        (sl) => sl.id === booking.shippingLineId,
+      );
+      if (shippingLine) {
+        form.setValue("shippingLine", shippingLine.name);
       }
     }
-  }
+
+    // ── Cargo type ──────────────────────────────────────────────────────
+    form.setValue(
+      "cargoType",
+      booking.freightType === "CONTAINER" ? "container" : "bulk",
+    );
+
+    // ── Cargo weight (bulk) ─────────────────────────────────────────────
+    if (booking.cargoTotalWeightVgm > 0) {
+      form.setValue("cargoWeight", String(booking.cargoTotalWeightVgm));
+    }
+
+    // ── Hazardous / refrigerated ────────────────────────────────────────
+    form.setValue("isHazardous", booking.isHazardous);
+    form.setValue("isRefrigerated", booking.isRefrigerated);
+
+    // ── Containers ──────────────────────────────────────────────────────
+    if (
+      booking.freightType === "CONTAINER" &&
+      booking.containers &&
+      booking.containers.length > 0
+    ) {
+      const mappedContainers = booking.containers.map((c) => {
+        let containerTypeName = "";
+        for (const group of referenceData?.containers ?? []) {
+          const ct = group.types.find(
+            (t) => t.code === c.type || t.name === c.type,
+          );
+          if (ct) {
+            containerTypeName = ct.name;
+            break;
+          }
+        }
+        return {
+          type: (c.type === "40ft" ? "40ft" : "20ft") as "20ft" | "40ft",
+          containerType: containerTypeName,
+          qty: String(c.qty),
+          vgm: String(c.vgm),
+        };
+      });
+      form.setValue("containers", mappedContainers);
+    }
+
+    // ── Consolidation ───────────────────────────────────────────────────
+    form.setValue("consolidationEnabled", booking.allowConsolidation);
+
+    // ── Scheduled date ──────────────────────────────────────────────────
+    if (booking.scheduledDate) {
+      form.setValue("scheduledDate", booking.scheduledDate);
+    }
+  };
 
   return (
     <div className="space-y-6">

apps/edr-freight-web/portal/src/types/userTypeRequest.ts

@@ -1,10 +0,0 @@
-export type UserTypeRequest {
-  email: string;
-  username: string;
-  phoneNumber: string;
-  userType: string;
-  name: {
-    am?: string;
-    en: string;
-  };
-}

packages/ui-common/package.json

@@ -23,6 +23,7 @@
   },
   "dependencies": {
     "@edr/types": "workspace:*",
+    "@mantine/core": "^9.3.0",
     "@tanstack/react-table": "^8.21.3",
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",

pnpm-lock.yaml

@@ -915,6 +915,9 @@ importers:
       '@edr/types':
         specifier: workspace:*
         version: link:../types
+      '@mantine/core':
+        specifier: ^9.3.0
+        version: 9.3.0(@mantine/hooks@9.3.0(react@18.3.1))(@types/react@18.3.31)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
       '@tanstack/react-table':
         specifier: ^8.21.3
         version: 8.21.3(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
@@ -4317,6 +4320,9 @@ packages:
   '@types/jsonwebtoken@9.0.5':
     resolution: {integrity: sha512-VRLSGzik+Unrup6BsouBeHsf4d1hOEgYWTm/7Nmw1sXoN1+tRly/Gy/po3yeahnP4jfnQWWAhQAqcNfH7ngOkA==}
 
+  '@types/lodash@4.17.24':
+    resolution: {integrity: sha512-gIW7lQLZbue7lRSWEFql49QJJWThrTFFeIMJdp3eH4tKoxm1OvEPg02rm4wCCSHS0cL3/Fizimb35b7k8atwsQ==}
+
   '@types/luxon@3.7.1':
     resolution: {integrity: sha512-H3iskjFIAn5SlJU7OuxUmTEpebK6TKB8rxZShDslBMZJ5u9S//KM1sbdAisiSrqwLQncVjnpi2OK2J51h+4lsg==}
 
@@ -13549,6 +13555,14 @@ snapshots:
       react: 19.2.6
       react-dom: 19.2.6(react@19.2.6)
 
+  '@floating-ui/react@0.27.19(react-dom@18.3.1(react@18.3.1))(react@18.3.1)':
+    dependencies:
+      '@floating-ui/react-dom': 2.1.8(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      '@floating-ui/utils': 0.2.11
+      react: 18.3.1
+      react-dom: 18.3.1(react@18.3.1)
+      tabbable: 6.4.0
+
   '@floating-ui/react@0.27.19(react-dom@19.2.6(react@19.2.6))(react@19.2.6)':
     dependencies:
       '@floating-ui/react-dom': 2.1.8(react-dom@19.2.6(react@19.2.6))(react@19.2.6)
@@ -14041,6 +14055,19 @@ snapshots:
     transitivePeerDependencies:
       - '@types/react'
 
+  '@mantine/core@9.3.0(@mantine/hooks@9.3.0(react@18.3.1))(@types/react@18.3.31)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)':
+    dependencies:
+      '@floating-ui/react': 0.27.19(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      '@mantine/hooks': 9.3.0(react@18.3.1)
+      clsx: 2.1.1
+      react: 18.3.1
+      react-dom: 18.3.1(react@18.3.1)
+      react-number-format: 5.4.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      react-remove-scroll: 2.7.2(@types/react@18.3.31)(react@18.3.1)
+      type-fest: 5.7.0
+    transitivePeerDependencies:
+      - '@types/react'
+
   '@mantine/core@9.3.0(@mantine/hooks@9.3.0(react@19.2.6))(@types/react@18.3.31)(react-dom@19.2.6(react@19.2.6))(react@19.2.6)':
     dependencies:
       '@floating-ui/react': 0.27.19(react-dom@19.2.6(react@19.2.6))(react@19.2.6)
@@ -14067,6 +14094,10 @@ snapshots:
     dependencies:
       react: 19.2.6
 
+  '@mantine/hooks@9.3.0(react@18.3.1)':
+    dependencies:
+      react: 18.3.1
+
   '@mantine/hooks@9.3.0(react@19.2.6)':
     dependencies:
       react: 19.2.6
@@ -14409,7 +14440,7 @@ snapshots:
       tslib: 2.8.1
       uid: 2.0.2
     optionalDependencies:
-      '@nestjs/microservices': 11.1.24(@nestjs/common@11.1.24(class-transformer@0.5.1)(class-validator@0.14.4)(reflect-metadata@0.2.2)(rxjs@7.8.2))(@nestjs/core@11.1.24)(amqp-connection-manager@5.0.0(amqplib@2.0.1))(amqplib@2.0.1)(reflect-metadata@0.2.2)(rxjs@7.8.2)
+      '@nestjs/microservices': 11.1.24(@nestjs/common@11.1.24(class-transformer@0.5.1)(class-validator@0.14.4)(reflect-metadata@0.2.2)(rxjs@7.8.2))(@nestjs/core@11.1.24)(amqp-connection-manager@5.0.0(amqplib@0.10.9))(amqplib@0.10.9)(reflect-metadata@0.2.2)(rxjs@7.8.2)
       '@nestjs/platform-express': 11.1.24(@nestjs/common@11.1.24(class-transformer@0.5.1)(class-validator@0.14.4)(reflect-metadata@0.2.2)(rxjs@7.8.2))(@nestjs/core@11.1.24)
 
   '@nestjs/event-emitter@2.1.1(@nestjs/common@11.1.24(class-transformer@0.5.1)(class-validator@0.14.4)(reflect-metadata@0.2.2)(rxjs@7.8.2))(@nestjs/core@11.1.24)':
@@ -14440,6 +14471,19 @@ snapshots:
       class-transformer: 0.5.1
       class-validator: 0.14.4
 
+  '@nestjs/microservices@11.1.24(@nestjs/common@11.1.24(class-transformer@0.5.1)(class-validator@0.14.4)(reflect-metadata@0.2.2)(rxjs@7.8.2))(@nestjs/core@11.1.24)(amqp-connection-manager@5.0.0(amqplib@0.10.9))(amqplib@0.10.9)(reflect-metadata@0.2.2)(rxjs@7.8.2)':
+    dependencies:
+      '@nestjs/common': 11.1.24(class-transformer@0.5.1)(class-validator@0.14.4)(reflect-metadata@0.2.2)(rxjs@7.8.2)
+      '@nestjs/core': 11.1.24(@nestjs/common@11.1.24(class-transformer@0.5.1)(class-validator@0.14.4)(reflect-metadata@0.2.2)(rxjs@7.8.2))(@nestjs/microservices@11.1.24)(@nestjs/platform-express@11.1.24)(reflect-metadata@0.2.2)(rxjs@7.8.2)
+      iterare: 1.2.1
+      reflect-metadata: 0.2.2
+      rxjs: 7.8.2
+      tslib: 2.8.1
+    optionalDependencies:
+      amqp-connection-manager: 5.0.0(amqplib@0.10.9)
+      amqplib: 0.10.9
+    optional: true
+
   '@nestjs/microservices@11.1.24(@nestjs/common@11.1.24(class-transformer@0.5.1)(class-validator@0.14.4)(reflect-metadata@0.2.2)(rxjs@7.8.2))(@nestjs/core@11.1.24)(amqp-connection-manager@5.0.0(amqplib@2.0.1))(amqplib@2.0.1)(reflect-metadata@0.2.2)(rxjs@7.8.2)':
     dependencies:
       '@nestjs/common': 11.1.24(class-transformer@0.5.1)(class-validator@0.14.4)(reflect-metadata@0.2.2)(rxjs@7.8.2)
@@ -14524,7 +14568,7 @@ snapshots:
       '@nestjs/core': 11.1.24(@nestjs/common@11.1.24(class-transformer@0.5.1)(class-validator@0.14.4)(reflect-metadata@0.2.2)(rxjs@7.8.2))(@nestjs/microservices@11.1.24)(@nestjs/platform-express@11.1.24)(reflect-metadata@0.2.2)(rxjs@7.8.2)
       tslib: 2.8.1
     optionalDependencies:
-      '@nestjs/microservices': 11.1.24(@nestjs/common@11.1.24(class-transformer@0.5.1)(class-validator@0.14.4)(reflect-metadata@0.2.2)(rxjs@7.8.2))(@nestjs/core@11.1.24)(amqp-connection-manager@5.0.0(amqplib@2.0.1))(amqplib@2.0.1)(reflect-metadata@0.2.2)(rxjs@7.8.2)
+      '@nestjs/microservices': 11.1.24(@nestjs/common@11.1.24(class-transformer@0.5.1)(class-validator@0.14.4)(reflect-metadata@0.2.2)(rxjs@7.8.2))(@nestjs/core@11.1.24)(amqp-connection-manager@5.0.0(amqplib@0.10.9))(amqplib@0.10.9)(reflect-metadata@0.2.2)(rxjs@7.8.2)
       '@nestjs/platform-express': 11.1.24(@nestjs/common@11.1.24(class-transformer@0.5.1)(class-validator@0.14.4)(reflect-metadata@0.2.2)(rxjs@7.8.2))(@nestjs/core@11.1.24)
 
   '@nestjs/throttler@6.5.0(@nestjs/common@11.1.24(class-transformer@0.5.1)(class-validator@0.14.4)(reflect-metadata@0.2.2)(rxjs@7.8.2))(@nestjs/core@11.1.24)(reflect-metadata@0.2.2)':
@@ -17500,6 +17544,8 @@ snapshots:
     dependencies:
       '@types/node': 20.19.42
 
+  '@types/lodash@4.17.24': {}
+
   '@types/luxon@3.7.1': {}
 
   '@types/methods@1.1.4': {}
@@ -18599,6 +18645,12 @@ snapshots:
       amqplib: 0.10.9
       promise-breaker: 6.0.0
 
+  amqp-connection-manager@5.0.0(amqplib@0.10.9):
+    dependencies:
+      amqplib: 0.10.9
+      promise-breaker: 6.0.0
+    optional: true
+
   amqp-connection-manager@5.0.0(amqplib@2.0.1):
     dependencies:
       amqplib: 2.0.1
@@ -25008,6 +25060,11 @@ snapshots:
     transitivePeerDependencies:
       - '@types/react'
 
+  react-number-format@5.4.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1):
+    dependencies:
+      react: 18.3.1
+      react-dom: 18.3.1(react@18.3.1)
+
   react-number-format@5.4.5(react-dom@19.2.6(react@19.2.6))(react@19.2.6):
     dependencies:
       react: 19.2.6
@@ -27058,6 +27115,12 @@ snapshots:
     optionalDependencies:
       '@types/react': 18.3.31
 
+  use-deep-compare-effect@1.8.1(react@19.2.6):
+    dependencies:
+      '@babel/runtime': 7.29.7
+      dequal: 2.0.3
+      react: 19.2.6
+
   use-isomorphic-layout-effect@1.2.1(@types/react@18.3.31)(react@19.2.6):
     dependencies:
       react: 19.2.6