enhance shipment form and booking process

apps/edr-freight-web/backoffice/src/components/contracts/GlCreateBookingForm.tsx

@@ -269,6 +269,8 @@ export default function GlCreateBookingForm() {
   const [scheduledDate, setScheduledDate] = useState("");
   const [contractRouteId, setContractRouteId] = useState<string | null>(null);
   const [notes, setNotes] = useState("");
+  // What the containers carry — captured per booking (moved off the contract).
+  const [cargoDescription, setCargoDescription] = useState("");
   const [containerLines, setContainerLines] = useState<ContainerLineDraft[]>([]);
   const [bulk, setBulk] = useState<BulkDraft>({
     cargoWeightTons: "",
@@ -459,6 +461,10 @@ export default function GlCreateBookingForm() {
       );
     };
     setPrefilled(true);
+    // Rebook carries the expired booking's cargo description forward.
+    if (copyFromBooking.cargoFreeText) {
+      setCargoDescription(copyFromBooking.cargoFreeText);
+    }
     setContainerLines(
       lines.map((c) => {
         const qty = Math.max(1, c.quantity);
@@ -705,14 +711,23 @@ export default function GlCreateBookingForm() {
 
   const lineErrors = useMemo<LineErrors[]>(() => {
     if (!isContainer || !contract) return [];
-    return containerLines.map((line) => {
+    // A line can be 0 (the contract covers both sizes; a booking may only need
+    // one) but the booking as a whole needs at least one container — anchor
+    // that error on the first line's quantity so it renders in the field.
+    const totalQty = containerLines.reduce(
+      (sum, l) => sum + Math.max(0, Number(l.quantity) || 0),
+      0,
+    );
+    return containerLines.map((line, idx) => {
       const errs: LineErrors = {};
       const qty = Number(line.quantity || 0);
       if (line.quantity.trim() === "") {
         errs.quantity = "Quantity is required.";
-      } else if (Number.isNaN(qty) || qty < 1) {
-        errs.quantity = "At least 1.";
-      } else if (line.units.length < qty) {
+      } else if (Number.isNaN(qty) || qty < 0) {
+        errs.quantity = "Enter 0 or more.";
+      } else if (idx === 0 && totalQty < 1) {
+        errs.quantity = "Book at least one container (either size).";
+      } else if (qty >= 1 && line.units.length < qty) {
         errs.units = `Enter details for all ${qty} container(s).`;
       }
       if (contract.isHazardous) {
@@ -789,6 +804,11 @@ export default function GlCreateBookingForm() {
   const routeError =
     multiRoute && !contractRouteId ? "Select a route." : undefined;
 
+  const cargoDescriptionError =
+    isContainer && !cargoDescription.trim()
+      ? "Describe the cargo carried in the containers."
+      : undefined;
+
   const cargoValid = isContainer
     ? lineErrors.every(
         (e) =>
@@ -800,7 +820,8 @@ export default function GlCreateBookingForm() {
       ) &&
       unitErrors.every((line) =>
         line.every((e) => !e.containerNumber && !e.vgmTons),
-      )
+      ) &&
+      !cargoDescriptionError
     : !bulkErrors.quantity && !bulkErrors.hazardous && !bulkErrors.reefer;
 
   const formValid = cargoValid && !hasOdd20ft && !dateError && !routeError;
@@ -827,6 +848,8 @@ export default function GlCreateBookingForm() {
     };
 
     if (isContainer) {
+      // What the containers carry — captured per booking, not on the contract.
+      if (cargoDescription.trim()) payload.cargoFreeText = cargoDescription.trim();
       payload.containers = containerLines
         .filter((l) => Number(l.quantity) >= 1)
         .map((l) => ({
@@ -1245,6 +1268,19 @@ export default function GlCreateBookingForm() {
               )}
               {remainderNotice}
               <ContractCapacityNotice contractId={contract.id} isContainer />
+              <Textarea
+                label="Cargo description *"
+                description="What do the containers carry on this shipment?"
+                placeholder="e.g. Electronics, garments, machinery spare parts…"
+                value={cargoDescription}
+                onChange={(e) => setCargoDescription(e.currentTarget.value)}
+                error={showErrors ? cargoDescriptionError : undefined}
+                radius={10}
+                autosize
+                minRows={2}
+                maxRows={4}
+                styles={fieldStyles}
+              />
               {containerLines.length === 0 ? (
                 <Text fz="sm" c="dimmed">
                   This contract has no container sizes in scope.
@@ -1264,7 +1300,7 @@ export default function GlCreateBookingForm() {
                         type="number"
                         onKeyDown={blockNegative}
                         label="Quantity *"
-                        min={1}
+                        min={0}
                         value={line.quantity}
                         error={
                           showErrors