@truedat/core 4.44.3 → 4.45.0

package/CHANGELOG.md

@@ -1,5 +1,18 @@
 # Changelog
 
+## [4.44.5] 2022-05-20
+
+### Changed
+
+- [TD-4230] `TemplateSelector` GraphQL fetchPolicy changed to
+  `cache-and-network` and changed hidden logic
+
+## [4.44.4] 2022-05-19
+
+### Added
+
+- [TD-4660] `lowerDeburrTrim` function, reference data routes and i18n messages
+
 ## [4.44.1] 2022-05-11
 
 ### Changed

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@truedat/core",
-  "version": "4.44.3",
+  "version": "4.45.0",
   "description": "Truedat Web Core",
   "sideEffects": false,
   "jsnext:main": "src/index.js",
@@ -17,23 +17,26 @@
   "scripts": {
     "clean": "rimraf yarn-error.log",
     "debug": "node --inspect-brk node_modules/.bin/jest --runInBand",
-    "test": "jest --coverage",
-    "test:watch": "jest --watch",
+    "test": "TZ=UTC jest --coverage",
+    "test:watch": "TZ=UTC jest --watch",
     "eslint": "eslint src/**",
     "eslint:fix": "eslint --fix src/**"
   },
   "devDependencies": {
-    "@babel/cli": "^7.14.8",
-    "@babel/core": "^7.15.0",
-    "@babel/plugin-proposal-class-properties": "^7.14.5",
-    "@babel/plugin-proposal-object-rest-spread": "^7.14.7",
-    "@babel/plugin-proposal-optional-chaining": "^7.14.5",
+    "@babel/cli": "^7.17.10",
+    "@babel/core": "^7.18.0",
+    "@babel/plugin-proposal-class-properties": "^7.17.12",
+    "@babel/plugin-proposal-object-rest-spread": "^7.18.0",
+    "@babel/plugin-proposal-optional-chaining": "^7.17.12",
     "@babel/plugin-syntax-dynamic-import": "^7.8.3",
-    "@babel/plugin-transform-modules-commonjs": "^7.15.0",
-    "@babel/preset-env": "^7.15.0",
-    "@babel/preset-react": "^7.14.5",
-    "@truedat/test": "4.44.3",
-    "babel-jest": "^27.0.6",
+    "@babel/plugin-transform-modules-commonjs": "^7.18.0",
+    "@babel/preset-env": "^7.18.0",
+    "@babel/preset-react": "^7.17.12",
+    "@testing-library/jest-dom": "^5.16.4",
+    "@testing-library/react": "^12.0.0",
+    "@testing-library/user-event": "^13.2.1",
+    "@truedat/test": "4.45.0",
+    "babel-jest": "^28.1.0",
     "babel-plugin-dynamic-import-node": "^2.3.3",
     "babel-plugin-lodash": "^3.3.4",
     "babel-plugin-react-intl": "^5.1.18",
@@ -41,7 +44,8 @@
     "enzyme": "^3.11.0",
     "enzyme-to-json": "^3.6.2",
     "identity-obj-proxy": "^3.0.0",
-    "jest": "^27.0.6",
+    "jest": "^28.1.0",
+    "jest-environment-jsdom": "^28.1.0",
     "jest-localstorage-mock": "^2.4.14",
     "react": "^16.14.0",
     "react-dom": "^16.14.0",
@@ -50,6 +54,8 @@
     "semantic-ui-react": "^2.0.3"
   },
   "jest": {
+    "maxWorkers": "50%",
+    "testTimeout": 10000,
     "moduleDirectories": [
       "<rootDir>/src",
       "../../node_modules"
@@ -82,16 +88,16 @@
     }
   },
   "dependencies": {
-    "@apollo/client": "^3.4.10",
+    "@apollo/client": "^3.6.4",
     "axios": "^0.19.2",
     "immutable": "^4.0.0-rc.12",
     "is-hotkey": "^0.1.6",
     "is-url": "^1.2.4",
-    "prop-types": "^15.7.2",
+    "prop-types": "^15.8.1",
     "react-csv": "^2.2.2",
     "react-dropzone": "^4.2.13",
     "react-intl": "^5.20.10",
-    "react-moment": "^0.9.7",
+    "react-moment": "^1.1.2",
     "react-redux": "^7.2.4",
     "react-router-dom": "^5.2.0",
     "redux": "^4.1.1",
@@ -106,5 +112,5 @@
     "react-dom": ">= 16.8.6 < 17",
     "semantic-ui-react": ">= 0.88.2 < 2.1"
   },
