cozy-ui-plus 1.1.0

package/dist/Contacts/AddModal/ContactForm/helpers.js

@@ -0,0 +1,466 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.validateFields = exports.removeRelatedContactRelationships = exports.removeField = exports.removeAsscociatedData = exports.moveToHead = exports.movePrimaryToHead = exports.makeTypeAndLabel = exports.makeRelatedContact = exports.makeItemLabel = exports.makeInitialCustomValue = exports.makeImppValues = exports.makeFields = exports.makeCustomLabel = exports.hasExtendedAddress = exports.getRelatedContactRelationships = exports.fieldsRequired = exports.createAddress = exports.addField = void 0;
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+
+var _get = _interopRequireDefault(require("lodash/get"));
+
+var _isEqual = _interopRequireDefault(require("lodash/isEqual"));
+
+var _merge = _interopRequireDefault(require("lodash/merge"));
+
+var _uniqueId = _interopRequireDefault(require("lodash/uniqueId"));
+
+var _cozyClient = require("cozy-client");
+
+var _contact = require("cozy-client/dist/models/contact");
+
+var _contactToFormValues2 = _interopRequireDefault(require("./contactToFormValues"));
+
+var _excluded = ["postcode"];
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+var fieldsRequired = ['givenName', 'familyName', 'email[0].email', 'cozy'];
+/**
+ * Returns errors if all required fields are empty
+ * @param {object} values - Fields values
+ * @param {func} t - Translation function
+ * @returns {object} Errors
+ */
+
+exports.fieldsRequired = fieldsRequired;
+
+var validateFields = function validateFields(values, t) {
+  var errors = {};
+
+  if (fieldsRequired.every(function (field) {
+    return !(0, _get.default)(values, field);
+  })) {
+    fieldsRequired.forEach(function (field) {
+      errors[field] = t('Contacts.AddModal.ContactForm.fields.required');
+    });
+  }
+
+  return errors;
+};
+/**
+ * @param {object} [item] - Contact attribute
+ * @returns {string} Stringified object
+ */
+
+
+exports.validateFields = validateFields;
+
+var makeItemLabel = function makeItemLabel(item) {
+  if (!item) return undefined;
+  var res = item.label || item.type ? JSON.stringify({
+    type: item.type,
+    label: item.label
+  }) : undefined;
+  return res;
+};
+/**
+ *
+ * @param {string} [itemLabel] - Value of the label for a contact attribute
+ * @returns {{ type?: string, label?: string }}
+ */
+
+
+exports.makeItemLabel = makeItemLabel;
+
+var makeTypeAndLabel = function makeTypeAndLabel(itemLabel) {
+  if (!itemLabel) {
+    return {
+      type: undefined,
+      label: undefined
+    };
+  }
+
+  var itemLabelObj = JSON.parse(itemLabel);
+  var res = {
+    type: itemLabelObj.type,
+    label: itemLabelObj.label
+  };
+  return res;
+};
+/**
+ * @param {object} addressField
+ * @returns {boolean} True if addressField has extended address
+ */
+
+
+exports.makeTypeAndLabel = makeTypeAndLabel;
+
+var hasExtendedAddress = function hasExtendedAddress(addressField) {
+  if (!addressField) return false;
+  var extendedAddressKeys = ['addresslocality', 'addressbuilding', 'addressstairs', 'addressfloor', 'addressapartment', 'addressentrycode'];
+  return Object.keys(addressField).some(function (ext) {
+    return extendedAddressKeys.includes(ext);
+  });
+};
+
+exports.hasExtendedAddress = hasExtendedAddress;
+
+var moveToHead = function moveToHead(shouldBeHead) {
+  return function (items) {
+    return items.reduce(function (arr, v) {
+      return shouldBeHead(v) ? [v].concat((0, _toConsumableArray2.default)(arr)) : [].concat((0, _toConsumableArray2.default)(arr), [v]);
+    }, []);
+  };
+};
+
+exports.moveToHead = moveToHead;
+var movePrimaryToHead = moveToHead(function (v) {
+  return v === null || v === void 0 ? void 0 : v.primary;
+});
+exports.movePrimaryToHead = movePrimaryToHead;
+
+var createAddress = function createAddress(_ref) {
+  var address = _ref.address,
+      oldContact = _ref.oldContact,
+      t = _ref.t;
+  return address ? address.filter(function (val) {
+    return val && val.address;
+  }).map(function (addressField, index) {
+    var _oldContact$address, _contactToFormValues, _contactToFormValues$;
+
+    var oldContactAddress = oldContact === null || oldContact === void 0 ? void 0 : (_oldContact$address = oldContact.address) === null || _oldContact$address === void 0 ? void 0 : _oldContact$address[index];
+    var oldContactFormValues = (_contactToFormValues = (0, _contactToFormValues2.default)({
+      contact: oldContact,
+      t: t
+    })) === null || _contactToFormValues === void 0 ? void 0 : (_contactToFormValues$ = _contactToFormValues.address) === null || _contactToFormValues$ === void 0 ? void 0 : _contactToFormValues$[index];
+    var addressHasBeenModified = !(0, _isEqual.default)(addressField, oldContactFormValues);
+
+    if (addressHasBeenModified) {
+      // Use "code" instead "postcode", to be vcard 4.0 rfc 6350 compliant
+      // eslint-disable-next-line no-unused-vars
+      var _ref2 = oldContactAddress || {},
+          postcode = _ref2.postcode,
+          oldContactAddressCleaned = (0, _objectWithoutProperties2.default)(_ref2, _excluded);
+
+      return _objectSpread(_objectSpread(_objectSpread(_objectSpread({}, oldContactAddressCleaned), {}, {
+        formattedAddress: addressField.address,
+        number: addressField.addressnumber,
+        street: addressField.addressstreet,
+        code: addressField.addresscode,
+        city: addressField.addresscity,
+        region: addressField.addressregion,
+        country: addressField.addresscountry
+      }, hasExtendedAddress(addressField) && {
+        extendedAddress: _objectSpread(_objectSpread({}, oldContactAddressCleaned.extendedAddress), {}, {
+          locality: addressField.addresslocality,
+          building: addressField.addressbuilding,
+          stairs: addressField.addressstairs,
+          floor: addressField.addressfloor,
+          apartment: addressField.addressapartment,
+          entrycode: addressField.addressentrycode
+        })
+      }), makeTypeAndLabel(addressField.addressLabel)), {}, {
+        primary: index === 0
+      });
+    }
+
+    return oldContactAddress;
+  }) : [];
+};
+/**
+ * @param {(import('../types').RelatedContact|undefined)[]} relatedContact - The related contacts array
+ * @returns {Record<string, { data: { _id: string, _type: string }[] }>} - The related contacts relationships
+ */
+
+
+exports.createAddress = createAddress;
+
+var getRelatedContactRelationships = function getRelatedContactRelationships(relatedContact) {
+  // Tips filter Boolean to remove undefined value from array when relatedContact is empty (see contactToFormValues)
+  var data = relatedContact.filter(Boolean).reduce(function (acc, curr) {
+    var relationType = curr.relatedContactLabel ? JSON.parse(curr.relatedContactLabel).type : 'related';
+    var existingIndex = acc.findIndex(function (item) {
+      return item._id === curr.relatedContactId;
+    });
+
+    if (existingIndex !== -1) {
+      acc[existingIndex].metadata.relationTypes = Array.from(new Set([].concat((0, _toConsumableArray2.default)(acc[existingIndex].metadata.relationTypes), [relationType])));
+    } else {
+      acc.push({
+        _id: curr.relatedContactId,
+        _type: _contact.CONTACTS_DOCTYPE,
+        metadata: {
+          relationTypes: [relationType]
+        }
+      });
+    }
+
+    return acc;
+  }, []); // `data` can be empty, you still have to return an object to override the behavior of the cozy-client store, otherwise it will keep the old value, and without refreshing the page, the data will not be up to date in the store and therefore on the interface
+
+  return {
+    related: {
+      data: data
+    }
+  };
+};
+/**
+ * When changing the type of relationship, it must be ensured that no empty relationship remains.
+ * The old and new ones are merged into `formValuesToContact`.
+ *
+ * @param {import('cozy-client/types/types').IOCozyContact} contact - The contact object with all relationships
+ * @returns {import('cozy-client/types/types').IOCozyContact} - The contact object without the related contacts relationships
+ */
+
+
+exports.getRelatedContactRelationships = getRelatedContactRelationships;
+
+var removeRelatedContactRelationships = function removeRelatedContactRelationships(contact) {
+  if (!(contact !== null && contact !== void 0 && contact.relationships)) return contact;
+  var updatedContact = (0, _merge.default)({}, contact);
+  var relationshipsWithoutRelatedContact = Object.entries(updatedContact.relationships).reduce(function (acc, _ref3) {
+    var _ref4 = (0, _slicedToArray2.default)(_ref3, 2),
+        relName = _ref4[0],
+        relValue = _ref4[1];
+
+    if ('related' === relName) {
+      acc[relName] = relValue;
+    }
+
+    return acc;
+  }, {});
+  updatedContact.relationships = relationshipsWithoutRelatedContact;
+  return updatedContact;
+}; // TODO : Update dehydrate function to HasMany class in cozy-client
+
+/**
+ * This function is used to clean the contact object from the associated data
+ * cozy-client dehydrates the document before saving it (via the `HasMany` method), but by doing it manually, we ensure that all hydrated relationships in the document (and without data of course) are not saved in the `relationships` of the document, which adds unnecessary data.
+ *
+ * @param {import('cozy-client/types/types').IOCozyContact} contact - The contact object with associated data
+ * @returns {import('cozy-client/types/types').IOCozyContact} - The contact object without associated data
+ */
+
+
+exports.removeRelatedContactRelationships = removeRelatedContactRelationships;
+
+var removeAsscociatedData = function removeAsscociatedData(contact) {
+  if (!contact) return {};
+  return Object.entries(contact).reduce(function (cleanedContact, _ref5) {
+    var _ref6 = (0, _slicedToArray2.default)(_ref5, 2),
+        key = _ref6[0],
+        value = _ref6[1];
+
+    // Add `groups` condition to keep the old implementation functional, see below
+    if (!(value instanceof _cozyClient.Association) || key === 'groups') {
+      cleanedContact[key] = value;
+    }
+
+    return cleanedContact;
+  }, {});
+};
+/**
+ * @param {import('cozy-client/types/types').IOCozyContact} contact
+ * @returns {import('../types').RelatedContact[]}
+ */
+
+
+exports.removeAsscociatedData = removeAsscociatedData;
+
+var makeRelatedContact = function makeRelatedContact(contact) {
+  var _contact$relationship;
+
+  if (!(contact.related instanceof _cozyClient.Association) || !((_contact$relationship = contact.relationships) !== null && _contact$relationship !== void 0 && _contact$relationship.related)) {
+    return [undefined];
+  }
+
+  var relatedData = contact.related.data.reduce(function (acc, curr) {
+    // Use `makeDisplayName` because if the contact is newly created, it has no `displayName` attribute. (Creation of a contact when selecting a linked contact)
+    acc[curr._id] = curr.displayName || (0, _contact.makeDisplayName)(curr);
+    return acc;
+  }, {});
+  var res = contact.relationships.related.data.flatMap(function (item) {
+    return item.metadata.relationTypes.map(function (type) {
+      return {
+        relatedContactId: item._id,
+        relatedContact: relatedData[item._id],
+        relatedContactLabel: makeItemLabel({
+          type: type === 'related' ? '' : type
+        })
+      };
+    });
+  }); // Useful because a contact always has at least the `related` relationships (see `getRelatedContactRelationships`)
+
+  return res.length > 0 ? res : [undefined];
+};
+
+exports.makeRelatedContact = makeRelatedContact;
+
+var addField = function addField(fields) {
+  return fields.push({
+    fieldId: (0, _uniqueId.default)('fieldId_')
+  });
+};
+
+exports.addField = addField;
+
+var removeField = function removeField(fields, index) {
+  var isLastRemainingField = fields.length === 1;
+
+  if (isLastRemainingField) {
+    fields.update(index, undefined);
+  } else {
+    fields.remove(index);
+  }
+};
+/**
+ *
+ * @param {string} value
+ * @param {func} t
+ * @returns {string}
+ */
+
+
+exports.removeField = removeField;
+
+var makeCustomLabel = function makeCustomLabel(value, t) {
+  var _JSON$parse = JSON.parse(value),
+      type = _JSON$parse.type,
+      label = _JSON$parse.label;
+
+  var isSupportedLabel = ['home', 'work'].includes(label);
+  var firstString = type || '';
+  var secondString = label && isSupportedLabel ? type ? " (".concat(t("Contacts.AddModal.ContactForm.label.".concat(label)), ")").toLowerCase() : "label.".concat(label) : '';
+  return firstString + secondString || null;
+};
+/**
+ *
+ * @param {import('cozy-client/types/types').IOCozyContact} oldContact - Contact to be modified
+ * @param {string?} value - New URI value to add to the Contact
+ * @returns {{ uri: string, protocol: string, label: string, primary?: boolean }[]}
+ */
+
+
+exports.makeCustomLabel = makeCustomLabel;
+
+var makeImppValues = function makeImppValues(oldContact, value) {
+  var _value = (value === null || value === void 0 ? void 0 : value.trim()) || '';
+
+  var oldImppValues = oldContact === null || oldContact === void 0 ? void 0 : oldContact.impp;
+
+  if (_value) {
+    if (!oldImppValues || oldImppValues.length === 0) {
+      return [{
+        uri: _value,
+        protocol: 'matrix',
+        label: 'work',
+        primary: true
+      }];
+    }
+
+    return oldImppValues.map(function (el) {
+      if (el.protocol === 'matrix' && el.label === 'work') {
+        return _objectSpread(_objectSpread({}, el), {}, {
+          uri: _value
+        });
+      }
+
+      return el;
+    });
+  }
+
+  return (oldImppValues === null || oldImppValues === void 0 ? void 0 : oldImppValues.map(function (el) {
+    if (el.protocol !== 'matrix' || el.label !== 'work') {
+      return el;
+    }
+  }).filter(Boolean)) || [];
+};
+/**
+ *
+ * @param {string} name
+ * @param {string} value
+ * @returns {string}
+ */
+
+
+exports.makeImppValues = makeImppValues;
+
+var makeInitialCustomValue = function makeInitialCustomValue(name, value) {
+  // gender input doesn't support custom label
+  if (!name || !value || name === 'gender') return undefined;
+  var valueObj = JSON.parse(value); // Voluntarily before the "backwards compatibility" condition
+
+  if (name.includes('relatedContactLabel')) {
+    if (!'related' === valueObj.type) {
+      return JSON.stringify({
+        type: valueObj.type
+      });
+    }
+
+    return undefined;
+  } // for backwards compatiblity - historically there is only type and no label
+
+
+  if (valueObj.type && !valueObj.label) {
+    return JSON.stringify({
+      type: valueObj.type
+    });
+  } // for phone label
+
+
+  if (name.includes('phoneLabel')) {
+    // but unsupported one
+    if (!['cell', 'voice', 'fax'].includes(valueObj.type)) {
+      return JSON.stringify({
+        type: valueObj.type,
+        label: valueObj.label
+      });
+    } // we don't want to create a custom label if supported
+
+
+    return undefined;
+  } // at this point if label and type are both present, it's a custom label
+
+
+  if (valueObj.type && valueObj.label) {
+    return JSON.stringify({
+      type: valueObj.type,
+      label: valueObj.label
+    });
+  }
+};
+/**
+ * @param {(import('../types').Field)[]|undefined} customFields
+ * @param {(import('../types').Field)[]} defaultFields
+ * @returns {(import('../types').Field)[]}
+ */
+
+
+exports.makeInitialCustomValue = makeInitialCustomValue;
+
+var makeFields = function makeFields(customFields, defaultFields) {
+  if (!customFields) {
+    return defaultFields;
+  }
+
+  var fields = (0, _toConsumableArray2.default)(defaultFields);
+  customFields.map(function (customField) {
+    if (customField.position) {
+      fields.splice(customField.position, 0, customField);
+    }
+  });
+  return fields;
+};
+
+exports.makeFields = makeFields;

