@truedat/dd 6.0.1 → 6.0.3

package/src/components/StructureView.js

@@ -34,7 +34,7 @@ export const StructureView = ({
           <Grid.Row stretched>
             <Grid.Column width={4}>
               <Segment id="filter-nav-container">
-                <FilteredNav filter={navFilter} structure={structure} />
+                <FilteredNav navFilter={navFilter} structure={structure} />
               </Segment>
             </Grid.Column>
             <Grid.Column width={showGrantRequestCart ? 8 : 12}>

package/src/components/StructuresView.js

@@ -19,6 +19,9 @@ import CatalogCustomViewCards from "./CatalogCustomViewCards";
 
 const StructuresHeader = () => {
   const match = useRouteMatch(BUCKETS_VIEW);
+  const propertyPathMessage = !match?.params?.propertyPath
+    ? "structures.subheader"
+    : match?.params?.propertyPath;
 
   return (
     <Header as="h2">
@@ -33,11 +36,8 @@ const StructuresHeader = () => {
         />
         <Header.Subheader>
           <FormattedMessage
-            id={
-              !match?.params?.propertyPath
-                ? "structures.subheader"
-                : match?.params?.propertyPath
-            }
+            id={propertyPathMessage}
+            defaultMessage={propertyPathMessage}
           />
         </Header.Subheader>
       </Header.Content>

package/src/components/SystemStructures.js

@@ -21,7 +21,10 @@ export const SystemStructures = ({
   const { id: systemId } = useParams();
 
   useEffect(() => {
-    saveNavFilter({ system_id: systemId });
+    saveNavFilter({
+      view: "SYSTEM_STRUCTURES",
+      filter: { system_id: systemId },
+    });
   }, [systemId, saveNavFilter]);
 
   return (
@@ -35,7 +38,9 @@ export const SystemStructures = ({
         <Grid.Row stretched>
           <Grid.Column width={4}>
             <Segment>
-              {navFilter?.system_id ? <FilteredNav filter={navFilter} /> : null}
+              {navFilter?.filter?.system_id ? (
+                <FilteredNav navFilter={navFilter} />
+              ) : null}
             </Segment>
           </Grid.Column>
           <Grid.Column width={12}>

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

@@ -49,7 +49,8 @@ describe("<BucketView />", () => {
        * mock store from "@truedat/test/render"
        */
       expect(saveNavFilter).toHaveBeenCalledWith({
-        "metadata.region": "eu-west-1",
+        view: "BUCKET_VIEW",
+        filter: { "metadata.region": "eu-west-1" },
       })
     );
   });

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

@@ -1,112 +1,139 @@
 import React from "react";
 import userEvent from "@testing-library/user-event";
 import { render } from "@truedat/test/render";
+import { act } from "react-dom/test-utils";
+import en from "../../messages/en";
 
 import FilteredNavLoader, { FilteredNav } from "../FilteredNav";
 
 jest.mock("../../hooks/useBucketStructures", () => {
   const originalModule = jest.requireActual("../../hooks/useBucketStructures");
+  const _ = require("lodash/fp");
+  const { lowerDeburrTrim } = require("@truedat/core/services/sort");
 
   const data = [
     { id: 1, name: "bank_capital" },
     { id: 2, name: "consumorenovables" },
   ];
 
+  const elasticSearchMock = (collection, searchValue) => {
+    const normalizedSearchValue = lowerDeburrTrim(searchValue);
+    return _.filter((structure) =>
+      _.contains(normalizedSearchValue)(lowerDeburrTrim(structure.name))
+    )(collection);
+  };
+
+  return {
+    __esModule: true,
+    ...originalModule,
+    useBucketStructures: jest.fn(({ query }) => {
+      const elasticSearchResult = elasticSearchMock(data, query);
+      return {
+        data: {
+          data: { data: elasticSearchResult },
+          headers: { "x-total-count": elasticSearchResult.length },
+        },
+        error: false,
+        isLoading: false,
+      };
+    }),
+  };
+});
+
+jest.mock("../../hooks/useBucketPaths", () => {
+  const originalModule = jest.requireActual("../../hooks/useBucketPaths");
+
+  const data = {
+    forest: {},
+    filtered_children: {},
+  };
+
   return {
     __esModule: true,
     ...originalModule,
-    useBucketStructures: jest.fn(() => ({
-      data: { data: { data }, headers: { "x-total-count": 2 } },
+    useBucketPaths: jest.fn(() => ({
+      data: { data, headers: { "x-total-count": 2 } },
       error: false,
-      trigger: jest.fn(),
+      isLoading: false,
     })),
   };
 });
 
+const navFilter = { view: "SYSTEM_STRUCTURES", filter: {} };
+
 const renderOpts = {
   state: {
-    navFilter: {},
+    navFilter,
+  },
+  messages: {
+    en: {
+      ...en,
+      "structures.props.functional_name": "structures.props.functional_name",
+    },
   },
 };
 
 describe("<FilteredNav />", () => {
-  it("matches the latest snapshot", () => {
-    const childStructures = [
-      { id: 1, name: "bank_capital" },
-      { id: 2, name: "consumorenovables" },
-    ];
-    const parentStructures = [];
-    const props = { childStructures, parentStructures };
-
-    const { getByText } = render(<FilteredNav {...props} />, renderOpts);
+  it("FilterNavLoader loads from useBucketStructures and shows structures", () => {
+    const { getByText } = render(
+      <FilteredNavLoader navFilter={navFilter} />,
+      renderOpts
+    );
     expect(getByText("bank_capital")).toBeInTheDocument();
     expect(getByText("consumorenovables")).toBeInTheDocument();
   });
 
-  it("ChildStructures prop in StructureNav component  should rendered with one item when inputSearch value change", () => {
-    const childStructures = [
-      { id: 1, name: "bank_capital" },
-      { id: 2, name: "consumorenovables" },
-    ];
-    const parentStructures = [];
-    const props = { childStructures, parentStructures };
-
+  it("StructureSearch: one element matching", async () => {
     const { getByRole, getByText, queryByText } = render(
-      <FilteredNav {...props} />,
+      <FilteredNavLoader navFilter={navFilter} />,
       renderOpts
     );
     expect(getByText("bank_capital")).toBeInTheDocument();
     expect(getByText("consumorenovables")).toBeInTheDocument();
 
+    jest.useFakeTimers();
     const inputSearch = getByRole("textbox");
     userEvent.type(inputSearch, "bank");
+    act(() => jest.runAllTimers());
     expect(getByText("bank_capital")).toBeInTheDocument();
     expect(queryByText("consumorenovables")).not.toBeInTheDocument();
   });
 
-  it("ChildStructures prop in StructureNav component  should rendered without items when inputSearch value change", () => {
-    const childStructures = [
-      { id: 1, name: "bank_capital" },
-      { id: 2, name: "consumorenovables" },
-    ];
-    const parentStructures = [];
-    const props = { childStructures, parentStructures };
-
+  it("StructureSearch: no elements matching", () => {
     const { getByRole, getByText, queryByText } = render(
-      <FilteredNav {...props} />,
+      <FilteredNavLoader navFilter={navFilter} />,
       renderOpts
     );
     expect(getByText("bank_capital")).toBeInTheDocument();
     expect(getByText("consumorenovables")).toBeInTheDocument();
 
+    jest.useFakeTimers();
     const inputSearch = getByRole("textbox");
     userEvent.type(inputSearch, "renovabless");
-
+    act(() => jest.runAllTimers());
     expect(queryByText("bank_capital")).not.toBeInTheDocument();
     expect(queryByText("consumorenovables")).not.toBeInTheDocument();
   });
 
-  it("FilterNavLoader loads from useBucketStructures and shows structures", () => {
-    const { getByText } = render(<FilteredNavLoader />, renderOpts);
-    expect(getByText("bank_capital")).toBeInTheDocument();
-    expect(getByText("consumorenovables")).toBeInTheDocument();
-  });
+  // it("FilterNavLoader shows displayed/total structures message", () => {
+  //   const { queryByText, getByText, getByRole } = render(
+  //     <FilteredNavLoader navFilter={navFilter} />,
+  //     renderOpts
+  //   );
 
-  it("FilterNavLoader shows displayed/total structures message", () => {
-    const { queryByText, getByText, getByRole } = render(
-      <FilteredNavLoader />,
-      renderOpts
-    );
-
-    const inputSearch = getByRole("textbox");
-    expect(queryByText("1 from a total of 2")).not.toBeInTheDocument();
-    userEvent.type(inputSearch, "bank");
-    expect(getByText("1 from a total of 2")).toBeInTheDocument();
-  });
+  //   const inputSearch = getByRole("textbox");
+  //   expect(queryByText("1 from a total of 2")).not.toBeInTheDocument();
+  //   userEvent.type(inputSearch, "bank");
+  //   expect(getByText("1 from a total of 2")).toBeInTheDocument();
+  // });
 
   it("test Alias Name Mode functionality", async () => {
+    const childStructures = [
+      { id: 1, name: "bank_capital" },
+      { id: 2, name: "consumorenovables" },
+    ];
     const toggleStructuresAliasNameMode = jest.fn();
-    const props = { toggleStructuresAliasNameMode };
+    const props = { toggleStructuresAliasNameMode, childStructures };
     const { getByRole } = render(<FilteredNav {...props} />, renderOpts);
 
     userEvent.click(getByRole("button", { name: /enable/i }));

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

@@ -5,7 +5,7 @@ import { StructureItems } from "../StructureItems";
 describe("<StructureItems />", () => {
   it("matches the latest snapshot", () => {
     const structures = [{ id: 1, name: "some structure" }];
-    const props = { structures };
+    const props = { structures, fnHasCatalogViewProp: jest.fn() };
 
     const { container } = render(<StructureItems {...props} />);
     expect(container).toMatchSnapshot();
@@ -13,7 +13,7 @@ describe("<StructureItems />", () => {
 
   it("matches the latest snapshot with alias", () => {
     const structures = [{ id: 1, name: "some structure", alias: "alias" }];
-    const props = { structures };
+    const props = { structures, fnHasCatalogViewProp: jest.fn() };
 
     const { container } = render(<StructureItems {...props} />);
     expect(container).toMatchSnapshot();

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

@@ -17,7 +17,7 @@ const renderOpts = {
 describe("<StructureNav />", () => {
   it("matches the latest snapshot", () => {
     const childStructures = [{ id: 1 }];
-    const props = { childStructures };
+    const props = { childStructures, fnHasCatalogViewProp: jest.fn() };
 
     const { container } = render(<StructureNav {...props} />, renderOpts);
     expect(container).toMatchSnapshot();

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

@@ -6,7 +6,11 @@ const structure1 = { id: 1, classes: { foo: "bar" } };
 const structure2 = { id: 2, classes: null };
 const structures = [structure1, structure2];
 
-const props = { classifier: "foo", structures };
+const props = {
+  classifier: "foo",
+  structures,
+  fnHasCatalogViewProp: jest.fn(),
+};
 
 describe("<StructureNavClassified />", () => {
   it("matches the latest snapshot", () => {

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

@@ -1,3 +1,4 @@
+import _ from "lodash/fp";
 import React from "react";
 import { render } from "@truedat/test/render";
 import { waitFor } from "@testing-library/react";
@@ -161,13 +162,14 @@ describe("<StructureStructureLinks />", () => {
   const renderOpts = {
     routes: ["/structures/60217/structureLinks"],
     mocks: [linksMock],
+    state: { navFilter: { view: "SYSTEM_STRUCTURES", filter: {} } },
   };
 
   it("shows structure to structure links", async () => {
-    const { getByRole } = render(<StructureStructureLinks {...props} />, {
-      ...renderOpts,
-      state: { structureActions },
-    });
+    const { getByRole } = render(
+      <StructureStructureLinks {...props} />,
+      _.merge(renderOpts, { state: { structureActions } })
+    );
     await waitFor(() => {
       expect(getByRole("link", { name: /STRUCTURE_2/i })).toBeInTheDocument();
       expect(getByRole("link", { name: /STRUCTURE_3/i })).toBeInTheDocument();
@@ -203,11 +205,10 @@ describe("<StructureStructureLinks />", () => {
     const dispatch = jest.fn();
     const { getByText, getByRole } = render(
       <StructureStructureLinks {...props} />,
-      {
-        ...renderOpts,
+      _.merge(renderOpts, {
         state: { structureActions },
         dispatch,
-      }
+      })
     );
     await waitFor(() => {
       expect(getByRole("link", { name: /STRUCTURE_2/i })).toBeInTheDocument();

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

@@ -44,6 +44,7 @@ describe("<StructureView />", () => {
           name: "some_db",
           type: "Database",
           description: "some description",
+          ancestry: [],
         },
       },
     };

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

@@ -26,7 +26,10 @@ const renderOpts = {
 
 describe("<SystemFilteredNav />", () => {
   it("matches the latest snapshot", () => {
-    const { container } = render(<SystemFilteredNav />, renderOpts);
+    const { container } = render(
+      <SystemFilteredNav fnHasCatalogViewProp={jest.fn()} />,
+      renderOpts
+    );
     expect(container).toMatchSnapshot();
   });
 });

package/src/hooks/useBucketPaths.js

@@ -0,0 +1,11 @@
+import useSWR from "swr";
+import { apiJsonPost } from "@truedat/core/services/api";
+import { API_BUCKET_PATHS } from "../api";
+
+export const useBucketPaths = (navFilter) =>
+  useSWR(
+    navFilter.view === "BUCKET_VIEW"
+      ? { url: API_BUCKET_PATHS, filters: navFilter.filter }
+      : null,
+    ({ url }) => apiJsonPost(url, { filters: navFilter.filter })
+  );

package/src/hooks/useBucketStructures.js

@@ -1,10 +1,22 @@
-import useSWRMutations from "swr/mutation";
+import useSWR from "swr";
 import { apiJsonPost } from "@truedat/core/services/api";
 import { API_BUCKET_STRUCTURES } from "../api";
 
-export const useBucketStructures = () => {
-  const mutation = useSWRMutations(API_BUCKET_STRUCTURES, (url, { arg }) =>
-    apiJsonPost(url, arg)
+export const useBucketStructures = ({
+  navFilter,
+  parentFilter,
+  ids,
+  query,
+}) => {
+  const params =
+    navFilter?.view === "SYSTEM_STRUCTURES"
+      ? { filters: { ...navFilter.filter, ...parentFilter }, query }
+      : // BUCKET_VIEW searches by ids directly instead of navFilter and parentFilter
+      navFilter?.view === "BUCKET_VIEW"
+      ? { filters: { ids }, query }
+      : undefined;
+
+  return useSWR({ url: API_BUCKET_STRUCTURES, params }, ({ url }) =>
+    apiJsonPost(url, params)
   );
-  return mutation;
 };

package/src/reducers/navFilter.js

@@ -1,6 +1,9 @@
 import { clearNavFilter, saveNavFilter } from "../routines";
 
-export const initialState = {};
+export const initialState = {
+  view: "SYSTEM_STRUCTURES",
+  filter: {},
+};
 
 export const navFilter = (state = initialState, { type, payload }) => {
   switch (type) {

package/src/reducers/structure.js

@@ -19,6 +19,7 @@ const structureFields = (fn) =>
   );
 
 const structureVersionFields = _.pick([
+  "ancestry",
   "class",
   "classes",
   "data_structure_link_count",

package/src/reducers/structureFilters.js

@@ -6,6 +6,7 @@ const initialState = {};
 const structureFilters = (state = initialState, { type, payload }) => {
   switch (type) {
     case clearStructureFilters.TRIGGER:
+    case fetchStructureFilters.TRIGGER:
       return initialState;
     case fetchStructureFilters.SUCCESS:
       return _.flow(

package/src/selectors/getStructureParent.js

@@ -1,6 +1,5 @@
 import _ from "lodash/fp";
 import { createSelector } from "reselect";
-import { isBucketFilter } from "../utils/bucketNav";
 
 const defaultName = "..";
 
@@ -23,7 +22,7 @@ export const getStructureParent = createSelector(
   ],
   (structure, structureParents, navFilter) =>
     _.isEmpty(structureParents)
-      ? !_.isEmpty(structure) && isBucketFilter(navFilter)
+      ? !_.isEmpty(structure) && navFilter?.view === "BUCKET_VIEW"
         ? { type: "bucket" }
         : _.has("system")(structure)
         ? rootNavItem(structure)

package/src/components/StructureNoteSuggestions.js

@@ -1,179 +0,0 @@
-import _ from "lodash/fp";
-import React, { useState } from "react";
-import PropTypes from "prop-types";
-import {
-  Button,
-  Checkbox,
-  Container,
-  Divider,
-  Icon,
-  List,
-  Message,
-  Segment,
-} from "semantic-ui-react";
-import { FormattedMessage, useIntl } from "react-intl";
-import { apiJson } from "@truedat/core/services/api";
-
-export default function StructureNoteSuggestions({
-  aiSuggestionsAction,
-  applySuggestions,
-  template,
-  isModification,
-}) {
-  const [loadingSuggestion, setLoadingSuggestion] = useState();
-  const [suggestions, setSuggestions] = useState();
-  const [suggestionsError, setSuggestionsError] = useState();
-  const [selectedSuggestions, setSelectedSuggestions] = useState([]);
-
-  const { locale } = useIntl();
-
-  const suggestionKeys = _.keys(suggestions);
-  const fieldInSuggestions = ({ name }) => _.includes(name)(suggestionKeys);
-  const templateFields = _.flow(
-    _.prop("content"),
-    _.filter(({ fields }) => _.any(fieldInSuggestions)(fields)),
-    _.map(({ name, fields }) => ({
-      name,
-      fields: _.filter(fieldInSuggestions)(fields),
-    }))
-  )(template);
-  const validFields = _.flow(
-    _.prop("content"),
-    _.flatMap(({ fields }) =>
-      _.flow(
-        _.filter(({ editable }) => editable || !isModification),
-        _.map(({ name }) => name)
-      )(fields)
-    )
-  )(template);
-
-  const handleRequestSuggestions = () => {
-    setLoadingSuggestion(true);
-    setSuggestionsError(null);
-    setSelectedSuggestions([]);
-    setSuggestions(null);
-    const url = `${aiSuggestionsAction.href}?language=${locale}`;
-    apiJson(url).then(({ data: { data: suggestions } }) => {
-      if (_.prop("[0]")(suggestions) === "error") {
-        setSuggestionsError(
-          _.prop("[1].error.message")(suggestions) || _.prop("[1]")(suggestions)
-        );
-      } else {
-        setSuggestions(suggestions);
-        const selectedFields = _.flow(
-          _.keys,
-          _.filter(
-            (key) =>
-              _.includes(key)(validFields) && !_.isEmpty(suggestions[key])
-          )
-        )(suggestions);
-        setSelectedSuggestions(selectedFields);
-      }
-      setLoadingSuggestion(false);
-    });
-  };
-  const handleApplySuggestions = () => {
-    applySuggestions(_.pick(selectedSuggestions)(suggestions));
-    setSelectedSuggestions([]);
-    setSuggestions(null);
-  };
-
-  const toggleSelectedSuggestion = (name) => {
-    setSelectedSuggestions(
-      _.includes(name)(selectedSuggestions)
-        ? _.reject((v) => v == name)(selectedSuggestions)
-        : [...selectedSuggestions, name]
-    );
-  };
-
-  return (
-    <Segment loading={loadingSuggestion}>
-      <Container style={{ display: "flex", justifyContent: "space-between" }}>
-        <h4>
-          {suggestions ? (
-            <Icon name="lightbulb outline" />
-          ) : (
-            <Icon name="lightbulb" />
-          )}
-          <FormattedMessage id="structure_note.ai_suggestion.header" />
-        </h4>
-        <Divider hidden />
-        {suggestions ? null : (
-          <Button onClick={handleRequestSuggestions}>
-            <FormattedMessage id="actions.ai_suggestion" />
-          </Button>
-        )}
-      </Container>
-      {suggestionsError ? (
-        <Message negative>
-          <Message.Header>
-            <FormattedMessage id="structure_note.ai_suggestion.error" />
-          </Message.Header>
-          <p>{suggestionsError}</p>
-        </Message>
-      ) : null}
-      {suggestions ? (
-        <>
-          {_.map(({ name: groupName, fields }) => (
-            <Container key={`group-${groupName}`}>
-              <>
-                <h5>{groupName ? groupName : ""}</h5>
-                <List>
-                  {_.map(({ name, label, editable }) => (
-                    <List.Item
-                      key={name}
-                      style={{
-                        display: "flex",
-                        alignItems: "center",
-                        gap: "12px",
-                      }}
-                    >
-                      <Checkbox
-                        id={name}
-                        disabled={
-                          (isModification && !editable) ||
-                          _.isEmpty(suggestions[name])
-                        }
-                        checked={_.includes(name)(selectedSuggestions)}
-                        onChange={() => toggleSelectedSuggestion(name)}
-                      />
-                      <label
-                        htmlFor={name}
-                        style={{ cursor: "pointer" }}
-                        disabled
-                      >
-                        <List.Header>{label}</List.Header>
-                        <List.Description>
-                          {_.isEmpty(suggestions[name])
-                            ? "-"
-                            : suggestions[name]}
-                        </List.Description>
-                      </label>
-                    </List.Item>
-                  ))(fields)}
-                </List>
-                <Divider hidden />
-              </>
-            </Container>
-          ))(templateFields)}
-          <Container textAlign="right">
-            <Button
-              primary
-              onClick={handleApplySuggestions}
-              disabled={_.isEmpty(selectedSuggestions)}
-            >
-              <FormattedMessage id="actions.apply_ai_suggestion" />
-            </Button>
-          </Container>
-        </>
-      ) : null}
-    </Segment>
-  );
-}
-
-StructureNoteSuggestions.propTypes = {
-  aiSuggestionsAction: PropTypes.object,
-  applySuggestions: PropTypes.func,
-  template: PropTypes.object,
-  isModification: PropTypes.bool,
-};