@teselagen/ui 0.3.47 → 0.3.48

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@teselagen/ui",
-  "version": "0.3.47",
+  "version": "0.3.48",
   "main": "./src/index.js",
   "exports": {
     ".": {
@@ -16,6 +16,7 @@
     "@blueprintjs/datetime": "3.23.19",
     "@blueprintjs/icons": "3.33.0",
     "@blueprintjs/select": "3.18.11",
+    "@teselagen/react-table": "6.10.16",
     "axios": "^0.21.1",
     "bluebird": "3.7.2",
     "buffer": "5.7.1",

package/src/DataTable/index.js

@@ -27,7 +27,8 @@ import {
   omitBy,
   times,
   some,
-  isFunction
+  isFunction,
+  every
 } from "lodash";
 import joinUrl from "url-join";
 
@@ -87,6 +88,7 @@ import { validateTableWideErrors } from "./validateTableWideErrors";
 import { editCellHelper } from "./editCellHelper";
 import { getCellVal } from "./getCellVal";
 import { getVals } from "./getVals";
+import { throwFormError } from "../throwFormError";
 enablePatches();
 
 const PRIMARY_SELECTED_VAL = "main_cell";
@@ -99,6 +101,8 @@ class DataTable extends React.Component {
     if (this.props.helperProp) {
       this.props.helperProp.addEditableTableEntities =
         this.addEditableTableEntities;
+      this.props.helperProp.getEditableTableInfoAndThrowFormError =
+        this.getEditableTableInfoAndThrowFormError;
     }
     this.hotkeyEnabler = withHotkeys({
       moveUpARow: {
@@ -798,7 +802,12 @@ class DataTable extends React.Component {
     const { change, schema } = computePresets(this.props);
     change(
       "reduxFormCellValidation",
-      validateTableWideErrors({ entities, schema, newCellValidate })
+      validateTableWideErrors({
+        entities,
+        schema,
+        newCellValidate,
+        props: this.props
+      })
     );
   };
   handleDeleteCell = () => {
@@ -2991,8 +3000,13 @@ class DataTable extends React.Component {
           indexToStartAt: entities.length
         }
       );
-
-      entities.splice(entities.length, 0, ...newEnts);
+      if (every(entities, "_isClean")) {
+        forEach(newEnts, (e, i) => {
+          entities[i] = e;
+        });
+      } else {
+        entities.splice(entities.length, 0, ...newEnts);
+      }
 
       this.updateValidation(entities, {
         ...reduxFormCellValidation,
@@ -3000,6 +3014,35 @@ class DataTable extends React.Component {
       });
     });
   };
+  getEditableTableInfoAndThrowFormError = () => {
+    const { schema, reduxFormEntities, reduxFormCellValidation } =
+      computePresets(this.props);
+    const { entsToUse, validationToUse } = removeCleanRows(
+      reduxFormEntities,
+      reduxFormCellValidation
+    );
+    const validationWTableErrs = validateTableWideErrors({
+      entities: entsToUse,
+      schema,
+      newCellValidate: validationToUse
+    });
+
+    if (!entsToUse?.length) {
+      throwFormError(
+        "Please add at least one row to the table before submitting."
+      );
+    }
+    const invalid =
+      isEmpty(validationWTableErrs) || !some(validationWTableErrs, v => v)
+        ? undefined
+        : validationWTableErrs;
+
+    if (invalid) {
+      throwFormError("Please fix the errors in the table before submitting.");
+    }
+
+    return entsToUse;
+  };
 
   insertRows = ({ above, numRows = 1, appendToBottom } = {}) => {
     const { entities = [], reduxFormCellValidation } = computePresets(
@@ -3744,3 +3787,23 @@ const formatPasteData = ({ schema, newVal, path }) => {
   }
   return newVal;
 };
+
+export function removeCleanRows(reduxFormEntities, reduxFormCellValidation) {
+  const toFilterOut = {};
+  const entsToUse = (reduxFormEntities || []).filter(e => {
+    if (!(e._isClean || isEntityClean(e))) return true;
+    else {
+      toFilterOut[getIdOrCodeOrIndex(e)] = true;
+      return false;
+    }
+  });
+
+  const validationToUse = {};
+  forEach(reduxFormCellValidation, (v, k) => {
+    const [rowId] = k.split(":");
+    if (!toFilterOut[rowId]) {
+      validationToUse[k] = v;
+    }
+  });
+  return { entsToUse, validationToUse };
+}

package/src/UploadCsvWizard.js

@@ -4,7 +4,7 @@ import { Callout, Icon, Intent, Tab, Tabs } from "@blueprintjs/core";
 import immer from "immer";
 import { observer } from "mobx-react";
 import "./UploadCsvWizard.css";
-import { forEach, isFunction } from "lodash";
+import { isFunction } from "lodash";
 import { compose } from "recompose";
 import SimpleStepViz from "./SimpleStepViz";
 import { nanoid } from "nanoid";
@@ -12,11 +12,10 @@ import { tgFormValueSelector } from "./utils/tgFormValues";
 import { some } from "lodash";
 import { times } from "lodash";
 import DialogFooter from "./DialogFooter";
-import DataTable, { isEntityClean } from "./DataTable";
+import DataTable, { removeCleanRows } from "./DataTable";
 import wrapDialog from "./wrapDialog";
 import { omit } from "lodash";
 import { connect } from "react-redux";
-import getIdOrCodeOrIndex from "./DataTable/utils/getIdOrCodeOrIndex";
 import { MatchHeaders } from "./MatchHeaders";
 import { isEmpty } from "lodash";
 import { addSpecialPropToAsyncErrs } from "./FormComponents/tryToMatchSchemas";
@@ -703,26 +702,6 @@ async function asyncValidateHelper(
   }
 }
 
-export function removeCleanRows(reduxFormEntities, reduxFormCellValidation) {
-  const toFilterOut = {};
-  const entsToUse = (reduxFormEntities || []).filter(e => {
-    if (!(e._isClean || isEntityClean(e))) return true;
-    else {
-      toFilterOut[getIdOrCodeOrIndex(e)] = true;
-      return false;
-    }
-  });
-
-  const validationToUse = {};
-  forEach(reduxFormCellValidation, (v, k) => {
-    const [rowId] = k.split(":");
-    if (!toFilterOut[rowId]) {
-      validationToUse[k] = v;
-    }
-  });
-  return { entsToUse, validationToUse };
-}
-
 function maybeStripIdFromEntities(ents, validateAgainstSchema) {
   let toRet;
   if (validateAgainstSchema?.fields?.some(({ path }) => path === "id")) {

package/src/index.js

@@ -17,19 +17,20 @@ export {
 } from "./DataTable/utils/withSelectedEntities";
 export {
   default as DataTable,
-  ConnectedPagingTool as PagingTool
+  ConnectedPagingTool as PagingTool,
+  removeCleanRows
 } from "./DataTable";
 
 export { default as getIdOrCodeOrIndex } from "./DataTable/utils/getIdOrCodeOrIndex";
 export { default as convertSchema } from "./DataTable/utils/convertSchema";
 export { default as Loading } from "./Loading";
+export { throwFormError } from "./throwFormError";
 export { default as AdvancedOptions } from "./AdvancedOptions";
 export { default as TgSelect } from "./TgSelect";
 export { default as wrapDialog } from "./wrapDialog";
 export { default as PromptUnsavedChanges } from "./PromptUnsavedChanges";
 export { default as BlueprintError } from "./BlueprintError";
 export { default as DropdownButton } from "./DropdownButton";
-export { removeCleanRows } from "./UploadCsvWizard";
 export { default as DialogFooter } from "./DialogFooter";
 export { default as adHoc } from "./utils/adHoc";
 export { default as IntentText } from "./IntentText";

package/src/throwFormError.js

@@ -0,0 +1,16 @@
+import { SubmissionError } from "redux-form";
+
+export const throwFormError = error => {
+  if (error.message) {
+    console.error("error:", error);
+  }
+  const errorToUse = error.message
+    ? { _error: error.message }
+    : typeof error === "string"
+    ? { _error: error }
+    : error;
+  if (!errorToUse._error) {
+    errorToUse._error = "Error Submitting Form";
+  }
+  throw new SubmissionError(errorToUse);
+};