Merge pull request #137 from vincentmakes/claude/drag-reorder-undo-redo-pS5tQ

Add undo/redo functionality to admin UI

Author: vincentmakes

CHANGELOG.md

@@ -4,6 +4,14 @@ All notable changes to CV Manager will be documented in this file.
 
 Format follows [Keep a Changelog](https://keepachangelog.com/), versioning follows [Semantic Versioning](https://semver.org/).
 
+## [1.43.0] - 2026-04-21
+
+### Added
+- **Undo / Redo for the admin UI.** Two new icon-only toolbar buttons (Undo, Redo) sit at the start of the admin toolbar, and the standard keyboard shortcuts (`Ctrl/Cmd+Z`, `Ctrl/Cmd+Shift+Z`, `Ctrl+Y`) revert or replay the most recent content change. Coverage: profile edits, full CRUD on experiences / certifications / education / skills / projects, custom-section + item CRUD, section visibility and print-visibility toggles, and section reordering. The "Show all items" bulk action collapses into a single undo step. Implementation captures a snapshot of the live CV state via `GET /api/cv` after each successful mutation and restores via `POST /api/import` (the same atomic-replace path used by user import), so no new backend endpoints were added. History caps at 50 entries and is in-memory only — it's wiped when you load, create, or delete a saved dataset, or run the user-facing Import (those operations replace the live state wholesale, so older history would no longer refer to anything coherent). Page reload also clears history. Modals, text inputs, and `contenteditable` elements opt out of the shortcut so native form undo continues to work mid-edit. Theme, settings, section rename, file uploads (logos, profile pictures), and dataset operations are intentionally **not** undoable in this release. Six new toast / button labels (`toolbar.undo`, `toolbar.redo`, `toast.undone`, `toast.redone`, `toast.nothing_to_undo`, `toast.nothing_to_redo`) translated across all 8 supported locales.
+
+### Fixed
+- Toast notifications no longer appear in the printed PDF / Print preview. The toast element gained the `no-print` class and `@media print` now hides `.toast` outright, so an auto-save (or any of the new undo/redo) toast that happens to be on-screen when the user hits Print is excluded from the output.
+
 ## [1.42.0] - 2026-04-20
 
 ### Added

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "cv-manager",
-  "version": "1.42.0",
+  "version": "1.43.0",
   "description": "Professional CV Management System",
   "main": "src/server.js",
   "scripts": {

package.json

@@ -18,6 +18,14 @@
     <div class="toolbar no-print">
         <div class="toolbar-title"></div>
         <div class="toolbar-actions" id="toolbarActions">
+            <button id="undoBtn" class="btn btn-secondary btn-icon-only" onclick="undoAction()" disabled
+                    data-i18n-title="toolbar.undo" title="Undo">
+                <span class="material-symbols-outlined">undo</span>
+            </button>
+            <button id="redoBtn" class="btn btn-secondary btn-icon-only" onclick="redoAction()" disabled
+                    data-i18n-title="toolbar.redo" title="Redo">
+                <span class="material-symbols-outlined">redo</span>
+            </button>
             <button class="btn btn-secondary" onclick="openCvManager()">
                 <span class="material-symbols-outlined">folder_managed</span>
                 <span data-i18n="toolbar.cv_manager">CV Manager</span>
@@ -916,7 +924,7 @@ <h3 class="modal-title" id="customItemModalTitle" data-i18n="custom_item.add_tit
     </div>
 
     <!-- Toast -->
-    <div class="toast" id="toast"></div>
+    <div class="toast no-print" id="toast"></div>
 
     <!-- ATS PDF Export Modal -->
     <div class="modal-overlay ats-pdf-modal" id="atsPdfModalOverlay">

public/index.html

@@ -2820,6 +2820,7 @@
 
 @media print {
     .toolbar, .add-btn, .item-actions, .section-actions, .no-print { display: none !important; }
+    .toast { display: none !important; }
     .container { margin-top: 0 !important; max-width: 100% !important; margin: 0 !important; padding: 0 10px !important; }
     .section { page-break-inside: avoid; break-inside: avoid; }
     #section-experience { page-break-inside: auto; break-inside: auto; }

public/shared/admin.css

@@ -1979,28 +1979,30 @@ async function confirmDelete(endpoint, id) {
 
 // Show All Items
 async function showAllItems() {
-    const cv = await api('/api/cv');
-    
-    for (const section of Object.keys(sectionVisibility)) {
-        await api(`/api/sections/${section}`, { method: 'PUT', body: { visible: true } });
-    }
-    
-    for (const exp of cv.experiences) {
-        await api(`/api/experiences/${exp.id}`, { method: 'PUT', body: { ...exp, visible: true } });
-    }
-    for (const cert of cv.certifications) {
-        await api(`/api/certifications/${cert.id}`, { method: 'PUT', body: { ...cert, visible: true } });
-    }
-    for (const edu of cv.education) {
-        await api(`/api/education/${edu.id}`, { method: 'PUT', body: { ...edu, visible: true } });
-    }
-    for (const skill of cv.skills) {
-        await api(`/api/skills/${skill.id}`, { method: 'PUT', body: { ...skill, visible: true } });
-    }
-    for (const proj of cv.projects) {
-        await api(`/api/projects/${proj.id}`, { method: 'PUT', body: { ...proj, visible: true } });
-    }
-    
+    await UndoManager.batch(async () => {
+        const cv = await api('/api/cv');
+
+        for (const section of Object.keys(sectionVisibility)) {
+            await api(`/api/sections/${section}`, { method: 'PUT', body: { visible: true } });
+        }
+
+        for (const exp of cv.experiences) {
+            await api(`/api/experiences/${exp.id}`, { method: 'PUT', body: { ...exp, visible: true } });
+        }
+        for (const cert of cv.certifications) {
+            await api(`/api/certifications/${cert.id}`, { method: 'PUT', body: { ...cert, visible: true } });
+        }
+        for (const edu of cv.education) {
+            await api(`/api/education/${edu.id}`, { method: 'PUT', body: { ...edu, visible: true } });
+        }
+        for (const skill of cv.skills) {
+            await api(`/api/skills/${skill.id}`, { method: 'PUT', body: { ...skill, visible: true } });
+        }
+        for (const proj of cv.projects) {
+            await api(`/api/projects/${proj.id}`, { method: 'PUT', body: { ...proj, visible: true } });
+        }
+    });
+
     await initAdmin();
     toast(t('toast.all_visible'));
     autoSaveActiveDataset();
@@ -2062,6 +2064,9 @@ async function importData(event) {
                 toast(result.error, 'error');
                 return;
             }
+            // Imported data wholesale-replaces the live state — earlier history
+            // doesn't refer to anything coherent anymore.
+            if (typeof UndoManager !== 'undefined') UndoManager.clear();
             // Clear active dataset — imported data doesn't belong to any dataset
             hideActiveDatasetBanner();
             // Switch UI locale to match imported language
@@ -3366,6 +3371,7 @@ async function submitSaveAs() {
         if (versionGroup) body.version_group = versionGroup;
         const result = await api('/api/datasets', { method: 'POST', body });
         if (result.success) {
+            if (typeof UndoManager !== 'undefined') UndoManager.clear();
             await applyLoadedDatasetResult({
                 id: result.id,
                 name,
@@ -3645,6 +3651,9 @@ async function loadDataset(id, name) {
     try {
         const result = await api(`/api/datasets/${id}/load`, { method: 'POST' });
         if (result.success) {
+            // Switching datasets replaces the entire content slice — any prior
+            // undo history would restore data that no longer belongs.
+            if (typeof UndoManager !== 'undefined') UndoManager.clear();
             // Set active dataset state BEFORE initAdmin (so initAdmin skips auto-load)
             await applyLoadedDatasetResult(result);
             persistActiveDataset();
@@ -3676,8 +3685,10 @@ async function deleteDataset(id, name) {
             toast(result.error, 'error');
             return;
         }
-        // If we deleted the active dataset, clear the banner
+        // If we deleted the active dataset, the live tables may have been
+        // swapped to another default — earlier undo history is no longer valid.
         if (activeDatasetId === id) {
+            if (typeof UndoManager !== 'undefined') UndoManager.clear();
             hideActiveDatasetBanner();
         }
         await loadDatasetsList();
@@ -4623,7 +4634,28 @@ document.addEventListener('keydown', (e) => {
         closeCustomItemModal();
         const langDropdown = document.getElementById('languagePickerDropdown');
         if (langDropdown) langDropdown.classList.remove('active');
+        return;
     }
+
+    // Undo / Redo: skip if a modal is open or focus is on an editable element
+    // so native form undo and modal-internal flows aren't disrupted.
+    const isMod = e.ctrlKey || e.metaKey;
+    if (!isMod) return;
+    const key = e.key.toLowerCase();
+    const isUndo = key === 'z' && !e.shiftKey;
+    const isRedo = (key === 'z' && e.shiftKey) || key === 'y';
+    if (!isUndo && !isRedo) return;
+
+    const tgt = e.target;
+    const tag = tgt && tgt.tagName ? tgt.tagName.toLowerCase() : '';
+    if (tag === 'input' || tag === 'textarea' || (tgt && tgt.isContentEditable)) return;
+    if (currentModal && currentModal.type !== null) return;
+    // Also skip if any modal-overlay is currently active
+    const openModal = document.querySelector('.modal-overlay.active');
+    if (openModal) return;
+
+    e.preventDefault();
+    if (isUndo) undoAction(); else redoAction();
 });
 
 // ===========================

public/shared/admin.js

@@ -1,6 +1,8 @@
 {
     "toolbar.settings": "Einstellungen",
     "toolbar.theme": "Design",
+    "toolbar.undo": "Rückgängig",
+    "toolbar.redo": "Wiederholen",
     "toolbar.open": "Öffnen...",
     "toolbar.save_as": "Speichern unter...",
     "toolbar.language": "Sprache",
@@ -350,6 +352,10 @@
     "custom_item.add_item": "Eintrag hinzufügen",
     "toast.saved": "Erfolgreich gespeichert",
     "toast.deleted": "Gelöscht",
+    "toast.undone": "Rückgängig gemacht",
+    "toast.redone": "Wiederhergestellt",
+    "toast.nothing_to_undo": "Nichts rückgängig zu machen",
+    "toast.nothing_to_redo": "Nichts zu wiederholen",
     "toast.visibility_updated": "Sichtbarkeit aktualisiert",
     "toast.section_visibility_updated": "Abschnittssichtbarkeit aktualisiert",
     "toast.section_print_visibility_updated": "Drucksichtbarkeit des Abschnitts aktualisiert",

public/shared/i18n/de.json

@@ -1,6 +1,8 @@
 {
     "toolbar.settings": "Settings",
     "toolbar.theme": "Theme",
+    "toolbar.undo": "Undo",
+    "toolbar.redo": "Redo",
     "toolbar.open": "Open...",
     "toolbar.save_as": "Save As...",
     "toolbar.cv_manager": "CV Manager",
@@ -360,6 +362,10 @@
     "custom_item.add_item": "Add Item",
     "toast.saved": "Saved successfully",
     "toast.deleted": "Deleted",
+    "toast.undone": "Undone",
+    "toast.redone": "Redone",
+    "toast.nothing_to_undo": "Nothing to undo",
+    "toast.nothing_to_redo": "Nothing to redo",
     "toast.visibility_updated": "Visibility updated",
     "toast.section_visibility_updated": "Section visibility updated",
     "toast.section_print_visibility_updated": "Section print visibility updated",

public/shared/i18n/en.json

@@ -1,6 +1,8 @@
 {
     "toolbar.settings": "Configuración",
     "toolbar.theme": "Tema",
+    "toolbar.undo": "Deshacer",
+    "toolbar.redo": "Rehacer",
     "toolbar.open": "Abrir...",
     "toolbar.save_as": "Guardar como...",
     "toolbar.language": "Idioma",
@@ -350,6 +352,10 @@
     "custom_item.add_item": "Añadir elemento",
     "toast.saved": "Guardado correctamente",
     "toast.deleted": "Eliminado",
+    "toast.undone": "Deshecho",
+    "toast.redone": "Rehecho",
+    "toast.nothing_to_undo": "Nada que deshacer",
+    "toast.nothing_to_redo": "Nada que rehacer",
     "toast.visibility_updated": "Visibilidad actualizada",
     "toast.section_visibility_updated": "Visibilidad de sección actualizada",
     "toast.section_print_visibility_updated": "Visibilidad de impresión de sección actualizada",

public/shared/i18n/es.json

@@ -1,6 +1,8 @@
 {
     "toolbar.settings": "Paramètres",
     "toolbar.theme": "Thème",
+    "toolbar.undo": "Annuler",
+    "toolbar.redo": "Rétablir",
     "toolbar.open": "Ouvrir...",
     "toolbar.save_as": "Enregistrer sous...",
     "toolbar.language": "Langue",
@@ -350,6 +352,10 @@
     "custom_item.add_item": "Ajouter un élément",
     "toast.saved": "Enregistré avec succès",
     "toast.deleted": "Supprimé",
+    "toast.undone": "Annulé",
+    "toast.redone": "Rétabli",
+    "toast.nothing_to_undo": "Rien à annuler",
+    "toast.nothing_to_redo": "Rien à rétablir",
     "toast.visibility_updated": "Visibilité mise à jour",
     "toast.section_visibility_updated": "Visibilité de la section mise à jour",
     "toast.section_print_visibility_updated": "Visibilité à l'impression de la section mise à jour",