@truedat/se 7.5.7 → 7.5.10

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@truedat/se",
-  "version": "7.5.7",
+  "version": "7.5.10",
   "description": "Truedat Web Search Engine",
   "sideEffects": false,
-  "jsnext:main": "src/index.js",
   "module": "src/index.js",
   "files": [
-    "src"
+    "src",
+    "index.js"
   ],
   "author": "Bluetab Solutions",
   "license": "GPL-3.0",
@@ -15,64 +15,25 @@
   },
   "scripts": {
     "clean": "rimraf yarn-error.log",
-    "debug": "node --inspect-brk node_modules/.bin/jest --runInBand",
     "test": "TZ=UTC jest --coverage",
-    "test:watch": "TZ=UTC jest --watch",
     "eslint": "eslint src/**",
     "eslint:fix": "eslint --fix src/**"
   },
-  "devDependencies": {
-    "@babel/cli": "^7.19.3",
-    "@babel/core": "^7.20.5",
-    "@babel/plugin-proposal-class-properties": "^7.18.6",
-    "@babel/plugin-proposal-object-rest-spread": "^7.20.2",
-    "@babel/plugin-proposal-optional-chaining": "^7.18.9",
-    "@babel/plugin-syntax-dynamic-import": "^7.8.3",
-    "@babel/plugin-transform-modules-commonjs": "^7.19.6",
-    "@babel/preset-env": "^7.20.2",
-    "@babel/preset-react": "^7.18.6",
-    "@testing-library/jest-dom": "^5.16.5",
-    "@testing-library/react": "^12.0.0",
-    "@testing-library/user-event": "^13.2.1",
-    "@truedat/test": "7.5.7",
-    "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",
-    "babel-plugin-transform-semantic-ui-react-imports": "^1.4.1",
-    "enzyme": "^3.11.0",
-    "enzyme-to-json": "^3.6.2",
-    "identity-obj-proxy": "^3.0.0",
-    "jest": "^29.0.0",
-    "jest-environment-jsdom": "^29.0.0",
-    "react": "^16.14.0",
-    "react-dom": "^16.14.0",
-    "redux-saga-test-plan": "^4.0.4",
-    "rimraf": "^3.0.2",
-    "semantic-ui-react": "^2.1.4"
-  },
   "jest": {
     "maxWorkers": "50%",
     "testTimeout": 10000,
     "moduleDirectories": [
-      "<rootDir>/src",
-      "../../node_modules"
-    ],
-    "setupFilesAfterEnv": [
-      "@truedat/test/setup"
+      "<rootDir>/src"
     ],
     "moduleNameMapper": {
       "\\.(css|less|png)$": "identity-obj-proxy",
       "^@truedat/([^/]+)$": "<rootDir>/../$1/src/index",
       "^@truedat/([^/]+)/(.*)$": "<rootDir>/../$1/src/$2"
     },
-    "snapshotSerializers": [
-      "enzyme-to-json/serializer"
+    "setupFilesAfterEnv": [
+      "@truedat/test/setup"
     ],
     "testEnvironment": "jsdom",
-    "testPathIgnorePatterns": [
-      "<rootDir>/node_modules/"
-    ],
     "transform": {
       "\\.js$": [
         "babel-jest",
@@ -80,28 +41,46 @@
           "rootMode": "upward"
         }
       ]
-    },
-    "transformIgnorePatterns": [
-      "/node_modules/(?!@truedat).*"
-    ]
+    }
+  },
+  "devDependencies": {
+    "@testing-library/dom": "^10.4.0",
+    "@testing-library/jest-dom": "^6.6.3",
+    "@testing-library/react": "^16.2.0",
+    "@testing-library/user-event": "^14.6.1",
+    "@truedat/test": "7.5.10",
+    "identity-obj-proxy": "^3.0.0",
+    "jest": "^29.7.0",
+    "redux-saga-test-plan": "^4.0.6"
   },
   "dependencies": {
-    "@truedat/core": "7.5.7",
-    "path-to-regexp": "^1.7.0",
+    "@apollo/client": "^3.13.5",
+    "@truedat/core": "7.5.10",
+    "axios": "^1.8.4",
+    "graphql": "^16.10.0",
+    "is-hotkey": "^0.2.0",
+    "is-url": "^1.2.4",
+    "lodash": "^4.17.21",
+    "moment": "^2.30.1",
+    "path-to-regexp": "^8.2.0",
     "prop-types": "^15.8.1",
-    "react-intl": "^5.20.10",
-    "react-redux": "^7.2.4",
-    "react-router-dom": "^5.2.0",
-    "redux": "^4.1.1",
-    "redux-saga": "^1.2.1",
+    "query-string": "^7.1.2",
+    "react": "^19.0.0",
+    "react-csv": "^2.2.2",
+    "react-dom": "^19.0.0",
+    "react-dropzone": "^14.3.8",
+    "react-hook-form": "^7.54.2",
+    "react-intl": "^7.1.10",
+    "react-moment": "^1.1.3",
+    "react-redux": "^9.2.0",
+    "react-router": "^7.4.0",
+    "redux": "^5.0.1",
+    "redux-saga": "^1.3.0",
     "redux-saga-routines": "^3.2.3",
-    "reselect": "^4.1.7",
-    "semantic-ui-react": "^2.1.4"
-  },
-  "peerDependencies": {
-    "react": ">= 16.8.6 < 17",
-    "react-dom": ">= 16.8.6 < 17",
-    "semantic-ui-react": ">= 2.0.3 < 2.2"
+    "reselect": "^5.1.1",
+    "semantic-ui-calendar-react": "^0.15.3",
+    "semantic-ui-react": "^3.0.0-beta.2",
+    "swr": "^2.3.3"
   },
