@teselagen/ui 0.9.7 → 0.10.2

package/src/DataTable/utils/useTableEntities.js

@@ -29,10 +29,11 @@ export const useTableEntities = tableFormName => {
     [dispatch, tableFormName]
   );
 
-  const { allOrderedEntities, selectedEntities } = useSelector(state => ({
+  const entitySelector = state => ({
     allOrderedEntities: state.form?.[tableFormName]?.values?.allOrderedEntities,
     selectedEntities:
       state.form?.[tableFormName]?.values?.reduxFormSelectedEntityIdMap
-  }));
+  });
+  const { allOrderedEntities, selectedEntities } = useSelector(entitySelector);
   return { selectTableEntities, allOrderedEntities, selectedEntities };
 };

package/src/DataTable/utils/withTableParams.js

@@ -98,16 +98,17 @@ export const useTableParams = props => {
     }
   }
 
-  const {
-    reduxFormQueryParams: _reduxFormQueryParams = {},
-    reduxFormSelectedEntityIdMap: _reduxFormSelectedEntityIdMap = {}
-  } = useSelector(state =>
+  const formValueStateSelector = state =>
     formValueSelector(formName)(
       state,
       "reduxFormQueryParams",
       "reduxFormSelectedEntityIdMap"
-    )
-  );
+    );
+
+  const {
+    reduxFormQueryParams: _reduxFormQueryParams = {},
+    reduxFormSelectedEntityIdMap: _reduxFormSelectedEntityIdMap = {}
+  } = useSelector(formValueStateSelector);
 
   // We want to make sure we don't rerender everything unnecessary
   // with redux-forms we tend to do unnecessary renders
