@truedat/dq 4.33.8 → 4.34.2

package/src/components/__tests__/__snapshots__/RuleImplementationsActions.spec.js.snap

@@ -22,55 +22,10 @@ exports[`<RuleImplementationsActions /> matches the latest snapshot 1`] = `
     toggle={true}
     type="checkbox"
   />
-  <ConfirmModal
-    actions={
-      Array [
-        Object {
-          "content": <Memo(MemoizedFormattedMessage)
-            id="confirmation.no"
-          />,
-          "key": "no",
-          "secondary": true,
-        },
-        Object {
-          "content": <Memo(MemoizedFormattedMessage)
-            id="confirmation.yes"
-          />,
-          "key": "yes",
-          "onClick": [Function],
-          "primary": true,
-        },
-      ]
-    }
-    content={
-      <Memo(MemoizedFormattedMessage)
-        id="implementations.actions.execution.confirmation.content"
-        values={
-          Object {
-            "implementations_count": 12,
-          }
-        }
-      />
-    }
-    header={
-      <Memo(MemoizedFormattedMessage)
-        id="implementations.actions.execution.confirmation.header"
-      />
-    }
-    trigger={
-      <Button
-        as="button"
-        content={
-          <Memo(MemoizedFormattedMessage)
-            id="implementations.actions.do_execution"
-          />
-        }
-        disabled={true}
-        id="execute_button"
-        loading={false}
-        secondary={true}
-      />
-    }
+  <Connect(ExecutionPopup)
+    count={12}
+    disabled={true}
+    handleSubmit={[Function]}
   />
   <Button
     as="button"
@@ -81,5 +36,6 @@ exports[`<RuleImplementationsActions /> matches the latest snapshot 1`] = `
     onClick={[Function]}
     secondary={true}
   />
+  <Connect(ImplementationsUploadButton) />
 </div>
 `;

package/src/components/__tests__/__snapshots__/RuleProperties.spec.js.snap

@@ -58,6 +58,5 @@ exports[`<RuleProperties /> matches the latest snapshot 1`] = `
       foo
     </ListContent>
   </ListItem>
-  <Connect(RuleRangeNumber) />
 </List>
 `;

package/src/components/__tests__/__snapshots__/RuleRow.spec.js.snap

@@ -24,19 +24,6 @@ exports[`<RuleRow /> matches the latest snapshot 1`] = `
         >
           
         </td>
-        <td
-          class=""
-        />
-        <td
-          class="right aligned"
-        >
-          1%
-        </td>
-        <td
-          class="right aligned"
-        >
-          22%
-        </td>
       </tr>
     </tbody>
   </table>
@@ -66,21 +53,6 @@ exports[`<RuleRow /> row prints column fields 1`] = `
           class=""
         >
           
-        </td>
-        <td
-          class=""
-        >
-          Percentage
-        </td>
-        <td
-          class="right aligned"
-        >
-          1%
-        </td>
-        <td
-          class="right aligned"
-        >
-          22%
         </td>
         <td
           class=""

package/src/components/__tests__/__snapshots__/Rules.spec.js.snap

@@ -57,47 +57,6 @@ exports[`<Rules /> matches the latest snapshot 1`] = `
           sorted={null}
           width={3}
         />
-        <TableHeaderCell
-          as="th"
-          className=""
-          content={
-            <Memo(MemoizedFormattedMessage)
-              id="quality.result_type"
-            />
-          }
-          key="3"
-          onClick={[Function]}
-          sorted={null}
-          width={2}
-        />
-        <TableHeaderCell
-          as="th"
-          className=""
-          content={
-            <Memo(MemoizedFormattedMessage)
-              id="quality.minimum"
-            />
-          }
-          key="4"
-          onClick={[Function]}
-          sorted={null}
-          textAlign="right"
-          width={1}
-        />
-        <TableHeaderCell
-          as="th"
-          className=""
-          content={
-            <Memo(MemoizedFormattedMessage)
-              id="quality.goal.list"
-            />
-          }
-          key="5"
-          onClick={[Function]}
-          sorted={null}
-          textAlign="right"
-          width={1}
-        />
       </TableRow>
     </TableHeader>
     <TableBody
