Merge pull request rowyio#1140 from rowyio/develop

Develop

src/components/Table/Table.tsx

@@ -31,7 +31,10 @@ import {
  tablePageAtom,
  updateColumnAtom,
  selectedCellAtom,
+ tableSortsAtom,
+ tableIdAtom,
 } from "@src/atoms/tableScope";
+import { projectScope, userSettingsAtom } from "@src/atoms/projectScope";
 import { getFieldType, getFieldProp } from "@src/components/fields";
 import { useKeyboardNavigation } from "./useKeyboardNavigation";
 import { useMenuAction } from "./useMenuAction";
@@ -98,6 +101,11 @@ export default function Table({
 
  const updateColumn = useSetAtom(updateColumnAtom, tableScope);
 
+ // Get user settings and tableId for applying sort sorting
+ const [userSettings] = useAtom(userSettingsAtom, projectScope);
+ const [tableId] = useAtom(tableIdAtom, tableScope);
+ const setTableSorts = useSetAtom(tableSortsAtom, tableScope);
+
  // Store a **state** and reference to the container element
  // so the state can re-render `TableBody`, preventing virtualization
  // not detecting scroll if the container element was initially `null`
@@ -233,6 +241,18 @@ export default function Table({
  containerRef,
  ]);
 
+ // apply user default sort on first render
+ const [applySort, setApplySort] = useState(true);
+ useEffect(() => {
+ if (applySort && Object.keys(tableSchema).length) {
+ const userDefaultSort = userSettings.tables?.[tableId]?.sorts || [];
+ setTableSorts(
+ userDefaultSort.length ? userDefaultSort : tableSchema.sorts || []
+ );
+ setApplySort(false);
+ }
+ }, [tableSchema, userSettings, tableId, setTableSorts, applySort]);
+
  return (
  <div
  ref={(el) => setContainerEl(el)}

src/components/fields/Formula/DisplayCell.tsx

@@ -7,6 +7,7 @@ import { defaultFn, getDisplayCell } from "./util";
 export default function Formula(props: IDisplayCellProps) {
  const { result, error, loading } = useFormula({
  row: props.row,
+ ref: props._rowy_ref,
  listenerFields: props.column.config?.listenerFields || [],
  formulaFn: props.column.config?.formulaFn || defaultFn,
  });

src/components/fields/Formula/Settings.tsx

@@ -3,14 +3,7 @@ import { useDebouncedCallback } from "use-debounce";
 import { useAtom } from "jotai";
 import MultiSelect from "@rowy/multiselect";
 
-import {
- Grid,
- InputLabel,
- Typography,
- Stack,
- FormHelperText,
- Tooltip,
-} from "@mui/material";
+import { Grid, InputLabel, Stack, FormHelperText } from "@mui/material";
 
 import {
  tableColumnsOrderedAtom,
@@ -142,7 +135,11 @@ export default function Settings({
  additionalVariables={[
  {
  key: "row",
- description: `Current row's data`,
+ description: `row has the value of doc.data() it has type definitions using this table's schema, but you can only access formula's listener fields.`,
+ },
+ {
+ key: "ref",
+ description: `reference object that holds the readonly reference of the row document.(i.e ref.id)`,
  },
  ]}
  />

src/components/fields/Formula/TableSourcePreview.ts

@@ -1,7 +1,7 @@
 import { useCallback, useEffect } from "react";
 import { useSetAtom } from "jotai";
 import { useAtomCallback } from "jotai/utils";
-import { cloneDeep, findIndex, initial, sortBy } from "lodash-es";
+import { cloneDeep, findIndex, sortBy } from "lodash-es";
 
 import {
  _deleteRowDbAtom,

src/components/fields/Formula/formula.d.ts

@@ -1,6 +1,8 @@
+type RowRef = Pick<FirebaseFirestore.DocumentReference, "id", "path">;
+
 type FormulaContext = {
  row: Row;
- // ref: FirebaseFirestore.DocumentReference;
+ ref: RowRef;
  // storage: firebasestorage.Storage;
  // db: FirebaseFirestore.Firestore;
 };

src/components/fields/Formula/useFormula.tsx

@@ -2,17 +2,19 @@ import { useEffect, useMemo, useState } from "react";
 import { pick, zipObject } from "lodash-es";
 import { useAtom } from "jotai";
 
-import { TableRow } from "@src/types/table";
+import { TableRow, TableRowRef } from "@src/types/table";
 import { tableColumnsOrderedAtom, tableScope } from "@src/atoms/tableScope";
 
 import { listenerFieldTypes, useDeepCompareMemoize } from "./util";
 
 export const useFormula = ({
  row,
+ ref,
  listenerFields,
  formulaFn,
 }: {
  row: TableRow;
+ ref: TableRowRef;
  listenerFields: string[];
  formulaFn: string;
 }) => {
@@ -61,6 +63,7 @@ export const useFormula = ({
  worker.postMessage({
  formulaFn,
  row: JSON.stringify(availableFields),
+ ref: { id: ref.id, path: ref.path },
  });
 
  return () => {

src/components/fields/Formula/worker.ts

@@ -1,14 +1,15 @@
 onmessage = async ({ data }) => {
  try {
- const { formulaFn, row } = data;
+ const { formulaFn, row, ref } = data;
  const AsyncFunction = async function () {}.constructor as any;
  const [_, fnBody] = formulaFn.match(/=>\s*({?[\s\S]*}?)$/);
  if (!fnBody) return;
  const fn = new AsyncFunction(
  "row",
+ "ref",
  `const fn = async () => \n${fnBody}\n return fn();`
  );
- const result = await fn(JSON.parse(row));
+ const result = await fn(JSON.parse(row), ref);
  postMessage({ result });
  } catch (error: any) {
  console.error("Error: ", error);

src/sources/TableSourceFirestore/TableSourceFirestore.tsx

@@ -39,7 +39,6 @@ import { getTableSchemaPath } from "@src/utils/table";
 import { TableSchema } from "@src/types/table";
 import { firebaseDbAtom } from "@src/sources/ProjectSourceFirebase";
 import { projectScope } from "@src/atoms/projectScope";
-import useApplySorts from "./useApplySorts";
 
 /**
  * When rendered, provides atom values for top-level tables and sub-tables
@@ -142,7 +141,6 @@ export const TableSourceFirestore = memo(function TableSourceFirestore() {
  }
  );
 
- useApplySorts();
  useAuditChange();
  useBulkWriteDb();