diff --git a/src/lib/components/filters/store.ts b/src/lib/components/filters/store.ts index 1561b2d30..4bd6a7a22 100644 --- a/src/lib/components/filters/store.ts +++ b/src/lib/components/filters/store.ts @@ -63,7 +63,7 @@ function initQueries(initialValue = new Map()) { const currentLocation = window.location.pathname; if (usableQueries.size) { - const queryParam = mapToQueryParams(get(queries)); + const queryParam = mapToQueryParams(usableQueries); goto(`${currentLocation}?query=${queryParam}`, { noScroll: true }); } else { goto(currentLocation, { noScroll: true }); diff --git a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/+page.ts b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/+page.ts index aa0de01a2..31d33e029 100644 --- a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/+page.ts +++ b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/+page.ts @@ -30,6 +30,7 @@ export const load: PageLoad = async ({ params, depends, url, route, parent }) => view, query, currentSort, + parsedQueries, rows: await sdk.forProject(params.region, params.project).tablesDB.listRows({ databaseId: params.database, tableId: params.table, diff --git a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/spreadsheet.svelte b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/spreadsheet.svelte index 0677a9498..5db4b40e6 100644 --- a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/spreadsheet.svelte +++ b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/spreadsheet.svelte @@ -87,6 +87,7 @@ import { hash } from '$lib/helpers/string'; import { formatNumberWithCommas } from '$lib/helpers/numbers'; import { chunks } from '$lib/helpers/array'; + import { mapToQueryParams } from '$lib/components/filters/store'; export let data: PageData; export let showRowCreateSheet: { @@ -308,26 +309,31 @@ async function sort(query: string | null) { $spreadsheetLoading = true; - const url = new URL(page.url); + const parsedQueries = data.parsedQueries; - if (query === null) { + if (parsedQueries.size > 0) { + for (const [tagValue, queryString] of parsedQueries.entries()) { + if (queryString.includes('orderAsc') || queryString.includes('orderDesc')) { + parsedQueries.delete(tagValue); + } + } + } + + if (query !== null) { + const { attribute, method } = JSON.parse(query); + const tagValue = { + tag: `${attribute} ${method}`, + value: attribute + }; + + parsedQueries.set(tagValue, query); + } + + if (parsedQueries.size === 0) { url.searchParams.delete('query'); } else { - // compatible with `load` func! - const { attribute, method } = JSON.parse(query); - url.searchParams.set( - 'query', - JSON.stringify([ - [ - { - tag: `${attribute} ${method}`, - value: attribute - }, - query - ] - ]) - ); + url.searchParams.set('query', mapToQueryParams(parsedQueries)); } // save > navigate > restore! @@ -611,6 +617,9 @@ return false; } + const parsedQueries = data.parsedQueries; + const filterQueries = parsedQueries.size ? data.parsedQueries.values() : []; + $paginatedRowsLoading = true; const loadedRows = await sdk .forProject(page.params.region, page.params.project) @@ -621,6 +630,7 @@ getCorrectOrderQuery(), Query.limit(SPREADSHEET_PAGE_LIMIT), Query.offset(pageToOffset(pageNumber, SPREADSHEET_PAGE_LIMIT)), + ...filterQueries /* filter queries */, ...buildWildcardColumnsQuery($table) ] });