@truedat/dd 6.16.4 → 7.0.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@truedat/dd",
-  "version": "6.16.4",
+  "version": "7.0.1",
   "description": "Truedat Web Data Dictionary",
   "sideEffects": false,
   "jsnext:main": "src/index.js",
@@ -34,7 +34,7 @@
     "@testing-library/jest-dom": "^5.16.5",
     "@testing-library/react": "^12.0.0",
     "@testing-library/user-event": "^13.2.1",
-    "@truedat/test": "6.15.2",
+    "@truedat/test": "7.0.1",
     "babel-jest": "^28.1.0",
     "babel-plugin-dynamic-import-node": "^2.3.3",
     "babel-plugin-lodash": "^3.3.4",
@@ -88,9 +88,9 @@
   },
   "dependencies": {
     "@apollo/client": "^3.7.1",
-    "@truedat/auth": "6.15.2",
-    "@truedat/core": "6.15.2",
-    "@truedat/df": "6.15.2",
+    "@truedat/auth": "7.0.1",
+    "@truedat/core": "7.0.1",
+    "@truedat/df": "7.0.1",
     "lodash": "^4.17.21",
     "moment": "^2.29.4",
     "path-to-regexp": "^1.7.0",
@@ -115,5 +115,5 @@
     "react-dom": ">= 16.8.6 < 17",
     "semantic-ui-react": ">= 2.0.3 < 2.2"
   },
-  "gitHead": "ecf57a30185b9e353b6e2692702b5599e4425edb"
+  "gitHead": "fff3313b142abb69e4d4139e0b6fd85d1af1a898"
 }

package/src/components/CatalogViewConfigs.js

@@ -1,8 +1,9 @@
-import PropTypes from "prop-types";
+import _ from "lodash/fp";
 import React from "react";
+import PropTypes from "prop-types";
 import { useIntl, FormattedMessage } from "react-intl";
 import { columnDecoratorComponent } from "@truedat/core/services";
-import { Link, useHistory } from "react-router-dom";
+import { Link } from "react-router-dom";
 import { BUCKET_VIEW_CONFIG_NEW, linkTo } from "@truedat/core/routes";
 import { useQuery } from "@apollo/client";
 import { Button, Segment, Table } from "semantic-ui-react";
@@ -11,17 +12,30 @@ import { connect } from "react-redux";
 import { CATALOG_VIEW_CONFIGS_QUERY } from "../api/queries";
 import { deleteCatalogViewConfig as deleteCatalogViewConfigRoutine } from "../routines";
 
