@truedat/lm 7.10.2 → 7.10.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@truedat/lm",
-  "version": "7.10.2",
+  "version": "7.10.4",
   "description": "Truedat Link Manager",
   "sideEffects": false,
   "module": "src/index.js",
@@ -48,7 +48,7 @@
     "@testing-library/jest-dom": "^6.6.3",
     "@testing-library/react": "^16.3.0",
     "@testing-library/user-event": "^14.6.1",
-    "@truedat/test": "7.10.2",
+    "@truedat/test": "7.10.4",
     "identity-obj-proxy": "^3.0.0",
     "jest": "^29.7.0",
     "redux-saga-test-plan": "^4.0.6"
@@ -82,5 +82,5 @@
     "semantic-ui-react": "^3.0.0-beta.2",
     "swr": "^2.3.3"
   },
-  "gitHead": "913c4f16345d35e38b0ed09c58d73b88955356f0"
+  "gitHead": "0dcedbfaed3964ee02a3d2c175e0f96e2fbc9316"
 }

package/src/components/ConceptSuggestionLinkForm.js

@@ -11,6 +11,7 @@ import { Button } from "semantic-ui-react";
 
 import { createRelation, clearSelectedRelationTags } from "../routines";
 import TagTypeDropdownSelector from "./TagTypeDropdownSelector";