-  "gitHead": "d5e72d523389c6e66d6f7168d7e3546b5d2ffdda"
+  "gitHead": "b8a49c6bae0bbde203dfb4763a5657fc398e3b7a"
 }

package/src/api/queries.js

@@ -11,8 +11,8 @@ export const DOMAINS_QUERY = gql`
 `;
 
 export const TEMPLATES_QUERY = gql`
-  query Templates($scope: String!) {
-    templates(scope: $scope) {
+  query Templates($scope: String, $domainIds: [ID]) {
+    templates(scope: $scope, domainIds: $domainIds) {
       id
       name
       label

package/src/components/CatalogMenu.js

@@ -1,12 +1,12 @@
-import _ from "lodash/fp";
 import React from "react";
 import { useAuthorized } from "../hooks";
 import {
-  STRUCTURES_UPLOAD_EVENTS,
   PENDING_STRUCTURE_NOTES,
+  REFERENCE_DATASETS,
+  STRUCTURES,
+  STRUCTURES_UPLOAD_EVENTS,
   STRUCTURE_TAGS,
   STRUCTURE_TYPES,
-  STRUCTURES,
   SYSTEMS,
 } from "../routes";
 import Submenu from "./Submenu";
@@ -16,6 +16,7 @@ const items = [{ name: "structures", routes: [STRUCTURES, SYSTEMS] }];
 const adminItems = [
   { name: "structureTypes", routes: [STRUCTURE_TYPES] },
   { name: "structureTags", routes: [STRUCTURE_TAGS] },
+  { name: "referenceData", routes: [REFERENCE_DATASETS] },
 ];
 
 const structureNoteItems = [

package/src/components/TemplateSelector.js

@@ -27,7 +27,7 @@ export const TemplateSelector = ({
 }) => {
   const { formatMessage } = useIntl();
   const options = makeOptions(templates);
-  const hidden = _.size(templates) <= 1;
+  const hidden = loading ? false : _.size(templates) <= 1;
 
   const handleChange = (e, { value, ...data }) => {
     const template = _.find({ id: value })(templates);
@@ -50,7 +50,9 @@ export const TemplateSelector = ({
         name={name}
         onChange={handleChange}
         options={options}
-        placeholder={formatMessage({ id: "template.selector.placeholder" })}
+        placeholder={formatMessage({
+          id: loading ? "loading" : "template.selector.placeholder",
+        })}
         search
         selection
         value={_.toString(selectedValue)}
@@ -69,19 +71,27 @@ TemplateSelector.propTypes = {
   templates: PropTypes.array,
 };
 
-export const TemplateSelectorLoader = ({ scope, onLoad, ...props }) => {
+const emptyTemplates = [];
+export const TemplateSelectorLoader = ({
+  scope,
+  onLoad,
+  domainIds,
+  ...props
+}) => {
   const { loading, error, data } = useQuery(TEMPLATES_QUERY, {
-    variables: { scope },
+    fetchPolicy: "cache-and-network",
+    variables: { scope, domainIds },
     onCompleted: onLoad,
   });
   if (error) return null;
-  const templates = data?.templates || [];
+  const templates = data?.templates || emptyTemplates;
   return (
     <TemplateSelector loading={loading} templates={templates} {...props} />
   );
 };
 
 TemplateSelectorLoader.propTypes = {
+  domainIds: PropTypes.array,
   scope: PropTypes.string.isRequired,
   onLoad: PropTypes.func,
 };

package/src/components/__tests__/DateTime.spec.js

@@ -1,10 +1,12 @@
 import React from "react";
-import { shallow } from "enzyme";
+import { render } from "@truedat/test/render";
 import { DateTime } from "..";
 
 describe("<DateTime />", () => {
   it("matches the latest snapshot", () => {
-    const wrapper = shallow(<DateTime value="2018-06-27T07:32:53.154377Z" />);
-    expect(wrapper).toMatchSnapshot();
+    const { container } = render(
+      <DateTime value="2018-06-27T07:32:53.154377Z" />
+    );
+    expect(container).toMatchSnapshot();
   });
 });

package/src/components/__tests__/TemplateSelector.spec.js

@@ -1,51 +1,80 @@
-import React, { Suspense } from "react";
-import { waitFor } from "@testing-library/react";
+import React from "react";
+import { waitForElementToBeRemoved } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
 import { render } from "@truedat/test/render";
-import { TEMPLATES_QUERY } from "@truedat/core/api/queries";
+import {
+  errorTemplateMock,
+  multipleTemplatesMock,
+  singleTemplateMock,
+} from "@truedat/test/mocks";
 import TemplateSelector from "../TemplateSelector";
 
 const scope = "foo";
-const templates = [
-  {
-    id: "1",
-    name: "template1",
-    label: "template1",
-    content: [{ name: "g1", fields: [{ name: "field1", label: "field1" }] }],
-    scope,
-  },
-  {
-    id: "2",
-    name: "template2",
-    label: "template2",
-    content: {},
-    scope,
-  },
-];
-const templatesMock = {
-  request: { query: TEMPLATES_QUERY, variables: { scope } },
-  result: { data: { templates } },
-};
-
-const renderOpts = {
-  mocks: [templatesMock],
-};
+const domainIds = [1];
+const variables = { scope, domainIds };
 
 describe("<TemplateSelector />", () => {
   const onChange = jest.fn();
-  const onLoad = jest.fn();
-  const props = { onChange, onLoad, scope: "foo" };
+  const props = { onChange, domainIds, scope };
+
+  it("matches the latest snapshot (loading)", () => {
+    const renderOpts = { mocks: [multipleTemplatesMock(variables)] };
+    const { container, queryByText } = render(
+      <TemplateSelector {...props} />,
+      renderOpts
+    );
+    expect(queryByText(/loading/i)).toBeInTheDocument();
+    expect(container).toMatchSnapshot();
+  });
 
   it("matches the latest snapshot", async () => {
+    const renderOpts = { mocks: [multipleTemplatesMock(variables)] };
+    const onLoad = jest.fn();
     const { container, queryByText } = render(
-      <Suspense fallback="loading...">
-        <TemplateSelector {...props} />
-      </Suspense>,
+      <TemplateSelector {...props} onLoad={onLoad} />,
       renderOpts
     );
-    await waitFor(() => {
-      expect(queryByText(/template1/i)).toBeInTheDocument();
-    });
+    await waitForElementToBeRemoved(() => queryByText(/loading/i));
+    expect(queryByText("template1")).toBeInTheDocument();
     expect(container).toMatchSnapshot();
     expect(onLoad.mock.calls.length).toBe(1);
   });
+
+  it("matches the latest snapshot when required", async () => {
+    const renderOpts = { mocks: [multipleTemplatesMock(variables)] };
+    const { container, queryByText } = render(
+      <TemplateSelector {...props} required />,
+      renderOpts
+    );
+    await waitForElementToBeRemoved(() => queryByText(/loading/i));
+    expect(queryByText("template1")).toBeInTheDocument();
+    expect(container).toMatchSnapshot();
+  });
+
+  it("is empty if templates query returns an error", async () => {
+    const renderOpts = { mocks: [errorTemplateMock(variables)] };
+    const { queryByText } = render(
+      <TemplateSelector {...props} required />,
+      renderOpts
+    );
+    await waitForElementToBeRemoved(() => queryByText(/loading/i));
+    expect(queryByText("template1")).not.toBeInTheDocument();
+  });
+
+  it("calls onChange when template is selected", async () => {
+    const renderOpts = { mocks: [multipleTemplatesMock(variables)] };
+    const { findByRole } = render(<TemplateSelector {...props} />, renderOpts);
+
+    userEvent.click(await findByRole("option", { name: "template1" }));
+    expect(onChange.mock.calls[0][1]).toMatchObject({
+      template: { id: "1", label: "template1" },
+    });
+  });
+
+  it("is empty when query returns a single template", async () => {
+    const renderOpts = { mocks: [singleTemplateMock(variables)] };
+    const { queryByText } = render(<TemplateSelector {...props} />, renderOpts);
+    await waitForElementToBeRemoved(() => queryByText(/loading/i));
+    expect(queryByText("template1")).not.toBeInTheDocument();
+  });
 });

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

@@ -68,6 +68,19 @@ exports[`<CatalogMenu /> matches the latest snapshot 1`] = `
             structureTags
           </span>
         </a>
