Make device sync atomic and undoable

src/app/projects/[projectId]/page.tsx

@@ -20,6 +20,8 @@ import {
   listProjectDevices,
   listProjects,
   listRooms,
+  reconnectProjectDeviceRows,
+  restoreProjectDeviceRows,
   synchronizeProjectDeviceRows,
   updateProjectDevice,
   updateProjectSettings,
@@ -32,6 +34,7 @@ import type {
   GlobalDeviceDto,
   ProjectDeviceDto,
   ProjectDeviceSyncPreviewDto,
+  ProjectDeviceSyncRestoreRowDto,
   ProjectDto,
   RoomDto,
 } from "../../../frontend/types";
@@ -54,6 +57,10 @@ const projectDeviceSyncFieldLabels: Record<ProjectDeviceSyncField, string> = {
   remark: "Bemerkung",
 };
 
+type ProjectDeviceUndoState =
+  | { kind: "synchronize"; projectDeviceId: string; rows: ProjectDeviceSyncRestoreRowDto[] }
+  | { kind: "disconnect"; projectDeviceId: string; rowIds: string[] };
+
 const emptyProjectDevice: CreateProjectDeviceInput = {
   name: "",
   displayName: "",
@@ -110,6 +117,7 @@ export default function ProjectDetailPage() {
   const [syncPreview, setSyncPreview] = useState<ProjectDeviceSyncPreviewDto | null>(null);
   const [selectedSyncRowIds, setSelectedSyncRowIds] = useState<string[]>([]);
   const [selectedSyncFields, setSelectedSyncFields] = useState<ProjectDeviceSyncField[]>([]);
+  const [projectDeviceUndo, setProjectDeviceUndo] = useState<ProjectDeviceUndoState | null>(null);
   const [error, setError] = useState<string | null>(null);
   const [isSaving, setIsSaving] = useState(false);
 
@@ -347,6 +355,7 @@ export default function ProjectDetailPage() {
       return;
     }
     try {
+      setProjectDeviceUndo(null);
       const preview = await getProjectDeviceSyncPreview(projectId, projectDeviceId);
       setSyncPreview(preview);
       setSelectedSyncRowIds(preview.rows.filter((row) => row.differences.length > 0).map((row) => row.rowId));
@@ -380,14 +389,21 @@ export default function ProjectDetailPage() {
     setIsSaving(true);
     setError(null);
     try {
-      const preview = await synchronizeProjectDeviceRows(
+      const result = await synchronizeProjectDeviceRows(
         projectId,
         syncPreview.projectDevice.id,
         selectedSyncRowIds,
         selectedSyncFields
       );
-      setSyncPreview(preview);
-      setSelectedSyncRowIds(preview.rows.filter((row) => row.differences.length > 0).map((row) => row.rowId));
+      setSyncPreview(result.preview);
+      setSelectedSyncRowIds(
+        result.preview.rows.filter((row) => row.differences.length > 0).map((row) => row.rowId)
+      );
+      setProjectDeviceUndo({
+        kind: "synchronize",
+        projectDeviceId: syncPreview.projectDevice.id,
+        rows: result.undo.rows,
+      });
     } catch (err) {
       setError(err instanceof Error ? err.message : "Gerätezeilen konnten nicht synchronisiert werden.");
     } finally {
@@ -402,8 +418,17 @@ export default function ProjectDetailPage() {
     setIsSaving(true);
     setError(null);
     try {
-      await disconnectProjectDeviceRows(projectId, syncPreview.projectDevice.id, selectedSyncRowIds);
+      const result = await disconnectProjectDeviceRows(
+        projectId,
+        syncPreview.projectDevice.id,
+        selectedSyncRowIds
+      );
       await openProjectDeviceSyncPreview(syncPreview.projectDevice.id);
+      setProjectDeviceUndo({
+        kind: "disconnect",
+        projectDeviceId: syncPreview.projectDevice.id,
+        rowIds: result.undo.rowIds,
+      });
     } catch (err) {
       setError(err instanceof Error ? err.message : "Verknüpfungen konnten nicht getrennt werden.");
     } finally {
@@ -411,6 +436,35 @@ export default function ProjectDetailPage() {
     }
   }
 
+  async function handleUndoProjectDeviceOperation() {
+    if (!projectId || !projectDeviceUndo) {
+      return;
+    }
+    setIsSaving(true);
+    setError(null);
+    try {
+      const preview =
+        projectDeviceUndo.kind === "synchronize"
+          ? await restoreProjectDeviceRows(
+              projectId,
+              projectDeviceUndo.projectDeviceId,
+              projectDeviceUndo.rows
+            )
+          : await reconnectProjectDeviceRows(
+              projectId,
+              projectDeviceUndo.projectDeviceId,
+              projectDeviceUndo.rowIds
+            );
+      setSyncPreview(preview);
+      setSelectedSyncRowIds(preview.rows.filter((row) => row.differences.length > 0).map((row) => row.rowId));
+      setProjectDeviceUndo(null);
+    } catch (err) {
+      setError(err instanceof Error ? err.message : "Die letzte Aktion konnte nicht rückgängig gemacht werden.");
+    } finally {
+      setIsSaving(false);
+    }
+  }
+
   async function handleCopyGlobalToProject() {
     if (!projectId || !selectedGlobalDeviceId) {
       return;
@@ -1039,6 +1093,16 @@ export default function ProjectDetailPage() {
             </div>
 
             <div className="d-flex flex-wrap gap-2">
+              {projectDeviceUndo ? (
+                <button
+                  className="btn btn-outline-secondary"
+                  type="button"
+                  onClick={() => void handleUndoProjectDeviceOperation()}
+                  disabled={isSaving}
+                >
+                  Letzte Aktion rückgängig
+                </button>
+              ) : null}
               <button
                 className="btn btn-primary"
                 type="button"