reworked site

web/app.js

@@ -245,6 +245,7 @@ const DEFAULT_SORT_SETTINGS = { mode: 'created', direction: 'desc' };
 const BOOKMARKS_BASE_URL = 'https://www.facebook.com/search/top';
 const BOOKMARK_WINDOW_DAYS = 28;
 const BOOKMARK_SUFFIXES = ['Gewinnspiel', 'gewinnen', 'verlosen'];
+const BOOKMARK_PREFS_KEY = 'trackerBookmarkPreferences';
 
 function initializeFocusParams() {
   try {
@@ -289,6 +290,45 @@ let bookmarkSearchTerm = '';
 let bookmarkSortMode = 'recent';
 let bookmarkSortDirection = 'desc';
 
+function loadBookmarkPreferences() {
+  try {
+    const stored = localStorage.getItem(BOOKMARK_PREFS_KEY);
+    if (stored) {
+      const parsed = JSON.parse(stored);
+      if (parsed && typeof parsed === 'object') {
+        return parsed;
+      }
+    }
+  } catch (error) {
+    console.warn('Konnte Bookmark-Einstellungen nicht laden:', error);
+  }
+  return {};
+}
+
+function persistBookmarkPreferences() {
+  try {
+    const payload = {
+      searchTerm: bookmarkSearchTerm,
+      sortMode: bookmarkSortMode,
+      sortDirection: bookmarkSortDirection
+    };
+    localStorage.setItem(BOOKMARK_PREFS_KEY, JSON.stringify(payload));
+  } catch (error) {
+    console.warn('Konnte Bookmark-Einstellungen nicht speichern:', error);
+  }
+}
+
+const storedBookmarkPrefs = loadBookmarkPreferences();
+if (storedBookmarkPrefs.searchTerm && typeof storedBookmarkPrefs.searchTerm === 'string') {
+  bookmarkSearchTerm = storedBookmarkPrefs.searchTerm.trim();
+}
+if (storedBookmarkPrefs.sortMode === 'label' || storedBookmarkPrefs.sortMode === 'recent') {
+  bookmarkSortMode = storedBookmarkPrefs.sortMode;
+}
+if (storedBookmarkPrefs.sortDirection === 'asc' || storedBookmarkPrefs.sortDirection === 'desc') {
+  bookmarkSortDirection = storedBookmarkPrefs.sortDirection;
+}
+
 const INITIAL_POST_LIMIT = 10;
 const POST_LOAD_INCREMENT = 10;
 const tabVisibleCounts = {
@@ -549,12 +589,6 @@ function filterBookmarksBySearch(list) {
   });
 }
 
-function getRecentBookmarks(list) {
-  const recent = sortBookmarksByRecency(list);
-  const RECENT_LIMIT = 5;
-  return recent.filter((bookmark) => bookmark.last_clicked_at).slice(0, RECENT_LIMIT);
-}
-
 function updateBookmarkSortDirectionUI() {
   if (!bookmarkSortDirectionToggle) {
     return;
@@ -1025,63 +1059,13 @@ function renderBookmarks() {
 
   const filteredBookmarks = filterBookmarksBySearch(dynamicBookmarks);
   const sortedForAll = sortBookmarksForDisplay(filteredBookmarks);
-  const recent = bookmarkSearchTerm ? [] : getRecentBookmarks(filteredBookmarks);
 
-  const sections = [];
-
-  if (recent.length) {
-    sections.push({
-      id: 'recent',
-      title: 'Zuletzt verwendet',
-      items: recent
-    });
-  }
-
-  const allItems = bookmarkSearchTerm ? sortedForAll : [staticDefault, ...sortedForAll];
-  const allTitle = bookmarkSearchTerm
-    ? `Suchergebnisse${filteredBookmarks.length ? ` (${filteredBookmarks.length})` : ''}`
+  const displayList = bookmarkSearchTerm ? sortedForAll : [staticDefault, ...sortedForAll];
+  const titleText = bookmarkSearchTerm
+    ? (filteredBookmarks.length ? `Suchergebnisse (${filteredBookmarks.length})` : 'Keine Treffer')
     : 'Alle Bookmarks';
 
-  sections.push({
-    id: bookmarkSearchTerm ? 'search' : 'all',
-    title: allTitle,
-    items: allItems
-  });
-
-  let renderedAnySection = false;
-
-  sections.forEach((section) => {
-    if (!section.items.length) {
-      return;
-    }
-
-    renderedAnySection = true;
-    const sectionElement = document.createElement('section');
-    sectionElement.className = 'bookmark-section';
-    sectionElement.dataset.section = section.id;
-
-    const header = document.createElement('header');
-    header.className = 'bookmark-section__header';
-
-    const title = document.createElement('h3');
-    title.className = 'bookmark-section__title';
-    title.textContent = section.title;
-    header.appendChild(title);
-
-    sectionElement.appendChild(header);
-
-    const list = document.createElement('div');
-    list.className = 'bookmark-section__list';
-
-    section.items.forEach((bookmark) => {
-      list.appendChild(createBookmarkRow(bookmark));
-    });
-
-    sectionElement.appendChild(list);
-    bookmarksList.appendChild(sectionElement);
-  });
-
-  if (!renderedAnySection) {
+  if (!displayList.length) {
     const empty = document.createElement('div');
     empty.className = 'bookmark-empty';
     if (bookmarkSearchTerm) {
@@ -1090,7 +1074,29 @@ function renderBookmarks() {
       empty.textContent = 'Noch keine Bookmarks gespeichert.';
     }
     bookmarksList.appendChild(empty);
+    return;
   }
+
+  const sectionElement = document.createElement('section');
+  sectionElement.className = 'bookmark-section';
+  sectionElement.dataset.section = bookmarkSearchTerm ? 'search' : 'all';
+
+  const headerEl = document.createElement('header');
+  headerEl.className = 'bookmark-section__header';
+  const titleEl = document.createElement('h3');
+  titleEl.className = 'bookmark-section__title';
+  titleEl.textContent = titleText;
+  headerEl.appendChild(titleEl);
+  sectionElement.appendChild(headerEl);
+
+  const list = document.createElement('div');
+  list.className = 'bookmark-section__list';
+  displayList.forEach((bookmark) => {
+    list.appendChild(createBookmarkRow(bookmark));
+  });
+
+  sectionElement.appendChild(list);
+  bookmarksList.appendChild(sectionElement);
 }
 
 function resetBookmarkForm() {
@@ -1277,20 +1283,24 @@ function initializeBookmarks() {
     bookmarkForm.addEventListener('submit', handleBookmarkSubmit);
   }
 
-  if (bookmarkSearchInput) {
+if (bookmarkSearchInput) {
+    bookmarkSearchInput.value = bookmarkSearchTerm;
     bookmarkSearchInput.addEventListener('input', () => {
       bookmarkSearchTerm = typeof bookmarkSearchInput.value === 'string'
         ? bookmarkSearchInput.value.trim()
         : '';
+      persistBookmarkPreferences();
       renderBookmarks();
     });
   }
 
   if (bookmarkSortSelect) {
+    bookmarkSortSelect.value = bookmarkSortMode;
     bookmarkSortSelect.addEventListener('change', () => {
       const value = bookmarkSortSelect.value;
       if (value === 'label' || value === 'recent') {
         bookmarkSortMode = value;
+        persistBookmarkPreferences();
         renderBookmarks();
       }
     });
@@ -1300,6 +1310,7 @@ function initializeBookmarks() {
     bookmarkSortDirectionToggle.addEventListener('click', () => {
       bookmarkSortDirection = bookmarkSortDirection === 'desc' ? 'asc' : 'desc';
       updateBookmarkSortDirectionUI();
+      persistBookmarkPreferences();
       renderBookmarks();
     });
     updateBookmarkSortDirectionUI();