fix(ui): finish showcase store batching (PAGE 60 → 5, INITIAL_BATCHES 12)
The showcase-store change in adeee64 didn't actually land — only
gallery.js + ShowcaseView.vue made it into the commit. Without this,
ShowcaseView mounts loadInitial() which doesn't exist yet, so the
showcase blows up. Landing the matching store edit now.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -3,7 +3,13 @@ import { ref, computed } from 'vue'
|
|||||||
import { useApi } from '../composables/useApi.js'
|
import { useApi } from '../composables/useApi.js'
|
||||||
import { useAsyncAction } from '../composables/useAsyncAction.js'
|
import { useAsyncAction } from '../composables/useAsyncAction.js'
|
||||||
|
|
||||||
const PAGE = 60
|
// Operator-confirmed 2026-05-30: instead of one 60-item request, fetch
|
||||||
|
// PAGE-sized chunks sequentially so items render as each batch lands
|
||||||
|
// rather than blocking on the full 60-item response. Total initial count
|
||||||
|
// is unchanged (PAGE * INITIAL_BATCHES = 60). Infinite-scroll also pulls
|
||||||
|
// PAGE items per trigger so subsequent appends stay progressive too.
|
||||||
|
const PAGE = 5
|
||||||
|
const INITIAL_BATCHES = 12
|
||||||
|
|
||||||
export const useShowcaseStore = defineStore('showcase', () => {
|
export const useShowcaseStore = defineStore('showcase', () => {
|
||||||
const api = useApi()
|
const api = useApi()
|
||||||
@@ -23,11 +29,21 @@ export const useShowcaseStore = defineStore('showcase', () => {
|
|||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
async function shuffle() {
|
// Reset state and fetch INITIAL_BATCHES chunks in sequence. Used by
|
||||||
|
// mount, the Shuffle button, and the R-key handler — all want the
|
||||||
|
// same progressive-cascade behavior.
|
||||||
|
async function loadInitial() {
|
||||||
images.value = []
|
images.value = []
|
||||||
seen.clear()
|
seen.clear()
|
||||||
exhausted.value = false
|
exhausted.value = false
|
||||||
await fetchPage()
|
for (let i = 0; i < INITIAL_BATCHES; i++) {
|
||||||
|
if (exhausted.value) break
|
||||||
|
await fetchPage()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
async function shuffle() {
|
||||||
|
await loadInitial()
|
||||||
}
|
}
|
||||||
|
|
||||||
const hasMore = computed(() => !exhausted.value)
|
const hasMore = computed(() => !exhausted.value)
|
||||||
@@ -35,5 +51,5 @@ export const useShowcaseStore = defineStore('showcase', () => {
|
|||||||
() => !loading.value && images.value.length === 0 && error.value === null
|
() => !loading.value && images.value.length === 0 && error.value === null
|
||||||
)
|
)
|
||||||
|
|
||||||
return { images, loading, error, hasMore, isEmpty, fetchPage, shuffle }
|
return { images, loading, error, hasMore, isEmpty, fetchPage, shuffle, loadInitial }
|
||||||
})
|
})
|
||||||
|
|||||||
Reference in New Issue
Block a user