@truedat/df 4.48.0 → 4.48.2

package/src/components/__tests__/__snapshots__/DynamicForm.spec.js.snap

@@ -1,95 +1,89 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`<DynamicForm /> matches snapshot for default field 1`] = `
-<Fragment>
-  <FieldGroupSegment
-    fields={
-      Array [
-        Object {
-          "name": "test",
-          "required": false,
-          "value": undefined,
-        },
-      ]
-    }
-    key="0"
-    name="test-group"
-    onFieldChange={[Function]}
-  />
-</Fragment>
+<FieldGroupSegment
+  fields={
+    Array [
+      Object {
+        "name": "test",
+        "required": false,
+        "value": undefined,
+      },
+    ]
+  }
+  key="0"
+  name="test-group"
+  onFieldChange={[Function]}
+/>
 `;
 
 exports[`<DynamicForm /> matches snapshot for domain values 1`] = `
-<Fragment>
-  <FieldGroupSegment
-    fields={
-      Array [
-        Object {
-          "name": "test",
-          "parsed_values": Array [
-            Object {
-              "text": "a",
-              "value": "a",
-            },
-            Object {
-              "text": "b",
-              "value": "b",
-            },
-            Object {
-              "text": "c",
-              "value": "c",
-            },
-          ],
-          "required": false,
-          "value": undefined,
-          "values": Object {
-            "domain": Object {
-              "1": Array [
-                "a",
-                "b",
-                "c",
-              ],
-            },
+<FieldGroupSegment
+  fields={
+    Array [
+      Object {
+        "name": "test",
+        "parsedValues": Array [
+          Object {
+            "text": "a",
+            "value": "a",
+          },
+          Object {
+            "text": "b",
+            "value": "b",
+          },
+          Object {
+            "text": "c",
+            "value": "c",
+          },
+        ],
+        "required": false,
+        "value": undefined,
+        "values": Object {
+          "domain": Object {
+            "1": Array [
+              "a",
+              "b",
+              "c",
+            ],
           },
         },
-      ]
-    }
-    key="0"
-    name="test-group"
-    onFieldChange={[Function]}
-  />
-</Fragment>
+      },
+    ]
+  }
+  key="0"
+  name="test-group"
+  onFieldChange={[Function]}
+/>
 `;
 
-exports[`<DynamicForm /> matches snapshot for empty content 1`] = `<Fragment />`;
+exports[`<DynamicForm /> matches snapshot for empty content 1`] = `null`;
 
 exports[`<DynamicForm /> matches snapshot for role_users values 1`] = `
-<Fragment>
-  <FieldGroupSegment
-    fields={
-      Array [
-        Object {
-          "name": "test",
-          "parsed_values": Array [
-            Object {
-              "text": "user1",
-              "value": "user1",
-            },
-          ],
-          "required": false,
-          "value": undefined,
-          "values": Object {
-            "processed_users": Array [
-              "user1",
-            ],
-            "role_users": "role",
+<FieldGroupSegment
+  fields={
+    Array [
+      Object {
+        "name": "test",
+        "parsedValues": Array [
+          Object {
+            "text": "user1",
+            "value": "user1",
           },
+        ],
+        "required": false,
+        "value": undefined,
+        "values": Object {
+          "processed_users": Array [
+            "user1",
+          ],
+          "role_users": "role",
         },
-      ]
-    }
-    key="0"
-    name="test-group"
-    onFieldChange={[Function]}
-  />
-</Fragment>
+      },
+    ]
+  }
+  key="0"
+  name="test-group"
+  onFieldChange={[Function]}
+/>
 `;

package/src/components/widgets/CheckboxField.js

@@ -1,24 +1,32 @@
 import _ from "lodash/fp";
 import React from "react";
+import { FormattedMessage } from "react-intl";
 import PropTypes from "prop-types";
 import { Form } from "semantic-ui-react";
 
 export const CheckboxField = ({
-  field: { name, value, parsed_values, disabled },
+  field: { name, value: fieldValue, parsedValues, disabled },
   onChange,
 }) =>
