@teselagen/ui 0.5.21-beta.3 → 0.5.21-beta.5

package/index.cjs.js

@@ -48395,57 +48395,81 @@ const DataTable = /* @__PURE__ */ __name((_G) => {
     reduxFormSearchInput,
     urlConnected
   ]);
-  if (!isTableParamsConnected) {
-    const updateSearch = /* @__PURE__ */ __name((val) => {
-      change("reduxFormSearchInput", val || "");
-    }, "updateSearch");
-    const setNewParams2 = /* @__PURE__ */ __name((newParams) => {
-      urlConnected && setCurrentParamsOnUrl(newParams, history.replace);
-      change("reduxFormQueryParams", newParams);
-    }, "setNewParams2");
-    const bindThese = makeDataTableHandlers({
-      setNewParams: setNewParams2,
-      updateSearch,
-      defaults: props.defaults,
-      onlyOneFilter: props.onlyOneFilter
-    });
-    const boundDispatchProps = {};
-    Object.keys(bindThese).forEach(function(key) {
-      const action = bindThese[key];
-      boundDispatchProps[key] = function(...args) {
-        action(...args, currentParams);
-      };
-    });
-    const changeFormValue = /* @__PURE__ */ __name((...args) => change(...args), "changeFormValue");
-    props.tableParams = __spreadProps(__spreadValues(__spreadValues(__spreadValues({
-      changeFormValue,
-      selectedEntities
-    }, _tableParams), props), boundDispatchProps), {
-      isTableParamsConnected: true
-      //let the table know not to do local sorting/filtering etc.
-    });
-  }
-  props = __spreadValues(__spreadValues({}, props), props.tableParams);
-  if (!isTableParamsConnected) {
-    const additionalFilterToUse = typeof props.additionalFilter === "function" ? props.additionalFilter.bind(void 0, ownProps) : () => props.additionalFilter;
-    const additionalOrFilterToUse = typeof props.additionalOrFilter === "function" ? props.additionalOrFilter.bind(void 0, ownProps) : () => props.additionalOrFilter;
-    props = __spreadValues(__spreadValues({}, props), getQueryParams({
-      doNotCoercePageSize,
-      currentParams,
-      entities: props.entities,
-      // for local table
-      urlConnected,
-      defaults: props.defaults,
-      schema: convertedSchema,
-      isInfinite,
-      isLocalCall,
-      additionalFilter: additionalFilterToUse,
-      additionalOrFilter: additionalOrFilterToUse,
-      noOrderError: props.noOrderError,
-      isCodeModel: props.isCodeModel,
-      ownProps: props
-    }));
-  }
+  const tableParams = React$1.useMemo(() => {
+    if (!isTableParamsConnected) {
+      const updateSearch = /* @__PURE__ */ __name((val) => {
+        change("reduxFormSearchInput", val || "");
+      }, "updateSearch");
+      const setNewParams2 = /* @__PURE__ */ __name((newParams) => {
+        urlConnected && setCurrentParamsOnUrl(newParams, history.replace);
+        change("reduxFormQueryParams", newParams);
+      }, "setNewParams2");
+      const bindThese = makeDataTableHandlers({
+        setNewParams: setNewParams2,
+        updateSearch,
+        defaults: props.defaults,
+        onlyOneFilter: props.onlyOneFilter
+      });
+      const boundDispatchProps = {};
+      Object.keys(bindThese).forEach(function(key) {
+        const action = bindThese[key];
+        boundDispatchProps[key] = function(...args) {
+          action(...args, currentParams);
+        };
+      });
+      const changeFormValue = /* @__PURE__ */ __name((...args) => change(...args), "changeFormValue");
+      return __spreadProps(__spreadValues(__spreadValues(__spreadValues({
+        changeFormValue,
+        selectedEntities
+      }, _tableParams), props), boundDispatchProps), {
+        isTableParamsConnected: true
+        //let the table know not to do local sorting/filtering etc.
+      });
+    }
+    return _tableParams;
+  }, [
+    _tableParams,
+    change,
+    currentParams,
+    history.replace,
+    isTableParamsConnected,
+    props,
+    selectedEntities,
+    urlConnected
+  ]);
+  props = __spreadValues(__spreadValues({}, props), tableParams);
+  const queryParams = React$1.useMemo(() => {
+    if (!isTableParamsConnected) {
+      const additionalFilterToUse = typeof props.additionalFilter === "function" ? props.additionalFilter.bind(void 0, ownProps) : () => props.additionalFilter;
+      const additionalOrFilterToUse = typeof props.additionalOrFilter === "function" ? props.additionalOrFilter.bind(void 0, ownProps) : () => props.additionalOrFilter;
+      return getQueryParams({
+        doNotCoercePageSize,
+        currentParams,
+        entities: props.entities,
+        // for local table
+        urlConnected,
+        defaults: props.defaults,
+        schema: convertedSchema,
+        isInfinite,
+        isLocalCall,
+        additionalFilter: additionalFilterToUse,
+        additionalOrFilter: additionalOrFilterToUse,
+        noOrderError: props.noOrderError,
+        isCodeModel: props.isCodeModel,
+        ownProps: props
+      });
+    }
+    return {};
+  }, [
+    convertedSchema,
+    currentParams,
+    doNotCoercePageSize,
+    isInfinite,
+    isLocalCall,
+    isTableParamsConnected,
+    urlConnected
+  ]);
+  props = __spreadValues(__spreadValues({}, props), queryParams);
   const {
     addFilters = noop$3,
     additionalFilters,
@@ -53513,7 +53537,6 @@ const UploadCsvWizardDialog = compose(
     }
   });
   const reduxFormEntitiesArray = useDeepEqualMemo(_reduxFormEntitiesArray);
