@truedat/df 8.7.0 → 8.7.2

package/src/templates/components/templateForm/FieldDefinition.js

@@ -5,154 +5,151 @@ import { useIntl } from "react-intl";
 import { useEffect } from "react";
 
 import {
-    getCardinalityOptions,
-    getWidgetOptions,
-    getTypeOptions,
-    WIDGETS,
+  getCardinalityOptions,
+  getWidgetOptions,
+  getTypeOptions,
+  WIDGETS,
 } from "./widgetDefinitions";
 import { getValues } from "./valueDefinitions";
 
 const defaultType = (values) => _.flow(_.map("value"), _.first)(values);
 
 const FieldDefinition = ({
-    allowedTypes = [],
-    allowedWidgets = [],
-    cardinality,
-    defaultField,
-    fieldNamePrefix,
-    mandatory,
-    onChange,
-    subscribableField,
-    type,
-    valueName,
-    widget,
+  allowedTypes = [],
+  allowedWidgets = [],
+  cardinality,
+  defaultField,
+  fieldNamePrefix,
+  mandatory,
+  onChange,
+  subscribableField,
+  type,
+  valueName,
+  widget,
 }) => {
-    const { formatMessage } = useIntl();
+  const { formatMessage } = useIntl();
 
-    const changeValue = (name, value) =>
-        value == "null"
-            ? onChange(null, { name, value: null })
-            : onChange(null, {
-                name,
-                value: { [value]: null },
-            });
-
-    const handleTypeChange = (e, data) => {
-        const { value } = data;
-        changeValue(valueName, defaultType(getValues(widget, value)) || "null");
-        onChange(e, {
-            name: defaultField,
-            value: { value: "", origin: "default" },
+  const changeValue = (name, value) =>
+    value == "null"
+      ? onChange(null, { name, value: null })
+      : onChange(null, {
+          name,
+          value: { [value]: null },
         });
-        onChange(e, { name: subscribableField, value: false });
-        onChange(e, data);
-    };
 
-    const handleCardinalityChange = (e, data) => {
-        const value = data?.value;
-        onChange(e, data);
-        if (_.includes(value)(["1", "+"]) && !_.isEmpty(mandatory))
-            onChange(e, { name: `${fieldNamePrefix}.mandatory`, value: null });
-    };
+  const handleTypeChange = (e, data) => {
+    const { value } = data;
+    changeValue(valueName, defaultType(getValues(widget, value)) || "null");
+    onChange(e, {
+      name: defaultField,
+      value: { value: "", origin: "default" },
+    });
+    onChange(e, { name: subscribableField, value: false });
+    onChange(e, data);
+  };
 
-    const handleWidgetChange = (e, data) => {
-        const { value } = data;
-        const types = _.find({ value })(WIDGETS).types;
-        const updatedType = _.indexOf(type)(types) < 0 ? _.head(types) : type;
-        changeValue(
-            valueName,
-            defaultType(getValues(value, updatedType)) || "null",
-        );
-        onChange(e, {
-            name: defaultField,
-            value: { value: "", origin: "default" },
-        });
-        onChange(e, { name: subscribableField, value: false });
-        onChange(e, data);
-    };
+  const handleCardinalityChange = (e, data) => {
+    const value = data?.value;
+    onChange(e, data);
+    if (_.includes(value)(["1", "+"]) && !_.isEmpty(mandatory))
+      onChange(e, { name: `${fieldNamePrefix}.mandatory`, value: null });
+  };
 
-    const typeCheckOnChange = (widgetOption) => {
-        if (widgetOption && _.indexOf(type)(widgetOption.types) < 0)
-            onChange(null, {
-                name: `${fieldNamePrefix}.type`,
-                value: widgetOption.types[0],
-            });
-    };
+  const handleWidgetChange = (e, data) => {
+    const { value } = data;
+    const types = _.find({ value })(WIDGETS).types;
+    const updatedType = _.indexOf(type)(types) < 0 ? _.head(types) : type;
+    changeValue(
+      valueName,
+      defaultType(getValues(value, updatedType)) || "null",
+    );
+    onChange(e, {
+      name: defaultField,
+      value: { value: "", origin: "default" },
+    });
+    onChange(e, { name: subscribableField, value: false });
+    onChange(e, data);
+  };
 
-    const cardinalityCheckOnChange = (widgetOption) => {
-        if (
-            widgetOption &&
-            _.indexOf(cardinality)(widgetOption.cardinalities) < 0
-        )
-            onChange(null, {
-                name: `${fieldNamePrefix}.cardinality`,
-                value: widgetOption.cardinalities[0],
-            });
-    };
+  const typeCheckOnChange = (widgetOption) => {
+    if (widgetOption && _.indexOf(type)(widgetOption.types) < 0)
+      onChange(null, {
+        name: `${fieldNamePrefix}.type`,
+        value: widgetOption.types[0],
+      });
+  };
 
-    //On widget change, verify if type and cardinality are still valid
-    useEffect(() => {
-        const widgetOption = _.find({ value: widget })(WIDGETS);
-        typeCheckOnChange(widgetOption);
-        cardinalityCheckOnChange(widgetOption);
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [widget, type]);
+  const cardinalityCheckOnChange = (widgetOption) => {
+    if (widgetOption && _.indexOf(cardinality)(widgetOption.cardinalities) < 0)
+      onChange(null, {
+        name: `${fieldNamePrefix}.cardinality`,
+        value: widgetOption.cardinalities[0],
+      });
+  };
 
-    const widgetOptions = _.isEmpty(allowedWidgets)
-        ? getWidgetOptions()
-        : _.filter((widget) => allowedWidgets.includes(widget.value))(
-            getWidgetOptions(),
-        );
-    const typeOptions = _.isEmpty(allowedTypes)
-        ? getTypeOptions(widget)
-        : _.filter((type) => allowedTypes.includes(type.value))(
-            getTypeOptions(widget),
-        );
+  //On widget change, verify if type and cardinality are still valid
+  useEffect(() => {
+    const widgetOption = _.find({ value: widget })(WIDGETS);
+    typeCheckOnChange(widgetOption);
+    cardinalityCheckOnChange(widgetOption);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [widget, type]);
 
-    return (
-        <Form.Group size="small" widths="equal">
-            <Form.Dropdown
-                name={`${fieldNamePrefix}.widget`}
-                fluid
-                selection
-                label={formatMessage({ id: "template.field.widget" })}
-                value={widget}
-                options={widgetOptions}
-                required
-                onChange={handleWidgetChange}
-            />
-            <Form.Dropdown
-                fluid
-                selection
-                label={formatMessage({ id: "template.field.type" })}
-                onChange={handleTypeChange}
-                name={`${fieldNamePrefix}.type`}
-                value={type}
-                required
-                options={typeOptions}
-            />
-            <Form.Dropdown
-                fluid
-                selection
-                label={formatMessage({ id: "template.field.cardinality" })}
-                name={`${fieldNamePrefix}.cardinality`}
-                value={cardinality}
-                onChange={handleCardinalityChange}
-                required
-                options={getCardinalityOptions(widget)}
-            />
-        </Form.Group>
-    );
+  const widgetOptions = _.isEmpty(allowedWidgets)
+    ? getWidgetOptions()
+    : _.filter((widget) => allowedWidgets.includes(widget.value))(
+        getWidgetOptions(),
+      );
+  const typeOptions = _.isEmpty(allowedTypes)
+    ? getTypeOptions(widget)
+    : _.filter((type) => allowedTypes.includes(type.value))(
+        getTypeOptions(widget),
+      );
+
+  return (
+    <Form.Group size="small" widths="equal">
+      <Form.Dropdown
+        name={`${fieldNamePrefix}.widget`}
+        fluid
+        selection
+        label={formatMessage({ id: "template.field.widget" })}
+        value={widget}
+        options={widgetOptions}
+        required
+        onChange={handleWidgetChange}
+      />
+      <Form.Dropdown
+        fluid
+        selection
+        label={formatMessage({ id: "template.field.type" })}
+        onChange={handleTypeChange}
+        name={`${fieldNamePrefix}.type`}
+        value={type}
+        required
+        options={typeOptions}
+      />
+      <Form.Dropdown
+        fluid
+        selection
+        label={formatMessage({ id: "template.field.cardinality" })}
+        name={`${fieldNamePrefix}.cardinality`}
+        value={cardinality}
+        onChange={handleCardinalityChange}
+        required
+        options={getCardinalityOptions(widget)}
+      />
+    </Form.Group>
+  );
 };
 
 FieldDefinition.propTypes = {
-    fieldNamePrefix: PropTypes.string,
-    handleWidgetChange: PropTypes.func,
-    handleTypeChange: PropTypes.func,
-    handleCardinalityChange: PropTypes.func,
-    type: PropTypes.string,
-    widget: PropTypes.string,
-    cardinality: PropTypes.string,
+  fieldNamePrefix: PropTypes.string,
+  handleWidgetChange: PropTypes.func,
+  handleTypeChange: PropTypes.func,
+  handleCardinalityChange: PropTypes.func,
+  type: PropTypes.string,
+  widget: PropTypes.string,
+  cardinality: PropTypes.string,
 };
 
 export default FieldDefinition;

package/src/templates/components/templateForm/HierarchiesList.js

@@ -15,7 +15,7 @@ export const HierarchiesList = ({ hierarchies, onChange, values, loading }) => {
 
   const options = _.flow(
     _.map(({ id, name }) => ({ text: name, value: id })),
-    _.sortBy("text")
+    _.sortBy("text"),
   )(hierarchies);
 
   return (

package/src/templates/components/templateForm/MandatoryConditional.js

@@ -16,13 +16,13 @@ export const MandatoryConditional = ({
   const fieldOptions = _.flow(
     _.reject({ name }),
     _.reject((field) => _.isEmpty(field?.values?.fixed)),
-    _.map(({ label, name }) => ({ text: label, value: name }))
+    _.map(({ label, name }) => ({ text: label, value: name })),
   )(allFields);
   const valueOptions = _.flow(
     _.find({ name: depends }),
     _.propOr([], "values.fixed"),
     _.reject(_.isNil),
-    _.map((value) => ({ text: value, value }))
+    _.map((value) => ({ text: value, value })),
   )(allFields);
   const handleChange = (e, { name, value }) => {
     if (_.includes("mandatory.on")(name) && !_.isEmpty(field?.mandatory?.to_be))

package/src/templates/components/templateForm/TemplateForm.js

@@ -17,7 +17,7 @@ const scopeOptions = (formatMessage) =>
       text: formatMessage({ id: `template.scope.${value}` }),
       value,
     })),
-    _.sortBy("text")
+    _.sortBy("text"),
   )([
     "bg",
     "dd",
@@ -66,55 +66,58 @@ export const TemplateForm = ({ loading, template, onSubmit }) => {
     });
 
   const handleRelationsChange = useCallback((relations) => {
-    setEditedTemplate((prev) => _.assoc("template_resource_relations", relations)(prev));
+    setEditedTemplate((prev) =>
+      _.assoc("template_resource_relations", relations)(prev),
+    );
   }, []);
 
-  const formattedFields = (fields) => _.flow(
-    _.map((field) => {
-      const fieldProperties = [
-        "label",
-        "name",
-        "description",
-        "type",
-        "widget",
-        "cardinality",
-        "values",
-        "default",
-        "subscribable",
-        "editable",
-        "searchable",
-        "ai_suggestion",
-      ];
+  const formattedFields = (fields) =>
+    _.flow(
+      _.map((field) => {
+        const fieldProperties = [
+          "label",
+          "name",
+          "description",
+          "type",
+          "widget",
+          "cardinality",
+          "values",
+          "default",
+          "subscribable",
+          "editable",
+          "searchable",
+          "ai_suggestion",
+        ];
 
-      const dependsProperty = _.isEmpty(_.path("depends.on")(field))
-        ? []
-        : ["depends"];
-      const mandatoryProperty = _.isEmpty(_.path("mandatory.on")(field))
-        ? []
-        : ["mandatory"];
-      const allFields = _.flow(
-        _.concat(dependsProperty),
-        _.concat(mandatoryProperty))
-        (fieldProperties);
+        const dependsProperty = _.isEmpty(_.path("depends.on")(field))
+          ? []
+          : ["depends"];
+        const mandatoryProperty = _.isEmpty(_.path("mandatory.on")(field))
+          ? []
+          : ["mandatory"];
+        const allFields = _.flow(
+          _.concat(dependsProperty),
+          _.concat(mandatoryProperty),
+        )(fieldProperties);
 
-      if (field?.type === "dynamic_table") {
-        const tableColumns = formattedFields(field?.values?.table_columns);
-        return _.flow(
-          _.set("values.table_columns", tableColumns),
-          _.pick(allFields),
-          _.omit(["default"]))
-          (field);
-      }
-      return _.pick(allFields)(field);
-    })
-  )(fields);
+        if (field?.type === "dynamic_table") {
+          const tableColumns = formattedFields(field?.values?.table_columns);
+          return _.flow(
+            _.set("values.table_columns", tableColumns),
+            _.pick(allFields),
+            _.omit(["default"]),
+          )(field);
+        }
+        return _.pick(allFields)(field);
+      }),
+    )(fields);
 
   const handleSubmit = () => {
     const formattedContent = _.flow(
       _.prop("content"),
       _.map(({ name, fields }) => {
         return { name, fields: formattedFields(fields) };
-      })
+      }),
     )(editedTemplate);
 
     onSubmit({ template: { ...editedTemplate, content: formattedContent } });
@@ -213,7 +216,9 @@ export const TemplateForm = ({ loading, template, onSubmit }) => {
           label={formatMessage({ id: "template.form.subscope" })}
           value={subscopeValue}
           onChange={handleChange}
-          disabled={editedTemplate?.scope !== "bg" && editedTemplate?.scope !== "ri"}
+          disabled={
+            editedTemplate?.scope !== "bg" && editedTemplate?.scope !== "ri"
+          }
         />
       </Form.Group>
       {scopesWithRelations?.includes(editedTemplate.scope) && (

package/src/templates/components/templateForm/ValuesConfiguration.js

@@ -4,64 +4,77 @@ import { useIntl } from "react-intl";
 
 const searchableEnabledScopes = ["bg", "dq", "ie", "ri", "dd"];
 
-const ValuesConfiguration = ({ aiSuggestion, editable, searchable, fieldNamePrefix, hasAiSuggestion, keyType, onChange, scope, subscribable, subscribableField }) => {
-    const { formatMessage } = useIntl();
+const ValuesConfiguration = ({
+  aiSuggestion,
+  editable,
+  searchable,
+  fieldNamePrefix,
+  hasAiSuggestion,
+  keyType,
+  onChange,
+  scope,
+  subscribable,
+  subscribableField,
+}) => {
+  const { formatMessage } = useIntl();
 
-    return <Form.Group size="small" widths="equal">
+  return (
+    <Form.Group size="small" widths="equal">
+      <Form.Field>
+        <Form.Checkbox
+          name={`${fieldNamePrefix}.editable`}
+          label={formatMessage({
+            id: "template.field.editable",
+            defaultMessage: "Editable",
+          })}
+          checked={editable}
+          onChange={(e, { name, checked: value }) =>
+            onChange(null, { name, value })
+          }
+        />
+      </Form.Field>
+      {hasAiSuggestion ? (
         <Form.Field>
-            <Form.Checkbox
-                name={`${fieldNamePrefix}.editable`}
-                label={formatMessage({
-                    id: "template.field.editable",
-                    defaultMessage: "Editable",
-                })}
-                checked={editable}
-                onChange={(e, { name, checked: value }) =>
-                    onChange(null, { name, value })
-                }
-            />
+          <Form.Checkbox
+            name={`${fieldNamePrefix}.ai_suggestion`}
+            label={formatMessage({
+              id: "template.field.ai_suggestion",
+              defaultMessage: "AI Suggestions",
+            })}
+            checked={aiSuggestion}
+            onChange={(_e, { name, checked: value }) =>
+              onChange(null, { name, value })
+            }
+          />
         </Form.Field>
-        {hasAiSuggestion ? (
-            <Form.Field>
-                <Form.Checkbox
-                    name={`${fieldNamePrefix}.ai_suggestion`}
-                    label={formatMessage({
-                        id: "template.field.ai_suggestion",
-                        defaultMessage: "AI Suggestions",
-                    })}
-                    checked={aiSuggestion}
-                    onChange={(_e, { name, checked: value }) =>
-                        onChange(null, { name, value })
-                    }
-                />
-            </Form.Field>
-        ) : null}
-        {_.includes(scope)(searchableEnabledScopes) ? (
-            <Form.Field>
-                <Form.Checkbox
-                    name={`${fieldNamePrefix}.searchable`}
-                    label={formatMessage({
-                        id: "template.field.searchable",
-                        defaultMessage: "Sercheable",
-                    })}
-                    checked={searchable}
-                    onChange={(_e, { name, checked: value }) =>
-                        onChange(null, { name, value })
-                    }
-                />
-            </Form.Field>
-        ) : null}
-        {_.includes(keyType)(["fixed", "fixed_tuple"]) ? (
-            <Form.Checkbox
-                name={subscribableField}
-                label={formatMessage({ id: "template.field.subscribable" })}
-                checked={subscribable}
-                onChange={(_e, { name, checked: value }) =>
-                    onChange(null, { name, value })
-                }
-            />
-        ) : null}
+      ) : null}
+      {_.includes(scope)(searchableEnabledScopes) ? (
+        <Form.Field>
+          <Form.Checkbox
+            name={`${fieldNamePrefix}.searchable`}
+            label={formatMessage({
+              id: "template.field.searchable",
+              defaultMessage: "Sercheable",
+            })}
+            checked={searchable}
+            onChange={(_e, { name, checked: value }) =>
+              onChange(null, { name, value })
+            }
+          />
+        </Form.Field>
+      ) : null}
+      {_.includes(keyType)(["fixed", "fixed_tuple"]) ? (
+        <Form.Checkbox
+          name={subscribableField}
+          label={formatMessage({ id: "template.field.subscribable" })}
+          checked={subscribable}
+          onChange={(_e, { name, checked: value }) =>
+            onChange(null, { name, value })
+          }
+        />
+      ) : null}
     </Form.Group>
-}
+  );
+};
 
-export default ValuesConfiguration;
+export default ValuesConfiguration;

package/src/templates/components/templateForm/ValuesField.js

@@ -37,9 +37,9 @@ export const ValuesField = ({
     value == "null"
       ? onChange(null, { name, value: null })
       : onChange(null, {
-        name,
-        value: { [value]: null },
-      });
+          name,
+          value: { [value]: null },
+        });
 
   const onSelectionChange = (e, { value }) => {
     onChange(e, { name: subscribableField, value: false });
@@ -56,52 +56,52 @@ export const ValuesField = ({
   return field.cardinality == "0"
     ? null
     : valueSegment(values, keyType, fieldType) && (
-      <Segment>
-        {_.size(values) > 1 ? (
-          <Form.Dropdown
-            fluid
-            selection
-            label={formatMessage({ id: "template.field.values" })}
-            onChange={onSelectionChange}
-            value={keyType || "null"}
-            required
-            options={valueTypes(values)}
+        <Segment>
+          {_.size(values) > 1 ? (
+            <Form.Dropdown
+              fluid
+              selection
+              label={formatMessage({ id: "template.field.values" })}
+              onChange={onSelectionChange}
+              value={keyType || "null"}
+              required
+              options={valueTypes(values)}
+            />
+          ) : null}
+          {keyType ? (
+            <ValuesSelector
+              cardinality={field?.cardinality}
+              defaultField={defaultField}
+              defaultValue={field?.default}
+              name={name}
+              formatMessage={formatMessage}
+              onChange={onChange}
+              type={keyType}
+              values={_.path(`values.${keyType}`)(field)}
+            />
+          ) : null}
+          <ValuesConfiguration
+            aiSuggestion={ai_suggestion}
+            editable={editable}
+            keyType={keyType}
+            onChange={onChange}
+            searchable={searchable}
+            fieldNamePrefix={fieldNamePrefix}
+            hasAiSuggestion={hasAiSuggestion}
+            subscribableField={subscribableField}
+            subscribable={field?.subscribable}
+            scope={scope}
           />
-        ) : null}
-        {keyType ? (
-          <ValuesSelector
-            cardinality={field?.cardinality}
+          <DefaultValue
             defaultField={defaultField}
-            defaultValue={field?.default}
-            name={name}
+            field={field}
+            fieldType={fieldType}
             formatMessage={formatMessage}
             onChange={onChange}
             type={keyType}
-            values={_.path(`values.${keyType}`)(field)}
           />
-        ) : null}
-        <ValuesConfiguration
-          aiSuggestion={ai_suggestion}
-          editable={editable}
-          keyType={keyType}
-          onChange={onChange}
-          searchable={searchable}
-          fieldNamePrefix={fieldNamePrefix}
-          hasAiSuggestion={hasAiSuggestion}
-          subscribableField={subscribableField}
-          subscribable={field?.subscribable}
-          scope={scope}
-        />
-        <DefaultValue
-          defaultField={defaultField}
-          field={field}
-          fieldType={fieldType}
-          formatMessage={formatMessage}
-          onChange={onChange}
-          type={keyType}
-        />
-      </Segment>
-    );
+        </Segment>
+      );
 };
 
 ValuesField.propTypes = {