@@ -131,34 +90,6 @@ exports[`<Rules /> matches the latest snapshot 1`] = `
               },
               "width": 3,
             },
-            Object {
-              "fieldDecorator": [Function],
-              "name": "result_type",
-              "sort": Object {
-                "name": "result_type.raw",
-              },
-              "width": 2,
-            },
-            Object {
-              "fieldDecorator": [Function],
-              "fieldSelector": [Function],
-              "name": "minimum",
-              "sort": Object {
-                "name": "minimum",
-              },
-              "textAlign": "right",
-              "width": 1,
-            },
-            Object {
-              "fieldDecorator": [Function],
-              "fieldSelector": [Function],
-              "name": "goal.list",
-              "sort": Object {
-                "name": "goal",
-              },
-              "textAlign": "right",
-              "width": 1,
-            },
           ]
         }
         key="0"
@@ -166,9 +97,7 @@ exports[`<Rules /> matches the latest snapshot 1`] = `
           Object {
             "business_concept_id": "2D2B3",
             "description": "desc1",
-            "goal": 10,
             "id": 123,
-            "minimum": 1,
             "name": "control1",
             "status": "status1",
             "type": "type1",
@@ -204,34 +133,6 @@ exports[`<Rules /> matches the latest snapshot 1`] = `
               },
               "width": 3,
             },
-            Object {
-              "fieldDecorator": [Function],
-              "name": "result_type",
-              "sort": Object {
-                "name": "result_type.raw",
-              },
-              "width": 2,
-            },
-            Object {
-              "fieldDecorator": [Function],
-              "fieldSelector": [Function],
-              "name": "minimum",
-              "sort": Object {
-                "name": "minimum",
-              },
-              "textAlign": "right",
-              "width": 1,
-            },
-            Object {
-              "fieldDecorator": [Function],
-              "fieldSelector": [Function],
-              "name": "goal.list",
-              "sort": Object {
-                "name": "goal",
-              },
-              "textAlign": "right",
-              "width": 1,
-            },
           ]
         }
         key="1"
@@ -239,9 +140,7 @@ exports[`<Rules /> matches the latest snapshot 1`] = `
           Object {
             "business_concept_id": "2D2B4",
             "description": "desc2",
-            "goal": 10,
             "id": 122,
-            "minimum": 1,
             "name": "control2",
             "status": "status2",
             "type": "type2",

package/src/components/ruleImplementationForm/InformationForm.js

@@ -6,6 +6,8 @@ import { useIntl } from "react-intl";
 import { Form, Icon, Popup } from "semantic-ui-react";
 import { selectTemplate } from "@truedat/df/routines";
 
+import LimitsForm from "./LimitsForm";
+
 const TemplateSelector = React.lazy(() =>
   import("@truedat/df/templates/components/TemplateSelector")
 );
@@ -33,12 +35,11 @@ const ImplementationDynamicForm = ({
         ? firstTemplate
         : {}
     );
-
-    selectTemplate({ id: templateId });
+    if (templateId !== undefined) selectTemplate({ id: templateId });
   }, [ruleImplementation, selectTemplate, templates]);
 
   const handleContentChange = (content) => onChange("dfContent", content);
-  const handleTemplateSelected = (e, { value }) =>
+  const handleTemplateSelected = (_e, { value }) =>
     selectTemplate({ id: value });
 
   return (
@@ -47,7 +48,6 @@ const ImplementationDynamicForm = ({
         name="template"
         selectedValue={_.prop("id")(template)}
         onChange={handleTemplateSelected}
-        isOptional={true}
       />
       {template && template.id && (
         <DynamicForm
@@ -113,7 +113,7 @@ export const InformationForm = ({
           autoComplete="off"
         />
       </Form.Field>
-
+      <LimitsForm onChange={onChange} ruleImplementation={ruleImplementation} />
       {!_.isEmpty(templates) && (
         <ImplementationDynamicForm
           selectTemplate={selectTemplate}

package/src/components/ruleImplementationForm/LimitsForm.js

@@ -0,0 +1,142 @@
+import _ from "lodash/fp";
+import React from "react";
+import PropTypes from "prop-types";
+import { useIntl } from "react-intl";
+import { Form, Icon, Popup, Label, Segment } from "semantic-ui-react";
+
+import generateValidationMessages from "./limitsValidation";
+
+export const FieldLabelWrapping = ({
+  children,
+  label,
+  required,
+  tooltip,
+  message,
+}) => (
+  <Form.Field>
+    <label className="rule-form-label">
+      {label}
+      {required && <span>*</span>}
+      {tooltip && (
+        <Popup
+          trigger={
+            <Icon className="rule-form-popup" name="question circle outline" />
+          }
+          content={tooltip}
+          on="click"
+          hideOnScroll
+        />
+      )}
+      {message && <Label pointing="left">{message}</Label>}
+    </label>
+    {children}
+  </Form.Field>
+);
+
+FieldLabelWrapping.propTypes = {
+  children: PropTypes.node,
+  label: PropTypes.string,
+  required: PropTypes.bool,
+  tooltip: PropTypes.string,
+  message: PropTypes.string,
+};
+
+export default function LimitsForm({ onChange, ruleImplementation }) {
+  const { formatMessage } = useIntl();
+  const handleChange = (e, { name, value }) => {
+    e && e.preventDefault();
+    onChange(name, value);
+  };
+
+  const { minimum: minimumMessage, goal: goalMessage } =
+    generateValidationMessages(ruleImplementation);
+
+  return (
+    <Segment>
+      <FieldLabelWrapping
+        label={formatMessage({ id: "ruleImplementations.props.result_type" })}
+        required
+        tooltip={formatMessage({
+          id: "ruleImplementation.form.tooltip.result_type",
+        })}
+      >
+        <Form.Group inline>
+          <Form.Radio
+            name={"result_type"}
+            label={formatMessage({
+              id: "ruleImplementations.props.result_type.percentage",
+            })}
+            value={"percentage"}
+            checked={ruleImplementation.result_type == "percentage"}
+            onChange={handleChange}
+          />
+          <Form.Radio
+            name={"result_type"}
+            label={formatMessage({
+              id: "ruleImplementations.props.result_type.deviation",
+            })}
+            value={"deviation"}
+            checked={ruleImplementation.result_type == "deviation"}
+            onChange={handleChange}
+          />
+          <Form.Radio
+            name={"result_type"}
+            label={formatMessage({
+              id: "ruleImplementations.props.result_type.errors_number",
+            })}
+            value={"errors_number"}
+            checked={ruleImplementation.result_type == "errors_number"}
+            onChange={handleChange}
+          />
+        </Form.Group>
+      </FieldLabelWrapping>
+      <FieldLabelWrapping
+        label={formatMessage({ id: "ruleImplementations.props.minimum" })}
+        message={minimumMessage && formatMessage({ id: minimumMessage })}
+        required
+        tooltip={formatMessage({
+          id: `ruleImplementation.form.tooltip.${ruleImplementation.result_type}.minimum`,
+        })}
+      >
+        <Form.Input
+          name="minimum"
+          onChange={handleChange}
+          value={
+            _.isNil(ruleImplementation.minimum)
+              ? ""
+              : ruleImplementation.minimum
+          }
+          placeholder={formatMessage({
+            id: "ruleImplementations.props.minimum.placeholder",
+          })}
+          autoComplete="off"
+        />
+      </FieldLabelWrapping>
+      <FieldLabelWrapping
+        label={formatMessage({ id: "ruleImplementations.props.goal" })}
+        message={goalMessage && formatMessage({ id: goalMessage })}
+        required
+        tooltip={formatMessage({
+          id: `ruleImplementation.form.tooltip.${ruleImplementation.result_type}.goal`,
+        })}
+      >
+        <Form.Input
+          name="goal"
+          onChange={handleChange}
+          value={
+            _.isNil(ruleImplementation.goal) ? "" : ruleImplementation.goal
+          }
+          placeholder={formatMessage({
+            id: "ruleImplementations.props.goal.placeholder",
+          })}
+          autoComplete="off"
+        />
+      </FieldLabelWrapping>
+    </Segment>
+  );
+}
+
+LimitsForm.propTypes = {
+  ruleImplementation: PropTypes.object,
+  onChange: PropTypes.func,
+};

package/src/components/ruleImplementationForm/RuleImplementationForm.js

@@ -5,10 +5,12 @@ import { connect } from "react-redux";
 import { useHistory } from "react-router-dom";
 import { FormattedMessage, useIntl } from "react-intl";
 import { Button, Divider, Form, Grid, Icon, Step } from "semantic-ui-react";
+import { validateContent } from "@truedat/df/utils";
 import PopulationForm from "./PopulationForm";
 import DatasetForm from "./DatasetForm";
 import ValidationsForm from "./ValidationsForm";
 import InformationForm from "./InformationForm";
+import { areLimitsValid } from "./limitsValidation";
 
 const RuleImplementationStep = ({ activeStep, name, icon }) => (
   <Step active={activeStep == name}>
@@ -37,12 +39,12 @@ export const RuleImplementationForm = ({
   handleSubmit,
   operators,
   onChange,
-  applyTemplate,
+  template,
 }) => {
   const { formatMessage } = useIntl();
   const history = useHistory();
   const steps = [
-    { name: "information", icon: "info", isValid: () => true },
+    { name: "information", icon: "info", isValid: () => validInformation() },
     { name: "dataset", icon: "database", isValid: () => validDataSet() },
     { name: "population", icon: "user", isValid: () => validPopulation() },
     { name: "validations", icon: "setting", isValid: () => validValidations() },
@@ -55,8 +57,15 @@ export const RuleImplementationForm = ({
     dataset: structures,
     population,
     validations,
+    dfContent,
   } = ruleImplementation || {};
 
+  const validInformation = () =>
+    template &&
+    !_.isEmpty(template) &&
+    _.size(validateContent(template)(dfContent)) == 0 &&
+    areLimitsValid(ruleImplementation);
+
   const validPopulation = () =>
     _.every(_.isEmpty)(population) || populationComplete();
 
@@ -208,7 +217,6 @@ export const RuleImplementationForm = ({
                 setImplementationKey,
                 ruleImplementation,
                 onChange,
-                applyTemplate,
               }}
             />
           )}
@@ -241,6 +249,7 @@ export const RuleImplementationForm = ({
           )}
         </Form>
       </Grid.Row>
+      <Divider hidden />
       <Grid.Row stretched>
         <Button
           floated="right"
@@ -287,11 +296,12 @@ RuleImplementationForm.propTypes = {
   setValidations: PropTypes.func,
   operators: PropTypes.object,
   onChange: PropTypes.func,
-  applyTemplate: PropTypes.func,
+  template: PropTypes.object,
 };
 
 const mapStateToProps = (state) => ({
   isSubmitting: state.ruleImplementationCreating,
+  template: state.template,
 });
 
 export default connect(mapStateToProps)(RuleImplementationForm);

package/src/components/ruleImplementationForm/RuleImplementationRawForm.js

@@ -5,7 +5,10 @@ import { connect } from "react-redux";
 import { useHistory } from "react-router-dom";
 import { FormattedMessage, useIntl } from "react-intl";
 import { Button, Form, Icon, Popup } from "semantic-ui-react";
+import { validateContent as validDfContent } from "@truedat/df/utils";
 import { selectTemplate } from "@truedat/df/routines";
+import LimitsForm from "./LimitsForm";
+import { areLimitsValid } from "./limitsValidation";
 
 const Help = ({ message }) => {
   const { formatMessage } = useIntl();
@@ -60,7 +63,6 @@ const ImplementationDynamicForm = ({
         name="template"
         selectedValue={_.prop("id")(template)}
         onChange={handleTemplateSelected}
-        isOptional={true}
       />
       {template && template.id && (
         <DynamicForm
@@ -84,7 +86,6 @@ export const RuleImplementationRawForm = ({
   handleSubmit,
   isSubmitting,
   implementationKey,
-  mode,
   rawContent,
   setImplementationKey,
   setImplementationRawContent,
@@ -148,9 +149,15 @@ export const RuleImplementationRawForm = ({
       /\b(DROP|DELETE|INSERT|UPDATE|CALL|EXEC|EXECUTE|ALTER)\b|;|--|#/gi;
     return text ? text.match(re) : [];
   };
+  const validInformation = () =>
+    template &&
+    !_.isEmpty(template) &&
+    _.size(validDfContent(template)(ruleImplementation?.dfContent)) == 0 &&
+    areLimitsValid(ruleImplementation);
 
   const isValidForm = () => {
     return (
+      validInformation() &&
       isNotEmptyProp("source_id") &&
       (_.isEmpty(databasesOptions) || isNotEmptyProp("database")) &&
       _.every(isNotEmptyProp)(["dataset", "validations"]) &&
@@ -208,11 +215,14 @@ export const RuleImplementationRawForm = ({
             placeholder={formatMessage({
               id: "ruleImplementation.props.name.placeholder",
             })}
-            readOnly={mode == "edition"}
             required
             value={implementationKey}
           />
         </Form.Field>
+        <LimitsForm
+          onChange={onChange}
+          ruleImplementation={ruleImplementation}
+        />
         {!_.isEmpty(templates) && (
           <ImplementationDynamicForm
             selectTemplate={selectTemplate}
@@ -279,7 +289,7 @@ export const RuleImplementationRawForm = ({
           required
           rows={4}
           size="small"
-          value={_.prop("dataset")(rawContent)}
+          value={_.prop("dataset")(rawContent) || ""}
         />
         <Form.TextArea
           className="raw"
@@ -303,7 +313,7 @@ export const RuleImplementationRawForm = ({
           })}
           rows={4}
           size="small"
-          value={_.prop("population")(rawContent)}
+          value={_.prop("population")(rawContent) || ""}
         />
         <Form.TextArea
           className="raw"
@@ -328,7 +338,7 @@ export const RuleImplementationRawForm = ({
           required
           rows={4}
           size="small"
-          value={_.prop("validations")(rawContent)}
+          value={_.prop("validations")(rawContent) || ""}
         />
         <Form.Button
           floated="right"