refactor(view-transitions): zentralen withViewTransition-Helper in state.js, Duplikate entfernt

src/js/boards.js

@@ -273,18 +273,10 @@ function bindBoardListEvents(list, board) {
 // reduced-motion kappt das Fade ueber den ungeschichteten @media-Block.
 // Feature-Detection-Fallback (Firefox < 144): instant.
 function openModal(id)  {
-  if (document.startViewTransition) {
+  withViewTransition(() => document.getElementById(id).classList.add('active'));
-    document.startViewTransition(() => document.getElementById(id).classList.add('active'));
-  } else {
-    document.getElementById(id).classList.add('active');
-  }
 }
 function closeModal(id) {
-  if (document.startViewTransition) {
+  withViewTransition(() => document.getElementById(id).classList.remove('active'));
-    document.startViewTransition(() => document.getElementById(id).classList.remove('active'));
-  } else {
-    document.getElementById(id).classList.remove('active');
-  }
 }
 
 function openAddBoardModal() {

src/js/bookmark-import.js

@@ -4,20 +4,6 @@
    via chrome.bookmarks.getTree() / browser.bookmarks.getTree()
    ============================================= */
 
-/**
- * Fuehrt eine DOM-Mutation mit nativem View-Transition-Fade aus.
- * Feature-Detection-Fallback (Firefox < 144): instant.
- * reduced-motion kappt das Fade ueber den ungeschichteten @media-Block.
- * @param {Function} mutate - synchrone DOM-Mutation
- */
-function bmImportViewTransition(mutate) {
-  if (document.startViewTransition) {
-    document.startViewTransition(mutate);
-  } else {
-    mutate();
-  }
-}
-
 const BrowserBookmarkImport = {
 
   /** Initialisiert den Import-Button */
@@ -211,14 +197,14 @@ const BrowserBookmarkImport = {
     document.body.appendChild(overlay);
 
     // View-Transition-Fade
-    bmImportViewTransition(() => overlay.classList.add('active'));
+    withViewTransition(() => overlay.classList.add('active'));
   },
 
   /** Schliesst das Modal */
   _closeModal() {
     const overlay = document.getElementById('bmImportOverlay');
     if (!overlay) return;
-    bmImportViewTransition(() => {
+    withViewTransition(() => {
       overlay.classList.remove('active');
       overlay.remove();
     });

src/js/dialog.js

@@ -3,20 +3,6 @@
    Custom Dialog System (ersetzt native alert/confirm)
    ============================================= */
 
-/**
- * Fuehrt eine DOM-Mutation mit nativem View-Transition-Fade aus.
- * Feature-Detection-Fallback (Firefox < 144): instant.
- * reduced-motion kappt das Fade ueber den ungeschichteten @media-Block.
- * @param {Function} mutate - synchrone DOM-Mutation
- */
-function dialogViewTransition(mutate) {
-  if (document.startViewTransition) {
-    document.startViewTransition(mutate);
-  } else {
-    mutate();
-  }
-}
-
 const HellionDialog = {
   /** SVG-Icons je nach Dialog-Typ */
   _icons: {
@@ -79,7 +65,7 @@ const HellionDialog = {
 
       function cleanup(result) {
         document.removeEventListener('keydown', keyHandler);
-        dialogViewTransition(() => {
+        withViewTransition(() => {
           overlay.classList.remove('active');
           overlay.remove();
         });
@@ -125,7 +111,7 @@ const HellionDialog = {
 
       document.body.appendChild(overlay);
       // View-Transition uebernimmt das Fade; Fokus bleibt erhalten
-      dialogViewTransition(() => {
+      withViewTransition(() => {
         overlay.classList.add('active');
         confirmBtn.focus();
       });

src/js/settings.js

@@ -3,20 +3,6 @@
    Settings Panel, Theme-Modal, Accordion, Toggles
    ============================================= */
 
-/**
- * Fuehrt einen DOM-Mutationsschritt mit nativem View-Transition-Fade aus.
- * Feature-Detection-Fallback fuer aeltere Browser (Firefox < 144): instant.
- * reduced-motion kappt das Fade ueber den ungeschichteten @media-Block.
- * @param {Function} mutate - synchrone DOM-Mutation (Klassen-Toggle etc.)
- */
-function withViewTransition(mutate) {
-  if (document.startViewTransition) {
-    document.startViewTransition(mutate);
-  } else {
-    mutate();
-  }
-}
-
 // ---- SETTINGS PANEL ----
 function openSettings()  {
   withViewTransition(() => {
@@ -53,11 +39,7 @@ function closeThemeModal() {
  */
 function switchTheme(name) {
   const swap = () => applyTheme(name, false); // false: Theme-BG anwenden (kein User-bgUrl-Schutz hier noetig, bgUrl wurde geleert)
-  if (document.startViewTransition) {
+  withViewTransition(swap);
-    document.startViewTransition(swap);
-  } else {
-    swap();
-  }
 }
 
 /**

src/js/state.js

@@ -55,3 +55,14 @@ async function saveBoards() {
 async function saveSettings() {
   await Store.set('settings', settings);
 }
+
+// ---- VIEW TRANSITIONS ----
+// Fuehrt eine synchrone DOM-Mutation mit nativem View-Transition-Fade aus.
+// Feature-Detection-Fallback (Firefox < 144): instant. reduced-motion kappt das Fade ueber den ungeschichteten @media-Block.
+function withViewTransition(mutate) {
+  if (document.startViewTransition) {
+    document.startViewTransition(mutate);
+  } else {
+    mutate();
+  }
+}