cozy-ui 132.0.0 → 133.0.0-beta.1

package/react/Contacts/AddModal/ContactForm/helpers.spec.js

@@ -1,391 +0,0 @@
-import get from 'lodash/get'
-
-import {
-  moveToHead,
-  makeItemLabel,
-  makeTypeAndLabel,
-  makeImppValues,
-  makeCustomLabel,
-  makeFields,
-  makeInitialCustomValue
-} from './helpers'
-import { locales } from './locales'
-
-const t = x => get(locales.en, x)
-
-describe('makeCustomLabel', () => {
-  it('should return custom type and supported label', () => {
-    const resForWork = makeCustomLabel('{"type":"someType","label":"work"}', t)
-    expect(resForWork).toBe('someType (pro)')
-
-    const resForHome = makeCustomLabel('{"type":"someType","label":"home"}', t)
-    expect(resForHome).toBe('someType (personal)')
-  })
-
-  it('should return label if no type', () => {
-    const resForWork = makeCustomLabel('{"label":"work"}', t)
-    expect(resForWork).toBe('label.work')
-
-    const resForHome = makeCustomLabel('{"label":"home"}', t)
-    expect(resForHome).toBe('label.home')
-  })
-
-  it('should return only custom type if label is not supported or undefined', () => {
-    const resForNotSupported = makeCustomLabel(
-      '{"type":"someType","label":"someLabel"}',
-      t
-    )
-    expect(resForNotSupported).toBe('someType')
-
-    const resForUndefined = makeCustomLabel('{"type":"someType"}', t)
-    expect(resForUndefined).toBe('someType')
-  })
-})
-
-describe('moveToHead function', () => {
-  it('should move an item to head of the array', () => {
-    const items = [1, 5, 657, 42, 3, 27, 88, 3, 4]
-    const shouldBeHead = v => v === 42
-    const expected = [42, 1, 5, 657, 3, 27, 88, 3, 4]
-    const actual = moveToHead(shouldBeHead)(items)
-    expect(actual).toEqual(expected)
-  })
-})
-
-describe('makeItemLabel', () => {
-  it('should return undefined if no arg', () => {
-    const res = makeItemLabel()
-
-    expect(res).toBe(undefined)
-  })
-
-  it('should return undefined if nothing defined', () => {
-    const res = makeItemLabel({ type: undefined, label: undefined })
-
-    expect(res).toBe(undefined)
-  })
-
-  it('should return correct type and label', () => {
-    const res = makeItemLabel({ type: 'cell', label: 'work' })
-
-    expect(res).toBe('{"type":"cell","label":"work"}')
-  })
-
-  it('should return only label if no type', () => {
-    const res = makeItemLabel({ type: undefined, label: 'work' })
-
-    expect(res).toBe('{"label":"work"}')
-  })
-
-  it('should return only type if no label', () => {
-    const res = makeItemLabel({ type: 'cell', label: undefined })
-
-    expect(res).toBe('{"type":"cell"}')
-  })
-})
-
-describe('makeTypeAndLabel', () => {
-  it('should return undefined if no arg', () => {
-    const res = makeTypeAndLabel()
-
-    expect(res).toStrictEqual({ type: undefined, label: undefined })
-  })
-
-  it('should return correct type and label', () => {
-    const res = makeTypeAndLabel('{"type":"cell","label":"work"}')
-
-    expect(res).toStrictEqual({ type: 'cell', label: 'work' })
-  })
-
-  it('should return only label', () => {
-    const res = makeTypeAndLabel('{"label":"work"}')
-
-    expect(res).toStrictEqual({ type: undefined, label: 'work' })
-  })
-
-  it('should return only type', () => {
-    const res = makeTypeAndLabel('{"type":"cell"}')
-
-    expect(res).toStrictEqual({ type: 'cell', label: undefined })
-  })
-})
-
-describe('makeImppValues', () => {
-  it('should replace only uri for {label: "work", protocol: "matrix"}', () => {
-    const res = makeImppValues(
-      {
-        impp: [
-          {
-            uri: 'john.doe@xmpp.net',
-            protocol: 'xmpp',
-            label: 'home',
-            primary: false
-          },
-          {
-            uri: 'john.doe@xmpp.net',
-            protocol: 'xmpp',
-            label: 'work',
-            primary: false
-          },
-          {
-            uri: 'john@doe.matrix.net',
-            protocol: 'matrix',
-            label: 'work',
-            primary: true
-          },
-          {
-            uri: 'john@doe.matrix.home',
-            protocol: 'matrix',
-            label: 'home'
-          }
-        ]
-      },
-      'newMatrixURI'
-    )
-
-    expect(res).toStrictEqual([
-      {
-        uri: 'john.doe@xmpp.net',
-        protocol: 'xmpp',
-        label: 'home',
-        primary: false
-      },
-      {
-        uri: 'john.doe@xmpp.net',
-        protocol: 'xmpp',
-        label: 'work',
-        primary: false
-      },
-      {
-        uri: 'newMatrixURI',
-        protocol: 'matrix',
-        label: 'work',
-        primary: true
-      },
-      {
-        uri: 'john@doe.matrix.home',
-        protocol: 'matrix',
-        label: 'home'
-      }
-    ])
-  })
-
-  it('should remove correctly', () => {
-    const res = makeImppValues(
-      {
-        impp: [
-          {
-            uri: 'john.doe@xmpp.net',
-            protocol: 'xmpp',
-            label: 'home',
-            primary: false
-          },
-          {
-            uri: 'john.doe@xmpp.net',
-            protocol: 'xmpp',
-            label: 'work',
-            primary: false
-          },
-          {
-            uri: 'john@doe.matrix.net',
-            protocol: 'matrix',
-            label: 'work',
-            primary: true
-          },
-          {
-            uri: 'john@doe.matrix.home',
-            protocol: 'matrix',
-            label: 'home'
-          }
-        ]
-      },
-      ''
-    )
-
-    expect(res).toStrictEqual([
-      {
-        uri: 'john.doe@xmpp.net',
-        protocol: 'xmpp',
-        label: 'home',
-        primary: false
-      },
-      {
-        uri: 'john.doe@xmpp.net',
-        protocol: 'xmpp',
-        label: 'work',
-        primary: false
-      },
-      {
-        uri: 'john@doe.matrix.home',
-        protocol: 'matrix',
-        label: 'home'
-      }
-    ])
-  })
-
-  it('should add the matrix impp values for the first time if no impp attribute', () => {
-    const expected = [
-      {
-        uri: 'newMatrixURI',
-        protocol: 'matrix',
-        label: 'work',
-        primary: true
-      }
-    ]
-
-    expect(makeImppValues({ impp: undefined }, 'newMatrixURI')).toStrictEqual(
-      expected
-    )
-
-    expect(makeImppValues({ impp: [] }, 'newMatrixURI')).toStrictEqual(expected)
-  })
-
-  it('should not add empty object if value is empty', () => {
-    expect(makeImppValues({ impp: undefined }, '')).toStrictEqual([])
-
-    expect(makeImppValues({ impp: [] }, '')).toStrictEqual([])
-  })
-})
-
-describe('makeInitialCustomValue', () => {
-  it('should return undefined if no name', () => {
-    const res = makeInitialCustomValue(
-      undefined,
-      '{"type":"fax","label":"work"}'
-    )
-
-    expect(res).toStrictEqual(undefined)
-  })
-
-  it('should return undefined if no value', () => {
-    const res = makeInitialCustomValue('phone[0].phoneLabel', undefined)
-
-    expect(res).toStrictEqual(undefined)
-  })
-
-  it('should return undefined if no name/value', () => {
-    const res = makeInitialCustomValue(undefined, undefined)
-
-    expect(res).toStrictEqual(undefined)
-  })
-
-  it('should return undefined for gender input', () => {
-    const res = makeInitialCustomValue(
-      'gender',
-      '{"type":"fax","label":"work"}'
-    )
-
-    expect(res).toStrictEqual(undefined)
-  })
-
-  it('should return the type if no label to ensure backwards compatibility', () => {
-    const res = makeInitialCustomValue('someInput', '{"type":"someType"}')
-
-    expect(res).toStrictEqual('{"type":"someType"}')
-  })
-
-  it('should return type and label if present', () => {
-    const res = makeInitialCustomValue(
-      'someInput',
-      '{"type":"someType","label":"work"}'
-    )
-
-    expect(res).toStrictEqual('{"type":"someType","label":"work"}')
-  })
-
-  describe('for phone input', () => {
-    const name = 'phone[0].phoneLabel'
-
-    it('should not return a custom label if the value is supported', () => {
-      const res = makeInitialCustomValue(name, '{"type":"fax","label":"work"}')
-
-      expect(res).toStrictEqual(undefined)
-    })
-
-    it('should return the custom label', () => {
-      const res = makeInitialCustomValue(name, '{"type":"someType"}')
-
-      expect(res).toStrictEqual('{"type":"someType"}')
-    })
-
-    it('should return the custom label', () => {
-      const res = makeInitialCustomValue(name, '{"label":"work"}')
-
-      expect(res).toStrictEqual('{"label":"work"}')
-    })
-
-    it('should return the custom value if the type is not supported even if there is a label', () => {
-      const res = makeInitialCustomValue(
-        name,
-        '{"type":"someType","label":"work"}'
-      )
-
-      expect(res).toStrictEqual('{"type":"someType","label":"work"}')
-    })
-  })
-})
-
-describe('makeFields', () => {
-  it('should return custom fields at custom position', () => {
-    const customFields = [
-      { name: 'middlename', position: 1 },
-      { name: 'birthday', position: 3 }
-    ]
-    const defaultFields = [{ name: 'firstname' }, { name: 'lastname' }]
-
-    const res = makeFields(customFields, defaultFields)
-
-    expect(res).toStrictEqual([
-      { name: 'firstname' },
-      { name: 'middlename', position: 1 },
-      { name: 'lastname' },
-      { name: 'birthday', position: 3 }
-    ])
-  })
-
-  it('should ignore custom fields without position value', () => {
-    const customFields = [
-      { name: 'middlename', position: 1 },
-      { name: 'field-with-no-position' }
-    ]
-    const defaultFields = [{ name: 'firstname' }, { name: 'lastname' }]
-
-    const res = makeFields(customFields, defaultFields)
-
-    expect(res).toStrictEqual([
-      { name: 'firstname' },
-      { name: 'middlename', position: 1 },
-      { name: 'lastname' }
-    ])
-  })
-
-  it('should not mutate the original arrays', () => {
-    const customFields = [
-      { name: 'middlename', position: 1 },
-      { name: 'field-with-no-position' },
-      { name: 'birthday', position: 3 }
-    ]
-    const defaultFields = [{ name: 'firstname' }, { name: 'lastname' }]
-
-    makeFields(customFields, defaultFields)
-
-    expect(defaultFields).toStrictEqual([
-      { name: 'firstname' },
-      { name: 'lastname' }
-    ])
-
-    expect(customFields).toStrictEqual([
-      { name: 'middlename', position: 1 },
-      { name: 'field-with-no-position' },
-      { name: 'birthday', position: 3 }
-    ])
-  })
-
-  it('should handle undefined custom fields', () => {
-    const defaultFields = [{ name: 'firstname' }, { name: 'lastname' }]
-
-    const res = makeFields(undefined, defaultFields)
-
-    expect(res).toStrictEqual(defaultFields)
-  })
-})

