john-okeefe
d222257797
Save the selected library to localStorage when the user changes the dropdown on the bookshelf page, and restore it on every page load via a new restoreLibrarySelection() call in the header Alpine component. This ensures that when a user navigates between dashboard, bookshelf, collections, etc., their last-chosen library filter is automatically re-applied rather than resetting to the default. Changes: - web/src/bookshelf.ts: listen for change events on #library-select and persist the value to localStorage - web/src/header.ts: add restoreLibrarySelection() which checks localStorage and sets the matching dropdown option on page load - templates/header.templ: call restoreLibrarySelection() in x-init - templates/header_templ.go: regenerated from templ source
59 lines
1.5 KiB
TypeScript
59 lines
1.5 KiB
TypeScript
// Header functionality
|
|
|
|
import { Alpine } from "./alpine";
|
|
import { initializeSearch } from "./search";
|
|
import {
|
|
initializeTheme,
|
|
changeTheme,
|
|
changeWoodPaneling,
|
|
loadWoodPaneling,
|
|
updateWoodPanelingIndicators,
|
|
} from "./theme";
|
|
import { getSelectedLibrary } from "./storage";
|
|
|
|
const logout = (): void => {
|
|
localStorage.removeItem("token");
|
|
localStorage.removeItem("user");
|
|
window.location.href = "/";
|
|
};
|
|
|
|
// Looks for saved library in localStorage and selects it in current page's dropdown
|
|
const restoreLibrarySelection = (): void => {
|
|
const savedLibrary = getSelectedLibrary();
|
|
if (!savedLibrary) return;
|
|
|
|
// Common library dropdown IDs across pages
|
|
const dropdownSelectors = [
|
|
"#library-select", // dashboard, bookshelf
|
|
"#selected-library", // alternate naming
|
|
"#library_id", // form field
|
|
];
|
|
|
|
for (const selector of dropdownSelectors) {
|
|
const dropdown = document.querySelector(selector) as HTMLSelectElement;
|
|
if (dropdown) {
|
|
const option = dropdown.querySelector(`option[value="${savedLibrary}"]`);
|
|
if (option) {
|
|
dropdown.value = savedLibrary;
|
|
// Trigger any htmx/change handlers
|
|
dropdown.dispatchEvent(new Event("change", { bubbles: true }));
|
|
console.log("Restored library selection:", savedLibrary);
|
|
return;
|
|
}
|
|
}
|
|
}
|
|
};
|
|
|
|
export { logout, restoreLibrarySelection };
|
|
|
|
Alpine.data("header", () => ({
|
|
logout,
|
|
initializeSearch,
|
|
initializeTheme,
|
|
changeTheme,
|
|
changeWoodPaneling,
|
|
loadWoodPaneling,
|
|
updateWoodPanelingIndicators,
|
|
restoreLibrarySelection,
|
|
}));
|