+import RelationTagsLoader from "./RelationTagsLoader";
 
 const StructureSuggestions = React.lazy(
   () => import("@truedat/dd/components/StructureSuggestions")
@@ -55,6 +56,7 @@ export const ConceptSuggestionLinkForm = () => {
   return (
     <>
       <Divider hidden />
+      <RelationTagsLoader />
       {!_.isEmpty(tagOptions) && (
         <>
           <TagTypeDropdownSelector options={tagOptions} />

package/src/components/StructureLinks.js

@@ -15,6 +15,7 @@ export const StructureLinks = ({
   structure,
   structureLinks,
   canCreateLink,
+  canSuggestConceptLink,
 }) => {
   const structureLinkColumnsWithTags = [
     {
@@ -75,6 +76,18 @@ export const StructureLinks = ({
             to={linkTo.STRUCTURE_LINKS_NEW({ id })}
             content={<FormattedMessage id="links.actions.create" />}
           />
+          {canSuggestConceptLink && (
+            <Grid.Column width={16}>
+              <Button
+                floated="right"
+                icon="lightbulb outline"
+                secondary
+                as={Link}
+                to={linkTo.STRUCTURE_LINKS_CONCEPTS_SUGGEST({ id })}
+                content={<FormattedMessage id="links.actions.suggest" />}
+              />
+            </Grid.Column>
+          )}
         </Grid.Column>
       )}
       {!_.isEmpty(structureLinks) && (
@@ -94,6 +107,7 @@ StructureLinks.propTypes = {
   structure: PropTypes.object,
   canCreateLink: PropTypes.bool,
   structureLinks: PropTypes.array,
+  canSuggestConceptLink: PropTypes.bool,
 };
 
 const mapStateToProps = (state) => ({
@@ -102,6 +116,7 @@ const mapStateToProps = (state) => ({
     getStructureToConceptLinks(state)
   ),
   canCreateLink: _.has("create_link")(state.structureActions),
+  canSuggestConceptLink: _.has("suggest_concept_link")(state.structureActions),
 });
 
 export default connect(mapStateToProps)(StructureLinks);

package/src/components/StructureSuggestionLinkForm.js

@@ -0,0 +1,79 @@
+import _ from "lodash/fp";
+import React, { useState, useEffect } from "react";
+import { Divider } from "semantic-ui-react";
+import { useParams } from "react-router";
+import { useDispatch, useSelector } from "react-redux";
+import { useIntl } from "react-intl";
+import { makeTagOptionsSelector } from "@truedat/core/selectors";
+import { HistoryBackButton } from "@truedat/core/components";
+import { linkTo } from "@truedat/core/routes";
+import { Button } from "semantic-ui-react";
+
+import { linkConcept, clearSelectedRelationTags } from "../routines";
+import TagTypeDropdownSelector from "./TagTypeDropdownSelector";
+import RelationTagsLoader from "./RelationTagsLoader";
+
+const ConceptSuggestions = React.lazy(() => import("@truedat/bg/concepts/components/ConceptSuggestions"));
+
+const selectTagOptions = makeTagOptionsSelector("data_field");
+
+export const StructureSuggestionLinkForm = () => {
+    const { id: targetId } = useParams();
+    const selectedRelationTags = useSelector((state) => state?.selectedRelationTags);
+    const tagOptions = useSelector(selectTagOptions);
+    const conceptLinking = useSelector((state) => state?.conceptLinking)
+    const dispatch = useDispatch();
+    const [selectedConcept, setSelectedConcept] = useState(null);
+    const { formatMessage } = useIntl();
+
+    useEffect(() => {
+        return () => {
+            dispatch(clearSelectedRelationTags.trigger());
+        };
+    }, [clearSelectedRelationTags, dispatch]);
+
+    const handleSubmit = () => {
+        const link = {
+            redirectUrl: linkTo.STRUCTURE_LINKS({ id: targetId }),
+            source_id: selectedConcept?.business_concept_id,
+            source_type: "business_concept",
+            target_id: targetId,
+            target_type: "data_structure",
+            tag_ids: selectedRelationTags ? selectedRelationTags : [],
+            origin: "suggested",
+        };
+        dispatch(linkConcept.trigger(link));
+    };
+
+    const disabled = !(selectedConcept && selectedRelationTags);
+
+    return (
+        <>
+            <Divider hidden />
+            <RelationTagsLoader />
+            {!_.isEmpty(tagOptions) && (
+                <>
+                    <TagTypeDropdownSelector options={tagOptions} />
+                    <Divider hidden />
+                </>
+            )}
+            <ConceptSuggestions
+                handleConceptSelected={setSelectedConcept}
+                selectedConcept={selectedConcept}
+            />
+            <Divider hidden />
+            <Button.Group>
+                <Button
+                    primary
+                    loading={conceptLinking}
+                    content={formatMessage({ id: "actions.create" })}
+                    disabled={disabled}
+                    onClick={handleSubmit}
+                />
+                <HistoryBackButton content={formatMessage({ id: "actions.cancel" })} />
+            </Button.Group>
+        </>
+    );
+};
+
+export default StructureSuggestionLinkForm;

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

@@ -57,6 +57,11 @@ jest.mock("@truedat/core/routes", () => ({
   },
 }));
 
+jest.mock("../RelationTagsLoader", () =>
+  jest.fn(() => <div>RelationTagsLoader</div>)
+);
+
+
 describe("ConceptSuggestionLinkForm", () => {
   const mockDispatch = jest.fn();
 

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

@@ -0,0 +1,127 @@
+import { fireEvent, screen, waitFor } from "@testing-library/react";
+import { render } from "@truedat/test/render";
+import { StructureSuggestionLinkForm } from "../StructureSuggestionLinkForm";
+import { useDispatch } from "react-redux";
+import { useParams } from "react-router";
+import { linkConcept, clearSelectedRelationTags } from "../../routines";
+
+jest.mock("react-redux", () => ({
+    ...jest.requireActual("react-redux"),
+    useDispatch: jest.fn(),
+}));
+
+jest.mock("react-router", () => ({
+    ...jest.requireActual("react-router"),
+    useParams: jest.fn(),
+}));
+
+
+jest.mock("react-intl", () => ({
+    ...jest.requireActual("react-intl"),
+    useIntl: () => ({
+        formatMessage: ({ id }) => id,
+    }),
+}));
+
+
+// Mock components
+jest.mock("@truedat/bg/concepts/components/ConceptSuggestions", () =>
+    jest.fn((props) => {
+        return (
+            <div>
+                <div>MockConceptSuggestions</div>
+                <button
+                    onClick={() => props.handleConceptSelected({ business_concept_id: "concept123" })}
+                >
+                    Select Concept
+                </button>
+            </div>
+        );
+    })
+);
+
+jest.mock("../TagTypeDropdownSelector", () =>
+    jest.fn(() => <div>MockTagTypeDropdownSelector</div>)
+);
+
+jest.mock("../RelationTagsLoader", () =>
+    jest.fn(() => <div>RelationTagsLoader</div>)
+);
+
+jest.mock("@truedat/core/components", () => ({
+    HistoryBackButton: (props) => <button>{props.content}</button>,
+}));
+
+jest.mock("@truedat/core/routes", () => ({
+    linkTo: { STRUCTURE_LINKS: jest.fn(() => "/mocked/redirect/url"), },
+}));
+
+describe("StructureSuggestionLinkForm", () => {
+    const mockDispatch = jest.fn();
+    const selectedRelationTags = ["tag1"];
+    const relationTags = [{
+        id: "tag1",
+        value: {
+            type: "tag1",
+            label: "tag1",
+            target_type: "data_field",
+        },
+    }]
+    const conceptLinking = false;
+    const state = { selectedRelationTags, relationTags, conceptLinking };
+
+    beforeEach(() => {
+        jest.clearAllMocks();
+
+        useParams.mockReturnValue({ id: "s1" });
+        useDispatch.mockReturnValue(mockDispatch);
+
+        clearSelectedRelationTags.trigger = jest.fn(() => ({ type: "CLEAR_TAGS" }));
+        linkConcept.trigger = jest.fn((payload) => ({
+            type: "LINK_CONCEPT",
+            payload,
+        }));
+    });
+
+    it("renders concepet suggestions and tag dropdown", async () => {
+        render(<StructureSuggestionLinkForm />, { state });
+
+        await waitFor(() => {
+            expect(screen.getByText("MockConceptSuggestions")).toBeInTheDocument();
+            expect(screen.getByText("actions.create")).toBeDisabled();
+        });
+    });
+
+    it("dispatches linkConcept on submit", async () => {
+        render(<StructureSuggestionLinkForm />, { state });
+
+        fireEvent.click(screen.getByText("Select Concept"));
+
+        const createBtn = screen.getByText("actions.create");
+        expect(createBtn).not.toBeDisabled();
+
+        fireEvent.click(createBtn);
+
+        expect(linkConcept.trigger).toHaveBeenCalledWith({
+            redirectUrl: "/mocked/redirect/url",
+            source_id: "concept123",
+            source_type: "business_concept",
+            target_id: "s1",
+            target_type: "data_structure",
+            tag_ids: ["tag1"],
+            origin: "suggested",
+        });
+
+        expect(mockDispatch).toHaveBeenCalledWith(
+            expect.objectContaining({ type: "LINK_CONCEPT" })
+        );
+    });
+
+    it("dispatches clearSelectedRelationTags on unmount", () => {
+        const { unmount } = render(<StructureSuggestionLinkForm />, { state });
+        unmount();
+
+        expect(clearSelectedRelationTags.trigger).toHaveBeenCalled();
+        expect(mockDispatch).toHaveBeenCalledWith({ type: "CLEAR_TAGS" });
+    });
+});