package/react/Contacts/AddModal/ContactForm/index.jsx

@@ -1,138 +0,0 @@
-import arrayMutators from 'final-form-arrays'
-import React, { useState } from 'react'
-import { Form } from 'react-final-form'
-
-import { getHasManyItems } from 'cozy-client/dist/associations/HasMany'
-
-import FieldInputLayout from './FieldInputLayout'
-import contactToFormValues from './contactToFormValues'
-import { fields as defaultFields } from './fieldsConfig'
-import formValuesToContact from './formValuesToContact'
-import { validateFields, makeFields } from './helpers'
-import { locales } from './locales'
-import Button from '../../../Buttons'
-import { useI18n, useExtendI18n } from '../../../providers/I18n'
-// 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
-let _submitContactForm
-
-function setSubmitContactForm(handleSubmit) {
-  _submitContactForm = handleSubmit
-}
-
-export 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
- */
-const ContactForm = ({ contacts, contact, customFieldsProps, onSubmit }) => {
-  const [showSecondaryFields, setShowSecondaryFields] = useState(false)
-  useExtendI18n(locales)
-  const { t } = useI18n()
-  const { fields, makeCustomFieldsFormValues, makeCustomContactValues } =
-    customFieldsProps
-
-  const _fields = makeFields(fields, defaultFields)
-  const hasSecondaryFields = _fields.some(el => el.isSecondary)
-
-  return (
-    <Form
-      mutators={{ ...arrayMutators }}
-      initialValues={contactToFormValues({
-        contact,
-        makeCustomContactValues,
-        t
-      })}
-      validate={values => validateFields(values, t)}
-      onSubmit={formValues =>
-        onSubmit(
-          formValuesToContact({
-            formValues,
-            oldContact: contact,
-            makeCustomFieldsFormValues,
-            t
-          })
-        )
-      }
-      render={({ handleSubmit, valid, submitFailed, errors }) => {
-        setSubmitContactForm(handleSubmit)
-        return (
-          <form
-            role="form"
-            onSubmit={handleSubmit}
-            className="u-flex u-flex-column"
-          >
-            {_fields.map((attributes, index) => (
-              <FieldInputLayout
-                key={index}
-                attributes={attributes}
-                contacts={contacts}
-                showSecondaryFields={showSecondaryFields}
-                formProps={{
-                  valid,
-                  submitFailed,
-                  errors
-                }}
-              />
-            ))}
-            {hasSecondaryFields && !showSecondaryFields && (
-              <div>
-                <Button
-                  className="u-db u-ml-2 u-mt-1"
-                  variant="text"
-                  label={t('Contacts.AddModal.ContactForm.other-fields')}
-                  onClick={() => setShowSecondaryFields(true)}
-                />
-              </div>
-            )}
-          </form>
-        )
-      }}
-    />
-  )
-}
-
-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)
-export const isSameContactProp = (prevProps, nextProps) => {
-  if (!prevProps.contact?.relationships || !nextProps.contact?.relationships) {
-    return false
-  }
-
-  const prevContactIdsRelated = getHasManyItems(
-    prevProps.contact,
-    'related'
-  ).map(r => r._id)
-  const nextContactIdsRelated = getHasManyItems(
-    nextProps.contact,
-    'related'
-  ).map(r => r._id)
-
-  if (
-    prevContactIdsRelated.length !== nextContactIdsRelated.length ||
-    !prevContactIdsRelated.every(id => nextContactIdsRelated.includes(id))
-  ) {
-    return false
-  }
-
-  return true
-}
-
-// export default ContactForm
-export default React.memo(ContactForm, isSameContactProp)