+const ConfigLink = (config) =>
+  config?.id ? (
+    <Link
+      to={linkTo.BUCKET_VIEW_CONFIG_EDIT({ id: config.id })}
+      title={config?.fieldType}
+    >
+      {config?.fieldType}
+    </Link>
+  ) : null;
+
 export const CatalogViewConfigs = ({
   deleteCatalogViewConfig,
   configs,
   loading,
 }) => {
   const { formatMessage } = useIntl();
-  const history = useHistory();
 
   const columns = [
-    { name: "Field type", fieldSelector: "fieldType" },
-    { name: "Field name", fieldSelector: "fieldName" },
+    {
+      name: "fieldType",
+      fieldDecorator: ConfigLink,
+      fieldSelector: _.identity,
+    },
+    { name: "fieldName", fieldSelector: "fieldName" },
   ];
 
   return loading ? null : (
@@ -37,65 +51,56 @@ export const CatalogViewConfigs = ({
       <Table>
         <Table.Header>
           <Table.Row>
-            {columns.map((column, i) => {
-              return (
-                <Table.HeaderCell
-                  key={i}
-                  width={column.width}
-                  content={formatMessage({
-                    id: `bucketViewConfig.${column.fieldSelector}`,
-                  })}
-                />
-              );
-            })}
+            {columns.map((column, i) => (
+              <Table.HeaderCell
+                key={i}
+                width={column.width}
+                content={formatMessage({
+                  id: `bucketViewConfig.${column.header || column.name}`,
+                })}
+              />
+            ))}
             <Table.HeaderCell textAlign="center">
               <FormattedMessage id="actions.delete" />
             </Table.HeaderCell>
           </Table.Row>
         </Table.Header>
         <Table.Body>
-          {configs.map((config, rowNumber) => {
-            return (
-              <Table.Row style={{ cursor: "pointer" }} key={rowNumber}>
-                {columns.map((column, columnNumber) => (
-                  <Table.Cell
-                    key={`${rowNumber}_${columnNumber}`}
-                    content={columnDecoratorComponent(column)(config)}
-                    onClick={() =>
-                      history.push(
-                        linkTo.BUCKET_VIEW_CONFIG_EDIT({ id: config.id })
-                      )
-                    }
-                  />
-                ))}
+          {configs.map((config, rowNumber) => (
+            <Table.Row key={rowNumber}>
+              {columns.map((column, columnNumber) => (
                 <Table.Cell
-                  style={{ cursor: "default" }}
-                  collapsing
-                  width="1"
-                  textAlign="center"
-                >
-                  <ConfirmModal
-                    icon="trash"
-                    trigger={
-                      <Button
-                        aria-label="delete"
-                        basic
-                        icon="trash"
-                        color="red"
-                      />
-                    }
-                    header={
-                      <FormattedMessage id="relations.actions.data_field.delete.confirmation.header" />
-                    }
-                    content={
-                      <FormattedMessage id="relations.actions.data_field.delete.confirmation.content" />
-                    }
-                    onConfirm={() => deleteCatalogViewConfig({ id: config.id })}
-                  />
-                </Table.Cell>
-              </Table.Row>
-            );
-          })}
+                  key={`${rowNumber}_${columnNumber}`}
+                  content={columnDecoratorComponent(column)(config)}
+                />
+              ))}
+              <Table.Cell
+                style={{ cursor: "default" }}
+                collapsing
+                width="1"
+                textAlign="center"
+              >
+                <ConfirmModal
+                  icon="trash"
+                  trigger={
+                    <Button
+                      aria-label="delete"
+                      basic
+                      icon="trash"
+                      color="red"
+                    />
+                  }
+                  header={
+                    <FormattedMessage id="relations.actions.data_field.delete.confirmation.header" />
+                  }
+                  content={
+                    <FormattedMessage id="relations.actions.data_field.delete.confirmation.content" />
+                  }
+                  onConfirm={() => deleteCatalogViewConfig({ id: config.id })}
+                />
+              </Table.Cell>
+            </Table.Row>
+          ))}
         </Table.Body>
       </Table>
     </Segment>

package/src/components/GrantApprovalRules.js

@@ -10,17 +10,27 @@ import {
   Segment,
   Table,
 } from "semantic-ui-react";
-import { Link, useHistory } from "react-router-dom";
+import { Link } from "react-router-dom";
 import { GRANT_APPROVAL_RULE_NEW, linkTo } from "@truedat/core/routes";
 import { columnDecoratorComponent } from "@truedat/core/services";
 import { GRANT_APPROVAL_RULES_QUERY } from "../api/queries";
 
+const ApprovalRuleLink = (rule) =>
+  rule?.id ? (
+    <Link to={linkTo.GRANT_APPROVAL_RULE(rule)} title={rule?.name}>
+      {rule?.name}
+    </Link>
+  ) : null;
+
 export default function GrantApprovalRules() {
   const { formatMessage } = useIntl();
-  const history = useHistory();
 
   const columns = [
-    { name: "name" },
+    {
+      name: "name",
+      fieldDecorator: ApprovalRuleLink,
+      fieldSelector: _.identity,
+    },
     { name: "action" },
     { name: "role" },
     {
@@ -63,7 +73,7 @@ export default function GrantApprovalRules() {
       </Segment>
 
       {!_.isEmpty(grantApprovalRules) && !loading ? (
-        <Table selectable>
+        <Table>
           <Table.Header>
             <Table.Row>
               {columns.map((column, i) => {
@@ -82,14 +92,7 @@ export default function GrantApprovalRules() {
           <Table.Body>
             {grantApprovalRules.map((grantApprovalRule, i) => {
               return (
-                <Table.Row
-                  key={i}
-                  onClick={() =>
-                    history.push(
-                      linkTo.GRANT_APPROVAL_RULE({ id: grantApprovalRule.id })
-                    )
-                  }
-                >
+                <Table.Row key={i}>
                   {columns.map((column, key) => (
                     <Table.Cell
                       key={key}

package/src/components/GrantsTable.js

@@ -2,10 +2,12 @@ import _ from "lodash/fp";
 import React, { useState } from "react";
 import PropTypes from "prop-types";
 import { useIntl } from "react-intl";
+import { useHistory } from "react-router-dom";
 import { Table, Header, Icon } from "semantic-ui-react";
 import { connect } from "react-redux";
 import { columnDecoratorComponent } from "@truedat/core/services";
 import { getSortInfo, sortColumn } from "@truedat/core/services/sort";
+import { linkTo } from "@truedat/core/routes";
 import { getGrantsTableColumns } from "../selectors";
 import { sortGrants } from "../routines";
 
@@ -17,6 +19,7 @@ export const GrantsTable = ({
   grantsSorting,
 }) => {
   const { formatMessage } = useIntl();
+  const history = useHistory();
   const filteredColumns = _.filter((c) => _.any(_.prop(c.name))(grants))(
     columns
   );
@@ -68,7 +71,10 @@ export const GrantsTable = ({
           </Table.Header>
           <Table.Body>
             {grants.map((grant, i) => (
-              <Table.Row key={i}>
+              <Table.Row
+                key={i}
+                onClick={() => history.push(linkTo.GRANT(grant))}
+              >
                 {columns &&
                   columns.map((column, key) => (
                     <Table.Cell

package/src/components/PendingStructureNoteRow.js

@@ -2,31 +2,23 @@ import _ from "lodash/fp";
 import React from "react";
 import PropTypes from "prop-types";
 import { Table } from "semantic-ui-react";
-import { useHistory } from "react-router-dom";
 import { columnDecorator } from "@truedat/core/services";
-import { linkTo } from "@truedat/core/routes";
 
-const PendingStructureNoteRow = ({ structure, columns }) => {
-  const history = useHistory();
-  return _.isEmpty(columns) || _.isEmpty(structure) ? null : (
+const PendingStructureNoteRow = ({ structure, columns }) =>
+  _.isEmpty(columns) || _.isEmpty(structure) ? null : (
     <Table.Row key={structure.id}>
       {columns.map((column, i) => (
         <Table.Cell
           key={i}
           {...(i == 0 && {
-            title: columnDecorator(column)(structure),
             className: "structure-cell-overflow",
           })}
           textAlign={column.textAlign}
           content={columnDecorator(column)(structure)}
-          onClick={() =>
-            history.push(linkTo.STRUCTURE_NOTES({ id: structure.id }))
-          }
         />
       ))}
     </Table.Row>
   );
-};
 
 PendingStructureNoteRow.propTypes = {
   structure: PropTypes.object.isRequired,

package/src/components/PendingStructureNotesTable.js

@@ -21,7 +21,7 @@ const PendingStructureNotesTable = ({ columns }) => {
       </Header.Content>
     </Header>
   ) : (
-    <Table selectable sortable>
+    <Table sortable>
       <Table.Header>
         <Table.Row>
           {columns &&

package/src/components/StructureRow.js

@@ -20,7 +20,6 @@ export const StructureRow = ({
         <Table.Cell
           key={i}
           {...(i == 0 && {
-            title: columnDecorator(column)(structure),
             className: "structure-cell-overflow",
           })}
           textAlign={column.textAlign}

package/src/components/StructureSelector.js

@@ -15,12 +15,13 @@ import {
 } from "../hooks/useStructures";
 import StructuresSearchResults from "./StructuresSearchResults";
 
-export function StructureSelectorContent({
+function StructureSelectorContent({
   overwriteColumns,
   selectedStructure: structure,
   onSelect,
   links,
   placeToTop,
+  selectable = true,
 }) {
   const [selectedStructure, setSelectedStructure] = useState(null);
   const { searchData, loading } = useSearchContext();
@@ -48,6 +49,7 @@ export function StructureSelectorContent({
         selectedStructure={selectedStructure}
         links={links}
         placeToTop={placeToTop}
+        selectable={selectable}
       />
     </Segment>
   );
@@ -59,6 +61,7 @@ StructureSelectorContent.propTypes = {
   selectedStructure: PropTypes.object,
   links: PropTypes.array,
   placeToTop: PropTypes.bool,
+  selectable: PropTypes.bool,
 };
 
 export const StructureSelector = (props) => {
@@ -107,6 +110,7 @@ StructureSelector.propTypes = {
   overwriteColumns: PropTypes.array,
   links: PropTypes.array,
   placeToTop: PropTypes.bool,
+  selectable: PropTypes.bool,
 };
 
 const mapStateToProps = (state) => ({

package/src/components/StructuresGrantRequestView.js

@@ -95,7 +95,6 @@ export function StructuresGrantRequestViewContent() {
           structures={structures}
           loading={loading}
           grantable
-          onSelect={({ id }) => history.push(linkTo.STRUCTURE({ id }))}
         />
       </div>
     </div>

package/src/components/StructuresSearchResults.js

@@ -18,6 +18,7 @@ export const StructuresSearchResults = ({
   loading,
   links,
   placeToTop,
+  selectable,
 }) => (
   <Dimmer.Dimmable dimmed={loading} className="structure-table-overflow">
     <Dimmer active={loading} inverted>
@@ -35,6 +36,7 @@ export const StructuresSearchResults = ({
           onStructureSelected={onSelect}
           links={links}
           placeToTop={placeToTop}
+          selectable={selectable}
         />
         <StructuresPagination size={size} />
       </>
@@ -64,6 +66,7 @@ StructuresSearchResults.propTypes = {
   loading: PropTypes.bool,
   links: PropTypes.array,
   placeToTop: PropTypes.bool,
+  selectable: PropTypes.bool,
 };
 
 export default StructuresSearchResults;

package/src/components/StructuresTable.js

@@ -25,6 +25,7 @@ export const StructuresTable = ({
   size,
   links = [],
   placeToTop = true,
+  selectable = false,
 }) => {
   const {
     searchData,
@@ -87,8 +88,8 @@ export const StructuresTable = ({
     );
     return (
       <Table
-        selectable
         sortable
+        selectable={selectable}
         size={size}
         headerRow={headerRow}
         renderBodyRow={renderBodyRow}

package/src/components/StructuresView.js

@@ -2,10 +2,9 @@ import _ from "lodash/fp";
 import React from "react";
 import PropTypes from "prop-types";
 import { connect } from "react-redux";
-import { useHistory, useRouteMatch } from "react-router-dom";
+import { useRouteMatch } from "react-router-dom";
 import { Header, Icon, Segment, Divider } from "semantic-ui-react";
 import { FormattedMessage, useIntl } from "react-intl";
-import { linkTo } from "@truedat/core/routes";
 import { BUCKETS_VIEW } from "@truedat/core/routes";
 import SearchWidget from "@truedat/core/search/SearchWidget";
 import {
@@ -70,22 +69,18 @@ export const StructuresViewContent = ({ embedded, customView }) => {
         _.flow(_.values, _.some(_.negate(_.isEmpty)))(allActiveFilters);
   const hasFilterApplied =
     !_.isEmpty(query) || selectedFilters(allActiveFilters, toggleDateFilter);
-  const history = useHistory();
+
   return (
     <>
       {!customView ? (
         <>
           <StructuresOptions hasFilterApplied={hasFilterApplied} {...actions} />
-          <SearchWidget dateFilter />
+          <SearchWidget dateFilter searchField="last_change_at" />
         </>
       ) : null}
 
       {hasFilterApplied || embedded ? (
-        <StructuresSearchResults
-          structures={structures}
-          loading={loading}
-          onSelect={({ id }) => history.push(linkTo.STRUCTURE({ id }))}
-        />
+        <StructuresSearchResults structures={structures} loading={loading} />
       ) : customView ? (
         <CatalogCustomViewCards />
       ) : (

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

@@ -24,15 +24,6 @@ jest.mock("@truedat/core/hooks", () => ({
   useAuthorized: jest.fn(() => true),
 }));
 
-const mockHistoryPush = jest.fn();
-
-jest.mock("react-router-dom", () => ({
-  ...jest.requireActual("react-router-dom"),
-  useHistory: () => ({
-    push: mockHistoryPush,
-  }),
-}));
-
 describe("<CatalogViewConfigsLoader />", () => {
   it("loads all catalog view configs and shows them in a table", async () => {
     const { findByRole } = render(<CatalogViewConfigsLoader />, renderOpts);
@@ -43,8 +34,7 @@ describe("<CatalogViewConfigsLoader />", () => {
     const fieldName = within(row).getByText(/someFieldName/);
     expect(fieldType).toBeInTheDocument();
     expect(fieldName).toBeInTheDocument();
-    userEvent.click(fieldName);
-    expect(mockHistoryPush).toHaveBeenCalledWith("/bucketViewConfigs/123/edit");
+    expect(fieldType).toHaveAttribute("href", "/bucketViewConfigs/123/edit");
   });
 
   it("deletes a catalog view config", async () => {

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

@@ -1,21 +1,10 @@
 import React from "react";
 import { render } from "@truedat/test/render";
-import userEvent from "@testing-library/user-event";
 import { waitFor } from "@testing-library/react";
-import { linkTo } from "@truedat/core/routes";
 import GrantApprovalRules from "../GrantApprovalRules";
 import { GRANT_APPROVAL_RULES_QUERY } from "../../api/queries";
 import en from "../../messages/en";
 
-const mockHistory = {
-  push: jest.fn(),
-};
-
-jest.mock("react-router-dom", () => ({
-  ...jest.requireActual("react-router-dom"),
-  useHistory: () => mockHistory,
-}));
-
 const grantApprovalRules = {
   grantApprovalRules: [
     {
@@ -87,8 +76,8 @@ describe("<GrantApprovalRules />", () => {
     expect(container).toMatchSnapshot();
   });
 
-  it("navigates to ApprovalRule detail on click", async () => {
-    const { queryByText } = render(
+  it("renders ApprovalRule name as Link", async () => {
+    const { queryByText, getByText } = render(
       <GrantApprovalRules />,
       renderOpts(grantApprovalRules)
     );
@@ -97,9 +86,7 @@ describe("<GrantApprovalRules />", () => {
       expect(queryByText(/loading/i)).not.toBeInTheDocument()
     );
 
-    userEvent.click(queryByText(/rule_name/i));
-    expect(mockHistory.push).toHaveBeenCalledWith(
-      linkTo.GRANT_APPROVAL_RULE({ id: 123 })
-    );
+    const link = getByText("rule_name");
+    expect(link).toHaveAttribute("href", "/grantApproveRules/123");
   });
 });

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

@@ -100,10 +100,9 @@ describe("<GrantsTable />", () => {
       .find("TableHeaderCell");
 
     expect(tableHeaderCells.at(0).props().sorted).toEqual(null);
-    expect(tableHeaderCells.at(1).props().sorted).toEqual(null);
-    expect(tableHeaderCells.at(2).props().sorted).toEqual("ascending");
+    expect(tableHeaderCells.at(1).props().sorted).toEqual("ascending");
+    expect(tableHeaderCells.at(2).props().sorted).toEqual(null);
     expect(tableHeaderCells.at(3).props().sorted).toEqual(null);
-    expect(tableHeaderCells.at(4).props().sorted).toEqual(null);
   });
 
   it("handles sort when column header is clicked", () => {
@@ -114,7 +113,7 @@ describe("<GrantsTable />", () => {
       .find("TableRow")
       .dive()
       .find("TableHeaderCell")
-      .at(1)
+      .at(0)
       .simulate("click");
 
     expect(
@@ -123,7 +122,7 @@ describe("<GrantsTable />", () => {
         .find("TableRow")
         .dive()
         .find("TableHeaderCell")
-        .at(1)
+        .at(0)
         .props().sorted
     ).toEqual("ascending");
 
@@ -132,7 +131,7 @@ describe("<GrantsTable />", () => {
       .find("TableRow")
       .dive()
       .find("TableHeaderCell")
-      .at(1)
+      .at(0)
       .simulate("click");
     expect(
       wrapper
@@ -140,7 +139,7 @@ describe("<GrantsTable />", () => {
         .find("TableRow")
         .dive()
         .find("TableHeaderCell")
-        .at(1)
+        .at(0)
         .props().sorted
     ).toEqual("descending");
   });

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

@@ -18,7 +18,7 @@ const columns = getStructureNotesColumnsSelector({});
 const structure = {
   id: "7207",
   note: { status: "draft" },
-  name: "bar",
+  name: "bar_name",
   path: ["bar rute"],
   domains: [{ name: "bar domain" }, { name: "baz domain" }],
   system: { name: "bar system" },
@@ -63,7 +63,7 @@ describe("<PendingStructureNoteRow />", () => {
     expect(container).toMatchSnapshot();
   });
 
-  it("navigates to the job route when row is clicked", () => {
+  it("renders structure note name as link", () => {
     const props = { columns, structure };
     const { getByText } = render(
       <table>
@@ -73,9 +73,8 @@ describe("<PendingStructureNoteRow />", () => {
       </table>,
       renderOpts
     );
-    userEvent.click(getByText(/bar system/));
-    expect(mockHistory.push.mock.calls.length).toBe(1);
-    expect(mockHistory.push.mock.calls[0][0]).toBe("/structures/7207/notes");
+    const link = getByText("bar_name");
+    expect(link).toHaveAttribute("href", "/structures/7207/notes");
   });
 
   it("renders empty table if structure is empty", () => {

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

@@ -2,6 +2,7 @@ import React from "react";
 import { waitFor } from "@testing-library/react";
 import { render } from "@truedat/test/render";
 import SearchContext from "@truedat/core/search/SearchContext";
+import { getColumns } from "../../selectors/structureNotesColumnsSelector";
 import PendingStructureNotesTable from "../PendingStructureNotesTable";
 
 const structures = {
@@ -53,10 +54,7 @@ const renderOpts = {
 };
 
 describe("<PendingStructureNotesTable />", () => {
-  const columns = [
-    { name: "foo", sort: { name: "name.raw" } },
-    { name: "bar", sort: { name: "bar.raw" } },
-  ];
+  const columns = getColumns;
   const props = { columns };
 
   it("matches the latest snapshot", async () => {

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

@@ -6,8 +6,8 @@ import { StructureSelector } from "../StructureSelector";
 const data = {
   _actions: { bulkUpdate: {} },
   data: [
-    { id: 1, name: "1", updated_at: "2021-12-10T12:22:37.797978Z" },
-    { id: 2, name: "2", updated_at: "2021-12-10T12:22:37.797978Z" },
+    { id: 1, name: "1", last_change_at: "2021-12-10T12:22:37.797978Z" },
+    { id: 2, name: "2", last_change_at: "2021-12-10T12:22:37.797978Z" },
   ],
   headers: { "x-total-count": 2 },
 };
@@ -56,7 +56,7 @@ const messages = {
     "structures.loading.header": "Header",
     "structure.type.undefined.text": "text",
     "structure.relation.relation_type_name": "relation",
-    "structure.updated_at": "Updated at",
+    "structure.last_change_at": "Updated at",
     "structure.type": "type",
   },
 };