-  parsed_values ? (
-    parsed_values.map(({ value: parsed_value, text }, i) => (
+  parsedValues ? (
+    parsedValues.map(({ value, text }, i) => (
       <Form.Checkbox
         name={name}
         key={i}
-        label={text}
-        value={parsed_value}
-        checked={_.isArray(value) && _.includes(parsed_value)(value)}
+        label={
+          text ? (
+            <FormattedMessage
+              id={`fields.${name}.${text}`}
+              defaultMessage={text}
+            />
+          ) : null
+        }
+        value={value}
+        checked={_.isArray(fieldValue) && _.includes(value)(fieldValue)}
         onChange={(e, { checked, value: thisValue, ...changes }) => {
           const newValue = checked
-            ? _.concat(thisValue)(value || [])
-            : _.pull(thisValue)(value || []);
+            ? _.concat(thisValue)(fieldValue || [])
+            : _.pull(thisValue)(fieldValue || []);
           onChange(e, { ...changes, value: newValue });
         }}
       />
@@ -26,7 +34,7 @@ export const CheckboxField = ({
   ) : (
     <Form.Checkbox
       name={name}
-      checked={value == "Si"}
+      checked={fieldValue === "Si"}
       onChange={(e, data) => {
         const { checked } = data;
         const value = checked ? "Si" : "No";

package/src/components/widgets/DynamicField.js

@@ -74,7 +74,9 @@ export const DynamicField = ({
 }) => (
   <Form.Field>
     <label>
-      {label}
+      {label ? (
+        <FormattedMessage id={`fields.${label}`} defaultMessage={label} />
+      ) : null}
       {fieldProps?.required && (
         <span
           style={{

package/src/components/widgets/RadioField.js

@@ -1,26 +1,34 @@
 import _ from "lodash/fp";
 import React from "react";
+import { FormattedMessage } from "react-intl";
 import PropTypes from "prop-types";
 import { Form } from "semantic-ui-react";
 
 export const RadioField = ({
-  field: { name, parsed_values, value },
-  onChange
+  field: { name, parsedValues, value: fieldValue },
+  onChange,
 }) =>
-  _.map.convert({ cap: false })(({ value: parsed_value, text }, i) => (
+  _.map.convert({ cap: false })(({ value, text }, i) => (
     <Form.Radio
       name={name}
       key={i}
-      label={text}
-      value={parsed_value}
-      checked={value === parsed_value}
+      label={
+        text ? (
+          <FormattedMessage
+            id={`fields.${name}.${text}`}
+            defaultMessage={text}
+          />
+        ) : null
+      }
+      value={value}
+      checked={fieldValue === value}
       onChange={onChange}
     />
-  ))(parsed_values);
+  ))(parsedValues);
 
 RadioField.propTypes = {
   field: PropTypes.object,
-  onChange: PropTypes.func
+  onChange: PropTypes.func,
 };
 
 export default RadioField;

package/src/components/widgets/__tests__/CheckboxField.spec.js

@@ -29,11 +29,11 @@ describe("<CheckboxField /> Multiple", () => {
   const label = "label";
   const name = "name";
   const value = [];
-  const parsed_values = [
+  const parsedValues = [
     { value: "foo", text: "Foo" },
-    { value: "bar", text: "Bar" }
+    { value: "bar", text: "Bar" },
   ];
-  const field = { label, name, value, parsed_values };
+  const field = { label, name, value, parsedValues };
   const onChange = jest.fn();
   const props = { field, onChange };
 
@@ -44,10 +44,7 @@ describe("<CheckboxField /> Multiple", () => {
 
   it("call onChange function for multiple", () => {
     const wrapper = shallow(<CheckboxField {...props} />);
-    const checkBox = wrapper
-      .find(Form.Checkbox)
-      .first()
-      .dive();
+    const checkBox = wrapper.find(Form.Checkbox).first().dive();
 
     checkBox.simulate("change", null, { checked: true, value: "foo" });
     expect(onChange).toBeCalledWith(null, { value: ["foo"] });

package/src/components/widgets/__tests__/RadioField.spec.js

@@ -7,11 +7,11 @@ describe("<RadioField />", () => {
   const name = "name";
   const cardinality = "1";
   const value = "Foo";
-  const parsed_values = ["Foo", "Bar"];
+  const parsedValues = ["Foo", "Bar"];
   const onChange = jest.fn();
   const props = {
-    field: { label, name, cardinality, value, parsed_values },
-    onChange
+    field: { label, name, cardinality, value, parsedValues },
+    onChange,
   };
 
   it("matches the latest snapshot", () => {

package/src/components/widgets/__tests__/__snapshots__/CheckboxField.spec.js.snap

@@ -7,7 +7,12 @@ Array [
     checked={false}
     control={[Function]}
     key="0"
-    label="Foo"
+    label={
+      <Memo(MemoizedFormattedMessage)
+        defaultMessage="Foo"
+        id="fields.name.Foo"
+      />
+    }
     name="name"
     onChange={[Function]}
     value="foo"
@@ -17,7 +22,12 @@ Array [
     checked={false}
     control={[Function]}
     key="1"
-    label="Bar"
+    label={
+      <Memo(MemoizedFormattedMessage)
+        defaultMessage="Bar"
+        id="fields.name.Bar"
+      />
+    }
     name="name"
     onChange={[Function]}
     value="bar"

package/src/components/widgets/__tests__/__snapshots__/RadioField.spec.js.snap

@@ -7,6 +7,7 @@ Array [
     checked={false}
     control={[Function]}
     key="0"
+    label={null}
     name="name"
     onChange={[MockFunction]}
   />,
@@ -15,6 +16,7 @@ Array [
     checked={false}
     control={[Function]}
     key="1"
+    label={null}
     name="name"
     onChange={[MockFunction]}
   />,

package/src/selectors/__tests__/getOptions.spec.js

@@ -5,14 +5,14 @@ describe("selectors: makeGetDropdownOptions", () => {
     { id: 1, name: "system", external_id: "external_id" },
     { id: 2, name: "system1", external_id: "external_id1" },
   ];
-  const parsed_values = [
+  const parsedValues = [
     { text: "bar", value: "bar" },
     { text: "foo", value: "foo" },
   ];
   const type = "system";
 
   it("should return options depending on type", () => {
-    const field = { parsed_values, type };
+    const field = { parsedValues, type };
     const props = { field };
     const state = { systems };
     const getOptions = makeGetDropdownOptions();

package/src/selectors/getOptions.js

@@ -12,7 +12,7 @@ const transformValues = (systems) =>
   )(systems);
 
 const getValuesFromProps = (_state, props) =>
-  _.path("field.parsed_values")(props);
+  _.path("field.parsedValues")(props);
 
 const getValuesFromState = (state, _props) => _.pick(["systems"])(state);
 

package/src/templates/components/Template.js

@@ -10,11 +10,14 @@ import TemplateForm from "./templateForm/TemplateForm";
 export const Template = ({ template, updateTemplate, deleteTemplate }) =>
   _.isUndefined(template.id) ? null : (
     <>
-      <TemplateCrumbs name={template.label} />
+      <TemplateCrumbs name={template?.label} />
       <Segment>
         <Header as="h2">
           <Icon name="file code outline" circular />
-          <Header.Content>{template.label}</Header.Content>
+          <Header.Content>
+            {template?.label}
+            <Header.Subheader>{template?.name}</Header.Subheader>
+          </Header.Content>
         </Header>
         <TemplateForm
           template={template}
@@ -27,7 +30,9 @@ export const Template = ({ template, updateTemplate, deleteTemplate }) =>
   );
 
 Template.propTypes = {
+  deleteTemplate: PropTypes.func,
   template: PropTypes.object,
+  updateTemplate: PropTypes.func,
 };
 
 const mapStateToProps = ({ template }) => ({ template });

package/src/templates/components/TemplateCard.js

@@ -1,5 +1,6 @@
 import React from "react";
 import PropTypes from "prop-types";
+import { FormattedMessage } from "react-intl";
 import { useHistory } from "react-router-dom";
 import { Icon, Card } from "semantic-ui-react";
 import { linkTo } from "@truedat/core/routes";
@@ -23,7 +24,7 @@ export const TemplateCard = ({ template: { id, name, label } }) => {
 };
 
 TemplateCard.propTypes = {
-  template: PropTypes.object
+  template: PropTypes.object,
 };
 
 export default TemplateCard;

package/src/templates/components/__tests__/Template.spec.js

@@ -1,16 +1,18 @@
 import React from "react";
-import { shallow } from "enzyme";
-import { Template } from "../Template";
+import { render } from "@truedat/test/render";
+import Template from "../Template";
+
+const renderOpts = {
+  state: {
+    template: { id: 1, label: "My Template", name: "template1" },
+    templateDeleting: false,
+    templateSaving: false,
+  },
+};
 
 describe("<Template />", () => {
   it("matches the latest snapshot", () => {
-    const updateTemplate = jest.fn();
-    const template = {
-      id: 1,
-      label: "Label"
-    };
-    const props = { template, updateTemplate };
-    const wrapper = shallow(<Template {...props} />);
-    expect(wrapper).toMatchSnapshot();
+    const { container } = render(<Template />, renderOpts);
+    expect(container).toMatchSnapshot();
   });
 });