@truedat/bg 7.4.1 → 7.4.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@truedat/bg",
-  "version": "7.4.1",
+  "version": "7.4.3",
   "description": "Truedat Web Business Glossary",
   "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": "7.4.1",
+    "@truedat/test": "7.4.3",
     "babel-jest": "^28.1.0",
     "babel-plugin-dynamic-import-node": "^2.3.3",
     "babel-plugin-lodash": "^3.3.4",
@@ -86,9 +86,9 @@
     ]
   },
   "dependencies": {
-    "@truedat/core": "7.4.1",
-    "@truedat/df": "7.4.1",
-    "@truedat/lm": "7.4.1",
+    "@truedat/core": "7.4.3",
+    "@truedat/df": "7.4.3",
+    "@truedat/lm": "7.4.3",
     "decode-uri-component": "^0.2.2",
     "file-saver": "^2.0.5",
     "moment": "^2.29.4",
@@ -111,5 +111,5 @@
     "react-dom": ">= 16.8.6 < 17",
     "semantic-ui-react": ">= 2.0.3 < 2.2"
   },
-  "gitHead": "3f0fb3cef1d8e517ab71b741d8e4617319960f58"
+  "gitHead": "f1e3c9384a5f250bda208b60615aa13c0581a4bc"
 }

package/src/concepts/components/Concept.js

@@ -4,6 +4,7 @@ import PropTypes from "prop-types";
 import { connect } from "react-redux";
 import { Route } from "react-router-dom";
 import { Grid, Segment } from "semantic-ui-react";
+import StructureGrantCart from "@truedat/dd/components/StructureGrantCart";
 import { Comments, CommentsLoader } from "@truedat/core/components";
 import { CONCEPT_VERSION } from "@truedat/core/routes";
 import { useIntl } from "react-intl";
@@ -19,6 +20,7 @@ import ConceptTabPane from "./ConceptTabPane";
 import ConceptSummary from "./ConceptSummary";
 import ConceptTaxonomy from "./ConceptTaxonomy";
 import SharedToDomains from "./SharedToDomains";
