mirror of
https://github.com/rowyio/rowy.git
synced 2025-12-28 16:06:41 +01:00
rename tableOrdersAtom to tableSortsAtom
This commit is contained in:
@@ -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[];
|
||||
}>
|
||||
>;
|
||||
}>;
|
||||
|
||||
@@ -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<TableFilter[]>([]);
|
||||
/** Orders applied to the local view */
|
||||
export const tableOrdersAtom = atom<TableOrder[]>([]);
|
||||
/** Sorts applied to the local view */
|
||||
export const tableSortsAtom = atom<TableSort[]>([]);
|
||||
|
||||
/** Store current page in URL */
|
||||
export const tablePageHashAtom = atomWithHash("page", 0, {
|
||||
|
||||
@@ -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: <ArrowDownwardIcon />,
|
||||
onClick: () => {
|
||||
setTableOrders(
|
||||
setTableSorts(
|
||||
isSorted && !isAsc ? [] : [{ key: sortKey, direction: "desc" }]
|
||||
);
|
||||
handleClose();
|
||||
@@ -132,7 +132,7 @@ export default function ColumnMenu() {
|
||||
activeLabel: "Remove sort: ascending",
|
||||
icon: <ArrowUpwardIcon />,
|
||||
onClick: () => {
|
||||
setTableOrders(
|
||||
setTableSorts(
|
||||
isSorted && isAsc ? [] : [{ key: sortKey, direction: "asc" }]
|
||||
);
|
||||
handleClose();
|
||||
|
||||
@@ -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;
|
||||
|
||||
@@ -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={
|
||||
<>
|
||||
<DialogContent style={{ flexGrow: 0, flexShrink: 0 }}>
|
||||
{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.
|
||||
|
||||
@@ -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);
|
||||
|
||||
@@ -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")) {
|
||||
|
||||
@@ -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,
|
||||
|
||||
@@ -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<T> {
|
||||
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<T = TableRow>(
|
||||
pathSegments,
|
||||
collectionGroup,
|
||||
filters,
|
||||
orders,
|
||||
sorts,
|
||||
page = 0,
|
||||
pageSize = COLLECTION_PAGE_SIZE,
|
||||
onError,
|
||||
@@ -130,7 +130,7 @@ export function useFirestoreCollectionWithAtom<T = TableRow>(
|
||||
page,
|
||||
pageSize,
|
||||
filters,
|
||||
orders,
|
||||
sorts,
|
||||
onError
|
||||
),
|
||||
(next, prev) => {
|
||||
@@ -142,9 +142,9 @@ export function useFirestoreCollectionWithAtom<T = TableRow>(
|
||||
)
|
||||
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<T = TableRow>(
|
||||
]);
|
||||
|
||||
// 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<T = TableRow>(
|
||||
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 = <T>(
|
||||
@@ -292,7 +292,7 @@ const getQuery = <T>(
|
||||
page: number,
|
||||
pageSize: number,
|
||||
filters: IUseFirestoreCollectionWithAtomOptions<T>["filters"],
|
||||
orders: IUseFirestoreCollectionWithAtomOptions<T>["orders"],
|
||||
sorts: IUseFirestoreCollectionWithAtomOptions<T>["sorts"],
|
||||
onError: IUseFirestoreCollectionWithAtomOptions<T>["onError"]
|
||||
) => {
|
||||
if (!path || (Array.isArray(pathSegments) && pathSegments.some((x) => !x)))
|
||||
@@ -324,12 +324,12 @@ const getQuery = <T>(
|
||||
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);
|
||||
|
||||
@@ -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() {
|
||||
<button onClick={() => setTableFilters([])}>Clear table filters</button>
|
||||
|
||||
<button
|
||||
onClick={() => setTableOrders([{ key: "firstName", direction: "asc" }])}
|
||||
onClick={() => setTableSorts([{ key: "firstName", direction: "asc" }])}
|
||||
>
|
||||
Set table orders
|
||||
Set table sorts
|
||||
</button>
|
||||
<button onClick={() => setTableFilters([])}>Clear table orders</button>
|
||||
<button onClick={() => setTableFilters([])}>Clear table sorts</button>
|
||||
|
||||
<ol>
|
||||
{tableRows.map(({ _rowy_ref, ...data }) => (
|
||||
|
||||
@@ -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,
|
||||
|
||||
2
src/types/table.d.ts
vendored
2
src/types/table.d.ts
vendored
@@ -157,7 +157,7 @@ export type TableFilter = {
|
||||
value: any;
|
||||
};
|
||||
|
||||
export type TableOrder = {
|
||||
export type TableSort = {
|
||||
key: string;
|
||||
direction: Parameters<typeof orderBy>[1];
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user