add viewMode store for grid/list toggle persistence
This commit is contained in:
parent
b7fdde2025
commit
6d8e1849eb
1 changed files with 63 additions and 0 deletions
63
src/lib/stores/viewMode.svelte.ts
Normal file
63
src/lib/stores/viewMode.svelte.ts
Normal file
|
|
@ -0,0 +1,63 @@
|
|||
export type ViewMode = 'grid' | 'list'
|
||||
|
||||
const COLLECTION_VIEW_KEY = 'collection-view-mode'
|
||||
const MODAL_VIEW_KEY = 'modal-view-mode'
|
||||
|
||||
class ViewModeStore {
|
||||
#collectionView = $state<ViewMode>('grid')
|
||||
#modalView = $state<ViewMode>('grid')
|
||||
#initialized = false
|
||||
|
||||
constructor() {
|
||||
// Load from localStorage on client-side init
|
||||
if (typeof window !== 'undefined') {
|
||||
this.#loadFromStorage()
|
||||
}
|
||||
}
|
||||
|
||||
#loadFromStorage() {
|
||||
if (this.#initialized) return
|
||||
this.#initialized = true
|
||||
|
||||
const storedCollection = localStorage.getItem(COLLECTION_VIEW_KEY)
|
||||
if (storedCollection === 'grid' || storedCollection === 'list') {
|
||||
this.#collectionView = storedCollection
|
||||
}
|
||||
|
||||
const storedModal = localStorage.getItem(MODAL_VIEW_KEY)
|
||||
if (storedModal === 'grid' || storedModal === 'list') {
|
||||
this.#modalView = storedModal
|
||||
}
|
||||
}
|
||||
|
||||
get collectionView(): ViewMode {
|
||||
// Ensure we load from storage on first access (handles SSR -> client hydration)
|
||||
if (typeof window !== 'undefined' && !this.#initialized) {
|
||||
this.#loadFromStorage()
|
||||
}
|
||||
return this.#collectionView
|
||||
}
|
||||
|
||||
get modalView(): ViewMode {
|
||||
if (typeof window !== 'undefined' && !this.#initialized) {
|
||||
this.#loadFromStorage()
|
||||
}
|
||||
return this.#modalView
|
||||
}
|
||||
|
||||
setCollectionView(mode: ViewMode) {
|
||||
this.#collectionView = mode
|
||||
if (typeof window !== 'undefined') {
|
||||
localStorage.setItem(COLLECTION_VIEW_KEY, mode)
|
||||
}
|
||||
}
|
||||
|
||||
setModalView(mode: ViewMode) {
|
||||
this.#modalView = mode
|
||||
if (typeof window !== 'undefined') {
|
||||
localStorage.setItem(MODAL_VIEW_KEY, mode)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export const viewMode = new ViewModeStore()
|
||||
Loading…
Reference in a new issue