+import ConceptContextProvider, { useConceptContext } from "./ConceptContext";
 
 const EventsLoader = React.lazy(() =>
   import("@truedat/audit/components/EventsLoader")
@@ -35,6 +37,9 @@ const ConceptRulesLoader = React.lazy(() =>
 export const Concept = ({ id, concept }) => {
   const { locales } = useLanguage();
   const { locale } = useIntl();
+  const {
+    conceptContext: { grantView },
+  } = useConceptContext();
 
   const defaultLang = _.flow(
     _.find({ is_default: true }),
@@ -128,11 +133,17 @@ export const Concept = ({ id, concept }) => {
           />
         </Grid.Column>
         <Grid.Column width={4}>
-          <ConceptSummary />
-          <ConceptRelationsSummary />
-          <ConceptTaxonomy />
-          <SharedToDomains />
-          <ConceptCompleteness />
+          {grantView ? (
+            <StructureGrantCart allowEmptyCart />
+          ) : (
+            <>
+              <ConceptSummary />
+              <ConceptRelationsSummary />
+              <ConceptTaxonomy />
+              <SharedToDomains />
+              <ConceptCompleteness />
+            </>
+          )}
         </Grid.Column>
       </Grid>
     </>
@@ -144,9 +155,20 @@ Concept.propTypes = {
   concept: PropTypes.object,
 };
 
+const ConceptWrapper = ({ id, concept }) => (
+  <ConceptContextProvider>
+    <Concept id={id} concept={concept} />
+  </ConceptContextProvider>
+);
+
+ConceptWrapper.propTypes = {
+  id: PropTypes.number.isRequired,
+  concept: PropTypes.object,
+};
+
 const mapStateToProps = ({ concept }) => ({
   id: _.prop("business_concept_id")(concept),
   concept: concept,
 });
 
-export default connect(mapStateToProps)(Concept);
+export default connect(mapStateToProps)(ConceptWrapper);

package/src/concepts/components/ConceptArchive.js

@@ -29,7 +29,7 @@ export const ConceptArchive = ({ conceptArchive }) => (
                   />
                   <Table.HeaderCell
                     content={
-                      <FormattedMessage id="concepts.props.last_change_at" />
+                      <FormattedMessage id="concepts.props.updated_at" />
                     }
                   />
                 </Table.Row>
@@ -48,11 +48,11 @@ export const ConceptArchive = ({ conceptArchive }) => (
 );
 
 ConceptArchive.propTypes = {
-  conceptArchive: PropTypes.array
+  conceptArchive: PropTypes.array,
 };
 
 const mapStateToProps = ({ conceptArchive }) => ({
-  conceptArchive
+  conceptArchive,
 });
 
 export default connect(mapStateToProps)(ConceptArchive);

package/src/concepts/components/ConceptArchiveRow.js

@@ -11,7 +11,7 @@ export const ConceptArchiveRow = ({
   business_concept_id,
   id,
   status,
-  last_change_at,
+  updated_at,
   last_change_by,
   version,
 }) => {
@@ -32,7 +32,7 @@ export const ConceptArchiveRow = ({
       />
       <Table.Cell content={version} />
       <Table.Cell content={_.propOr("", "full_name")(last_change_by)} />
-      <Table.Cell content={<DateTime value={last_change_at} />} />
+      <Table.Cell content={<DateTime value={updated_at} />} />
     </Table.Row>
   );
 };
@@ -41,7 +41,7 @@ ConceptArchiveRow.propTypes = {
   business_concept_id: PropTypes.number,
   id: PropTypes.number,
   status: PropTypes.string,
-  last_change_at: PropTypes.string,
+  updated_at: PropTypes.string,
   last_change_by: PropTypes.string,
   version: PropTypes.number,
 };

package/src/concepts/components/ConceptContext.js

@@ -0,0 +1,37 @@
+import React, { createContext, useState, useContext } from "react";
+import PropTypes from "prop-types";
+
+export const ConceptContext = createContext("conceptContext");
+
+const initialContext = {
+  grantView: false,
+};
+
+export const ConceptContextProvider = ({ children }) => {
+  const [context, setContext] = useState(initialContext);
+
+  const setProperty = (value) =>
+    setContext({
+      ...context,
+      ...value,
+    });
+
+  return (
+    <ConceptContext.Provider
+      value={{
+        conceptContext: context,
+        setConceptContextProperty: setProperty,
+      }}
+    >
+      {children}
+    </ConceptContext.Provider>
+  );
+};
+
+ConceptContextProvider.propTypes = {
+  children: PropTypes.node,
+};
+
+export const useConceptContext = () => useContext(ConceptContext);
+
+export default ConceptContextProvider;

package/src/concepts/components/__tests__/Concept.spec.js

@@ -3,6 +3,31 @@ import { render } from "@truedat/test/render";
 import { waitFor } from "@testing-library/react";
 import { LangProviderWrapper } from "@truedat/core/i18n";
 import { Concept } from "../Concept";
+import ConceptContextProvider, { useConceptContext } from "../ConceptContext";
+
+jest.mock("../ConceptContext", () => {
+  const originalModule = jest.requireActual("../ConceptContext");
+
+  return {
+    __esModule: true,
+    ...originalModule,
+    useConceptContext: jest.fn(),
+  };
+});
+
+jest.mock("@truedat/core/hooks", () => {
+  const originalModule = jest.requireActual("@truedat/core/hooks");
+
+  return {
+    __esModule: true,
+    ...originalModule,
+    useOperators: () => ({
+      data: {},
+      error: false,
+      loading: false,
+    }),
+  };
+});
 
 beforeAll(() => {
   jest.useFakeTimers();
@@ -116,9 +141,33 @@ describe("<Concept />", () => {
   };
 
   it("matches the latest snapshot", async () => {
+    useConceptContext.mockReturnValue({
+      conceptContext: { grantView: false },
+    });
+    const { container, queryByText } = render(
+      <LangProviderWrapper langs={["es", "en"]}>
+        <ConceptContextProvider>
+          <Concept {...props} />
+        </ConceptContextProvider>
+      </LangProviderWrapper>,
+      renderOpts
+    );
+    await waitFor(() => {
+      expect(queryByText(/lazy/i)).not.toBeInTheDocument();
+      expect(container.querySelector(".loading")).not.toBeInTheDocument();
+    });
+    expect(container).toMatchSnapshot();
+  });
+
+  it("matches the latest snapshot with grantView activated", async () => {
+    useConceptContext.mockReturnValue({
+      conceptContext: { grantView: true },
+    });
     const { container, queryByText } = render(
       <LangProviderWrapper langs={["es", "en"]}>
-        <Concept {...props} />
+        <ConceptContextProvider>
+          <Concept {...props} />
+        </ConceptContextProvider>
       </LangProviderWrapper>,
       renderOpts
     );

package/src/concepts/components/__tests__/ConceptArchive.spec.js

@@ -8,10 +8,10 @@ describe("<ConceptArchive />", () => {
       {
         id: 123,
         status: "status",
-        last_change_at: "2018-06-27T07:32:53.154377Z",
+        updated_at: "2018-06-27T07:32:53.154377Z",
         last_change_by: "maixu",
-        version: 1
-      }
+        version: 1,
+      },
     ];
     const props = { conceptArchive };
     const wrapper = shallow(<ConceptArchive {...props} />);

package/src/concepts/components/__tests__/ConceptContext.spec.js

@@ -0,0 +1,47 @@
+import React, { useEffect } from "react";
+import { render } from "@truedat/test/render";
+import { renderHook, act } from "@testing-library/react-hooks";
+import ConceptContext, { useConceptContext } from "../ConceptContext";
+
+describe("<ConceptContext />", () => {
+  it("matches the latest snapshot", async () => {
+    const { container } = render(
+      <ConceptContext>
+        <div>Hello world</div>
+      </ConceptContext>
+    );
+    expect(container).toMatchSnapshot();
+  });
+
+  it("should update context with new values when setProperty is called", () => {
+    const { result } = renderHook(() => useConceptContext(), {
+      wrapper: ({ children }) => <ConceptContext>{children}</ConceptContext>,
+    });
+
+    act(() => {
+      result.current.setConceptContextProperty({ newKey: "newValue" });
+    });
+
+    expect(result.current.conceptContext).toEqual(
+      expect.objectContaining({ newKey: "newValue" })
+    );
+  });
+
+  it("should provide context values to child components", () => {
+    const TestComponent = () => {
+      const { conceptContext, setConceptContextProperty } = useConceptContext();
+      useEffect(() => {
+        setConceptContextProperty({ testKey: "testValue" });
+      }, []);
+      return <div>{conceptContext.testKey}</div>;
+    };
+
+    const { getByText } = render(
+      <ConceptContext>
+        <TestComponent />
+      </ConceptContext>
+    );
+
+    expect(getByText("testValue")).toBeInTheDocument();
+  });
+});

package/src/concepts/components/__tests__/__snapshots__/Concept.spec.js.snap

@@ -307,3 +307,184 @@ exports[`<Concept /> matches the latest snapshot 1`] = `
   </div>
 </div>
 `;
+
+exports[`<Concept /> matches the latest snapshot with grantView activated 1`] = `
+<div>
+  <div
+    class="ui breadcrumb"
+  >
+    <a
+      class="section"
+      href="/concepts"
+    >
+      Business Glossary
+    </a>
+    <i
+      aria-hidden="true"
+      class="right angle icon divider"
+    />
+    <a
+      class="section"
+      href="/concepts/pending"
+    >
+      Draft
+    </a>
+    <i
+      aria-hidden="true"
+      class="right angle icon divider"
+    />
+    <span
+      class="active section"
+      style="cursor: default;"
+    >
+      Concept_en
+    </span>
+  </div>
+  <div
+    class="ui equal width grid"
+    style="margin-top: 0px;"
+  >
+    <div
+      class="twelve wide column"
+    >
+      <div
+        class="ui segment"
+      >
+        <div
+          class="ui grid"
+        >
+          <div
+            class="row"
+          >
+            <div
+              class="eight wide column"
+            >
+              <h2
+                class="ui header"
+              >
+                <i
+                  aria-hidden="true"
+                  class="book circular icon"
+                />
+                <div
+                  class="content"
+                >
+                  Concept_es
+                  <div
+                    class="sub header"
+                  >
+                    templates.undefined
+                  </div>
+                </div>
+              </h2>
+            </div>
+            <div
+              class="right aligned eight wide column"
+            >
+              <button
+                class="ui basic icon button button icon group-actions"
+                data-tooltip="Sharing"
+              >
+                <i
+                  aria-hidden="true"
+                  class="share alternate icon"
+                />
+              </button>
+              <button
+                class="ui basic icon button button icon group-actions structureButton"
+              >
+                <i
+                  aria-hidden="true"
+                  class="eye icon"
+                />
+              </button>
+            </div>
+          </div>
+          <div
+            class="row"
+          >
+            <div
+              class="eight wide column"
+            >
+              <div
+                class="ui left floated buttons"
+              >
+                <button
+                  class="ui mini active button"
+                >
+                  Spanish
+                </button>
+                <button
+                  class="ui mini button"
+                >
+                  English
+                </button>
+              </div>
+            </div>
+            <div
+              class="right aligned eight wide column"
+            />
+          </div>
+        </div>
+        <div
+          class="ui pointing secondary top attached tabular menu"
+        >
+          <a
+            class="item"
+            href="/concepts/1/versions/1"
+          >
+            Concept
+          </a>
+          <a
+            class="item"
+            href="/concepts/1/versions/1/links/structures"
+          >
+            Linkage
+          </a>
+          <a
+            class="item"
+            href="/concepts/1/versions/1/rules"
+          >
+            Quality Rules
+          </a>
+          <a
+            class="item"
+            href="/concepts/1/versions/1/archive"
+          >
+            History
+          </a>
+          <a
+            class="item"
+            href="/concepts/1/versions/1/events"
+          >
+            Audit
+          </a>
+        </div>
+      </div>
+    </div>
+    <div
+      class="four wide column"
+    >
+      <div
+        class="ui segment structure-grant-cart"
+      >
+        <div
+          class="ui header"
+          title="structure.grant.cart"
+        >
+          structure.grant.cart
+        </div>
+        <div
+          class="ui divider"
+        />
+        <div
+          class="list"
+        />
+        <p>
+          structure.grant.cart.empty
+        </p>
+      </div>
+    </div>
+  </div>
+</div>
+`;

package/src/concepts/components/__tests__/__snapshots__/ConceptArchive.spec.js.snap

@@ -46,7 +46,7 @@ exports[`<ConceptArchive /> matches the latest snapshot 1`] = `
                 as="th"
                 content={
                   <Memo(MemoizedFormattedMessage)
-                    id="concepts.props.last_change_at"
+                    id="concepts.props.updated_at"
                   />
                 }
               />
@@ -58,9 +58,9 @@ exports[`<ConceptArchive /> matches the latest snapshot 1`] = `
             <ConceptArchiveRow
               id={123}
               key="0"
-              last_change_at="2018-06-27T07:32:53.154377Z"
               last_change_by="maixu"
               status="status"
+              updated_at="2018-06-27T07:32:53.154377Z"
               version={1}
             />
           </TableBody>

package/src/concepts/components/__tests__/__snapshots__/ConceptArchiveRow.spec.js.snap

@@ -24,13 +24,7 @@ exports[`<ConceptArchiveRow /> matches the latest snapshot 1`] = `
         </td>
         <td
           class=""
-        >
-          <time
-            datetime="1530084773154"
-          >
-            2018-06-27 07:32
-          </time>
-        </td>
+        />
       </tr>
     </tbody>
   </table>

package/src/concepts/components/__tests__/__snapshots__/ConceptContext.spec.js.snap

@@ -0,0 +1,9 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<ConceptContext /> matches the latest snapshot 1`] = `
+<div>
+  <div>
+    Hello world
+  </div>
+</div>
+`;

package/src/concepts/reducers/__tests__/conceptArchive.spec.js

@@ -21,15 +21,15 @@ describe("reducers: conceptArchive", () => {
       {
         id: 123,
         status: "status",
-        last_change_at: "2018-06-27T07:32:53.154377Z",
+        updated_at: "2018-06-27T07:32:53.154377Z",
         last_change_by: "maixu",
-        version: 1
-      }
+        version: 1,
+      },
     ];
     expect(
       conceptArchive(fooState, {
         type: fetchConceptArchive.SUCCESS,
-        payload: { data }
+        payload: { data },
       })
     ).toEqual(data);
   });

package/src/concepts/reducers/concept.js

@@ -32,6 +32,7 @@ const pickFields = _.pick([
   "rule_count",
   "concept_count",
   "i18n_content",
+  "actions",
 ]);
 
 export const concept = (state = initialState, { type, payload, meta }) => {

package/src/concepts/reducers/conceptArchive.js

@@ -6,10 +6,10 @@ const initialState = [];
 const pickFields = _.pick([
   "id",
   "business_concept_id",
-  "last_change_at",
+  "updated_at",
   "last_change_by",
   "status",
-  "version"
+  "version",
 ]);
 
 const conceptArchive = (state = initialState, { type, payload }) => {

package/src/concepts/relations/components/ConceptLinkActions.js

@@ -1,29 +1,55 @@
 import _ from "lodash/fp";
-import React from "react";
+import React, { useState } from "react";
+import { PropTypes } from "prop-types";
 import { connect } from "react-redux";
-import { Icon } from "semantic-ui-react";
+import { Button, Icon } from "semantic-ui-react";
 import { FormattedMessage } from "react-intl";
 import { ConfirmModal } from "@truedat/core/components";
 import { conceptLinkAction } from "../routines";
 
-export const DeleteLink = ({ conceptLinkAction, action, loading }) =>
-  loading ? (
+export const DeleteLink = ({ conceptLinkAction, action, loading }) => {
+  const [openModal, setOpenModal] = useState(false);
+
+  return loading ? (
     <Icon loading name="circle notch" color="red" />
   ) : (
-    <ConfirmModal
-      icon="trash"
-      trigger={<Icon name="trash alternate outline" color="red" />}
-      header={
-        <FormattedMessage id="relations.actions.data_field.delete.confirmation.header" />
-      }
-      content={
-        <FormattedMessage id="relations.actions.data_field.delete.confirmation.content" />
-      }
-      onConfirm={() => conceptLinkAction(action)}
-      onOpen={(e) => e.stopPropagation()}
-      onClose={(e) => e.stopPropagation()}
-    />
+    <>
+      <ConfirmModal
+        open={openModal}
+        trigger={
+          <Button
+            basic
+            color="red"
+            icon
+            onClick={() => setOpenModal(true)}
+            size="mini"
+          >
+            <Icon name="trash alternate outline" color="red" />
+          </Button>
+        }
+        header={
+          <FormattedMessage id="relations.actions.data_field.delete.confirmation.header" />
+        }
+        content={
+          <FormattedMessage id="relations.actions.data_field.delete.confirmation.content" />
+        }
+        onConfirm={() => conceptLinkAction(action)}
+        onOpen={() => {
+          setOpenModal(true);
+        }}
+        onClose={() => {
+          setOpenModal(false);
+        }}
+      />
+    </>
   );
+};
+
+DeleteLink.propTypes = {
+  conceptLinkAction: PropTypes.func,
+  action: PropTypes.object,
+  loading: PropTypes.bool,
+};
 
 const mapStateToProps = ({ conceptLinkActionLoading }, ownProps) => ({
   loading: _.pathEq("action.href")(conceptLinkActionLoading)(ownProps),
@@ -36,4 +62,8 @@ export const DeleteLinkConnected = connect(mapStateToProps, {
 export const LinkActions = ({ delete: deleteAction }) =>
   deleteAction ? <DeleteLinkConnected action={deleteAction} /> : null;
 
+LinkActions.propTypes = {
+  delete: PropTypes.object,
+};
+
 export default LinkActions;