package/dist/Contacts/AddModal/ContactForm/index.js

@@ -0,0 +1,184 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+exports.getSubmitContactForm = getSubmitContactForm;
+exports.isSameContactProp = void 0;
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
+var _finalFormArrays = _interopRequireDefault(require("final-form-arrays"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _reactFinalForm = require("react-final-form");
+
+var _HasMany = require("cozy-client/dist/associations/HasMany");
+
+var _Buttons = _interopRequireDefault(require("cozy-ui/transpiled/react/Buttons"));
+
+var _I18n = require("cozy-ui/transpiled/react/providers/I18n");
+
+var _FieldInputLayout = _interopRequireDefault(require("./FieldInputLayout"));
+
+var _contactToFormValues = _interopRequireDefault(require("./contactToFormValues"));
+
+var _fieldsConfig = require("./fieldsConfig");
+
+var _formValuesToContact = _interopRequireDefault(require("./formValuesToContact"));
+
+var _helpers = require("./helpers");
+
+var _locales = require("./locales");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+// import { fullContactPropTypes } from '../../ContactPropTypes' // !!
+// this variable will be set in the form's render prop
+// and used by the submit button in ContactFormModal
+// to be able to trigger the submit from outside the form
+// See react-final-form examples here: https://www.npmjs.com/package/react-final-form#external-submit
+var _submitContactForm;
+
+function setSubmitContactForm(handleSubmit) {
+  _submitContactForm = handleSubmit;
+}
+
+function getSubmitContactForm() {
+  return _submitContactForm;
+}
+/**
+ *
+ * @param {object} params
+ * @param {{ data: Array<object> }} params.contacts
+ * @param {import('cozy-client/types/types').IOCozyContact} params.contact
+ * @param {Object} params.customFieldsProps
+ * @param {func} params.onSubmit
+ * @returns
+ */
+
+
+var ContactForm = function ContactForm(_ref) {
+  var contacts = _ref.contacts,
+      contact = _ref.contact,
+      customFieldsProps = _ref.customFieldsProps,
+      _onSubmit = _ref.onSubmit;
+
+  var _useState = (0, _react.useState)(false),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      showSecondaryFields = _useState2[0],
+      setShowSecondaryFields = _useState2[1];
+
+  (0, _I18n.useExtendI18n)(_locales.locales);
+
+  var _useI18n = (0, _I18n.useI18n)(),
+      t = _useI18n.t;
+
+  var fields = customFieldsProps.fields,
+      makeCustomFieldsFormValues = customFieldsProps.makeCustomFieldsFormValues,
+      makeCustomContactValues = customFieldsProps.makeCustomContactValues;
+
+  var _fields = (0, _helpers.makeFields)(fields, _fieldsConfig.fields);
+
+  var hasSecondaryFields = _fields.some(function (el) {
+    return el.isSecondary;
+  });
+
+  return /*#__PURE__*/_react.default.createElement(_reactFinalForm.Form, {
+    mutators: _objectSpread({}, _finalFormArrays.default),
+    initialValues: (0, _contactToFormValues.default)({
+      contact: contact,
+      makeCustomContactValues: makeCustomContactValues,
+      t: t
+    }),
+    validate: function validate(values) {
+      return (0, _helpers.validateFields)(values, t);
+    },
+    onSubmit: function onSubmit(formValues) {
+      return _onSubmit((0, _formValuesToContact.default)({
+        formValues: formValues,
+        oldContact: contact,
+        makeCustomFieldsFormValues: makeCustomFieldsFormValues,
+        t: t
+      }));
+    },
+    render: function render(_ref2) {
+      var handleSubmit = _ref2.handleSubmit,
+          valid = _ref2.valid,
+          submitFailed = _ref2.submitFailed,
+          errors = _ref2.errors;
+      setSubmitContactForm(handleSubmit);
+      return /*#__PURE__*/_react.default.createElement("form", {
+        role: "form",
+        onSubmit: handleSubmit,
+        className: "u-flex u-flex-column"
+      }, _fields.map(function (attributes, index) {
+        return /*#__PURE__*/_react.default.createElement(_FieldInputLayout.default, {
+          key: index,
+          attributes: attributes,
+          contacts: contacts,
+          showSecondaryFields: showSecondaryFields,
+          formProps: {
+            valid: valid,
+            submitFailed: submitFailed,
+            errors: errors
+          }
+        });
+      }), hasSecondaryFields && !showSecondaryFields && /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_Buttons.default, {
+        className: "u-db u-ml-2 u-mt-1",
+        variant: "text",
+        label: t('Contacts.AddModal.ContactForm.other-fields'),
+        onClick: function onClick() {
+          return setShowSecondaryFields(true);
+        }
+      })));
+    }
+  });
+};
+
+ContactForm.defaultProps = {
+  customFieldsProps: {}
+}; // Used to avoid unnecessary multiple rendering of ContactForm when creating a new contact in another way.
+// These unnecessary renderings prevented the addition of a newly created linked contact. (Creation of a contact when selecting a linked contact)
+
+var isSameContactProp = function isSameContactProp(prevProps, nextProps) {
+  var _prevProps$contact, _nextProps$contact;
+
+  if (!((_prevProps$contact = prevProps.contact) !== null && _prevProps$contact !== void 0 && _prevProps$contact.relationships) || !((_nextProps$contact = nextProps.contact) !== null && _nextProps$contact !== void 0 && _nextProps$contact.relationships)) {
+    return false;
+  }
+
+  var prevContactIdsRelated = (0, _HasMany.getHasManyItems)(prevProps.contact, 'related').map(function (r) {
+    return r._id;
+  });
+  var nextContactIdsRelated = (0, _HasMany.getHasManyItems)(nextProps.contact, 'related').map(function (r) {
+    return r._id;
+  });
+
+  if (prevContactIdsRelated.length !== nextContactIdsRelated.length || !prevContactIdsRelated.every(function (id) {
+    return nextContactIdsRelated.includes(id);
+  })) {
+    return false;
+  }
+
+  return true;
+}; // export default ContactForm
+
+
+exports.isSameContactProp = isSameContactProp;
+
+var _default = /*#__PURE__*/_react.default.memo(ContactForm, isSameContactProp);
+
+exports.default = _default;