@@ -228,7 +229,7 @@ export const useTableParams = props => {
 
   const tableParams = useMemo(
     () => ({
-      changeFormValue: change,
+      changeFormValue: (...args) => change(...args),
       selectedEntities,
       ..._tableParams,
       formName,

package/src/UploadCsvWizard.js

@@ -185,7 +185,9 @@ export const SimpleInsertDataDialog = compose(
   }, [dataTableForm, dispatch]);
 
   const _reduxFormCellValidation = useSelector(
-    state => state.form?.[dataTableForm]?.values.reduxFormCellValidation
+    function _reduxFormCellValidationSelector(state) {
+      return state.form?.[dataTableForm]?.values.reduxFormCellValidation;
+    }
   );
   const reduxFormCellValidation = useDeepEqualMemo(_reduxFormCellValidation);
 
@@ -272,13 +274,13 @@ const UploadCsvWizardDialogInner = reduxForm()(({
   const {
     reduxFormEntities: _reduxFormEntities,
     reduxFormCellValidation: _reduxFormCellValidation
-  } = useSelector(state =>
-    formValueSelector(datatableFormName)(
+  } = useSelector(function dtFormNameSelector(state) {
+    return formValueSelector(datatableFormName)(
       state,
       "reduxFormEntities",
       "reduxFormCellValidation"
-    )
-  );
+    );
+  });
 
   const reduxFormEntities = useDeepEqualMemo(_reduxFormEntities);
   const reduxFormCellValidation = useDeepEqualMemo(_reduxFormCellValidation);

package/src/utils/hooks/useDeepEqualMemo.js

@@ -1,9 +1,9 @@
-import { isEqual } from "lodash-es";
 import { useEffect, useRef } from "react";
+import { isEqualIgnoreFunctions } from "../isEqualIgnoreFunctions";
 
 export const useDeepEqualMemo = value => {
   const ref = useRef();
-  if (!isEqual(value, ref.current)) {
+  if (!isEqualIgnoreFunctions(value, ref.current)) {
     ref.current = value;
   }
   return ref.current;

package/src/utils/isEqualIgnoreFunctions.js

@@ -0,0 +1,23 @@
+/**
+ * This HOC compares props to create a pure component that will only update
+ * when props are not deep equal. It will compare the string values of functions
+ */
+import { isEqualWith, isFunction } from "lodash-es";
+
+/**
+ * tgreen: This is an awful function which we should come up with a better solution for
+ * @param {*} o1
+ * @param {*} o2
+ */
+export const isEqualIgnoreFunctions = (o1, o2) => {
+  const isEq = isEqualWith(o1, o2, function (val1, val2) {
+    if (isFunction(val1) && isFunction(val2)) {
+      return val1 === val2 || val1.toString() === val2.toString();
+    }
+    // tgreen: we were seeing an issue where the isEq would infinite loop on react children
+    // components. We decided to just ignore them (assume they are equal)
+    if (val1 && val1.constructor && val1.constructor.name === "FiberNode")
+      return true;
+  });
+  return isEq;
+};

package/src/utils/pureNoFunc.js

@@ -3,28 +3,12 @@
  * when props are not deep equal. It will compare the string values of functions
  */
 import { shouldUpdate } from "recompose";
-import { isEqualWith, isFunction } from "lodash-es";
-
-/**
- * tgreen: This is an awful function which we should come up with a better solution for
- * @param {*} o1
- * @param {*} o2
- */
-const isEq = (o1, o2) => {
-  const isEq = isEqualWith(o1, o2, function (val1, val2) {
-    if (isFunction(val1) && isFunction(val2)) {
-      return val1 === val2 || val1.toString() === val2.toString();
-    }
-    // tgreen: we were seeing an issue where the isEq would infinite loop on react children
-    // components. We decided to just ignore them (assume they are equal)
-    if (val1 && val1.constructor && val1.constructor.name === "FiberNode")
-      return true;
-  });
-  return isEq;
-};
+import { isEqualIgnoreFunctions } from "./isEqualIgnoreFunctions";
 
 const pure = BaseComponent => {
-  const hoc = shouldUpdate((props, nextProps) => !isEq(props, nextProps));
+  const hoc = shouldUpdate(
+    (props, nextProps) => !isEqualIgnoreFunctions(props, nextProps)
+  );
   return hoc(BaseComponent);
 };
 

package/utils/isEqualIgnoreFunctions.d.ts

@@ -0,0 +1 @@
+export function isEqualIgnoreFunctions(o1: any, o2: any): boolean;

package/DataTable/EditabelCell.d.ts

@@ -1,7 +0,0 @@
-export function EditableCell({ cancelEdit, dataTest, finishEdit, isNumeric, initialValue }: {
-    cancelEdit: any;
-    dataTest: any;
-    finishEdit: any;
-    isNumeric: any;
-    initialValue: any;
-}): import("react/jsx-runtime").JSX.Element;

package/DataTable/ReactTable.d.ts

@@ -1,78 +0,0 @@
-export function ReactTable({ addFilters, cellRenderer, change, columns, compact, contextMenu, currentParams, disabled, doNotShowEmptyRows, doNotValidateUntouchedRows, editingCellSelectAll, entities, expandedEntityIdMap, extraCompact, filters, formName, getCellHoverText, getRowClassName, handleCellClick, handleCopySelectedRows, history, insertRows, isCellEditable, isCopyable, isEntityDisabled, isLoading, isLocalCall, isSelectionARectangle, isSimple, isSingleSelect, maxHeight, moveColumnPersist, mustClickCheckboxToSelect, noDeselectAll, noRowsFoundMessage, noSelect, noUserSelect, noVirtual, numRows, onDeselect, onDoubleClick, onlyShowRowsWErrors, onMultiRowSelect, onRowClick, onRowSelect, onSingleRowSelect, order, primarySelectedCellId, ReactTableProps, recordIdToIsVisibleMap, reduxFormCellValidation, reduxFormEditingCell, reduxFormSelectedEntityIdMap, refocusTable, removeSingleFilter, resizePersist, schema, selectedCells, setColumns, setExpandedEntityIdMap, setNewParams, setOrder, setRecordIdToIsVisibleMap, setSelectedCells, shouldShowSubComponent, startCellEdit, style, SubComponent, tableConfig, tableRef, updateEntitiesHelper, updateValidation, withCheckboxes, withExpandAndCollapseAllButton, withFilter, withSort }: {
-    addFilters: any;
-    cellRenderer: any;
-    change: any;
-    columns: any;
-    compact: any;
-    contextMenu: any;
-    currentParams: any;
-    disabled: any;
-    doNotShowEmptyRows: any;
-    doNotValidateUntouchedRows: any;
-    editingCellSelectAll: any;
-    entities: any;
-    expandedEntityIdMap: any;
-    extraCompact: any;
-    filters: any;
-    formName: any;
-    getCellHoverText: any;
-    getRowClassName: any;
-    handleCellClick: any;
-    handleCopySelectedRows: any;
-    history: any;
-    insertRows: any;
-    isCellEditable: any;
-    isCopyable: any;
-    isEntityDisabled: any;
-    isLoading: any;
-    isLocalCall: any;
-    isSelectionARectangle: any;
-    isSimple: any;
-    isSingleSelect: any;
-    maxHeight: any;
-    moveColumnPersist: any;
-    mustClickCheckboxToSelect: any;
-    noDeselectAll: any;
-    noRowsFoundMessage: any;
-    noSelect: any;
-    noUserSelect: any;
-    noVirtual: any;
-    numRows: any;
-    onDeselect: any;
-    onDoubleClick: any;
-    onlyShowRowsWErrors: any;
-    onMultiRowSelect: any;
-    onRowClick: any;
-    onRowSelect: any;
-    onSingleRowSelect: any;
-    order: any;
-    primarySelectedCellId: any;
-    ReactTableProps: any;
-    recordIdToIsVisibleMap: any;
-    reduxFormCellValidation: any;
-    reduxFormEditingCell: any;
-    reduxFormSelectedEntityIdMap: any;
-    refocusTable: any;
-    removeSingleFilter: any;
-    resizePersist: any;
-    schema: any;
-    selectedCells: any;
-    setColumns: any;
-    setExpandedEntityIdMap: any;
-    setNewParams: any;
-    setOrder: any;
-    setRecordIdToIsVisibleMap: any;
-    setSelectedCells: any;
-    shouldShowSubComponent: any;
-    startCellEdit: any;
-    style: any;
-    SubComponent: any;
-    tableConfig: any;
-    tableRef: any;
-    updateEntitiesHelper: any;
-    updateValidation: any;
-    withCheckboxes: any;
-    withExpandAndCollapseAllButton: any;
-    withFilter: any;
-    withSort: any;
-}): import("react/jsx-runtime").JSX.Element;

package/DataTable/defaultProps.d.ts

@@ -1,43 +0,0 @@
-import { noop } from 'lodash-es';
-declare namespace _default {
-    export { noop as addFilters };
-    export let className: string;
-    export { noop as clearFilters };
-    export { noop as contextMenu };
-    export let disabled: boolean;
-    export let entities: never[];
-    export let extraClasses: string;
-    export let filters: never[];
-    export let isCopyable: boolean;
-    export { noop as isEntityDisabled };
-    export let isLoading: boolean;
-    export let isSimple: boolean;
-    export let isSingleSelect: boolean;
-    export let maxHeight: number;
-    export let noHeader: boolean;
-    export let noSelect: boolean;
-    export let noUserSelect: boolean;
-    export { noop as onDeselect };
-    export { noop as onMultiRowSelect };
-    export { noop as onRowClick };
-    export { noop as onRowSelect };
-    export { noop as onSingleRowSelect };
-    export let page: number;
-    export let pageSize: number;
-    export let reduxFormExpandedEntityIdMap: {};
-    export let reduxFormSearchInput: string;
-    export let reduxFormSelectedEntityIdMap: {};
-    export { noop as removeSingleFilter };
-    export let resized: never[];
-    export { noop as resizePersist };
-    export { noop as setFilter };
-    export { noop as setOrder };
-    export { noop as setPage };
-    export { noop as setPageSize };
-    export { noop as setSearchTerm };
-    export let showCount: boolean;
-    export let style: {};
-    export let withCheckboxes: boolean;
-    export let withSort: boolean;
-}
-export default _default;

package/DataTable/utils/computePresets.d.ts

@@ -1 +0,0 @@
-export default function computePresets(props?: {}): import('lodash').Dictionary<any>;

package/DataTable/utils/types/Entity.d.ts

@@ -1,9 +0,0 @@
-type SharedFields = {
-    _isClean?: boolean;
-};
-export type Entity = ({
-    id?: string | number;
-} | {
-    code?: string;
-}) & SharedFields;
-export {};

package/DataTable/utils/types/Field.d.ts

@@ -1,4 +0,0 @@
-export type Field = {
-    path: string;
-    type: "genericSelect" | string;
-};

package/DataTable/utils/types/OrderBy.d.ts

@@ -1,11 +0,0 @@
-type OrderByClause<T = {
-    id: string;
-}> = {
-    path?: string;
-    direction?: "asc" | "desc";
-    type?: string;
-    sortFn?: ((record: T) => unknown) | string | Array<((record: T) => unknown) | string>;
-    getValueToFilterOn?: (record: T) => unknown;
-};
-export type OrderBy = OrderByClause | OrderByClause[] | Record<string, "asc" | "desc">;
-export {};

package/DataTable/utils/types/Schema.d.ts

@@ -1,4 +0,0 @@
-import { Field } from './Field';
-export type Schema = {
-    fields: Field[];
-};

package/DataTable/utils/useDeepEqualMemo.d.ts

@@ -1 +0,0 @@
-export function useDeepEqualMemo(value: any): undefined;

package/DataTable/utils/useHotKeysWrapper.d.ts

@@ -1,29 +0,0 @@
-export function useHotKeysWrapper({ change, entities, entitiesUndoRedoStack, formatAndValidateEntities, handleCopySelectedRows, isCellEditable, isEntityDisabled, isSingleSelect, noDeselectAll, noSelect, onDeselect, onMultiRowSelect, onRowSelect, onSingleRowSelect, primarySelectedCellId, reduxFormCellValidation, reduxFormSelectedEntityIdMap, schema, selectedCells, setEntitiesUndoRedoStack, setNoVirtual, setSelectedCells, startCellEdit, tableRef, updateEntitiesHelper, updateValidation, waitUntilAllRowsAreRendered }: {
-    change: any;
-    entities: any;
-    entitiesUndoRedoStack: any;
-    formatAndValidateEntities: any;
-    handleCopySelectedRows: any;
-    isCellEditable: any;
-    isEntityDisabled: any;
-    isSingleSelect: any;
-    noDeselectAll: any;
-    noSelect: any;
-    onDeselect: any;
-    onMultiRowSelect: any;
-    onRowSelect: any;
-    onSingleRowSelect: any;
-    primarySelectedCellId: any;
-    reduxFormCellValidation: any;
-    reduxFormSelectedEntityIdMap: any;
-    schema: any;
-    selectedCells: any;
-    setEntitiesUndoRedoStack: any;
-    setNoVirtual: any;
-    setSelectedCells: any;
-    startCellEdit: any;
-    tableRef: any;
-    updateEntitiesHelper: any;
-    updateValidation: any;
-    waitUntilAllRowsAreRendered: any;
-}): import('../../../../../node_modules/@blueprintjs/core').UseHotkeysReturnValue;

package/DataTable/utils/useTableParams.d.ts

@@ -1,49 +0,0 @@
-/**
- *  Note all these options can be passed at Design Time or at Runtime (like reduxForm())
- *
- * @export
- *
- * @param {compOrOpts} compOrOpts
- * @typedef {object} compOrOpts
- * @property {*string} formName - required unique identifier for the table
- * @property {Object | Function} schema - The data table schema or a function returning it. The function wll be called with props as the argument.
- * @property {boolean} urlConnected - whether the table should connect to/update the URL
- * @property {boolean} withSelectedEntities - whether or not to pass the selected entities
- * @property {boolean} isCodeModel - whether the model is keyed by code instead of id in the db
- * @property {object} defaults - tableParam defaults such as pageSize, filter, etc
- * @property {boolean} noOrderError - won't console an error if an order is not found on schema
- */
-export default function useTableParams(props: any): any;
-/**
- * Note all these options can be passed at Design Time or at Runtime (like reduxForm())
- */
-export type compOrOpts = {
-    /**
-     * } formName - required unique identifier for the table
-     */
-    string: any;
-    /**
-     * - The data table schema or a function returning it. The function wll be called with props as the argument.
-     */
-    schema: Object | Function;
-    /**
-     * - whether the table should connect to/update the URL
-     */
-    urlConnected: boolean;
-    /**
-     * - whether or not to pass the selected entities
-     */
-    withSelectedEntities: boolean;
-    /**
-     * - whether the model is keyed by code instead of id in the db
-     */
-    isCodeModel: boolean;
-    /**
-     * - tableParam defaults such as pageSize, filter, etc
-     */
-    defaults: object;
-    /**
-     * - won't console an error if an order is not found on schema
-     */
-    noOrderError: boolean;
-};