@truedat/bg 4.46.1 → 4.46.4

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # Changelog
 
+## [4.46.4] 2022-06-16
+
+### Added
+
+- [TD-4720] Include concepts tab in domain view
+
+## [4.46.2] 2022-06-16
+
+### Changed
+
+- [TD-4739] Don't lazily load components from `@truedat/core`
+
 ## [4.45.1] 2022-05-26
 
 ### Changed

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@truedat/bg",
-  "version": "4.46.1",
+  "version": "4.46.4",
   "description": "Truedat Web Business Glossary",
   "sideEffects": false,
   "jsnext:main": "src/index.js",
@@ -34,7 +34,7 @@
     "@testing-library/jest-dom": "^5.16.4",
     "@testing-library/react": "^12.0.0",
     "@testing-library/user-event": "^13.2.1",
-    "@truedat/test": "4.46.0",
+    "@truedat/test": "4.46.4",
     "babel-jest": "^28.1.0",
     "babel-plugin-dynamic-import-node": "^2.3.3",
     "babel-plugin-lodash": "^3.3.4",
@@ -86,8 +86,8 @@
     ]
   },
   "dependencies": {
-    "@truedat/core": "4.46.0",
-    "@truedat/df": "4.46.1",
+    "@truedat/core": "4.46.4",
+    "@truedat/df": "4.46.4",
     "file-saver": "^2.0.5",
     "moment": "^2.24.0",
     "path-to-regexp": "^1.7.0",
@@ -107,5 +107,5 @@
     "react-dom": ">= 16.8.6 < 17",
     "semantic-ui-react": ">= 0.88.2 < 2.1"
   },
-  "gitHead": "00524d691df3a57293aca6580e6bf96667e11761"
+  "gitHead": "dcd0aa42ffe1fb816945154ec2a2d06889dca7e7"
 }

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 { Comments, CommentsLoader } from "@truedat/core/components";
 import { CONCEPT_VERSION } from "@truedat/core/routes";
 import ConceptRelationsSummary from "../relations/components/ConceptRelationsSummary";
 import ConceptArchiveLoader from "./ConceptArchiveLoader";
@@ -19,13 +20,11 @@ import SharedToDomains from "./SharedToDomains";
 const EventsLoader = React.lazy(() =>
   import("@truedat/audit/components/EventsLoader")
 );
-const Comments = React.lazy(() => import("@truedat/core/components/Comments"));
-const CommentsLoader = React.lazy(() =>
-  import("@truedat/core/components/CommentsLoader")
-);
+
 const RelationsLoader = React.lazy(() =>
   import("@truedat/lm/components/RelationsLoader")
 );
+
 const ConceptRulesLoader = React.lazy(() =>
   import("@truedat/dq/components/ConceptRulesLoader")
 );
@@ -71,11 +70,11 @@ export const Concept = ({ id }) => (
 );
 
 Concept.propTypes = {
-  id: PropTypes.number.isRequired
+  id: PropTypes.number.isRequired,
 };
 
 const mapStateToProps = ({ concept }) => ({
-  id: _.prop("business_concept_id")(concept)
+  id: _.prop("business_concept_id")(concept),
 });
 
 export default connect(mapStateToProps)(Concept);

package/src/concepts/components/ConceptArchiveRow.js

