@truedat/bg 7.2.11 → 7.3.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@truedat/bg",
-  "version": "7.2.11",
+  "version": "7.3.0",
   "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.2.11",
+    "@truedat/test": "7.3.0",
     "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.2.11",
-    "@truedat/df": "7.2.11",
-    "@truedat/lm": "7.2.11",
+    "@truedat/core": "7.3.0",
+    "@truedat/df": "7.3.0",
+    "@truedat/lm": "7.3.0",
     "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": "74eb04f81dd49275229cf3050b56b897ff78410e"
+  "gitHead": "cbf85fe17b535953689418b85658cc804d095dfb"
 }

package/src/concepts/components/ConceptCompleteness.js

@@ -5,15 +5,23 @@ import { connect } from "react-redux";
 import { List, Header, Progress, Segment, Icon } from "semantic-ui-react";
 import { FormattedMessage } from "react-intl";
 import { isRequired } from "@truedat/df/utils";
-import { useLanguage } from "@truedat/core/i18n";
+import { useLanguage, I18nProvider } from "@truedat/core/i18n";
 import { splitTranslatableFields } from "@truedat/core/services/i18nContent";
 
-const missingRequiredFields = (concept, content) => {
+const fetchMissingRequiredFields = (
+  concept,
+  content,
+  isDefault,
+  splitFields
+) => {
   return _.flow(
     _.path("template.content"),
     _.flatMap(({ fields }) =>
       _.filter((field) => {
         const name = field?.name;
+        if (!isDefault && !splitFields.translatable[name]) {
+          return false;
+        }
         const value = _.prop(name)(content);
         return (
           !_.isNumber(value) &&
@@ -32,7 +40,14 @@ export const Completeness = ({
   langLocalName,
   concept,
   content,
+  isRequired,
+  isDefault,
+  splitFields,
 }) => {
+  const missingRequiredFields =
+    isRequired && !_.includes(status)(["published", "versioned"])
+      ? fetchMissingRequiredFields(concept, content, isDefault, splitFields)
+      : [];
   return (
     <>
       <Header as="h3" dividing>
@@ -55,16 +70,15 @@ export const Completeness = ({
         percent={completeness}
         progress
       />
-      {_.negate(_.isEmpty)(missingRequiredFields(concept, content)) &&
-        !_.includes(status)(["published", "versioned"]) && (
-          <>
-            <Header as="h4" dividing>
-              <FormattedMessage
-                id="concepts.props.missing_fields"
-                defaultMessage="Missing required fields"
-              />
-            </Header>
-
+      {!_.isEmpty(missingRequiredFields) && (
+        <>
+          <Header as="h4" dividing>
+            <FormattedMessage
+              id="concepts.props.missing_fields"
+              defaultMessage="Missing required fields"
+            />
+          </Header>
+          <I18nProvider lang={lang}>
             <List>
               {_.map.convert({ cap: false })(({ label }, i) => (
                 <List.Item key={i}>
@@ -76,10 +90,11 @@ export const Completeness = ({
                     />
                   ) : null}
                 </List.Item>
-              ))(missingRequiredFields(concept, content))}
+              ))(missingRequiredFields)}
             </List>
-          </>
-        )}
+          </I18nProvider>
+        </>
+      )}
     </>
   );
 };
@@ -91,6 +106,9 @@ Completeness.propTypes = {
   lang: PropTypes.string,
   langLocalName: PropTypes.string,
   content: PropTypes.object,
+  isRequired: PropTypes.bool,
+  isDefault: PropTypes.bool,
+  splitFields: PropTypes.object,
 };
 
 export const ConceptCompleteness = ({ concept }) => {
@@ -101,19 +119,15 @@ export const ConceptCompleteness = ({ concept }) => {
   const status = _.get("status")(concept);
 
   const i18nContent = concept.i18n_content || {};
-
-  const { noTranslatable: noTranslatableFields } = splitTranslatableFields(
-    concept.template
-  );
-
-  const noTranslatableContent = _.pick(_.keys(noTranslatableFields))(
+  const splitFields = splitTranslatableFields(concept.template);
+  const noTranslatableContent = _.pick(_.keys(splitFields.noTranslatable))(
     concept.content
   );
+
   const i18nConcept = _.flow(
-    _.filter(({ is_enabled, is_required }) => is_enabled && is_required),
+    _.filter(({ is_enabled }) => is_enabled),
     _.map(({ id, lang, is_default, is_required, local_name }) => {
       const contentLang = _.get(lang)(i18nContent);
-
       const langContent = is_default
         ? content
         : { ...noTranslatableContent, ...contentLang?.content };
@@ -139,8 +153,15 @@ export const ConceptCompleteness = ({ concept }) => {
 
   return (
     <Segment className="completeness">
-      {_.map(({ completeness, lang, langLocalName, content, isRequired }) => {
-        return isRequired == true ? (
+      {_.map(
+        ({
+          completeness,
+          lang,
+          langLocalName,
+          content,
+          isRequired,
+          isDefault,
+        }) => (
           <Completeness
             key={lang}
             status={status}
@@ -149,9 +170,12 @@ export const ConceptCompleteness = ({ concept }) => {
             langLocalName={_.size(i18nConcept) > 1 ? langLocalName : null}
             concept={concept}
             content={content}
+            isRequired={isRequired}
+            isDefault={isDefault}
+            splitFields={splitFields}
           />
-        ) : null;
-      })(i18nConcept)}
+        )
+      )(i18nConcept)}
     </Segment>
   );
 };

package/src/concepts/components/ConceptCreate.js

@@ -3,35 +3,23 @@ import React, { useState, useEffect } from "react";
 import PropTypes from "prop-types";
 import { connect } from "react-redux";
 import { useLanguage } from "@truedat/core/i18n";
-import {
-  splitTranslatableFields,
-  formatLocales,
-} from "@truedat/core/services/i18nContent";
+import { splitTranslatableFields } from "@truedat/core/services/i18nContent";
 import { conceptAction } from "../routines";
 import { useConceptVersionsActions } from "../hooks/useConcepts";
-import ConceptForms from "./ConceptForms";
+import ConceptForm from "./ConceptForm";
 
 const actionKey = "create";
 
 const ConceptCreate = ({ conceptActionLoading, conceptAction }) => {
-  const { locales } = useLanguage();
+  const { locales, defaultLang, altLangs } = useLanguage();
   const { actions: conceptsActions } = useConceptVersionsActions();
 
   const [i18nConcept, setI18nConcept] = useState({});
   const [domainId, setDomainId] = useState();
   const [template, setTemplate] = useState();
-  const [translatableKeys, setTranslatableKeys] = useState([]);
-  const [noTranslatableKeys, setNoTranslatableKeys] = useState([]);
 
   useEffect(() => {
     const templateFields = splitTranslatableFields(template);
-
-    const translatableFields = _.keys(templateFields.translatable);
-    const noTranslatableFields = _.keys(templateFields.noTranslatable);
-
-    setTranslatableKeys(translatableFields);
-    setNoTranslatableKeys(noTranslatableFields);
-
     const updateI18nConcept = _.flow(
       _.map((langContent) => ({
         ...langContent,
@@ -42,37 +30,41 @@ const ConceptCreate = ({ conceptActionLoading, conceptAction }) => {
       _.keyBy("lang")
     )(i18nConcept);
 
-    setI18nConcept(updateI18nConcept);
+    if (!_.isEqual(i18nConcept, updateI18nConcept)) {
+      setI18nConcept(updateI18nConcept);
+    }
   }, [template]);
 
-  if (_.isEmpty(i18nConcept)) {
-    const i18nConceptInit = _.flow(
-      _.filter(({ is_enabled }) => is_enabled),
-      _.map(({ id, lang, is_default, is_required }) => {
-        return { id, lang, is_default, is_required, name: "", content: {} };
-      }),
-      _.keyBy("lang")
-    )(locales);
-
-    if (i18nConceptInit) setI18nConcept(i18nConceptInit);
-  }
+  useEffect(() => {
+    if (_.isEmpty(i18nConcept)) {
+      const i18nConceptInit = _.flow(
+        _.filter(({ is_enabled }) => is_enabled),
+        _.map(({ id, lang, is_default, is_required }) => {
+          return { id, lang, is_default, is_required, name: "", content: {} };
+        }),
+        _.keyBy("lang")
+      )(locales);
+      setI18nConcept(i18nConceptInit);
+    }
+  }, [locales]);
 
   const action = _.prop(actionKey)(conceptsActions);
 
-  const langs = formatLocales(locales);
-
   const handleSubmit = (e) => {
     e.preventDefault();
-    const defaultContent = _.flow(_.find("is_default"))(i18nConcept);
+
+    const defaultContent = i18nConcept[defaultLang];
+
+    const { translatable } = splitTranslatableFields(template);
+    const translatableKeys = Object.keys(translatable);
 
     const i18nSendConcept = _.flow(
-      _.omit(defaultContent.lang),
+      _.pick(altLangs),
       _.omitBy(({ name, is_required }) => _.isEmpty(name) && !is_required),
-      _.mapValues((langConcept) =>
-        _.flow(_.pick(["name", "content"]), ({ name, content }) => {
-          return { name, content: _.pick(translatableKeys)(content) };
-        })(langConcept)
-      )
+      _.mapValues((langConcept) => ({
+        name: langConcept.name,
+        content: _.pick(translatableKeys, langConcept.content),
+      }))
     )(i18nConcept);
 
     const business_concept_version = {
@@ -89,16 +81,14 @@ const ConceptCreate = ({ conceptActionLoading, conceptAction }) => {
       business_concept_version,
     });
   };
+
   return (
-    <ConceptForms
+    <ConceptForm
       actionKey={actionKey}
       domainId={domainId}
       template={template}
       i18nConcept={i18nConcept}
       loading={conceptActionLoading}
-      langs={langs}
-      noTranslatableFields={noTranslatableKeys}
-      translatableFields={translatableKeys}
       setI18nConcept={setI18nConcept}
       setDomainId={setDomainId}
       setTemplate={setTemplate}

package/src/concepts/components/ConceptEdit.js

@@ -5,20 +5,16 @@ import { compose } from "redux";
 import { connect } from "react-redux";
 import { applyTemplate } from "@truedat/df/utils";
 import { useLanguage } from "@truedat/core/i18n";
-import {
-  splitTranslatableFields,
-  formatLocales,
-} from "@truedat/core/services/i18nContent";
+import { splitTranslatableFields } from "@truedat/core/services/i18nContent";
 import { useTemplate } from "@truedat/core/hooks";
 import { conceptAction } from "../routines";
-import ConceptForms from "./ConceptForms";
+import ConceptForm from "./ConceptForm";
 const actionKey = "update";
 
 export const ConceptEdit = ({
   concept,
   content,
-  loading,
-  locales,
+  templateLoading,
   localesLoading,
   template,
   action,
@@ -26,27 +22,24 @@ export const ConceptEdit = ({
   processedContent,
 }) => {
   const { domain } = concept;
-
   const [i18nConcept, setI18nConcept] = useState(content);
+  const { defaultLang, altLangs } = useLanguage();
 
   const templateFields = splitTranslatableFields(template);
 
   const translatableKeys = _.keys(templateFields.translatable);
-  const noTranslatableKeys = _.keys(templateFields.noTranslatable);
-  const langs = formatLocales(locales);
 
   const handleSubmit = (e) => {
     e.preventDefault();
-    const defaultContent = _.flow(_.find("is_default"))(i18nConcept);
+    const defaultContent = i18nConcept[defaultLang];
 
     const i18nSendConcept = _.flow(
-      _.omit(defaultContent.lang),
+      _.pick(altLangs),
       _.omitBy(({ name, is_required }) => _.isEmpty(name) && !is_required),
-      _.mapValues((langConcept) =>
-        _.flow(_.pick(["name", "content"]), ({ name, content }) => {
-          return { name, content: _.pick(translatableKeys)(content) };
-        })(langConcept)
-      )
+      _.mapValues((langConcept) => ({
+        name: langConcept.name,
+        content: _.pick(translatableKeys, langConcept.content),
+      }))
     )(i18nConcept);
 
     const newContent = processedContent(defaultContent.content, domain?.id);
@@ -68,15 +61,12 @@ export const ConceptEdit = ({
 
   return (
     <>
-      <ConceptForms
+      <ConceptForm
         actionKey={actionKey}
         domainId={domain.id}
         template={template}
         i18nConcept={i18nConcept}
-        loading={loading || localesLoading}
-        langs={langs}
-        noTranslatableFields={noTranslatableKeys}
-        translatableFields={translatableKeys}
+        loading={templateLoading || localesLoading}
         setI18nConcept={setI18nConcept}
         onSubmit={handleSubmit}
         setTemplate={() => null} // In ConceptEdit, the template is already selected and cannot be changed
@@ -88,9 +78,12 @@ export const ConceptEdit = ({
 ConceptEdit.propTypes = {
   action: PropTypes.object,
   concept: PropTypes.object,
+  content: PropTypes.object.isRequired,
+  templateLoading: PropTypes.bool,
+  localesLoading: PropTypes.bool,
+  template: PropTypes.object,
   conceptAction: PropTypes.func.isRequired,
-  templateName: PropTypes.string,
-  loading: PropTypes.bool,
+  processedContent: PropTypes.func.isRequired,
 };
 
 export const ConceptEditLoader = (props) => {