@truedat/dq 4.43.0 → 4.43.3

package/CHANGELOG.md

@@ -1,5 +1,24 @@
 # Changelog
 
+## [4.43.3] 2022-05-04
+
+### Changed
+
+- [TD-3936] Updated `react-hook-form`
+
+## [4.43.2] 2022-05-03
+
+### Fixed
+
+- [TD-4709] `DatasetForm` wasn't behaving correctly on implementations with
+  no dataset
+
+## [4.43.1] 2022-04-28
+
+# Added
+
+- [TD-4538] Add Segment configuration and segment results for implementations
+
 ## [4.43.0] 2022-04-26
 
 # Added
@@ -8,13 +27,13 @@
 
 ## [4.42.3] 2022-04-13
 
-# Fixed
+### Fixed
 
 - [TD-4721] Remove sources error condition in NewRuleImplementation
 
 ## [4.42.1] 2022-04-12
 
-# Changed
+### Changed
 
 - [TD-4536] Support rule implementation with multiple populations
 
@@ -929,7 +948,7 @@ New major version for Truedat 4.0, no changes
 
 - [TD-1802] Added individual saga to retrieve filter values
 
-## [2.19.0]
+## [2.19.0] 2019-05-16
 
 ### Added
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@truedat/dq",
-  "version": "4.43.0",
+  "version": "4.43.3",
   "description": "Truedat Web Data Quality Module",
   "sideEffects": false,
   "jsnext:main": "src/index.js",
@@ -31,7 +31,7 @@
     "@babel/plugin-transform-modules-commonjs": "^7.15.0",
     "@babel/preset-env": "^7.15.0",
     "@babel/preset-react": "^7.14.5",
-    "@truedat/test": "4.43.0",
+    "@truedat/test": "4.43.3",
     "babel-jest": "^27.0.6",
     "babel-plugin-dynamic-import-node": "^2.3.3",
     "babel-plugin-lodash": "^3.3.4",
@@ -82,8 +82,8 @@
   },
   "dependencies": {
     "@apollo/client": "^3.4.10",
-    "@truedat/core": "4.43.0",
-    "@truedat/df": "4.43.0",
+    "@truedat/core": "4.43.3",
+    "@truedat/df": "4.43.3",
     "axios": "^0.19.2",
     "graphql": "^15.5.3",
     "path-to-regexp": "^1.7.0",
@@ -103,5 +103,5 @@
     "react-dom": ">= 16.8.6 < 17",
     "semantic-ui-react": ">= 0.88.2 < 2.1"
   },
-  "gitHead": "ad0f63f2d98ae377883743b839858d9d671d2431"
+  "gitHead": "072eb5d04ec38033c17e030c365502484815a96b"
 }

package/src/api.js

@@ -22,6 +22,7 @@ const API_RULE_IMPLEMENTATION_FILTERS_SEARCH =
 const API_RULE_IMPLEMENTATIONS_UPLOAD = "/api/rule_implementations/upload";
 const API_RULE_RESULT = "/api/rule_results/:id";
 const API_RULE_RESULTS = "/api/rule_results";
+const API_SEGMENT_RESULTS = "/api/rule_results/:rule_result_id/segment_results";
 const API_SUBSCRIPTIONS_SEARCH = "/api/subscriptions/user/me/search";
 const API_SUBSCRIPTION = "/api/subscriptions/:id";
 const API_SUBSCRIPTIONS = "/api/subscriptions";