-  "gitHead": "01b1e4eb176b2c491750b524988e32094413515c"
+  "gitHead": "8a8c49e9d5d6bb4e5f2b503b063bfd6dd20a503d"
 }

package/src/components/CardResult.js

@@ -1,9 +1,8 @@
 import { join, truncate } from "lodash/fp";
-import React from "react";
 import PropTypes from "prop-types";
 import { FormattedMessage } from "react-intl";
 import { Card } from "semantic-ui-react";
-import { Link } from "react-router-dom";
+import { Link } from "react-router";
 
 export const CardResult = ({ index, description, header, to, path }) => {
   const headerConcept = (
@@ -22,7 +21,7 @@ export const CardResult = ({ index, description, header, to, path }) => {
     className: "search result",
     header: headerConcept,
     meta: join(" > ")(path),
-    description: truncate({ length: 300 })(description)
+    description: truncate({ length: 300 })(description),
   };
 
   return <Card {...cardProps} />;
@@ -33,7 +32,7 @@ CardResult.propTypes = {
   index: PropTypes.string,
   description: PropTypes.string,
   path: PropTypes.array,
-  to: PropTypes.string
+  to: PropTypes.string,
 };
 
 export default CardResult;

package/src/components/DeleteIndexButton.js

@@ -1,4 +1,3 @@
-import React from "react";
 import PropTypes from "prop-types";
 import { useIntl } from "react-intl";
 import { Button } from "semantic-ui-react";

package/src/components/ElasticIndexes.js

@@ -1,4 +1,3 @@
-import React from "react";
 import { FormattedMessage, useIntl } from "react-intl";
 import {
   Header,
@@ -33,9 +32,11 @@ export default function ElasticIndexes() {
         </Header.Content>
       </Header>
       <Dimmer.Dimmable dimmed={loading}>
-        <Dimmer active={loading} inverted>
-          <Loader />
-        </Dimmer>
+        {loading ? (
+          <Dimmer active inverted>
+            <Loader />
+          </Dimmer>
+        ) : null}
         {indexes ? (
           <Table>
             <Table.Header>

package/src/components/Search.js

@@ -1,4 +1,3 @@
-import React from "react";
 import { Segment } from "semantic-ui-react";
 
 import SearchInput from "./SearchInput";

package/src/components/SearchHome.js

@@ -1,9 +1,9 @@
 import _ from "lodash/fp";
-import React from "react";
 import PropTypes from "prop-types";
 import { useIntl } from "react-intl";
 import { connect } from "react-redux";
-import { Link, useHistory } from "react-router-dom";
+import { Link } from "react-router";
+import { useNavigate } from "react-router";
 import { Image, Search } from "semantic-ui-react";
 import { SEARCH_RESULTS } from "@truedat/core/routes";
 import searchImage from "assets/searching.png";
@@ -12,7 +12,7 @@ import { fetchSearch } from "../routines";
 
 const SearchHome = ({ fetchSearch, loading, results, searchHomeAddon }) => {
   const { formatMessage } = useIntl();
-  const history = useHistory();
+  const navigate = useNavigate();
 
   const onSearchChange = (e, data) => {
     e.preventDefault();
@@ -21,7 +21,7 @@ const SearchHome = ({ fetchSearch, loading, results, searchHomeAddon }) => {
   };
 
   const onKeyPress = ({ key }) => {
-    if (key == "Enter") history.push(SEARCH_RESULTS);
+    if (key == "Enter") navigate(SEARCH_RESULTS);
   };
 
   const props = {

package/src/components/SearchInput.js

@@ -1,4 +1,3 @@
-import React from "react";
 import PropTypes from "prop-types";
 import { connect } from "react-redux";
 import { Input } from "semantic-ui-react";

package/src/components/SearchLoader.js

@@ -1,44 +1,24 @@
-import React from "react";
-import { withRouter } from "react-router-dom";
-import PropTypes from "prop-types";
-import { compose } from "redux";
-import { connect } from "react-redux";
+import { useEffect } from "react";
+import { useLocation, useMatch } from "react-router";
+import { useDispatch, useSelector } from "react-redux";
 import { Loading } from "@truedat/core/components";
 import { clearSearch, fetchSearch, updateSearchPath } from "../routines";
 
-export class SearchLoader extends React.Component {
-  static propTypes = {
-    fetchSearch: PropTypes.func,
-    updateSearchPath: PropTypes.func,
-    clearSearch: PropTypes.func,
-    searchLoading: PropTypes.bool,
-  };
+export default function SearchLoader() {
+  const dispatch = useDispatch();
+  const searchLoading = useSelector((state) => state.searchLoading);
+  const location = useLocation();
+  const match = useMatch(location.pathname);
 
-  componentDidMount() {
-    const {
-      fetchSearch,
-      updateSearchPath,
-      match: { path },
-    } = this.props;
-    updateSearchPath({ path });
-    fetchSearch({});
-  }
+  useEffect(() => {
+    const path = match?.pathname || location.pathname;
+    dispatch(updateSearchPath({ path }));
+    dispatch(fetchSearch({}));
 
-  componentWillUnmount() {
-    const { clearSearch } = this.props;
-    clearSearch();
-  }
+    return () => {
+      dispatch(clearSearch());
+    };
+  }, [dispatch, match, location.pathname]);
 
-  render() {
-    const { searchLoading } = this.props;
-    if (searchLoading) return <Loading />;
-    return null;
-  }
+  return searchLoading ? <Loading /> : null;
 }
-
-const mapStateToProps = ({ searchLoading }) => ({ searchLoading });
-
-export default compose(
-  withRouter,
-  connect(mapStateToProps, { fetchSearch, clearSearch, updateSearchPath })
-)(SearchLoader);

package/src/components/SearchPagination.js

@@ -1,4 +1,3 @@
-import React from "react";
 import PropTypes from "prop-types";
 import { connect } from "react-redux";
 import { Pagination } from "semantic-ui-react";

package/src/components/SearchResults.js

@@ -1,9 +1,8 @@
 import _ from "lodash/fp";
-import React from "react";
 import PropTypes from "prop-types";
 import { FormattedMessage } from "react-intl";
 import { connect } from "react-redux";
-import { Link } from "react-router-dom";
+import { Link } from "react-router";
 import { Message, Icon, Label } from "semantic-ui-react";
 import { SEARCH } from "@truedat/core/routes";
 import { searchResultsSelector } from "../selectors";
@@ -40,13 +39,13 @@ export const SearchResults = ({ loading, results, searchCount }) => {
 SearchResults.propTypes = {
   loading: PropTypes.bool,
   results: PropTypes.array,
-  searchCount: PropTypes.number
+  searchCount: PropTypes.number,
 };
 
-const mapStateToProps = state => ({
+const mapStateToProps = (state) => ({
   results: searchResultsSelector(state),
   loading: state.searchLoading,
-  searchCount: state.searchCount
+  searchCount: state.searchCount,
 });
 
 export default connect(mapStateToProps)(SearchResults);

package/src/components/SearchRoutes.js

@@ -1,77 +1,31 @@
-import React from "react";
-import { Route } from "react-router-dom";
-import {
-  SEARCH,
-  SEARCH_CONCEPTS,
-  SEARCH_INGESTS,
-  SEARCH_RESULTS,
-  SEARCH_STRUCTURES,
-  ELASTICINDEXES,
-} from "@truedat/core/routes";
-import { Unauthorized } from "@truedat/core/components";
-import { useAuthorized } from "@truedat/core/hooks";
+import { Route, Routes } from "react-router";
+import { ProtectedRoute, Loader } from "@truedat/core/router";
+// import { path } from "@truedat/core/routesTree";
 import SearchLoader from "./SearchLoader";
 import SearchHome from "./SearchHome";
 import Search from "./Search";
 import ElasticIndexes from "./ElasticIndexes";
 
 export const SearchRoutes = () => {
-  const authorized = useAuthorized();
   return (
-    <Route
-      path={SEARCH}
-      render={() => (
-        <>
-          <Route path={SEARCH} component={SearchLoader} exact />
-          <Route path={SEARCH} component={SearchHome} exact />
-          <Route
-            path={SEARCH_RESULTS}
-            exact
-            render={() => (
-              <>
-                <SearchLoader />
-                <Search />
-              </>
-            )}
-          />
-          <Route
-            path={SEARCH_CONCEPTS}
-            exact
-            render={() => (
-              <>
-                <SearchLoader />
-                <Search />
-              </>
-            )}
-          />
-          <Route
-            path={SEARCH_INGESTS}
-            exact
-            render={() => (
-              <>
-                <SearchLoader />
-                <Search />
-              </>
-            )}
-          />
-          <Route
-            path={SEARCH_STRUCTURES}
-            exact
-            render={() => (
-              <>
-                <SearchLoader />
-                <Search />
-              </>
-            )}
-          />
-          <Route
-            path={ELASTICINDEXES}
-            exact
-            render={() => (authorized ? <ElasticIndexes /> : <Unauthorized />)}
-          />
-        </>
-      )}
-    />
+    <Routes>
+      <Route path={"search"} element={<Loader loaders={<SearchLoader />} />}>
+        <Route index element={<SearchHome />} />
+        <Route path={"results"} element={<Search />} />
+        <Route path={"concepts"} element={<Search />} />
+        <Route path={"ingests"} element={<Search />} />
+        <Route path={"structures"} element={<Search />} />
+        <Route
+          path={"elasticIndexes"}
+          element={
+            <ProtectedRoute>
+              <ElasticIndexes />
+            </ProtectedRoute>
+          }
+        />
+      </Route>
+      <Route path="*" element={null} />
+    </Routes>
   );
 };
 

package/src/components/SearchTabs.js

@@ -1,9 +1,8 @@
 import _ from "lodash/fp";
-import React from "react";
 import PropTypes from "prop-types";
 import { connect } from "react-redux";
 import { FormattedMessage } from "react-intl";
-import { Link } from "react-router-dom";
+import { Link } from "react-router";
 import { Menu } from "semantic-ui-react";
 import { useActiveRoute } from "@truedat/core/hooks";
 import { useAuthorized } from "@truedat/core/hooks";
@@ -11,7 +10,7 @@ import {
   SEARCH_CONCEPTS,
   SEARCH_INGESTS,
   SEARCH_RESULTS,
-  SEARCH_STRUCTURES
+  SEARCH_STRUCTURES,
 } from "@truedat/core/routes";
 import { searchIndicesSelector } from "../selectors/searchIndicesSelector";
 
@@ -19,7 +18,7 @@ const relations = {
   all: ["all"],
   concepts: ["business_glossary_view"],
   structures: ["data_dictionary"],
-  ingests: ["ingests"]
+  ingests: ["ingests"],
 };
 
 export const SearchTab = ({ route, name }) => {
@@ -40,7 +39,7 @@ export const SearchTab = ({ route, name }) => {
 
 SearchTab.propTypes = {
   route: PropTypes.string,
-  name: PropTypes.string
+  name: PropTypes.string,
 };
 
 export const SearchTabs = ({ indices }) => {
@@ -61,11 +60,11 @@ export const SearchTabs = ({ indices }) => {
 };
 
 SearchTabs.propTypes = {
-  indices: PropTypes.array
+  indices: PropTypes.array,
 };
 
-export const mapStateToProps = state => ({
-  indices: searchIndicesSelector(state)
+export const mapStateToProps = (state) => ({
+  indices: searchIndicesSelector(state),
 });
 
 export default connect(mapStateToProps)(SearchTabs);

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

@@ -1,5 +1,4 @@
-import React from "react";
-import { shallowWithIntl } from "@truedat/test/intl-stub";
+import { render, waitForLoad } from "@truedat/test/render";
 import { CardResult } from "../CardResult";
 
 describe("<CardResult />", () => {
@@ -10,17 +9,18 @@ describe("<CardResult />", () => {
   const to = "/foo";
   const path = ["levelOne", "levelTwo", "levelThree"];
 
-  it("it matches the last snapshot", () => {
+  it("it matches the last snapshot", async () => {
     const props = {
       index,
       description,
       header,
       resource_id,
       to,
-      path
+      path,
     };
-    const wrapper = shallowWithIntl(<CardResult {...props} />);
-    expect(wrapper).toMatchSnapshot();
-    expect(wrapper.find("Card").length).toBe(1);
+    const rendered = render(<CardResult {...props} />);
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
+    expect(rendered.container.querySelector(".card")).toBeInTheDocument();
   });
 });

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

@@ -1,9 +1,7 @@
-import React from "react";
-import { render } from "@truedat/test/render";
 import userEvent from "@testing-library/user-event";
+import { render, waitForLoad } from "@truedat/test/render";
 import { useElasticIndexDelete } from "@truedat/se/hooks/useElasticIndexes";
 import DeleteIndexButton from "../DeleteIndexButton";
-import en from "../../messages/en";
 
 jest.mock("@truedat/se/hooks/useElasticIndexes", () => {
   const originalModule = jest.requireActual(
@@ -20,53 +18,40 @@ jest.mock("@truedat/se/hooks/useElasticIndexes", () => {
   };
 });
 
-const renderOpts = {
-  messages: {
-    en: {
-      ...en,
-      "confirmation.yes": "yes",
-      "confirmation.no": "no",
-      "elastic_index.delete": "elastic_index.delete",
-      "elastic_index.delete.confirmation.header":
-        "elastic_index.delete.confirmation.header",
-      "elastic_index.delete.confirmation.content":
-        "elastic_index.delete.confirmation.content",
-    },
-  },
-};
-
 describe("<DeleteIndexButton />", () => {
   const indexName = "test_index";
-  it("matches the last snapshot", () => {
-    const { container } = render(
-      <DeleteIndexButton indexName={indexName} />,
-      renderOpts
-    );
-    expect(container).toMatchSnapshot();
+
+  it("matches the last snapshot", async () => {
+    const rendered = render(<DeleteIndexButton indexName={indexName} />);
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
   });
 
-  it("triggers useElasticIndexDelete hook on confirm", () => {
-    const { getByRole } = render(
-      <DeleteIndexButton indexName={indexName} />,
-      renderOpts
+  it("triggers useElasticIndexDelete hook on confirm", async () => {
+    const user = userEvent.setup({ delay: null });
+    const rendered = render(<DeleteIndexButton indexName={indexName} />);
+    await waitForLoad(rendered);
+
+    await user.click(rendered.getByRole("button", { name: /delete/i }));
+    await user.click(
+      rendered.getByRole("button", { name: "modal-affirmative-action" })
     );
-    userEvent.click(getByRole("button", { name: /delete/i }));
-    userEvent.click(getByRole("button", { name: "modal-affirmative-action" }));
 
     expect(useElasticIndexDelete).toHaveBeenCalledWith(indexName);
     const { trigger } = useElasticIndexDelete();
-
     expect(trigger).toHaveBeenCalled();
   });
 
-  it("do not triggers useElasticIndexDelete hook on cancel", () => {
+  it("do not triggers useElasticIndexDelete hook on cancel", async () => {
     jest.clearAllMocks();
-    const { getByRole } = render(
-      <DeleteIndexButton indexName={indexName} />,
-      renderOpts
+    const user = userEvent.setup({ delay: null });
+    const rendered = render(<DeleteIndexButton indexName={indexName} />);
+    await waitForLoad(rendered);
+
+    await user.click(rendered.getByRole("button", { name: /delete/i }));
+    await user.click(
+      rendered.getByRole("button", { name: "modal-negative-action" })
     );
-    userEvent.click(getByRole("button", { name: /delete/i }));
-    userEvent.click(getByRole("button", { name: "modal-negative-action" }));
 
     expect(useElasticIndexDelete).toHaveBeenCalledWith(indexName);
     const { trigger } = useElasticIndexDelete();

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

@@ -1,7 +1,5 @@
-import React from "react";
-import { render } from "@truedat/test/render";
+import { render, waitForLoad } from "@truedat/test/render";
 import ElasticIndexes from "../ElasticIndexes";
-import en from "../../messages/en";
 
 jest.mock("@truedat/se/hooks/useElasticIndexes", () => {
   const originalModule = jest.requireActual(
@@ -19,29 +17,10 @@ jest.mock("@truedat/se/hooks/useElasticIndexes", () => {
   };
 });
 
-const renderOpts = {
-  messages: {
-    en: {
-      ...en,
-      "elastic_index.action": "elastic_index.action",
-      "elastic_index.documents": "elastic_index.documents",
-      "elastic_index.size": "elastic_index.size",
-      "elastic_index.alias": "elastic_index.alias",
-      "elastic_index.key": "elastic_index.key",
-      "elastic_index.delete": "elastic_index.delete",
-      "elastic_index.header": "elastic_index.header",
-      "elastic_index.subheader": "elastic_index.subheader",
-      "elastic_index.delete.confirmation.header":
-        "elastic_index.delete.confirmation.header",
-      "elastic_index.delete.confirmation.content":
-        "elastic_index.delete.confirmation.content",
-    },
-  },
-};
-
 describe("<ElasticIndexes />", () => {
-  it("matches the last snapshot", () => {
-    const { container } = render(<ElasticIndexes />, renderOpts);
-    expect(container).toMatchSnapshot();
+  it("matches the latest snapshot", async () => {
+    const rendered = render(<ElasticIndexes />);
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
   });
 });

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

@@ -1,4 +1,3 @@
-import React from "react";
 import { render } from "@truedat/test/render";
 import { Search } from "../Search";