-  console.log({ _finishedFiles });
   const finishedFiles = useDeepEqualMemo(_finishedFiles);
   const [hasSubmittedOuter, setSubmittedOuter] = React$1.useState();
   const [steps, setSteps] = React$1.useState(getInitialSteps(true));
@@ -63268,6 +63291,7 @@ const Uploader = /* @__PURE__ */ __name(({
     if (noRedux) {
       return _onChange(val);
     }
+    dispatch(reduxForm.touch(formName, name));
     return dispatch(reduxForm.change(formName, name, val));
   }, "onChange");
   const handleSecondHalfOfUpload = /* @__PURE__ */ __name((_0) => __async(exports, [_0], function* ({
@@ -64431,22 +64455,13 @@ function withTableParams(compOrOpts, pTopLevelOpts) {
     const mergedOpts = getMergedOpts(topLevelOptions, ownProps);
     const { formName, urlConnected, history, defaults: defaults2, onlyOneFilter } = mergedOpts;
     function updateSearch(val) {
-      setTimeout(function() {
-        dispatch(reduxForm.change(formName, "reduxFormSearchInput", val || ""));
-      });
+      dispatch(reduxForm.change(formName, "reduxFormSearchInput", val || ""));
     }
     __name(updateSearch, "updateSearch");
-    let setNewParams;
-    if (urlConnected) {
-      setNewParams = /* @__PURE__ */ __name(function(newParams) {
-        setCurrentParamsOnUrl(newParams, history.replace);
-        dispatch(reduxForm.change(formName, "reduxFormQueryParams", newParams));
-      }, "setNewParams");
-    } else {
-      setNewParams = /* @__PURE__ */ __name(function(newParams) {
-        dispatch(reduxForm.change(formName, "reduxFormQueryParams", newParams));
-      }, "setNewParams");
-    }
+    const setNewParams = /* @__PURE__ */ __name((newParams) => {
+      urlConnected && setCurrentParamsOnUrl(newParams, history.replace);
+      dispatch(reduxForm.change(formName, "reduxFormQueryParams", newParams));
+    }, "setNewParams");
     return {
       bindThese: makeDataTableHandlers({
         setNewParams,

package/index.es.js

@@ -59,7 +59,7 @@ var __async = (__this, __arguments, generator) => {
 import * as React$1 from "react";
 import React__default, { useState, useEffect, forwardRef, useImperativeHandle, Fragment, useMemo, useRef, useReducer, useCallback, createElement, Component, useLayoutEffect, createContext, memo, useContext, isValidElement, PureComponent, createPortal as createPortal$1 } from "react";
 import { Icon, Classes, Button, Intent, Keys, MenuItem, Tag, Popover, Tooltip, Spinner, InputGroup, Checkbox, Switch, TextArea, EditableText, NumericInput, RadioGroup, Position, FormGroup, Menu, Toaster, MenuDivider, useHotkeys, ContextMenu, Callout, Dialog, Card, Tabs, Tab, Colors, Overlay, KeyCombo, ProgressBar } from "@blueprintjs/core";
-import { formValueSelector, Field, change, reduxForm, SubmissionError, destroy, initialize, FormName, Fields } from "redux-form";
+import { formValueSelector, Field, change, reduxForm, SubmissionError, destroy, initialize, touch, FormName, Fields } from "redux-form";
 import require$$2$1, { unstable_batchedUpdates, createPortal } from "react-dom";
 import { connect, useDispatch, useSelector, useStore } from "react-redux";
 import { DateInput, DateRangeInput } from "@blueprintjs/datetime";
@@ -2024,8 +2024,8 @@ function createTippy(reference2, passedProps) {
   });
   return instance;
   function getNormalizedTouchSettings() {
-    var touch = instance.props.touch;
-    return Array.isArray(touch) ? touch : [touch, 0];
+    var touch2 = instance.props.touch;
+    return Array.isArray(touch2) ? touch2 : [touch2, 0];
   }
   __name(getNormalizedTouchSettings, "getNormalizedTouchSettings");
   function getIsCustomTouchBehavior() {
@@ -48377,57 +48377,81 @@ const DataTable = /* @__PURE__ */ __name((_G) => {
     reduxFormSearchInput,
     urlConnected
   ]);
-  if (!isTableParamsConnected) {
-    const updateSearch = /* @__PURE__ */ __name((val) => {
-      change2("reduxFormSearchInput", val || "");
-    }, "updateSearch");
-    const setNewParams2 = /* @__PURE__ */ __name((newParams) => {
-      urlConnected && setCurrentParamsOnUrl(newParams, history.replace);
-      change2("reduxFormQueryParams", newParams);
-    }, "setNewParams2");
-    const bindThese = makeDataTableHandlers({
-      setNewParams: setNewParams2,
-      updateSearch,
-      defaults: props.defaults,
-      onlyOneFilter: props.onlyOneFilter
-    });
-    const boundDispatchProps = {};
-    Object.keys(bindThese).forEach(function(key) {
-      const action = bindThese[key];
-      boundDispatchProps[key] = function(...args) {
-        action(...args, currentParams);
-      };
-    });
-    const changeFormValue = /* @__PURE__ */ __name((...args) => change2(...args), "changeFormValue");
-    props.tableParams = __spreadProps(__spreadValues(__spreadValues(__spreadValues({
-      changeFormValue,
-      selectedEntities
-    }, _tableParams), props), boundDispatchProps), {
-      isTableParamsConnected: true
-      //let the table know not to do local sorting/filtering etc.
-    });
-  }
-  props = __spreadValues(__spreadValues({}, props), props.tableParams);
-  if (!isTableParamsConnected) {
-    const additionalFilterToUse = typeof props.additionalFilter === "function" ? props.additionalFilter.bind(void 0, ownProps) : () => props.additionalFilter;
-    const additionalOrFilterToUse = typeof props.additionalOrFilter === "function" ? props.additionalOrFilter.bind(void 0, ownProps) : () => props.additionalOrFilter;
-    props = __spreadValues(__spreadValues({}, props), getQueryParams({
-      doNotCoercePageSize,
-      currentParams,
-      entities: props.entities,
-      // for local table
-      urlConnected,
-      defaults: props.defaults,
-      schema: convertedSchema,
-      isInfinite,
-      isLocalCall,
-      additionalFilter: additionalFilterToUse,
-      additionalOrFilter: additionalOrFilterToUse,
-      noOrderError: props.noOrderError,
-      isCodeModel: props.isCodeModel,
-      ownProps: props
-    }));
-  }
+  const tableParams = useMemo(() => {
+    if (!isTableParamsConnected) {
+      const updateSearch = /* @__PURE__ */ __name((val) => {
+        change2("reduxFormSearchInput", val || "");
+      }, "updateSearch");
+      const setNewParams2 = /* @__PURE__ */ __name((newParams) => {
+        urlConnected && setCurrentParamsOnUrl(newParams, history.replace);
+        change2("reduxFormQueryParams", newParams);
+      }, "setNewParams2");
+      const bindThese = makeDataTableHandlers({
+        setNewParams: setNewParams2,
+        updateSearch,
+        defaults: props.defaults,
+        onlyOneFilter: props.onlyOneFilter
+      });
+      const boundDispatchProps = {};
+      Object.keys(bindThese).forEach(function(key) {
+        const action = bindThese[key];
+        boundDispatchProps[key] = function(...args) {
+          action(...args, currentParams);
+        };
+      });
+      const changeFormValue = /* @__PURE__ */ __name((...args) => change2(...args), "changeFormValue");
+      return __spreadProps(__spreadValues(__spreadValues(__spreadValues({
+        changeFormValue,
+        selectedEntities
+      }, _tableParams), props), boundDispatchProps), {
+        isTableParamsConnected: true
+        //let the table know not to do local sorting/filtering etc.
+      });
+    }
+    return _tableParams;
+  }, [
+    _tableParams,
+    change2,
+    currentParams,
+    history.replace,
+    isTableParamsConnected,
+    props,
+    selectedEntities,
+    urlConnected
+  ]);
+  props = __spreadValues(__spreadValues({}, props), tableParams);
+  const queryParams = useMemo(() => {
+    if (!isTableParamsConnected) {
+      const additionalFilterToUse = typeof props.additionalFilter === "function" ? props.additionalFilter.bind(void 0, ownProps) : () => props.additionalFilter;
+      const additionalOrFilterToUse = typeof props.additionalOrFilter === "function" ? props.additionalOrFilter.bind(void 0, ownProps) : () => props.additionalOrFilter;
+      return getQueryParams({
+        doNotCoercePageSize,
+        currentParams,
+        entities: props.entities,
+        // for local table
+        urlConnected,
+        defaults: props.defaults,
+        schema: convertedSchema,
+        isInfinite,
+        isLocalCall,
+        additionalFilter: additionalFilterToUse,
+        additionalOrFilter: additionalOrFilterToUse,
+        noOrderError: props.noOrderError,
+        isCodeModel: props.isCodeModel,
+        ownProps: props
+      });
+    }
+    return {};
+  }, [
+    convertedSchema,
+    currentParams,
+    doNotCoercePageSize,
+    isInfinite,
+    isLocalCall,
+    isTableParamsConnected,
+    urlConnected
+  ]);
+  props = __spreadValues(__spreadValues({}, props), queryParams);
   const {
     addFilters = noop$3,
     additionalFilters,
@@ -53495,7 +53519,6 @@ const UploadCsvWizardDialog = compose(
     }
   });
   const reduxFormEntitiesArray = useDeepEqualMemo(_reduxFormEntitiesArray);
-  console.log({ _finishedFiles });
   const finishedFiles = useDeepEqualMemo(_finishedFiles);
   const [hasSubmittedOuter, setSubmittedOuter] = useState();
   const [steps, setSteps] = useState(getInitialSteps(true));
@@ -63250,6 +63273,7 @@ const Uploader = /* @__PURE__ */ __name(({
     if (noRedux) {
       return _onChange(val);
     }
+    dispatch(touch(formName, name));
     return dispatch(change(formName, name, val));
   }, "onChange");
   const handleSecondHalfOfUpload = /* @__PURE__ */ __name((_0) => __async(void 0, [_0], function* ({
@@ -64413,22 +64437,13 @@ function withTableParams(compOrOpts, pTopLevelOpts) {
     const mergedOpts = getMergedOpts(topLevelOptions, ownProps);
     const { formName, urlConnected, history, defaults: defaults2, onlyOneFilter } = mergedOpts;
     function updateSearch(val) {
-      setTimeout(function() {
-        dispatch(change(formName, "reduxFormSearchInput", val || ""));
-      });
+      dispatch(change(formName, "reduxFormSearchInput", val || ""));
     }
     __name(updateSearch, "updateSearch");
-    let setNewParams;
-    if (urlConnected) {
-      setNewParams = /* @__PURE__ */ __name(function(newParams) {
-        setCurrentParamsOnUrl(newParams, history.replace);
-        dispatch(change(formName, "reduxFormQueryParams", newParams));
-      }, "setNewParams");
-    } else {
-      setNewParams = /* @__PURE__ */ __name(function(newParams) {
-        dispatch(change(formName, "reduxFormQueryParams", newParams));
-      }, "setNewParams");
-    }
+    const setNewParams = /* @__PURE__ */ __name((newParams) => {
+      urlConnected && setCurrentParamsOnUrl(newParams, history.replace);
+      dispatch(change(formName, "reduxFormQueryParams", newParams));
+    }, "setNewParams");
     return {
       bindThese: makeDataTableHandlers({
         setNewParams,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@teselagen/ui",
-  "version": "0.5.21-beta.3",
+  "version": "0.5.21-beta.5",
   "main": "./src/index.js",
   "exports": {
     ".": {

package/src/DataTable/index.js

@@ -278,63 +278,74 @@ const DataTable = ({
     urlConnected
   ]);
 
-  if (!isTableParamsConnected) {
-    const updateSearch = val => {
-      change("reduxFormSearchInput", val || "");
-    };
+  const tableParams = useMemo(() => {
+    if (!isTableParamsConnected) {
+      const updateSearch = val => {
+        change("reduxFormSearchInput", val || "");
+      };
 
-    const setNewParams = newParams => {
-      urlConnected && setCurrentParamsOnUrl(newParams, history.replace);
-      change("reduxFormQueryParams", newParams); //we always will update the redux params as a workaround for withRouter not always working if inside a redux-connected container https://github.com/ReactTraining/react-router/issues/5037
-    };
+      const setNewParams = newParams => {
+        urlConnected && setCurrentParamsOnUrl(newParams, history.replace);
+        change("reduxFormQueryParams", newParams); //we always will update the redux params as a workaround for withRouter not always working if inside a redux-connected container https://github.com/ReactTraining/react-router/issues/5037
+      };
 
-    const bindThese = makeDataTableHandlers({
-      setNewParams,
-      updateSearch,
-      defaults: props.defaults,
-      onlyOneFilter: props.onlyOneFilter
-    });
+      const bindThese = makeDataTableHandlers({
+        setNewParams,
+        updateSearch,
+        defaults: props.defaults,
+        onlyOneFilter: props.onlyOneFilter
+      });
 
-    const boundDispatchProps = {};
-    //bind currentParams to actions
-    Object.keys(bindThese).forEach(function (key) {
-      const action = bindThese[key];
-      boundDispatchProps[key] = function (...args) {
-        action(...args, currentParams);
-      };
-    });
+      const boundDispatchProps = {};
+      //bind currentParams to actions
+      Object.keys(bindThese).forEach(function (key) {
+        const action = bindThese[key];
+        boundDispatchProps[key] = function (...args) {
+          action(...args, currentParams);
+        };
+      });
 
-    const changeFormValue = (...args) => change(...args);
+      const changeFormValue = (...args) => change(...args);
 
-    props.tableParams = {
-      changeFormValue,
-      selectedEntities,
-      ..._tableParams,
-      ...props,
-      ...boundDispatchProps,
-      isTableParamsConnected: true //let the table know not to do local sorting/filtering etc.
-    };
-  }
+      return {
+        changeFormValue,
+        selectedEntities,
+        ..._tableParams,
+        ...props,
+        ...boundDispatchProps,
+        isTableParamsConnected: true //let the table know not to do local sorting/filtering etc.
+      };
+    }
+    return _tableParams;
+  }, [
+    _tableParams,
+    change,
+    currentParams,
+    history.replace,
+    isTableParamsConnected,
+    props,
+    selectedEntities,
+    urlConnected
+  ]);
 
   props = {
     ...props,
-    ...props.tableParams
+    ...tableParams
   };
 
-  if (!isTableParamsConnected) {
-    const additionalFilterToUse =
-      typeof props.additionalFilter === "function"
-        ? props.additionalFilter.bind(this, ownProps)
-        : () => props.additionalFilter;
+  const queryParams = useMemo(() => {
+    if (!isTableParamsConnected) {
+      const additionalFilterToUse =
+        typeof props.additionalFilter === "function"
+          ? props.additionalFilter.bind(this, ownProps)
+          : () => props.additionalFilter;
 
-    const additionalOrFilterToUse =
-      typeof props.additionalOrFilter === "function"
-        ? props.additionalOrFilter.bind(this, ownProps)
-        : () => props.additionalOrFilter;
+      const additionalOrFilterToUse =
+        typeof props.additionalOrFilter === "function"
+          ? props.additionalOrFilter.bind(this, ownProps)
+          : () => props.additionalOrFilter;
 
-    props = {
-      ...props,
-      ...getQueryParams({
+      return getQueryParams({
         doNotCoercePageSize,
         currentParams,
         entities: props.entities, // for local table
@@ -348,9 +359,24 @@ const DataTable = ({
         noOrderError: props.noOrderError,
         isCodeModel: props.isCodeModel,
         ownProps: props
-      })
-    };
-  }
+      });
+    }
+    return {};
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [
+    convertedSchema,
+    currentParams,
+    doNotCoercePageSize,
+    isInfinite,
+    isLocalCall,
+    isTableParamsConnected,
+    urlConnected
+  ]);
+
+  props = {
+    ...props,
+    ...queryParams
+  };
 
   const {
     addFilters = noop,

package/src/DataTable/utils/withTableParams.js

@@ -182,22 +182,13 @@ export default function withTableParams(compOrOpts, pTopLevelOpts) {
       mergedOpts;
 
     function updateSearch(val) {
-      setTimeout(function () {
-        dispatch(change(formName, "reduxFormSearchInput", val || ""));
-      });
+      dispatch(change(formName, "reduxFormSearchInput", val || ""));
     }
 
-    let setNewParams;
-    if (urlConnected) {
-      setNewParams = function (newParams) {
-        setCurrentParamsOnUrl(newParams, history.replace);
-        dispatch(change(formName, "reduxFormQueryParams", newParams)); //we always will update the redux params as a workaround for withRouter not always working if inside a redux-connected container https://github.com/ReactTraining/react-router/issues/5037
-      };
-    } else {
-      setNewParams = function (newParams) {
-        dispatch(change(formName, "reduxFormQueryParams", newParams));
-      };
-    }
+    const setNewParams = newParams => {
+      urlConnected && setCurrentParamsOnUrl(newParams, history.replace);
+      dispatch(change(formName, "reduxFormQueryParams", newParams)); //we always will update the redux params as a workaround for withRouter not always working if inside a redux-connected container https://github.com/ReactTraining/react-router/issues/5037
+    };
     return {
       bindThese: makeDataTableHandlers({
         setNewParams,

package/src/FormComponents/Uploader.js

@@ -36,7 +36,7 @@ import writeXlsxFile from "write-excel-file";
 import { startCase } from "lodash-es";
 import { getNewName } from "./getNewName";
 import { isObject } from "lodash-es";
-import { change, initialize } from "redux-form";
+import { change, touch, initialize } from "redux-form";
 import classNames from "classnames";
 import convertSchema from "../DataTable/utils/convertSchema";
 import { LoadingDots } from "./LoadingDots";
@@ -252,6 +252,7 @@ const Uploader = ({
     if (noRedux) {
       return _onChange(val);
     }
+    dispatch(touch(formName, name));
     return dispatch(change(formName, name, val));
   };
 

package/src/UploadCsvWizard.js

@@ -658,7 +658,6 @@ const UploadCsvWizardDialog = compose(
     }
   });
   const reduxFormEntitiesArray = useDeepEqualMemo(_reduxFormEntitiesArray);
-  console.log({ _finishedFiles });
   const finishedFiles = useDeepEqualMemo(_finishedFiles);
 
   const [hasSubmittedOuter, setSubmittedOuter] = useState();