Expose project-wide history controls
This commit is contained in:
@@ -21,7 +21,6 @@ import {
|
||||
listProjects,
|
||||
listRooms,
|
||||
synchronizeProjectDeviceRows,
|
||||
undoProjectCommand,
|
||||
updateProjectDevice,
|
||||
updateProjectSettings,
|
||||
} from "../../../frontend/utils/api";
|
||||
@@ -56,11 +55,6 @@ const projectDeviceSyncFieldLabels: Record<ProjectDeviceSyncField, string> = {
|
||||
remark: "Bemerkung",
|
||||
};
|
||||
|
||||
type ProjectDeviceUndoState = {
|
||||
projectDeviceId: string;
|
||||
revisionNumber: number;
|
||||
};
|
||||
|
||||
const emptyProjectDevice: CreateProjectDeviceInput = {
|
||||
name: "",
|
||||
displayName: "",
|
||||
@@ -117,7 +111,6 @@ 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);
|
||||
|
||||
@@ -180,7 +173,6 @@ export default function ProjectDetailPage() {
|
||||
setProject((current) =>
|
||||
current ? { ...current, currentRevision } : current
|
||||
);
|
||||
setProjectDeviceUndo(null);
|
||||
}
|
||||
|
||||
async function handleCreateBoard(event: FormEvent<HTMLFormElement>) {
|
||||
@@ -386,7 +378,6 @@ 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));
|
||||
@@ -438,10 +429,6 @@ export default function ProjectDetailPage() {
|
||||
setSelectedSyncRowIds(
|
||||
result.preview.rows.filter((row) => row.differences.length > 0).map((row) => row.rowId)
|
||||
);
|
||||
setProjectDeviceUndo({
|
||||
projectDeviceId: syncPreview.projectDevice.id,
|
||||
revisionNumber: result.revision.revisionNumber,
|
||||
});
|
||||
} catch (err) {
|
||||
setError(err instanceof Error ? err.message : "Gerätezeilen konnten nicht synchronisiert werden.");
|
||||
} finally {
|
||||
@@ -474,10 +461,6 @@ export default function ProjectDetailPage() {
|
||||
.map((row) => row.rowId)
|
||||
);
|
||||
applyProjectRevision(result.history.currentRevision);
|
||||
setProjectDeviceUndo({
|
||||
projectDeviceId: syncPreview.projectDevice.id,
|
||||
revisionNumber: result.revision.revisionNumber,
|
||||
});
|
||||
} catch (err) {
|
||||
setError(err instanceof Error ? err.message : "Verknüpfungen konnten nicht getrennt werden.");
|
||||
} finally {
|
||||
@@ -485,40 +468,6 @@ export default function ProjectDetailPage() {
|
||||
}
|
||||
}
|
||||
|
||||
async function handleUndoProjectDeviceOperation() {
|
||||
if (!projectId || !project || !projectDeviceUndo) {
|
||||
return;
|
||||
}
|
||||
setIsSaving(true);
|
||||
setError(null);
|
||||
try {
|
||||
if (
|
||||
project.currentRevision !==
|
||||
projectDeviceUndo.revisionNumber
|
||||
) {
|
||||
throw new Error(
|
||||
"Eine neuere Projektänderung verhindert dieses Rückgängig."
|
||||
);
|
||||
}
|
||||
const result = await undoProjectCommand(
|
||||
projectId,
|
||||
project.currentRevision
|
||||
);
|
||||
const preview = await getProjectDeviceSyncPreview(
|
||||
projectId,
|
||||
projectDeviceUndo.projectDeviceId
|
||||
);
|
||||
applyProjectRevision(result.history.currentRevision);
|
||||
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 || !project || !selectedGlobalDeviceId) {
|
||||
return;
|
||||
@@ -624,7 +573,7 @@ export default function ProjectDetailPage() {
|
||||
<section className="col-12">
|
||||
<ProjectVersionHistory
|
||||
currentRevision={project.currentRevision}
|
||||
onRestoreComplete={() => window.location.reload()}
|
||||
onProjectStateChange={() => window.location.reload()}
|
||||
projectId={projectId}
|
||||
/>
|
||||
</section>
|
||||
@@ -1163,16 +1112,6 @@ 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"
|
||||
|
||||
@@ -7,15 +7,19 @@ import React, {
|
||||
useState,
|
||||
} from "react";
|
||||
import type {
|
||||
ProjectHistoryStateDto,
|
||||
ProjectRevisionPageDto,
|
||||
ProjectRevisionSummaryDto,
|
||||
ProjectSnapshotMetadataDto,
|
||||
} from "../types";
|
||||
import {
|
||||
createNamedProjectSnapshot,
|
||||
getProjectHistory,
|
||||
listProjectRevisions,
|
||||
listProjectSnapshots,
|
||||
redoProjectCommand,
|
||||
restoreProjectSnapshot,
|
||||
undoProjectCommand,
|
||||
} from "../utils/api";
|
||||
import {
|
||||
getProjectRevisionDescription,
|
||||
@@ -26,7 +30,7 @@ import {
|
||||
interface ProjectVersionHistoryProps {
|
||||
projectId: string;
|
||||
currentRevision: number;
|
||||
onRestoreComplete: () => void;
|
||||
onProjectStateChange: () => void;
|
||||
}
|
||||
|
||||
const revisionPageSize = 10;
|
||||
@@ -34,8 +38,10 @@ const revisionPageSize = 10;
|
||||
export function ProjectVersionHistory({
|
||||
projectId,
|
||||
currentRevision,
|
||||
onRestoreComplete,
|
||||
onProjectStateChange,
|
||||
}: ProjectVersionHistoryProps) {
|
||||
const [history, setHistory] =
|
||||
useState<ProjectHistoryStateDto | null>(null);
|
||||
const [snapshots, setSnapshots] = useState<ProjectSnapshotMetadataDto[]>(
|
||||
[]
|
||||
);
|
||||
@@ -51,9 +57,26 @@ export function ProjectVersionHistory({
|
||||
useState<ProjectSnapshotMetadataDto | null>(null);
|
||||
const [isOpen, setIsOpen] = useState(false);
|
||||
const [isLoading, setIsLoading] = useState(true);
|
||||
const [isHistoryLoading, setIsHistoryLoading] = useState(true);
|
||||
const [isBusy, setIsBusy] = useState(false);
|
||||
const [error, setError] = useState<string | null>(null);
|
||||
|
||||
const loadHistory = useCallback(async () => {
|
||||
setIsHistoryLoading(true);
|
||||
try {
|
||||
setHistory(await getProjectHistory(projectId));
|
||||
} catch (loadError) {
|
||||
setError(
|
||||
getVersionHistoryError(
|
||||
loadError,
|
||||
"Rückgängig-Status konnte nicht geladen werden."
|
||||
)
|
||||
);
|
||||
} finally {
|
||||
setIsHistoryLoading(false);
|
||||
}
|
||||
}, [projectId]);
|
||||
|
||||
const loadOverview = useCallback(async () => {
|
||||
setIsLoading(true);
|
||||
setError(null);
|
||||
@@ -77,6 +100,10 @@ export function ProjectVersionHistory({
|
||||
}
|
||||
}, [projectId]);
|
||||
|
||||
useEffect(() => {
|
||||
void loadHistory();
|
||||
}, [currentRevision, loadHistory]);
|
||||
|
||||
useEffect(() => {
|
||||
if (isOpen) {
|
||||
void loadOverview();
|
||||
@@ -157,7 +184,7 @@ export function ProjectVersionHistory({
|
||||
);
|
||||
setRestoreCandidate(null);
|
||||
setIsBusy(false);
|
||||
onRestoreComplete();
|
||||
onProjectStateChange();
|
||||
} catch (restoreError) {
|
||||
setError(
|
||||
getVersionHistoryError(
|
||||
@@ -170,6 +197,33 @@ export function ProjectVersionHistory({
|
||||
}
|
||||
}
|
||||
|
||||
async function handleHistoryCommand(direction: "undo" | "redo") {
|
||||
setIsBusy(true);
|
||||
setError(null);
|
||||
try {
|
||||
const result =
|
||||
direction === "undo"
|
||||
? await undoProjectCommand(projectId, currentRevision)
|
||||
: await redoProjectCommand(projectId, currentRevision);
|
||||
setHistory(result.history);
|
||||
onProjectStateChange();
|
||||
} catch (historyError) {
|
||||
setError(
|
||||
getVersionHistoryError(
|
||||
historyError,
|
||||
direction === "undo"
|
||||
? "Die letzte Änderung konnte nicht rückgängig gemacht werden."
|
||||
: "Die letzte Änderung konnte nicht wiederholt werden."
|
||||
)
|
||||
);
|
||||
} finally {
|
||||
setIsBusy(false);
|
||||
}
|
||||
}
|
||||
|
||||
const historyIsCurrent =
|
||||
history?.currentRevision === currentRevision;
|
||||
|
||||
return (
|
||||
<section className="card shadow-sm">
|
||||
<div className="card-header d-flex flex-wrap justify-content-between align-items-center gap-2">
|
||||
@@ -178,6 +232,42 @@ export function ProjectVersionHistory({
|
||||
<span className="badge text-bg-secondary">
|
||||
Aktuelle Revision {currentRevision}
|
||||
</span>
|
||||
<button
|
||||
className="btn btn-sm btn-outline-secondary"
|
||||
disabled={
|
||||
isBusy ||
|
||||
isHistoryLoading ||
|
||||
!historyIsCurrent ||
|
||||
!history?.undoDepth
|
||||
}
|
||||
onClick={() => void handleHistoryCommand("undo")}
|
||||
title={
|
||||
history?.undoDepth
|
||||
? `${history.undoDepth} Änderung(en) können rückgängig gemacht werden`
|
||||
: "Keine Änderung zum Rückgängigmachen"
|
||||
}
|
||||
type="button"
|
||||
>
|
||||
Rückgängig
|
||||
</button>
|
||||
<button
|
||||
className="btn btn-sm btn-outline-secondary"
|
||||
disabled={
|
||||
isBusy ||
|
||||
isHistoryLoading ||
|
||||
!historyIsCurrent ||
|
||||
!history?.redoDepth
|
||||
}
|
||||
onClick={() => void handleHistoryCommand("redo")}
|
||||
title={
|
||||
history?.redoDepth
|
||||
? `${history.redoDepth} Änderung(en) können wiederholt werden`
|
||||
: "Keine Änderung zum Wiederholen"
|
||||
}
|
||||
type="button"
|
||||
>
|
||||
Wiederholen
|
||||
</button>
|
||||
<button
|
||||
aria-expanded={isOpen}
|
||||
className="btn btn-sm btn-outline-secondary"
|
||||
@@ -188,6 +278,11 @@ export function ProjectVersionHistory({
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
{error ? (
|
||||
<div className="alert alert-warning m-3 mb-0" role="alert">
|
||||
{error}
|
||||
</div>
|
||||
) : null}
|
||||
{isOpen ? (
|
||||
<>
|
||||
<div className="card-body border-bottom">
|
||||
@@ -237,12 +332,6 @@ export function ProjectVersionHistory({
|
||||
</form>
|
||||
</div>
|
||||
|
||||
{error ? (
|
||||
<div className="alert alert-warning m-3 mb-0" role="alert">
|
||||
{error}
|
||||
</div>
|
||||
) : null}
|
||||
|
||||
<div className="card-body border-bottom">
|
||||
<h2 className="h6">Gespeicherte Sicherungspunkte</h2>
|
||||
{isLoading ? (
|
||||
|
||||
Reference in New Issue
Block a user