From 028ab2fa134f116e6877d822dbd59527e858e467 Mon Sep 17 00:00:00 2001 From: Sidney Alcantara Date: Mon, 13 Jun 2022 23:10:15 +1000 Subject: [PATCH] rename tableOrdersAtom to tableSortsAtom --- src/atoms/globalScope/user.ts | 4 ++-- src/atoms/tableScope/table.ts | 6 ++--- src/components/ColumnMenu/ColumnMenu.tsx | 12 +++++----- .../Table/ColumnHeader/ColumnHeaderSort.tsx | 12 +++++----- .../TableModals/ExportModal/ExportModal.tsx | 12 +++++----- .../ImportExistingWizard.tsx | 10 ++++---- src/components/TableToolbar/AddRow.tsx | 6 ++--- .../TableToolbar/Filters/Filters.tsx | 8 +++---- src/hooks/useFirestoreCollectionWithAtom.ts | 24 +++++++++---------- src/pages/Test/TableTestPage.tsx | 10 ++++---- .../TableSourceFirestore.tsx | 8 +++---- src/types/table.d.ts | 2 +- 12 files changed, 57 insertions(+), 57 deletions(-) diff --git a/src/atoms/globalScope/user.ts b/src/atoms/globalScope/user.ts index 4de9a5bf..ee111ed8 100644 --- a/src/atoms/globalScope/user.ts +++ b/src/atoms/globalScope/user.ts @@ -9,7 +9,7 @@ import { UpdateDocFunction, TableFilter, TableRowRef, - TableOrder, + TableSort, } from "@src/types/table"; /** User info and settings */ @@ -33,7 +33,7 @@ export type UserSettings = Partial<{ Partial<{ filters: TableFilter[]; hiddenFields: string[]; - sorts: TableOrder[]; + sorts: TableSort[]; }> >; }>; diff --git a/src/atoms/tableScope/table.ts b/src/atoms/tableScope/table.ts index d565baa0..29a45c58 100644 --- a/src/atoms/tableScope/table.ts +++ b/src/atoms/tableScope/table.ts @@ -7,7 +7,7 @@ import { TableSchema, ColumnConfig, TableFilter, - TableOrder, + TableSort, TableRow, UpdateDocFunction, UpdateCollectionDocFunction, @@ -59,8 +59,8 @@ export const tableColumnsReducer = ( /** Filters applied to the local view */ export const tableFiltersAtom = atom([]); -/** Orders applied to the local view */ -export const tableOrdersAtom = atom([]); +/** Sorts applied to the local view */ +export const tableSortsAtom = atom([]); /** Store current page in URL */ export const tablePageHashAtom = atomWithHash("page", 0, { diff --git a/src/components/ColumnMenu/ColumnMenu.tsx b/src/components/ColumnMenu/ColumnMenu.tsx index f3e6acf8..2c0e7693 100644 --- a/src/components/ColumnMenu/ColumnMenu.tsx +++ b/src/components/ColumnMenu/ColumnMenu.tsx @@ -41,7 +41,7 @@ import { tableIdAtom, updateColumnAtom, deleteColumnAtom, - tableOrdersAtom, + tableSortsAtom, columnMenuAtom, columnModalAtom, tableFiltersPopoverAtom, @@ -75,7 +75,7 @@ export default function ColumnMenu() { const [tableId] = useAtom(tableIdAtom, tableScope); const updateColumn = useSetAtom(updateColumnAtom, tableScope); const deleteColumn = useSetAtom(deleteColumnAtom, tableScope); - const [tableOrders, setTableOrders] = useAtom(tableOrdersAtom, tableScope); + const [tableSorts, setTableSorts] = useAtom(tableSortsAtom, tableScope); const [columnMenu, setColumnMenu] = useAtom(columnMenuAtom, tableScope); const openColumnModal = useSetAtom(columnModalAtom, tableScope); const openTableFiltersPopover = useSetAtom( @@ -100,8 +100,8 @@ export default function ColumnMenu() { const _sortKey = getFieldProp("sortKey", (column as any).type); const sortKey = _sortKey ? `${column.key}.${_sortKey}` : column.key; - const isSorted = tableOrders[0]?.key === sortKey; - const isAsc = isSorted && tableOrders[0]?.direction === "asc"; + const isSorted = tableSorts[0]?.key === sortKey; + const isAsc = isSorted && tableSorts[0]?.direction === "asc"; const userDocHiddenFields = userSettings.tables?.[formatSubTableName(tableId)]?.hiddenFields ?? []; @@ -119,7 +119,7 @@ export default function ColumnMenu() { activeLabel: "Remove sort: descending", icon: , onClick: () => { - setTableOrders( + setTableSorts( isSorted && !isAsc ? [] : [{ key: sortKey, direction: "desc" }] ); handleClose(); @@ -132,7 +132,7 @@ export default function ColumnMenu() { activeLabel: "Remove sort: ascending", icon: , onClick: () => { - setTableOrders( + setTableSorts( isSorted && isAsc ? [] : [{ key: sortKey, direction: "asc" }] ); handleClose(); diff --git a/src/components/Table/ColumnHeader/ColumnHeaderSort.tsx b/src/components/Table/ColumnHeader/ColumnHeaderSort.tsx index 3af9a469..deab488b 100644 --- a/src/components/Table/ColumnHeader/ColumnHeaderSort.tsx +++ b/src/components/Table/ColumnHeader/ColumnHeaderSort.tsx @@ -7,7 +7,7 @@ import IconSlash, { ICON_SLASH_STROKE_DASHOFFSET, } from "@src/components/IconSlash"; -import { tableScope, tableOrdersAtom } from "@src/atoms/tableScope"; +import { tableScope, tableSortsAtom } from "@src/atoms/tableScope"; import { FieldType } from "@src/constants/fields"; import { getFieldProp } from "@src/components/fields"; @@ -20,21 +20,21 @@ export interface IColumnHeaderSortProps { } export default function ColumnHeaderSort({ column }: IColumnHeaderSortProps) { - const [tableOrders, setTableOrders] = useAtom(tableOrdersAtom, tableScope); + const [tableSorts, setTableSorts] = useAtom(tableSortsAtom, tableScope); const _sortKey = getFieldProp("sortKey", (column as any).type); const sortKey = _sortKey ? `${column.key}.${_sortKey}` : column.key; const currentSort: typeof SORT_STATES[number] = - tableOrders[0]?.key !== sortKey + tableSorts[0]?.key !== sortKey ? "none" - : tableOrders[0]?.direction || "none"; + : tableSorts[0]?.direction || "none"; const nextSort = SORT_STATES[SORT_STATES.indexOf(currentSort) + 1] ?? SORT_STATES[0]; const handleSortClick = () => { - if (nextSort === "none") setTableOrders([]); - else setTableOrders([{ key: sortKey, direction: nextSort }]); + if (nextSort === "none") setTableSorts([]); + else setTableSorts([{ key: sortKey, direction: nextSort }]); }; if (column.type === FieldType.id) return null; diff --git a/src/components/TableModals/ExportModal/ExportModal.tsx b/src/components/TableModals/ExportModal/ExportModal.tsx index f5f25e05..49db08ad 100644 --- a/src/components/TableModals/ExportModal/ExportModal.tsx +++ b/src/components/TableModals/ExportModal/ExportModal.tsx @@ -25,7 +25,7 @@ import { tableScope, tableSettingsAtom, tableFiltersAtom, - tableOrdersAtom, + tableSortsAtom, } from "@src/atoms/tableScope"; import { firebaseDbAtom } from "@src/sources/ProjectSourceFirebase"; import { tableFiltersToFirestoreFilters } from "@src/hooks/useFirestoreCollectionWithAtom"; @@ -43,7 +43,7 @@ export default function Export({ onClose }: ITableModalProps) { const [firebaseDb] = useAtom(firebaseDbAtom, globalScope); const [tableSettings] = useAtom(tableSettingsAtom, tableScope); const [tableFilters] = useAtom(tableFiltersAtom, tableScope); - const [tableOrders] = useAtom(tableOrdersAtom, tableScope); + const [tableSorts] = useAtom(tableSortsAtom, tableScope); const tableCollection = tableSettings.collection; const isCollectionGroup = tableSettings.tableType === "collectionGroup"; @@ -55,17 +55,17 @@ export default function Export({ onClose }: ITableModalProps) { // add filters const filters = tableFiltersToFirestoreFilters(tableFilters); // optional order results - const orders = tableOrders.map((order) => + const sorts = tableSorts.map((order) => orderBy(order.key, order.direction) ); // TODO: paginate - return firestoreQuery(collectionRef, ...filters, ...orders, limit(10_000)); + return firestoreQuery(collectionRef, ...filters, ...sorts, limit(10_000)); }, [ firebaseDb, tableCollection, isCollectionGroup, tableFilters, - tableOrders, + tableSorts, ]); return ( @@ -82,7 +82,7 @@ export default function Export({ onClose }: ITableModalProps) { header={ <> - {tableFilters.length !== 0 || tableOrders.length !== 0 + {tableFilters.length !== 0 || tableSorts.length !== 0 ? "The filters and sorting applied to the table will be applied to the export" : "No filters or sorting will be applied on the exported data"} . Limited to 10,000 rows. diff --git a/src/components/TableModals/ImportExistingWizard/ImportExistingWizard.tsx b/src/components/TableModals/ImportExistingWizard/ImportExistingWizard.tsx index 946ef895..719a28d9 100644 --- a/src/components/TableModals/ImportExistingWizard/ImportExistingWizard.tsx +++ b/src/components/TableModals/ImportExistingWizard/ImportExistingWizard.tsx @@ -16,7 +16,7 @@ import { tableScope, updateTableSchemaAtom, tableFiltersAtom, - tableOrdersAtom, + tableSortsAtom, tableRowsAtom, tableModalAtom, } from "@src/atoms/tableScope"; @@ -39,7 +39,7 @@ export interface IStepProps { export default function ImportExistingWizard({ onClose }: ITableModalProps) { const [updateTableSchema] = useAtom(updateTableSchemaAtom, tableScope); const setTableFilters = useSetAtom(tableFiltersAtom, tableScope); - const setTableOrders = useSetAtom(tableOrdersAtom, tableScope); + const setTableSorts = useSetAtom(tableSortsAtom, tableScope); const [tableRows] = useAtom(tableRowsAtom, tableScope); const setTableModal = useSetAtom(tableModalAtom, tableScope); @@ -51,11 +51,11 @@ export default function ImportExistingWizard({ onClose }: ITableModalProps) { setConfig((prev) => ({ ...merge(prev, value) })); }, []); - // Reset table filters and orders on open + // Reset table filters and sorts on open useEffect(() => { setTableFilters([]); - setTableOrders([]); - }, [setTableFilters, setTableOrders]); + setTableSorts([]); + }, [setTableFilters, setTableSorts]); if (tableRows.length === 0 || !updateTableSchema) { setTableModal(RESET); diff --git a/src/components/TableToolbar/AddRow.tsx b/src/components/TableToolbar/AddRow.tsx index 77653bca..4c2aae58 100644 --- a/src/components/TableToolbar/AddRow.tsx +++ b/src/components/TableToolbar/AddRow.tsx @@ -25,7 +25,7 @@ import { tableScope, tableSettingsAtom, tableFiltersAtom, - tableOrdersAtom, + tableSortsAtom, addRowAtom, } from "@src/atoms/tableScope"; @@ -33,7 +33,7 @@ export default function AddRow() { const [userRoles] = useAtom(userRolesAtom, globalScope); const [tableSettings] = useAtom(tableSettingsAtom, tableScope); const [tableFilters] = useAtom(tableFiltersAtom, tableScope); - const [tableOrders] = useAtom(tableOrdersAtom, tableScope); + const [tableSorts] = useAtom(tableSortsAtom, tableScope); const addRow = useSetAtom(addRowAtom, tableScope); const [idType, setIdType] = useAtom(tableAddRowIdTypeAtom, globalScope); @@ -41,7 +41,7 @@ export default function AddRow() { const [open, setOpen] = useState(false); const [openIdModal, setOpenIdModal] = useState(false); - const forceRandomId = tableFilters.length > 0 || tableOrders.length > 0; + const forceRandomId = tableFilters.length > 0 || tableSorts.length > 0; const handleClick = () => { if (idType === "random" || (forceRandomId && idType === "decrement")) { diff --git a/src/components/TableToolbar/Filters/Filters.tsx b/src/components/TableToolbar/Filters/Filters.tsx index 87b63af9..d4236f95 100644 --- a/src/components/TableToolbar/Filters/Filters.tsx +++ b/src/components/TableToolbar/Filters/Filters.tsx @@ -32,7 +32,7 @@ import { tableSchemaAtom, tableColumnsOrderedAtom, tableFiltersAtom, - tableOrdersAtom, + tableSortsAtom, updateTableSchemaAtom, tableFiltersPopoverAtom, } from "@src/atoms/tableScope"; @@ -59,7 +59,7 @@ export default function Filters() { const [tableSchema] = useAtom(tableSchemaAtom, tableScope); const [tableColumnsOrdered] = useAtom(tableColumnsOrderedAtom, tableScope); const [localFilters, setLocalFilters] = useAtom(tableFiltersAtom, tableScope); - const [, setTableOrders] = useAtom(tableOrdersAtom, tableScope); + const [, setTableSorts] = useAtom(tableSortsAtom, tableScope); const [updateTableSchema] = useAtom(updateTableSchemaAtom, tableScope); const [{ defaultQuery }] = useAtom(tableFiltersPopoverAtom, tableScope); @@ -112,12 +112,12 @@ export default function Filters() { setLocalFilters(filtersToApply); // Reset order so we don’t have to make a new index - setTableOrders([]); + setTableSorts([]); }, [ hasTableFilters, hasUserFilters, setLocalFilters, - setTableOrders, + setTableSorts, setTableQuery, tableFilters, tableFiltersOverridable, diff --git a/src/hooks/useFirestoreCollectionWithAtom.ts b/src/hooks/useFirestoreCollectionWithAtom.ts index 10dc8aab..3c681c4e 100644 --- a/src/hooks/useFirestoreCollectionWithAtom.ts +++ b/src/hooks/useFirestoreCollectionWithAtom.ts @@ -32,7 +32,7 @@ import { DeleteCollectionDocFunction, NextPageState, TableFilter, - TableOrder, + TableSort, TableRow, } from "@src/types/table"; import { firebaseDbAtom } from "@src/sources/ProjectSourceFirebase"; @@ -47,8 +47,8 @@ interface IUseFirestoreCollectionWithAtomOptions { collectionGroup?: boolean; /** Attach filters to the query */ filters?: TableFilter[]; - /** Attach orders to the query */ - orders?: TableOrder[]; + /** Attach sorts to the query */ + sorts?: TableSort[]; /** Set query page */ page?: number; /** Set query page size */ @@ -86,7 +86,7 @@ export function useFirestoreCollectionWithAtom( pathSegments, collectionGroup, filters, - orders, + sorts, page = 0, pageSize = COLLECTION_PAGE_SIZE, onError, @@ -130,7 +130,7 @@ export function useFirestoreCollectionWithAtom( page, pageSize, filters, - orders, + sorts, onError ), (next, prev) => { @@ -142,9 +142,9 @@ export function useFirestoreCollectionWithAtom( ) return false; - // If orders are not equal, update the query + // If sorts are not equal, update the query // Overrides isLastPage check - if (JSON.stringify(next?.orders) !== JSON.stringify(prev?.orders)) + if (JSON.stringify(next?.sorts) !== JSON.stringify(prev?.sorts)) return false; return isLastPage || queryEqual(next?.query as any, prev?.query as any); @@ -226,7 +226,7 @@ export function useFirestoreCollectionWithAtom( ]); // Create variable for validity of query to pass to useEffect dependencies - // below, and prevent it being called when page, filters, or orders is updated + // below, and prevent it being called when page, filters, or sorts is updated const queryValid = Boolean(memoizedQuery); // Set updateDocAtom and deleteDocAtom values if they exist useEffect(() => { @@ -281,7 +281,7 @@ export function useFirestoreCollectionWithAtom( export default useFirestoreCollectionWithAtom; /** - * Create the Firestore query with page, filters, and orders constraints. + * Create the Firestore query with page, filters, and sorts constraints. * Put code in a function so the results can be compared by useMemoValue. */ const getQuery = ( @@ -292,7 +292,7 @@ const getQuery = ( page: number, pageSize: number, filters: IUseFirestoreCollectionWithAtomOptions["filters"], - orders: IUseFirestoreCollectionWithAtomOptions["orders"], + sorts: IUseFirestoreCollectionWithAtomOptions["sorts"], onError: IUseFirestoreCollectionWithAtomOptions["onError"] ) => { if (!path || (Array.isArray(pathSegments) && pathSegments.some((x) => !x))) @@ -324,12 +324,12 @@ const getQuery = ( collectionRef, queryLimit((page + 1) * pageSize), ...firestoreFilters, - ...(orders?.map((order) => orderBy(order.key, order.direction)) || []) + ...(sorts?.map((order) => orderBy(order.key, order.direction)) || []) ), page, limit, firestoreFilters, - orders, + sorts, }; } catch (e) { if (onError) onError(e as FirestoreError); diff --git a/src/pages/Test/TableTestPage.tsx b/src/pages/Test/TableTestPage.tsx index df893ebb..f7e635a5 100644 --- a/src/pages/Test/TableTestPage.tsx +++ b/src/pages/Test/TableTestPage.tsx @@ -8,7 +8,7 @@ import { tableSettingsAtom, tableSchemaAtom, tableFiltersAtom, - tableOrdersAtom, + tableSortsAtom, tableRowsAtom, auditChangeAtom, } from "@src/atoms/tableScope"; @@ -28,7 +28,7 @@ function TableTestPage() { const [tableSchema] = useAtom(tableSchemaAtom, tableScope); const setTableFilters = useSetAtom(tableFiltersAtom, tableScope); - const setTableOrders = useSetAtom(tableOrdersAtom, tableScope); + const setTableSorts = useSetAtom(tableSortsAtom, tableScope); const [tableRows] = useAtom(tableRowsAtom, tableScope); const [auditChange] = useAtom(auditChangeAtom, tableScope); @@ -86,11 +86,11 @@ function TableTestPage() { - +
    {tableRows.map(({ _rowy_ref, ...data }) => ( diff --git a/src/sources/TableSourceFirestore/TableSourceFirestore.tsx b/src/sources/TableSourceFirestore/TableSourceFirestore.tsx index 954d4cc0..d7c0f42c 100644 --- a/src/sources/TableSourceFirestore/TableSourceFirestore.tsx +++ b/src/sources/TableSourceFirestore/TableSourceFirestore.tsx @@ -8,7 +8,7 @@ import { tableSchemaAtom, updateTableSchemaAtom, tableFiltersAtom, - tableOrdersAtom, + tableSortsAtom, tablePageAtom, tableRowsDbAtom, _updateRowDbAtom, @@ -46,9 +46,9 @@ export const TableSourceFirestore = memo(function TableSourceFirestore() { } ); - // Get table filters and orders + // Get table filters and sorts const [filters] = useAtom(tableFiltersAtom, tableScope); - const [orders] = useAtom(tableOrdersAtom, tableScope); + const [sorts] = useAtom(tableSortsAtom, tableScope); const [page] = useAtom(tablePageAtom, tableScope); // Get documents from collection and store in tableRowsDbAtom // and handle some errors with snackbars @@ -65,7 +65,7 @@ export const TableSourceFirestore = memo(function TableSourceFirestore() { tableSettings?.collection, { filters, - orders, + sorts, page, collectionGroup: isCollectionGroup, onError: handleErrorCallback, diff --git a/src/types/table.d.ts b/src/types/table.d.ts index 4fae39f6..c82ccd54 100644 --- a/src/types/table.d.ts +++ b/src/types/table.d.ts @@ -157,7 +157,7 @@ export type TableFilter = { value: any; }; -export type TableOrder = { +export type TableSort = { key: string; direction: Parameters[1]; };