i/next-ai-draw-io
1
0
Fork 0
mirror of https://github.com/DayuanJiang/next-ai-draw-io.git synced 2026-01-03 06:42:27 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: add confirmation dialog for diagram history restore (#49)

Browse Source
This commit is contained in:
Dayuan Jiang
2025-12-03 14:04:29 +09:00
committed by GitHub
parent 443a937370
commit c458947553
1 changed files with 43 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

54
components/history-dialog.tsx
View File

@@ -1,5 +1,6 @@
"use client";
import { useState } from "react";
import {
Dialog,
DialogContent,
@@ -22,6 +23,19 @@ export function HistoryDialog({
onToggleHistory,
}: HistoryDialogProps) {
const { loadDiagram: onDisplayChart, diagramHistory } = useDiagram();
const [selectedIndex, setSelectedIndex] = useState<number | null>(null);
const handleClose = () => {
setSelectedIndex(null);
onToggleHistory(false);
};
const handleConfirmRestore = () => {
if (selectedIndex !== null) {
onDisplayChart(diagramHistory[selectedIndex].xml);
handleClose();
}
};
return (
<Dialog open={showHistory} onOpenChange={onToggleHistory}>
@@ -45,11 +59,12 @@ export function HistoryDialog({
{diagramHistory.map((item, index) => (
<div
key={index}
className="border rounded-md p-2 cursor-pointer hover:border-primary transition-colors"
onClick={() => {
onDisplayChart(item.xml);
onToggleHistory(false);
}}
className={`border rounded-md p-2 cursor-pointer hover:border-primary transition-colors ${
selectedIndex === index
? "border-primary ring-2 ring-primary"
: ""
}`}
onClick={() => setSelectedIndex(index)}
>
<div className="aspect-video bg-white rounded overflow-hidden flex items-center justify-center">
<Image
@@ -69,12 +84,29 @@ export function HistoryDialog({
)}
<DialogFooter>
<Button
variant="outline"
onClick={() => onToggleHistory(false)}
>
Close
</Button>
{selectedIndex !== null ? (
<>
<div className="flex-1 text-sm text-muted-foreground">
Restore to Version {selectedIndex + 1}?
</div>
<Button
variant="outline"
onClick={() => setSelectedIndex(null)}
>
Cancel
</Button>
<Button onClick={handleConfirmRestore}>
Confirm
</Button>
</>
) : (
<Button
variant="outline"
onClick={handleClose}
>
Close
</Button>
)}
</DialogFooter>
</DialogContent>
</Dialog>