@@ -13,7 +13,7 @@ export const ConceptArchiveRow = ({
   status,
   last_change_at,
   last_change_by,
-  version
+  version,
 }) => {
   const history = useHistory();
   return (
@@ -23,7 +23,12 @@ export const ConceptArchiveRow = ({
       }
     >
       <Table.Cell
-        content={<FormattedMessage id={`concepts.status.${status}`} />}
+        content={
+          <FormattedMessage
+            id={`concepts.status.${status}`}
+            defaultMessage={status}
+          />
+        }
       />
       <Table.Cell content={version} />
       <Table.Cell content={_.propOr("", "full_name")(last_change_by)} />
@@ -38,7 +43,7 @@ ConceptArchiveRow.propTypes = {
   status: PropTypes.string,
   last_change_at: PropTypes.string,
   last_change_by: PropTypes.string,
-  version: PropTypes.number
+  version: PropTypes.number,
 };
 
 export default ConceptArchiveRow;

package/src/concepts/components/ConceptDetails.js

@@ -3,16 +3,14 @@ import PropTypes from "prop-types";
 import { connect } from "react-redux";
 import { Segment, Header } from "semantic-ui-react";
 import { FormattedMessage } from "react-intl";
+import { RichTextEditor } from "@truedat/core/components";
 
 const DynamicFormViewer = React.lazy(() =>
   import("@truedat/df/components/DynamicFormViewer")
 );
-const RichTextEditor = React.lazy(() =>
-  import("@truedat/core/components/RichTextEditor")
-);
 
 export const ConceptDetails = ({
-  concept: { content, description, template }
+  concept: { content, description, template },
 }) => (
   <Segment attached="bottom">
     <Header as="h3">
@@ -24,7 +22,7 @@ export const ConceptDetails = ({
 );
 
 ConceptDetails.propTypes = {
-  concept: PropTypes.object
+  concept: PropTypes.object,
 };
 
 const mapStateToProps = ({ concept }) => ({ concept });

package/src/concepts/components/ConceptEdit.js

@@ -13,7 +13,7 @@ import {
 import { compose } from "redux";
 import { connect } from "react-redux";
 import { injectIntl, FormattedMessage } from "react-intl";
-import { HistoryBackButton } from "@truedat/core/components";
+import { HistoryBackButton, RichTextEditor } from "@truedat/core/components";
 import { selectTemplate, selectDomain } from "@truedat/df/routines";
 import { applyTemplate } from "@truedat/df/utils";
 import { conceptAction } from "../routines";
@@ -22,10 +22,6 @@ const DynamicForm = React.lazy(() =>
   import("@truedat/df/components/DynamicForm")
 );
 
-const RichTextEditor = React.lazy(() =>
-  import("@truedat/core/components/RichTextEditor")
-);
-
 const TemplateLoader = React.lazy(() =>
   import("@truedat/df/templates/components/TemplateLoader")
 );

package/src/concepts/components/ConceptFiltersLoader.js

@@ -17,6 +17,7 @@ const makeMapStateToProps = () => {
   const mapStateToProps = (state, props) => ({
     selectedFilter: state.conceptSelectedFilter,
     filters: activeFiltersSelector(state, props),
+    defaultFilters: props?.defaultFilters || {},
   });
   return mapStateToProps;
 };

package/src/concepts/components/ConceptForm.js

@@ -13,7 +13,7 @@ import {
 import { compose } from "redux";
 import { connect } from "react-redux";
 import { injectIntl, FormattedMessage } from "react-intl";
-import { HistoryBackButton } from "@truedat/core/components";
+import { HistoryBackButton, RichTextEditor } from "@truedat/core/components";
 import { conceptAction } from "../routines";
 import DomainDropdownSelector from "../../taxonomy/components/DomainDropdownSelector";
 
@@ -21,10 +21,6 @@ const SelectableDynamicForm = React.lazy(() =>
   import("@truedat/df/components/SelectableDynamicForm")
 );
 
-const RichTextEditor = React.lazy(() =>
-  import("@truedat/core/components/RichTextEditor")
-);
-
 const actionKey = "create";
 
 const staticFields = ["name", "description"];

package/src/concepts/components/ConceptRoutes.js

@@ -25,7 +25,6 @@ import ConceptLoader from "./ConceptLoader";
 import Concepts from "./Concepts";
 import ConceptsBulkUpdate from "./ConceptsBulkUpdate";
 import ConceptsLoader from "./ConceptsLoader";
-import ConceptsDefaultFiltersLoader from "./ConceptsDefaultFiltersLoader";
 import ConceptSubscriptionLoader from "./ConceptSubscriptionLoader";
 
 const RelationTagsLoader = React.lazy(() =>
@@ -56,19 +55,9 @@ export const ConceptRoutes = ({ concept, conceptLoaded, templatesLoaded }) => {
           authorized ? (
             <>
               <ConceptUserFiltersLoader />
-              <ConceptsDefaultFiltersLoader
-                defaultFilters={{
-                  status: ["pending_approval", "draft", "rejected"],
-                }}
-              />
               <ConceptFiltersLoader
                 defaultFilters={{
-                  status: [
-                    "pending_approval",
-                    "draft",
-                    "rejected",
-                    "published",
-                  ],
+                  status: ["pending_approval", "draft", "rejected"],
                 }}
               />
               <Concepts
@@ -96,11 +85,6 @@ export const ConceptRoutes = ({ concept, conceptLoaded, templatesLoaded }) => {
                   render={() => (
                     <>
                       <ConceptUserFiltersLoader />
-                      <ConceptsDefaultFiltersLoader
-                        defaultFilters={{
-                          status: ["published"],
-                        }}
-                      />
                       <ConceptFiltersLoader
                         defaultFilters={{
                           status: ["published"],

package/src/concepts/components/ConceptSummary.js

@@ -28,11 +28,11 @@ FieldValue.propTypes = {
   field: PropTypes.any,
   value: PropTypes.any,
   color: PropTypes.any,
-  in_progress: PropTypes.bool
+  in_progress: PropTypes.bool,
 };
 
 export const ConceptSummary = ({
-  concept: { status, version, last_change_at, last_change_user, in_progress }
+  concept: { status, version, last_change_at, last_change_user, in_progress },
 }) => (
   <Segment>
     <Header as="h3" dividing>
@@ -41,7 +41,12 @@ export const ConceptSummary = ({
 
     <FieldValue
       field="status"
-      value={<FormattedMessage id={`concepts.status.${status}`} />}
+      value={
+        <FormattedMessage
+          id={`concepts.status.${status}`}
+          defaultMessage={status}
+        />
+      }
       color={mapStatusColor[status]}
       in_progress={in_progress}
     />
@@ -60,12 +65,12 @@ export const ConceptSummary = ({
 );
 
 ConceptSummary.propTypes = {
-  concept: PropTypes.object
+  concept: PropTypes.object,
 };
 
-const mapStateToProps = state => ({
+const mapStateToProps = (state) => ({
   concept: state.concept,
-  fieldValues: getFieldValues(state)
+  fieldValues: getFieldValues(state),
 });
 
 export default connect(mapStateToProps)(ConceptSummary);

package/src/concepts/components/ConceptTaxonomy.js

@@ -6,12 +6,9 @@ import { List, Header, Segment } from "semantic-ui-react";
 import { FormattedMessage } from "react-intl";
 import { getConceptDomainPath } from "../selectors";
 import DomainItem from "../../taxonomy/components/DomainItem";
+import DomainsConceptLoader from "../../taxonomy/components/DomainsConceptLoader";
 import ConceptManageDomainPopup from "./ConceptManageDomainPopup";
 
-const DomainsConceptLoader = React.lazy(() =>
-  import("../../taxonomy/components/DomainsConceptLoader")
-);
-
 export const ConceptTaxonomy = ({ domainPath }) =>
   _.negate(_.isEmpty)(domainPath) && (
     <Segment>

package/src/concepts/components/Concepts.js

@@ -1,17 +1,11 @@
 import React from "react";
 import PropTypes from "prop-types";
-import { connect } from "react-redux";
-import { Dimmer, Header, Icon, Loader, Segment } from "semantic-ui-react";
+import { Header, Icon, Segment } from "semantic-ui-react";
 import { FormattedMessage } from "react-intl";
-import ConceptsActions from "./ConceptsActions";
 import ConceptCrumbs from "./ConceptCrumbs";
-import ConceptsLabelResults from "./ConceptsLabelResults";
-import ConceptsPagination from "./ConceptsPagination";
-import ConceptsSearch from "./ConceptsSearch";
-import ConceptsTable from "./ConceptsTable";
-import ConceptSelectedFilters from "./ConceptSelectedFilters";
+import ConceptsPanel from "./ConceptsPanel";
 
-export const Concepts = ({ loading, header, subheader, icon, ...actions }) => (
+export const Concepts = ({ header, subheader, icon }) => (
   <>
     <ConceptCrumbs />
     <Segment>
@@ -25,17 +19,7 @@ export const Concepts = ({ loading, header, subheader, icon, ...actions }) => (
         </Header.Content>
       </Header>
       <Segment attached="bottom">
-        <ConceptsActions {...actions} />
-        <ConceptsSearch />
-        <ConceptSelectedFilters />
-        <Dimmer.Dimmable dimmed={loading}>
-          <Dimmer active={loading} inverted>
-            <Loader />
-          </Dimmer>
-          <ConceptsLabelResults />
-          <ConceptsTable />
-          <ConceptsPagination />
-        </Dimmer.Dimmable>
+        <ConceptsPanel />
       </Segment>
     </Segment>
   </>
@@ -44,12 +28,7 @@ export const Concepts = ({ loading, header, subheader, icon, ...actions }) => (
 Concepts.propTypes = {
   header: PropTypes.string,
   icon: PropTypes.string,
-  loading: PropTypes.bool,
-  subheader: PropTypes.string
+  subheader: PropTypes.string,
 };
 
-const mapStateToProps = ({ conceptsLoading }) => ({
-  loading: conceptsLoading
-});
-
-export default connect(mapStateToProps)(Concepts);
+export default Concepts;

package/src/concepts/components/ConceptsActions.js

@@ -23,8 +23,8 @@ export const ConceptsActions = ({
   create,
   createUrl,
   conceptsDownloading,
-  conceptActionsLoaded,
   downloadConcepts,
+  hidden,
   upload,
 }) => {
   const { formatMessage } = useIntl();
@@ -32,7 +32,7 @@ export const ConceptsActions = ({
     _.map((l) => [l, formatMessage({ id: `concepts.props.${l}` })]),
     _.fromPairs
   )(staticLabels);
-  return conceptActionsLoaded ? (
+  return hidden ? null : (
     <div>
       {create && createUrl && (
         <Button
@@ -56,25 +56,27 @@ export const ConceptsActions = ({
       {upload && <ConceptsUploadButton />}
       <ConceptsUpdateButton />
     </div>
-  ) : null;
+  );
 };
 
 ConceptsActions.propTypes = {
   conceptsDownloading: PropTypes.bool,
-  conceptActionsLoaded: PropTypes.bool,
+  hidden: PropTypes.bool,
   create: PropTypes.bool,
   createUrl: PropTypes.string,
   downloadConcepts: PropTypes.func,
   upload: PropTypes.bool,
 };
 
-const mapStateToProps = (state) => ({
+const mapStateToProps = ({
+  conceptActions,
+  conceptsActions,
+  conceptsDownloading,
+}) => ({
   createUrl:
-    _.isEmpty(state.conceptActions) &&
-    _.has("create")(state.conceptsActions) &&
-    CONCEPTS_NEW,
-  conceptsDownloading: state.conceptsDownloading,
-  conceptActionsLoaded: _.negate(_.isEmpty)(state.conceptsActions),
+    _.isEmpty(conceptActions) && conceptsActions?.create ? CONCEPTS_NEW : null,
+  conceptsDownloading: conceptsDownloading,
+  hidden: _.isEmpty(conceptsActions),
 });
 
 export default connect(mapStateToProps, { downloadConcepts, uploadConcepts })(

package/src/concepts/components/ConceptsLoader.js

@@ -1,26 +1,15 @@
-import _ from "lodash/fp";
 import { useEffect } from "react";
 import PropTypes from "prop-types";
 import { connect } from "react-redux";
 import { makeSearchQuerySelector } from "@truedat/core/selectors";
-import {
-  clearConcepts,
-  clearConceptDefaultFilters,
-  fetchConcepts,
-} from "../routines";
+import { clearConcepts, fetchConcepts } from "../routines";
 
-export const ConceptsLoader = ({
-  clearConcepts,
-  clearConceptDefaultFilters,
-  fetchConcepts,
-  payload,
-}) => {
+export const ConceptsLoader = ({ clearConcepts, fetchConcepts, payload }) => {
   useEffect(() => {
     return () => {
       clearConcepts();
-      clearConceptDefaultFilters();
     };
-  }, [clearConcepts, clearConceptDefaultFilters]);
+  }, [clearConcepts]);
   useEffect(() => {
     fetchConcepts(payload);
   }, [payload, fetchConcepts]);
@@ -33,27 +22,17 @@ ConceptsLoader.propTypes = {
   payload: PropTypes.object,
 };
 
-const defaultFilters = (defaultFilters, conceptsDefaultFilters) =>
-  defaultFilters || conceptsDefaultFilters;
 const makeMapStateToProps = () => {
   const searchQuerySelector = makeSearchQuerySelector(
     "conceptQuery",
     "conceptActiveFilters"
   );
   const mapStateToProps = (state, props) => ({
-    payload: searchQuerySelector(state, {
-      ...props,
-      defaultFilters: defaultFilters(
-        _.prop("defaultFilters")(props),
-        _.prop("conceptsDefaultFilters")(state)
-      ),
-    }),
+    payload: searchQuerySelector(state, props),
   });
   return mapStateToProps;
 };
 
-export default connect(makeMapStateToProps, {
-  clearConcepts,
-  clearConceptDefaultFilters,
-  fetchConcepts,
-})(ConceptsLoader);
+export default connect(makeMapStateToProps, { clearConcepts, fetchConcepts })(
+  ConceptsLoader
+);

package/src/concepts/components/ConceptsPanel.js

@@ -0,0 +1,34 @@
+import React from "react";
+import PropTypes from "prop-types";
+import { connect } from "react-redux";
+import { Dimmer, Loader } from "semantic-ui-react";
+import ConceptsActions from "./ConceptsActions";
+import ConceptsLabelResults from "./ConceptsLabelResults";
+import ConceptsPagination from "./ConceptsPagination";
+import ConceptsSearch from "./ConceptsSearch";
+import ConceptsTable from "./ConceptsTable";
+import ConceptSelectedFilters from "./ConceptSelectedFilters";
+
+export const ConceptsPanel = ({ loading, ...actions }) => (
+  <>
+    <ConceptsActions {...actions} />
+    <ConceptsSearch />
+    <ConceptSelectedFilters />
+    <Dimmer.Dimmable dimmed={loading}>
+      <Dimmer active={loading} inverted>
+        <Loader />
+      </Dimmer>
+      <ConceptsLabelResults />
+      <ConceptsTable />
+      <ConceptsPagination />
+    </Dimmer.Dimmable>
+  </>
+);
+
+ConceptsPanel.propTypes = {
+  loading: PropTypes.bool,
+};
+
+const mapStateToProps = ({ conceptsLoading }) => ({ loading: conceptsLoading });
+
+export default connect(mapStateToProps)(ConceptsPanel);

package/src/concepts/components/ConceptsTable.js

@@ -7,14 +7,15 @@ import { Table, Header, Icon } from "semantic-ui-react";
 import { FormattedMessage } from "react-intl";
 import { withRouter } from "react-router";
 import { getSortInfo, sortColumn } from "@truedat/core/services/sort";
-import { CONCEPTS, CONCEPTS_PENDING } from "@truedat/core/routes";
+import { CONCEPTS } from "@truedat/core/routes";
 import { sortConcepts } from "../routines";
 import { getConceptsRows, getConceptColumns } from "../selectors";
 import ConceptRow from "./ConceptRow";
 
 export class ConceptsTable extends React.Component {
   static propTypes = {
-    conceptsLoading: PropTypes.bool,
+    loading: PropTypes.bool,
+    sortBy: PropTypes.array,
     concepts: PropTypes.array,
     columns: PropTypes.array,
     location: PropTypes.object,
@@ -23,8 +24,8 @@ export class ConceptsTable extends React.Component {
 
   //initial state
   state = {
-    sortedColumn: _.prop("column")(getSortInfo(this.props.conceptsSorting)),
-    direction: _.prop("direction")(getSortInfo(this.props.conceptsSorting)),
+    sortedColumn: _.prop("column")(getSortInfo(this.props.sortBy)),
+    direction: _.prop("direction")(getSortInfo(this.props.sortBy)),
   };
 
   setDirection = (direction) => {
@@ -36,25 +37,23 @@ export class ConceptsTable extends React.Component {
   };
 
   componentDidUpdate(prevProps) {
-    if (prevProps.conceptsSorting != this.props.conceptsSorting) {
+    if (prevProps.sortBy != this.props.sortBy) {
       const { column: sortedColumn, direction: direction } = getSortInfo(
-        this.props.conceptsSorting
+        this.props.sortBy
       );
       this.setState({ sortedColumn, direction });
     }
   }
 
   render() {
-    const { concepts, columns, conceptsLoading, location, sortConcepts } =
-      this.props;
-
+    const { concepts, columns, loading, location, sortConcepts } = this.props;
     const { sortedColumn, direction } = this.state;
 
     const pathname = _.prop("pathname")(location);
     const conceptColumns = columns.filter(
       (column) =>
-        (pathname == CONCEPTS && column.name != "status") ||
-        pathname == CONCEPTS_PENDING
+        (pathname === CONCEPTS && column.name != "status") ||
+        pathname !== CONCEPTS
     );
 
     return (
@@ -100,7 +99,7 @@ export class ConceptsTable extends React.Component {
             </Table.Body>
           </Table>
         )}
-        {_.isEmpty(concepts) && !conceptsLoading && (
+        {loading || concepts?.length ? null : (
           <Header as="h4">
             <Icon name="search" />
             <Header.Content>
@@ -116,8 +115,8 @@ export class ConceptsTable extends React.Component {
 const mapStateToProps = (state) => ({
   columns: getConceptColumns(state),
   concepts: getConceptsRows(state),
-  conceptsLoading: state.conceptsLoading,
-  conceptsSorting: _.path("conceptQuery.sort")(state),
+  loading: state.conceptsLoading,
+  sortBy: _.path("conceptQuery.sort")(state),
 });
 
 export default compose(

package/src/concepts/components/DomainConcepts.js

@@ -0,0 +1,29 @@
+import React from "react";
+import PropTypes from "prop-types";
+import { connect } from "react-redux";
+import ConceptsPanel from "./ConceptsPanel";
+import ConceptsLoader from "./ConceptsLoader";
+import ConceptFiltersLoader from "./ConceptFiltersLoader";
+
+export const DomainConcepts = ({ domain = {} }) => {
+  const defaultFilters = {
+    taxonomy: [domain.id],
+    current: [true],
+    status: ["published"],
+  };
+  return (
+    <>
+      <ConceptFiltersLoader defaultFilters={defaultFilters} />
+      <ConceptsLoader defaultFilters={defaultFilters} />
+      <ConceptsPanel />
+    </>
+  );
+};
+
+DomainConcepts.propTypes = {
+  domain: PropTypes.object.isRequired,
+};
+
+export const mapStateToProps = ({ domain }) => ({ domain });
+
+export default connect(mapStateToProps)(DomainConcepts);

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

@@ -1,26 +1,23 @@
 import React from "react";
-import { shallow } from "enzyme";
+import { render } from "@truedat/test/render";
 import ConceptArchiveRow from "../ConceptArchiveRow";
 
-const mockHistory = {
-  push: jest.fn()
-};
-
-jest.mock("react-router-dom", () => ({
-  ...jest.requireActual("react-router-dom"),
-  useHistory: () => mockHistory
-}));
-
 describe("<ConceptArchiveRow />", () => {
   it("matches the latest snapshot", () => {
     const props = {
       id: 123,
-      status: "status",
+      status: "draft",
       last_change_at: "2018-06-27T07:32:53.154377Z",
       last_change_by: "maixu",
-      version: 1
+      version: 1,
     };
-    const wrapper = shallow(<ConceptArchiveRow {...props} />);
-    expect(wrapper).toMatchSnapshot();
+    const { container } = render(
+      <table>
+        <tbody>
+          <ConceptArchiveRow {...props} />
+        </tbody>
+      </table>
+    );
+    expect(container).toMatchSnapshot();
   });
 });