feat(clearance): preview charge documents before and after upload

apps/edr-freight-web/backoffice/src/pages/trainBuilder/TrainBuilderDetailPage.tsx

@@ -111,6 +111,7 @@ export default function TrainBuilderDetailPage() {
   const assignWagons = useMutation(api.trainBuilder.assignWagons.mutationOptions());
   const removeWagon = useMutation(api.trainBuilder.removeWagon.mutationOptions());
   const setWagonYard = useMutation(api.trainBuilder.setWagonYard.mutationOptions());
+  const setWagonsYard = useMutation(api.trainBuilder.setWagonsYard.mutationOptions());
   const maintenanceWagon = useMutation(
     api.trainBuilder.sendWagonToMaintenance.mutationOptions(),
   );
@@ -165,6 +166,7 @@ export default function TrainBuilderDetailPage() {
     assignWagons.isPending ||
     removeWagon.isPending ||
     setWagonYard.isPending ||
+    setWagonsYard.isPending ||
     maintenanceWagon.isPending ||
     reorderWagons.isPending;
 
@@ -230,6 +232,16 @@ export default function TrainBuilderDetailPage() {
     },
     [withToast, setWagonYard.mutateAsync, trainId],
   );
+  const handleChangeWagonsYard = useCallback(
+    (wagonIds: string[], currentYardId: string, onDone: () => void) => {
+      if (!trainId) return;
+      void withToast(async () => {
+        await setWagonsYard.mutateAsync({ id: trainId, wagonIds, currentYardId });
+        onDone();
+      }, "Could not move the selected wagons");
+    },
+    [withToast, setWagonsYard.mutateAsync, trainId],
+  );
   const handleMaintenance = useCallback(
     (wagon: TrainCompositionWagon) => setMaintenanceTarget(wagon),
     [],
@@ -515,6 +527,9 @@ export default function TrainBuilderDetailPage() {
                 onChangeYard={
                   composition.editable && canChangeWagonYard ? handleChangeWagonYard : undefined
                 }
+                onChangeYardBulk={
+                  composition.editable && canChangeWagonYard ? handleChangeWagonsYard : undefined
+                }
               />
             </Stack>
           </Card>