+        <a
+          aria-checked="false"
+          class="item"
+          href="/referenceDatasets"
+          name="referenceData"
+          role="option"
+        >
+          <span
+            class="text"
+          >
+            referenceData
+          </span>
+        </a>
         <a
           aria-checked="false"
           class="item"

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

@@ -1,23 +1,11 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`<DateTime /> matches the latest snapshot 1`] = `
-<t
-  ago={false}
-  calendar={false}
-  date="2018-06-27T07:32:53.154377Z"
-  decimal={false}
-  element={null}
-  filter={[Function]}
-  format="YYYY-MM-DD HH:mm"
-  fromNow={false}
-  interval={60000}
-  local={false}
-  onChange={[Function]}
-  titleFormat=""
-  toNow={false}
-  unit={null}
-  unix={false}
-  utc={false}
-  withTitle={false}
-/>
+<div>
+  <time
+    datetime="1530084773154"
+  >
+    2018-06-27 07:32
+  </time>
+</div>
 `;

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

@@ -1,5 +1,59 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
+exports[`<TemplateSelector /> matches the latest snapshot (loading) 1`] = `
+<div>
+  <div
+    class="field"
+  >
+    <label>
+      Template
+    </label>
+    <div
+      class="field"
+    >
+      <div
+        aria-busy="true"
+        aria-expanded="false"
+        class="ui loading search selection dropdown"
+        name="template"
+        role="combobox"
+      >
+        <input
+          aria-autocomplete="list"
+          autocomplete="off"
+          class="search"
+          tabindex="0"
+          type="text"
+          value=""
+        />
+        <div
+          aria-atomic="true"
+          aria-live="polite"
+          class="divider default text"
+          role="alert"
+        >
+          loading...
+        </div>
+        <i
+          aria-hidden="true"
+          class="dropdown icon"
+        />
+        <div
+          class="menu transition"
+          role="listbox"
+        >
+          <div
+            class="message"
+          >
+            No results found.
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+`;
+
 exports[`<TemplateSelector /> matches the latest snapshot 1`] = `
 <div>
   <div
@@ -74,3 +128,83 @@ exports[`<TemplateSelector /> matches the latest snapshot 1`] = `
   </div>
 </div>
 `;
+
+exports[`<TemplateSelector /> matches the latest snapshot when required 1`] = `
+<div>
+  <div
+    class="required field"
+  >
+    <label>
+      Template
+      <div
+        class="ui left pointing label"
+      >
+        Empty required field
+      </div>
+    </label>
+    <div
+      class="field"
+    >
+      <div
+        aria-busy="false"
+        aria-expanded="false"
+        class="ui search selection dropdown"
+        name="template"
+        role="combobox"
+      >
+        <input
+          aria-autocomplete="list"
+          autocomplete="off"
+          class="search"
+          tabindex="0"
+          type="text"
+          value=""
+        />
+        <div
+          aria-atomic="true"
+          aria-live="polite"
+          class="divider default text"
+          role="alert"
+        >
+          Select a template...
+        </div>
+        <i
+          aria-hidden="true"
+          class="dropdown icon"
+        />
+        <div
+          class="menu transition"
+          role="listbox"
+        >
+          <div
+            aria-checked="false"
+            aria-selected="true"
+            class="selected item"
+            role="option"
+            style="pointer-events: all;"
+          >
+            <span
+              class="text"
+            >
+              template1
+            </span>
+          </div>
+          <div
+            aria-checked="false"
+            aria-selected="false"
+            class="item"
+            role="option"
+            style="pointer-events: all;"
+          >
+            <span
+              class="text"
+            >
+              template2
+            </span>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+`;

package/src/messages/en.js

@@ -4,6 +4,7 @@ export default {
   "actions.confirm": "Are you sure?",
   "actions.create": "Create",
   "actions.delete": "Delete",
+  "actions.download": "Download",
   "actions.edit": "Edit",
   "actions.next": "Next",
   "actions.prev": "Previous",
@@ -44,6 +45,7 @@ export default {
   filters: "Filters",
   "filters.class.raw.field": "Field",
   "filters.reset": "(reset all filters)",
+  loading: "loading...",
   "form.validation.required": "{prop} is required",
   "form.validation.minLength": "{prop} must have at least {value} characters",
   "form.validation.email.invalid": "Invalid email address",
@@ -91,6 +93,7 @@ export default {
   "sidemenu.pending_structure_notes": "Pending notes",
   "sidemenu.quality_dashboard": "Quality Dashboard",
   "sidemenu.quality": "Data Quality",
+  "sidemenu.referenceData": "Reference Data",
   "sidemenu.roles": "Roles",
   "sidemenu.rules": "Quality Rules",
   "sidemenu.search": "Search",

package/src/messages/es.js

@@ -4,6 +4,7 @@ export default {
   "actions.confirm": "¿Estás seguro?",
   "actions.create": "Crear",
   "actions.delete": "Eliminar",
+  "actions.download": "Descargar",
   "actions.edit": "Editar",
   "actions.next": "Siguiente",
   "actions.prev": "Anterior",
@@ -48,6 +49,7 @@ export default {
   "form.validation.required": "{prop} es un campo requerido",
   "form.validation.minLength": "{prop} debe tener al menos {value} elementos",
   "form.validation.email.invalid": "Dirección de email inválida",
+  loading: "cargando...",
   "navigation.dashboard": "Dashboard",
   "navigation.menu": "Menú",
   "search.applied_filters": "Filtros aplicados:",
@@ -94,6 +96,7 @@ export default {
   "sidemenu.pending_structure_notes": "Notas pendientes",
   "sidemenu.quality_dashboard": "Dashboard de Calidad",
   "sidemenu.quality": "Calidad",
+  "sidemenu.referenceData": "Datos de referencia",
   "sidemenu.roles": "Roles",
   "sidemenu.rules": "Reglas",
   "sidemenu.search": "Búsqueda",

package/src/routes.js

@@ -109,6 +109,10 @@ export const PROFILE_EXECUTION =
   "/profileGroups/:group_id/profileExecutions/:id";
 export const PROFILE_GROUP = "/profileGroups/:id";
 export const QUALITY_DASHBOARD = "/quality_dashboard";
+export const REFERENCE_DATASETS = "/referenceDatasets";
+export const REFERENCE_DATASET_EDIT = "/referenceDatasets/:id/edit";
+export const REFERENCE_DATASET_NEW = "/referenceDatasets/new";
+export const REFERENCE_DATASET = "/referenceDatasets/:id";
 export const REMEDIATION_EDIT =
   "/rules/:id/implementations/:implementation_id/results/:rule_result_id/remediation/edit";
 export const REMEDIATION_NEW =
@@ -229,19 +233,23 @@ const routes = {
   GROUPS,
   GROUP_CREATE,
   GROUP_EDIT,
-  IMPLEMENTATIONS,
-  IMPLEMENTATION_NEW,
-  IMPLEMENTATION_NEW_RAW,
   IMPLEMENTATION,
+  IMPLEMENTATIONS,
+  IMPLEMENTATION_CLONE,
+  IMPLEMENTATION_CONCEPT_LINKS,
+  IMPLEMENTATION_CONCEPT_LINKS_NEW,
   IMPLEMENTATION_EDIT,
   IMPLEMENTATION_EVENTS,
-  IMPLEMENTATION_CLONE,
   IMPLEMENTATION_MOVE,
-  IMPLEMENTATION_RESULT_DETAILS,
-  IMPLEMENTATION_RESULT_SEGMENTS_RESULTS,
-  IMPLEMENTATION_RESULT_REMEDIATION_PLAN,
+  IMPLEMENTATION_NEW,
+  IMPLEMENTATION_NEW_RAW,
   IMPLEMENTATION_RESULTS,
   IMPLEMENTATION_RESULTS_DETAILS,
+  IMPLEMENTATION_RESULT_DETAILS,
+  IMPLEMENTATION_RESULT_REMEDIATION_PLAN,
+  IMPLEMENTATION_RESULT_SEGMENTS_RESULTS,
+  IMPLEMENTATION_STRUCTURES,
+  IMPLEMENTATION_STRUCTURES_NEW,
   INGEST,
   INGESTS,
   INGESTS_NEW,
@@ -266,6 +274,10 @@ const routes = {
   PROFILE_EXECUTION,
   PROFILE_GROUP,
   QUALITY_DASHBOARD,
+  REFERENCE_DATASET,
+  REFERENCE_DATASETS,
+  REFERENCE_DATASET_EDIT,
+  REFERENCE_DATASET_NEW,
   REMEDIATION_EDIT,
   REMEDIATION_NEW,
   REMEDIATION_PLAN,
@@ -276,13 +288,9 @@ const routes = {
   RULES,
   RULE_EDIT,
   RULE_EVENTS,
-  IMPLEMENTATION_CONCEPT_LINKS,
-  IMPLEMENTATION_CONCEPT_LINKS_NEW,
-  IMPLEMENTATION_STRUCTURES,
-  IMPLEMENTATION_STRUCTURES_NEW,
+  RULE_IMPLEMENTATIONS,
   RULE_IMPLEMENTATION_NEW,
   RULE_IMPLEMENTATION_NEW_RAW,
-  RULE_IMPLEMENTATIONS,
   RULE_NEW,
   SAMPLE,
   SEARCH,
@@ -300,6 +308,7 @@ const routes = {
   STRUCTURE,
   STRUCTURES,
   STRUCTURES_BULK_UPDATE,
+  STRUCTURES_UPLOAD_EVENTS,
   STRUCTURE_CHILDREN,
   STRUCTURE_EVENTS,
   STRUCTURE_GRANTS,
@@ -321,12 +330,6 @@ const routes = {
   STRUCTURE_VERSION,
   STRUCTURE_VERSIONS,
   STRUCTURE_VERSION_VERSIONS,
-  STRUCTURE,
-  STRUCTURES_BULK_UPDATE,
-  STRUCTURES,
-  STRUCTURES_UPLOAD_EVENTS,
-  SUBSCRIPTION_EDIT,
-  SUBSCRIPTION_NEW,
   SUBSCRIPTION,
   SUBSCRIPTIONS,
   SUBSCRIPTION_EDIT,

package/src/services/file.js

@@ -0,0 +1,9 @@
+export const toBase64 = (file) =>
+  new Promise((resolve, reject) => {
+    const reader = new FileReader();
+    reader.readAsDataURL(file);
+    // eslint-disable-next-line fp/no-mutation
+    reader.onload = () => resolve(reader.result);
+    // eslint-disable-next-line fp/no-mutation
+    reader.onerror = (error) => reject(error);
+  });

package/src/services/sort.js

@@ -2,6 +2,8 @@ import _ from "lodash/fp";
 
 export const lowerDeburr = _.flow(_.toLower, _.deburr);
 
+export const lowerDeburrTrim = _.flow(_.toLower, _.deburr, _.trim);
+
 export const lowerDeburrPath = (path) =>
   _.flow(_.path(path), _.toLower, _.deburr);