christianV/Craze-Data-check
1
0
Fork 0
mirror of https://github.com/christianvidalwolf-prog/Craze-Data-check.git synced 2026-08-03 15:35:23 +02:00
Code Issues Packages Projects Releases Wiki Activity

Enhance Undo system with 5-step history and TopBar badge

Browse Source
This commit is contained in:
Christian Vidal Wolf
2026-03-29 17:50:31 +02:00
parent 5c9d101349
commit c67fcadb48
2 changed files with 27 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/TopBar.tsx
+8 -2
View File
@@ -11,9 +11,10 @@ interface TopBarProps {
canUndo: boolean;
onUndo: () => void;
undoMessage?: string;
undoSteps: number;
}
export function TopBar({ stats, onExport, hasData, hasUnsavedChanges, userEmail, onSignOut, canUndo, onUndo, undoMessage }: TopBarProps) {
export function TopBar({ stats, onExport, hasData, hasUnsavedChanges, userEmail, onSignOut, canUndo, onUndo, undoMessage, undoSteps }: TopBarProps) {
return (
<header className="bg-[#020812] border-b border-slate-700/30 h-32 flex items-center justify-between px-10 shrink-0 z-10 shadow-2xl">
<div className="flex items-center -ml-4">
@@ -73,10 +74,15 @@ export function TopBar({ stats, onExport, hasData, hasUnsavedChanges, userEmail,
<button
onClick={onUndo}
title={`Undo: ${undoMessage}`}
className="flex items-center gap-2 px-4 py-2 bg-amber-600 hover:bg-amber-700 text-white rounded-md text-sm font-bold transition-all shadow-lg shadow-amber-900/40 animate-in fade-in zoom-in duration-300"
className="flex items-center gap-2 px-4 py-2 bg-amber-600 hover:bg-amber-700 text-white rounded-md text-sm font-bold transition-all shadow-lg shadow-amber-900/40 animate-in fade-in zoom-in duration-300 relative group"
>
<Undo2 className="w-4 h-4" />
BACK / UNDO
{undoSteps > 1 && (
<span className="absolute -top-1 -right-1 bg-white text-amber-700 text-[10px] w-4 h-4 rounded-full flex items-center justify-center shadow-md">
{undoSteps}
</span>
)}
</button>
)}