diff --git a/web/satellite/src/components/browser/FileBrowser.vue b/web/satellite/src/components/browser/FileBrowser.vue index aa2869ae2..a9a06a7de 100644 --- a/web/satellite/src/components/browser/FileBrowser.vue +++ b/web/satellite/src/components/browser/FileBrowser.vue @@ -458,7 +458,7 @@ function changePageAndLimit(page: number, limit: number): void { const tokenToBeFetched = obStore.state.continuationTokens.get(tokenKey); if (!tokenToBeFetched) { - obStore.listByToken(routePath.value, 1, tokenToBeFetched); + obStore.initList(routePath.value); return; } diff --git a/web/satellite/src/store/modules/objectBrowserStore.ts b/web/satellite/src/store/modules/objectBrowserStore.ts index c4df7b5fd..d3e6ec7cf 100644 --- a/web/satellite/src/store/modules/objectBrowserStore.ts +++ b/web/satellite/src/store/modules/objectBrowserStore.ts @@ -292,6 +292,8 @@ export const useObjectBrowserStore = defineStore('objectBrowser', () => { const { Contents, CommonPrefixes } = response; processFetchedObjects(path, Contents, CommonPrefixes); + + state.activeObjectsRange = { start: 1, end: MAX_KEY_COUNT }; } keyCount += response.KeyCount ?? 0; @@ -305,7 +307,7 @@ export const useObjectBrowserStore = defineStore('objectBrowser', () => { state.totalObjectCount = keyCount; } - async function listByToken(path: string, key: number, continuationToken?: string): Promise { + async function listByToken(path: string, key: number, continuationToken: string): Promise { assertIsInitialized(state); const input: ListObjectsV2CommandInput = { @@ -321,10 +323,7 @@ export const useObjectBrowserStore = defineStore('objectBrowser', () => { processFetchedObjects(path, Contents, CommonPrefixes); - state.activeObjectsRange = { - start: key === 1 ? key : key - MAX_KEY_COUNT, - end: key === 1 ? MAX_KEY_COUNT : key, - }; + state.activeObjectsRange = { start: key - MAX_KEY_COUNT, end: key }; } function processFetchedObjects(path: string, Contents: _Object[] | undefined, CommonPrefixes: CommonPrefix[] | undefined): void { diff --git a/web/satellite/src/types/common.ts b/web/satellite/src/types/common.ts index bc5728343..1f6a1cd79 100644 --- a/web/satellite/src/types/common.ts +++ b/web/satellite/src/types/common.ts @@ -43,14 +43,14 @@ export type UUID = string export type MemorySize = string export type Time = string -export function tableSizeOptions(itemCount: number): {title: string, value: number}[] { +export function tableSizeOptions(itemCount: number, isObjectBrowser = false): {title: string, value: number}[] { const opts = [ { title: '10', value: 10 }, { title: '25', value: 25 }, { title: '50', value: 50 }, { title: '100', value: 100 }, ]; - if (itemCount < 1000) { + if (itemCount < 1000 && !isObjectBrowser) { return [{ title: 'All', value: itemCount }, ...opts]; } return opts; diff --git a/web/satellite/vuetify-poc/src/components/BrowserTableComponent.vue b/web/satellite/vuetify-poc/src/components/BrowserTableComponent.vue index 690747429..0a62a897c 100644 --- a/web/satellite/vuetify-poc/src/components/BrowserTableComponent.vue +++ b/web/satellite/vuetify-poc/src/components/BrowserTableComponent.vue @@ -30,7 +30,10 @@ hover must-sort :loading="isFetching || loading" - :items-length="allFiles.length" + :items-length="isPaginationEnabled ? totalObjectCount : allFiles.length" + :items-per-page-options="isPaginationEnabled ? tableSizeOptions(totalObjectCount, true) : undefined" + @update:page="onPageChange" + @update:itemsPerPage="onLimitChange" >