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 { 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', () => {
|
||||
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 = []
|
||||
seen.clear()
|
||||
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)
|
||||
@@ -35,5 +51,5 @@ export const useShowcaseStore = defineStore('showcase', () => {
|
||||
() => !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