@@ -47,6 +48,7 @@ export {
   API_RULE_IMPLEMENTATIONS_UPLOAD,
   API_RULE_RESULT,
   API_RULE_RESULTS,
+  API_SEGMENT_RESULTS,
   API_SUBSCRIPTIONS_SEARCH,
   API_SUBSCRIPTION,
   API_SUBSCRIPTIONS,

package/src/components/ConditionSummary.js

@@ -217,6 +217,7 @@ ConditionSummary.propTypes = {
   icon: PropTypes.string,
   rows: PropTypes.array,
   type: PropTypes.string,
+  alias: PropTypes.array,
 };
 
 export default ConditionSummary;

package/src/components/FieldSummary.js

@@ -0,0 +1,86 @@
+import _ from "lodash/fp";
+import React from "react";
+import PropTypes from "prop-types";
+import { Header, Icon, Segment, Table } from "semantic-ui-react";
+import { Link } from "react-router-dom";
+import { FormattedMessage } from "react-intl";
+import { linkTo } from "@truedat/core/routes";
+
+export const empty = (rows) =>
+  rows && _.every((r) => _.isEmpty(r) || _.isNil(r))(rows);
+
+const ConditionCell = ({ row, alias }) => {
+  const alias_text = _.flow(
+    _.find({ index: row.structure?.parent_index }),
+    _.propOr(null, "text")
+  )(alias);
+
+  return (
+    <Table.Row>
+      <Table.Cell width={5}>
+        {_.has("structure")(row) && (
+          <>
+            <Link
+              to={linkTo.STRUCTURE({
+                id: _.path("structure.id")(row),
+              })}
+            >
+              <span className="highlighted">
+                {alias_text && `(${alias_text}).`}{" "}
+                {`"${_.pathOr("", "structure.name")(row)}"`}
+              </span>
+            </Link>
+          </>
+        )}
+      </Table.Cell>
+    </Table.Row>
+  );
+};
+
+ConditionCell.propTypes = {
+  row: PropTypes.object,
+  alias: PropTypes.array,
+};
+
+export const FieldSummary = ({ rows, type, icon, alias }) => {
+  const wrappedRows = [rows];
+  return empty(rows) ? null : (
+    <>
+      <Header as="h3">
+        <Icon name={icon} size="small" />
+        <Header.Content>
+          <FormattedMessage
+            id={`ruleImplementations.summary.headers.${type}`}
+          />
+        </Header.Content>
+      </Header>
+      {wrappedRows.map((rows, i) => (
+        <Segment key={i}>
+          <Table basic="very">
+            <Table.Header>
+              <Table.Row>
+                <Table.HeaderCell>
+                  <FormattedMessage id={`ruleImplementation.summary.field`} />
+                </Table.HeaderCell>
+              </Table.Row>
+            </Table.Header>
+            <Table.Body>
+              {rows.map((row, i) => (
+                <ConditionCell key={i} row={row} alias={alias} />
+              ))}
+            </Table.Body>
+          </Table>
+        </Segment>
+      ))}
+    </>
+  );
+};
+
+FieldSummary.propTypes = {
+  icon: PropTypes.string,
+  rows: PropTypes.array,
+  type: PropTypes.string,
+  alias: PropTypes.array,
+};
+
+export default FieldSummary;

package/src/components/ImplementationSummary.js

@@ -6,6 +6,7 @@ import { Link } from "react-router-dom";
 import { FormattedMessage } from "react-intl";
 import { linkTo } from "@truedat/core/routes";
 import ConditionSummary, { empty, path } from "./ConditionSummary";
+import FieldSummary from "./FieldSummary";
 import InformationSummary from "./InformationSummary";
 import "../styles/ImplementationSummary.less";
 
@@ -15,6 +16,7 @@ const defaults = [
   "dataset",
   "populations",
   "validations",
+  "segments",
 ];
 
 const FormattedLink = ({ value, operator = {} }) =>
@@ -130,7 +132,7 @@ DatasetSummary.propTypes = {
 
 export const ImplementationSummary = ({ ruleImplementation, activeSteps }) => {
   const steps = _.isEmpty(activeSteps) ? defaults : activeSteps;
-  const { dataset, populations, validations } =
+  const { dataset, populations, validations, segments } =
     _.pick(steps)(ruleImplementation);
   const alias = _.map(_.propOr({}, "alias"))(dataset);
   return (
@@ -158,6 +160,14 @@ export const ImplementationSummary = ({ ruleImplementation, activeSteps }) => {
           alias={alias}
         />
       )}
+      {segments && _.includes("segments")(steps) && (
+        <FieldSummary
+          type="segments"
+          icon="grid layout"
+          rows={segments}
+          alias={alias}
+        />
+      )}
     </>
   );
 };

package/src/components/NewRemediation.js

@@ -2,11 +2,13 @@ import _ from "lodash/fp";
 import React, { useState } from "react";
 import PropTypes from "prop-types";
 import { connect } from "react-redux";
-import { Button, Header, Icon, Segment } from "semantic-ui-react";
+import { Button, Header, Icon, Container, Segment } from "semantic-ui-react";
 import { FormattedMessage, useIntl } from "react-intl";
 import { createRemediation, fetchRuleImplementation } from "../routines";
 import RemediationForm from "./RemediationForm";
 
+import "../styles/remediationPlan.less";
+
 export const NewRemediation = ({
   manageRemediations,
   onSaveRemediation,
@@ -23,25 +25,30 @@ export const NewRemediation = ({
 
   return !manageRemediations || _.isEmpty(templates) ? null : (
     <>
-      {!isEdit ? (
-        <Button
-          primary
-          onClick={() => setIsEdit(!isEdit)}
-          content={formatMessage({ id: "remediation.actions.create" })}
-        />
-      ) : (
-        <>
-          <Header as="h2">
-            <Icon name="plug" />
-            <Header.Content>
-              <FormattedMessage id="remediation.actions.create" />
-            </Header.Content>
-          </Header>
-          <Segment>
-            <RemediationForm onSave={onSave} latestResultId={latestResultId} />
-          </Segment>
-        </>
-      )}
+      <Container className="new-remedation-container" fluid>
+        {!isEdit ? (
+          <Button
+            primary
+            onClick={() => setIsEdit(!isEdit)}
+            content={formatMessage({ id: "remediation.actions.create" })}
+          />
+        ) : (
+          <>
+            <Header as="h2">
+              <Icon name="plug" />
+              <Header.Content>
+                <FormattedMessage id="remediation.actions.create" />
+              </Header.Content>
+            </Header>
+            <Segment>
+              <RemediationForm
+                onSave={onSave}
+                latestResultId={latestResultId}
+              />
+            </Segment>
+          </>
+        )}
+      </Container>
     </>
   );
 };

package/src/components/NewRuleImplementation.js

@@ -224,8 +224,8 @@ const updateStructureParentIndex = (structures) => (structure) => {
   return structure;
 };
 
-const withConditionDefaultAlias = (conditions, structures) =>
-  _.map((p) => {
+const withConditionDefaultAlias = (conditions, structures) => {
+  return _.map((p) => {
     return {
       ...p,
       structure: updateStructureParentIndex(structures)(p.structure),
@@ -235,6 +235,7 @@ const withConditionDefaultAlias = (conditions, structures) =>
           : p.value,
     };
   })(conditions);
+};
 
 export const NewRuleImplementation = ({
   canManageRaw,
@@ -296,6 +297,18 @@ export const NewRuleImplementation = ({
             ),
             precalculatedDataset
           ),
+          segments: withConditionDefaultAlias(
+            addFieldType(
+              ruleImplementationProps,
+              structuresFields,
+              structuresSiblings,
+              "segments",
+              "segment",
+              { name: "" }
+            ),
+            precalculatedDataset
+          ),
+
           rawContent: {
             ..._.prop("raw_content")(ruleImplementationProps),
           },
@@ -313,12 +326,14 @@ export const NewRuleImplementation = ({
           population: [],
           populations: [],
           validations: [{}],
+          segments: [{}],
           rawContent: {
             database: "",
             source_id: null,
             dataset: "",
             population: "",
             validations: "",
+            segments: "",
           },
           dfName: "",
           dfContent: {},
@@ -380,6 +395,12 @@ export const NewRuleImplementation = ({
       _.filter((val) => valueInDataset(val))
     )(ruleImplementation);
 
+    const segments_within_dataset = _.flow(
+      _.prop("segments"),
+      _.filter((val) => belongsToDataset(_.path("structure.id")(val))),
+      _.filter((val) => valueInDataset(val))
+    )(ruleImplementation);
+
     const population_within_dataset = _.flow(
       _.prop("population"),
       _.filter((val) => belongsToDataset(_.path("structure.id")(val))),
@@ -395,16 +416,15 @@ export const NewRuleImplementation = ({
       validations: _.isEmpty(validations_within_dataset)
         ? [{}]
         : validations_within_dataset,
+      segments: _.isEmpty(segments_within_dataset)
+        ? []
+        : segments_within_dataset,
     });
   };
 
   const onChange = (prop, value) =>
     setRuleImplementation({ ...ruleImplementation, [prop]: value });
 
-  const setPopulation = (population) => {
-    setRuleImplementation({ ...ruleImplementation, population });
-  };
-
   const addPopulation = () => {
     const populations = _.concat(
       _.pathOr([], "populations")(ruleImplementation)
@@ -426,6 +446,18 @@ export const NewRuleImplementation = ({
     setRuleImplementation({ ...ruleImplementation, validations });
   };
 
+  const addSegments = () => {
+    const segments = _.concat(_.pathOr([], "segments")(ruleImplementation))([
+      {},
+    ]);
+    setRuleImplementation({ ...ruleImplementation, segments });
+  };
+
+  const setSegments = (segments) => {
+    const newSegments = _.isEqual([{}])(segments) ? [] : segments;
+    setRuleImplementation({ ...ruleImplementation, segments: newSegments });
+  };
+
   const setImplementationKey = (implementationKey) =>
     setRuleImplementation({ ...ruleImplementation, implementationKey });
 
@@ -449,6 +481,7 @@ export const NewRuleImplementation = ({
     const validations = _.filter(_.negate(_.isEmpty))(
       ruleImplementation.validations
     );
+    const segments = _.filter(_.negate(_.isEmpty))(ruleImplementation.segments);
 
     const dfContent = _.flow(
       _.prop("dfContent"),
@@ -481,6 +514,7 @@ export const NewRuleImplementation = ({
             dataset: datasetAttributes(_.prop("dataset")(ruleImplementation)),
             populations: populationsAttributes(populations),
             validations: conditionAttributes(validations),
+            segments,
             implementation_key: _.prop("implementationKey")(ruleImplementation),
             implementation_type:
               _.prop("implementationType")(ruleImplementation),
@@ -562,6 +596,8 @@ export const NewRuleImplementation = ({
                 addPopulation={addPopulation}
                 setPopulations={setPopulations}
                 setValidations={setValidations}
+                addSegments={addSegments}
+                setSegments={setSegments}
                 operators={operators}
                 setImplementationKey={setImplementationKey}
                 onChange={onChange}

package/src/components/RemediationPlan.js

@@ -4,17 +4,14 @@ import PropTypes from "prop-types";
 import { connect } from "react-redux";
 import { useIntl } from "react-intl";
 import { useParams } from "react-router-dom";
-import { Button, Header, Icon, Grid, Segment } from "semantic-ui-react";
+import { Button, Grid, Container } from "semantic-ui-react";
 import { FormattedMessage } from "react-intl";
 import { Loading } from "@truedat/core/components";
 import { ConfirmModal } from "@truedat/core/components";
-import {
-  fetchRemediation,
-  clearRemediation,
-  deleteRemediation,
-} from "../routines";
+import { deleteRemediation } from "../routines";
 import NewRemediation from "./NewRemediation";
 import RemediationForm from "./RemediationForm";
+
 import "../styles/remediationPlan.less";
 
 const DynamicFormViewer = React.lazy(() =>
@@ -23,10 +20,7 @@ const DynamicFormViewer = React.lazy(() =>
 
 export const RemediationPlan = ({
   isLoading,
-  className,
   deleteRemediation,
-  fetchRemediation,
-  clearRemediation,
   remediation,
   templates,
   latestResultId,
@@ -44,17 +38,6 @@ export const RemediationPlan = ({
     setRuleResultId(paramsRuleResultId || latestResultId);
   }, [paramsRuleResultId, latestResultId]);
 
-  useEffect(() => {
-    ruleResultId && fetchRemediation({ rule_result_id: ruleResultId });
-  }, [fetchRemediation, ruleResultId]);
-
-  useEffect(
-    () => () => {
-      clearRemediation();
-    },
-    [clearRemediation]
-  );
-
   const onSave = () => {
     setIsEdit(false);
   };
@@ -70,67 +53,58 @@ export const RemediationPlan = ({
     <>
       {!_.isEmpty(remediation) ? (
         <>
-          <Header as="h2">
-            <Icon circular name="rain" />
-            <Header.Content>
-              <FormattedMessage
-                id={!isEdit ? "remediation" : "remediation.actions.edit"}
+          {manageRemediations ? (
+            <div className="ui actions remediation">
+              <ConfirmModal
+                icon="trash"
+                trigger={<Button secondary icon="trash" basic color="red" />}
+                header={
+                  <FormattedMessage id="remediation.actions.delete.confirmation.header" />
+                }
+                content={
+                  <FormattedMessage
+                    id="remediation.actions.delete.confirmation.content"
+                    values={{ ruleResultId: <b>{ruleResultId}</b> }}
+                  />
+                }
+                onConfirm={() =>
+                  deleteRemediation({
+                    implementation_id: implementationId,
+                    rule_result_id: ruleResultId,
+                  })
+                }
+              />
+              <Button
+                className="button-edit-remediation"
+                primary
+                onClick={() => setIsEdit(!isEdit)}
+                content={formatMessage({
+                  id: !isEdit ? "actions.edit" : "actions.cancel",
+                })}
               />
-            </Header.Content>
-          </Header>
+            </div>
+          ) : null}
 
-          <Segment className={className}>
-            {manageRemediations ? (
-              <div className="ui actions remediation">
-                <ConfirmModal
-                  icon="trash"
-                  trigger={<Button secondary icon="trash" basic color="red" />}
-                  header={
-                    <FormattedMessage id="remediation.actions.delete.confirmation.header" />
-                  }
-                  content={
-                    <FormattedMessage
-                      id="remediation.actions.delete.confirmation.content"
-                      values={{ ruleResultId: <b>{ruleResultId}</b> }}
-                    />
-                  }
-                  onConfirm={() =>
-                    deleteRemediation({
-                      implementation_id: implementationId,
-                      rule_result_id: ruleResultId,
-                    })
-                  }
-                />
-                <Button
-                  className="button-edit-remediation"
-                  primary
-                  onClick={() => setIsEdit(!isEdit)}
-                  content={formatMessage({
-                    id: !isEdit ? "actions.edit" : "actions.cancel",
-                  })}
+          <Grid>
+            <Grid.Column width={8}>
+              {!isEdit && remediation?.df_name ? (
+                <DynamicFormViewer
+                  template={_.find(_.propEq("name", remediation.df_name))(
+                    templates
+                  )}
+                  content={remediation.df_content}
                 />
-              </div>
-            ) : null}
-
-            <Grid>
-              <Grid.Column width={8}>
-                {!isEdit && remediation?.df_name ? (
-                  <DynamicFormViewer
-                    template={_.find(_.propEq("name", remediation.df_name))(
-                      templates
-                    )}
-                    content={remediation.df_content}
-                  />
-                ) : (
+              ) : (
+                <Container className="new-remedation-container" fluid>
                   <RemediationForm
                     onSave={onSave}
                     remediation={remediation}
                     latestResultId={latestResultId}
                   />
-                )}
-              </Grid.Column>
-            </Grid>
-          </Segment>
+                </Container>
+              )}
+            </Grid.Column>
+          </Grid>
         </>
       ) : null}
     </>
@@ -139,10 +113,7 @@ export const RemediationPlan = ({
 
 RemediationPlan.propTypes = {
   isLoading: PropTypes.bool,
-  className: PropTypes.string,
   deleteRemediation: PropTypes.func,
-  clearRemediation: PropTypes.func,
-  fetchRemediation: PropTypes.func,
   remediation: PropTypes.object,
   templates: PropTypes.array,
   latestResultId: PropTypes.number,
@@ -164,6 +135,4 @@ const mapStateToProps = ({
 
 export default connect(mapStateToProps, {
   deleteRemediation,
-  fetchRemediation,
-  clearRemediation,
 })(RemediationPlan);

package/src/components/RuleImplementationProperties.js

@@ -12,7 +12,7 @@ const DynamicFormViewer = React.lazy(() =>
   import("@truedat/df/components/DynamicFormViewer")
 );
 
-const summarySteps = ["dataset", "populations", "validations"];
+const summarySteps = ["dataset", "populations", "validations", "segments"];
 
 export const RuleImplementationProperties = ({
   ruleImplementation,
@@ -75,6 +75,7 @@ const mapStateToProps = ({
   ruleImplementation: _.pick([
     ...summarySteps,
     "populations",
+    "segments",
     "executable",
     "event_type",
     "event_message",