Refactor storage handling across application

- Introduced a new storageHelpers module to centralize localStorage interactions, improving code maintainability and readability.
- Updated various components and managers to utilize the new storageHelpers functions for setting, getting, and removing items from localStorage.
- Added migration logic to handle localStorage items during application initialization, ensuring compatibility with the new storage structure.
- Enhanced logging during application initialization for better debugging.
This commit is contained in:
Will Miao
2025-03-22 05:32:18 +08:00
parent bb3d73b87c
commit 19ef73a07f
11 changed files with 169 additions and 27 deletions

View File

@@ -2,6 +2,7 @@ import { BASE_MODELS, BASE_MODEL_CLASSES } from '../utils/constants.js';
import { state, getCurrentPageState } from '../state/index.js';
import { showToast, updatePanelPositions } from '../utils/uiHelpers.js';
import { loadMoreLoras } from '../api/loraApi.js';
import { removeStorageItem, setStorageItem, getStorageItem } from '../utils/storageHelpers.js';
export class FilterManager {
constructor(options = {}) {
@@ -267,7 +268,7 @@ export class FilterManager {
const storageKey = `${this.currentPage}_filters`;
// Save filters to localStorage
localStorage.setItem(storageKey, JSON.stringify(this.filters));
setStorageItem(storageKey, this.filters);
// Update state with current filters
pageState.filters = { ...this.filters };
@@ -323,9 +324,9 @@ export class FilterManager {
this.updateTagSelections();
this.updateActiveFiltersCount();
// Remove from localStorage
// Remove from local Storage
const storageKey = `${this.currentPage}_filters`;
localStorage.removeItem(storageKey);
removeStorageItem(storageKey);
// Update UI
this.filterButton.classList.remove('active');
@@ -344,16 +345,14 @@ export class FilterManager {
loadFiltersFromStorage() {
const storageKey = `${this.currentPage}_filters`;
const savedFilters = localStorage.getItem(storageKey);
const savedFilters = getStorageItem(storageKey);
if (savedFilters) {
try {
const parsedFilters = JSON.parse(savedFilters);
// Ensure backward compatibility with older filter format
this.filters = {
baseModel: parsedFilters.baseModel || [],
tags: parsedFilters.tags || []
baseModel: savedFilters.baseModel || [],
tags: savedFilters.tags || []
};
// Update state with loaded filters

View File

@@ -1,5 +1,6 @@
import { updatePanelPositions } from "../utils/uiHelpers.js";
import { getCurrentPageState } from "../state/index.js";
import { setStorageItem, getStorageItem } from "../utils/storageHelpers.js";
/**
* SearchManager - Handles search functionality across different pages
* Each page can extend or customize this base functionality
@@ -183,7 +184,7 @@ export class SearchManager {
loadSearchPreferences() {
try {
const preferences = JSON.parse(localStorage.getItem(`${this.currentPage}_search_prefs`)) || {};
const preferences = getStorageItem(`${this.currentPage}_search_prefs`) || {};
// Apply search options
if (preferences.options) {
@@ -254,7 +255,7 @@ export class SearchManager {
preferences.recursive = this.recursiveSearchToggle.checked;
}
localStorage.setItem(`${this.currentPage}_search_prefs`, JSON.stringify(preferences));
setStorageItem(`${this.currentPage}_search_prefs`, preferences);
} catch (error) {
console.error('Error saving search preferences:', error);
}

View File

@@ -2,6 +2,7 @@ import { modalManager } from './ModalManager.js';
import { showToast } from '../utils/uiHelpers.js';
import { state } from '../state/index.js';
import { resetAndReload } from '../api/loraApi.js';
import { setStorageItem } from '../utils/storageHelpers.js';
export class SettingsManager {
constructor() {
@@ -75,7 +76,7 @@ export class SettingsManager {
state.global.settings.show_only_sfw = showOnlySFW;
// Save settings to localStorage
localStorage.setItem('settings', JSON.stringify(state.global.settings));
setStorageItem('settings', state.global.settings);
try {
// Save backend settings via API

View File

@@ -1,4 +1,5 @@
import { modalManager } from './ModalManager.js';
import { getStorageItem, setStorageItem } from '../utils/storageHelpers.js';
export class UpdateService {
constructor() {
@@ -7,13 +8,13 @@ export class UpdateService {
this.latestVersion = "v0.0.0"; // Initialize with default values
this.updateInfo = null;
this.updateAvailable = false;
this.updateNotificationsEnabled = localStorage.getItem('show_update_notifications') !== 'false';
this.lastCheckTime = parseInt(localStorage.getItem('last_update_check') || '0');
this.updateNotificationsEnabled = getStorageItem('show_update_notifications') !== 'false';
this.lastCheckTime = parseInt(getStorageItem('last_update_check') || '0');
}
initialize() {
// Initialize update preferences from localStorage
const showUpdates = localStorage.getItem('show_update_notifications');
const showUpdates = getStorageItem('show_update_notifications');
this.updateNotificationsEnabled = showUpdates === null || showUpdates === 'true';
// Register event listener for update notification toggle
@@ -22,7 +23,7 @@ export class UpdateService {
updateCheckbox.checked = this.updateNotificationsEnabled;
updateCheckbox.addEventListener('change', (e) => {
this.updateNotificationsEnabled = e.target.checked;
localStorage.setItem('show_update_notifications', e.target.checked);
setStorageItem('show_update_notifications', e.target.checked);
this.updateBadgeVisibility();
});
}
@@ -71,7 +72,7 @@ export class UpdateService {
// Update last check time
this.lastCheckTime = now;
localStorage.setItem('last_update_check', now.toString());
setStorageItem('last_update_check', now.toString());
// Update UI
this.updateBadgeVisibility();