cozy-ui 131.2.0 → 133.0.0-beta.1

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

@@ -1,108 +0,0 @@
-import PropTypes from 'prop-types'
-import React, { useState } from 'react'
-
-import { locales } from './locales'
-import Button from '../../../Buttons'
-import { ConfirmDialog } from '../../../CozyDialogs'
-import FormControlLabel from '../../../FormControlLabel'
-import RadioGroup from '../../../RadioGroup'
-import Radio from '../../../Radios'
-import TextField from '../../../TextField'
-import { useBreakpoints } from '../../../providers/Breakpoints'
-import { useI18n, useExtendI18n } from '../../../providers/I18n'
-
-const CustomLabelDialog = ({
-  customValue,
-  setCustomValue,
-  customLabelOptions,
-  onSubmit,
-  onClose
-}) => {
-  const customValueObj = JSON.parse(customValue || '{}')
-  useExtendI18n(locales)
-  const { t } = useI18n()
-  const { isMobile } = useBreakpoints()
-  const [type, setType] = useState(
-    customValueObj.type || customLabelOptions.defaultType
-  )
-  const [label, setLabel] = useState(
-    customValueObj.label || customLabelOptions.defaultLabel
-  )
-
-  const handleSubmit = () => {
-    setCustomValue(JSON.stringify({ type, label }))
-    onSubmit({ target: { value: JSON.stringify({ type, label }) } })
-    onClose()
-  }
-
-  return (
-    <ConfirmDialog
-      open
-      title={t('Contacts.AddModal.CustomLabelDialog.label.custom')}
-      content={
-        <>
-          <TextField
-            className="u-mt-half"
-            variant="outlined"
-            fullWidth
-            autoFocus
-            value={type}
-            onChange={ev => setType(ev.target.value)}
-          />
-          {!customLabelOptions.hide && (
-            <RadioGroup
-              style={{ flexDirection: 'row' }}
-              className="u-mt-half u-ml-half"
-              aria-label="radio"
-              name="label"
-              value={label}
-              onChange={ev => setLabel(ev.target.value)}
-            >
-              <FormControlLabel
-                value="home"
-                label={t('Contacts.AddModal.CustomLabelDialog.label.home')}
-                control={<Radio />}
-              />
-              <FormControlLabel
-                value="work"
-                label={t('Contacts.AddModal.CustomLabelDialog.label.work')}
-                control={<Radio />}
-              />
-            </RadioGroup>
-          )}
-        </>
-      }
-      actions={
-        <>
-          <Button
-            variant="secondary"
-            fullWidth={isMobile}
-            label={t('Contacts.AddModal.CustomLabelDialog.cancel')}
-            onClick={onClose}
-          />
-          <Button
-            label={t('Contacts.AddModal.CustomLabelDialog.ok')}
-            fullWidth={isMobile}
-            disabled={!type}
-            onClick={handleSubmit}
-          />
-        </>
-      }
-      onClose={onClose}
-    />
-  )
-}
-
-CustomLabelDialog.propTypes = {
-  customValue: PropTypes.string,
-  setCustomValue: PropTypes.func,
-  customLabelOptions: PropTypes.shape({
-    hide: PropTypes.bool,
-    defaultType: PropTypes.string,
-    defaultLabel: PropTypes.string
-  }),
-  onSubmit: PropTypes.func,
-  onClose: PropTypes.func
-}
-
-export default CustomLabelDialog

package/react/Contacts/AddModal/CustomLabelDialog/locales/en.json

@@ -1,15 +0,0 @@
-{
-  "Contacts": {
-    "AddModal": {
-      "CustomLabelDialog": {
-        "label": {
-          "custom": "Customised label",
-          "home": "Personal",
-          "work": "Pro"
-        },
-        "cancel": "Cancel",
-        "ok": "Ok"
-      }
-    }
-  }
-}

package/react/Contacts/AddModal/CustomLabelDialog/locales/fr.json

@@ -1,15 +0,0 @@
-{
-  "Contacts": {
-    "AddModal": {
-      "CustomLabelDialog": {
-        "label": {
-          "custom": "Libellé personnalisé",
-          "home": "Perso",
-          "work": "Pro"
-        },
-        "cancel": "Annuler",
-        "ok": "Ok"
-      }
-    }
-  }
-}

package/react/Contacts/AddModal/CustomLabelDialog/locales/index.jsx

@@ -1,11 +0,0 @@
-import en from './en.json'
-import fr from './fr.json'
-import ru from './ru.json'
-import vi from './vi.json'
-
-export const locales = {
-  en,
-  fr,
-  ru,
-  vi
-}

package/react/Contacts/AddModal/CustomLabelDialog/locales/ru.json

@@ -1,15 +0,0 @@
-{
-  "Contacts": {
-    "AddModal": {
-      "CustomLabelDialog": {
-        "label": {
-          "custom": "Пользовательская метка",
-          "home": "Личное",
-          "work": "Рабочее"
-        },
-        "cancel": "Отменить",
-        "ok": "ОК"
-      }
-    }
-  }
-}

package/react/Contacts/AddModal/CustomLabelDialog/locales/vi.json

@@ -1,15 +0,0 @@
-{
-  "Contacts": {
-    "AddModal": {
-      "CustomLabelDialog": {
-        "label": {
-          "custom": "Nhãn tùy chỉnh",
-          "home": "Cá nhân",
-          "work": "Công việc"
-        },
-        "cancel": "Hủy",
-        "ok": "Ok"
-      }
-    }
-  }
-}

package/react/Contacts/AddModal/Readme.md

@@ -1,55 +0,0 @@
-Works with `final-form`, `final-form-arrays`, `react-final-form` and `react-final-form-arrays` packages under the hood.
-
-⚠️ Must be used within `AlertProvider`.
-
-```jsx
-import { useState } from 'react'
-import StarIcon from 'cozy-ui/transpiled/react/Icons/Star'
-import TextField from 'cozy-ui/transpiled/react/TextField'
-import ContactsAddModal from 'cozy-ui/transpiled/react/Contacts/AddModal'
-import DemoProvider from 'cozy-ui/docs/components/DemoProvider'
-import AlertProvider from 'cozy-ui/transpiled/react/providers/Alert'
-import Button from 'cozy-ui/transpiled/react/Buttons'
-import { johnDoeContact } from 'cozy-ui/transpiled/react/Contacts/AddModal/mocks'
-import contacts from 'cozy-ui/transpiled/react/ContactsList/_mockContacts.json'
-import Variants from 'cozy-ui/docs/components/Variants'
-
-initialState = { showModal: isTesting() }
-initialVariants = [{ withContact: false, withCustomFields: false }]
-
-const open = () => setState({ showModal: true })
-const close = () => setState({ showModal: false })
-
-const handleSubmit = async formData => {
-  console.info('formData :', formData)
-}
-
-const customFields = [{ name: 'customField', icon: StarIcon, type: 'text', position: 5, component: TextField }]
-
-;
-
-<DemoProvider dictRequire={() => ({ Contacts: {AddModal: {ContactForm: {fields: {customField: 'Custom field'}}}} })}>
-  <AlertProvider>
-    <Variants initialVariants={initialVariants}>
-      {variant => (
-        <>
-          <Button onClick={open} label="Open Modal" />
-          {state.showModal && (
-            <ContactsAddModal
-              contacts={{ data: contacts }}
-              contact={variant.withContact ? {...johnDoeContact, customField: "Custom field value"} : undefined}
-              customFieldsProps={variant.withCustomFields && {
-                fields: customFields,
-                makeCustomFieldsFormValues: formValues => ({ customField: formValues.customField }),
-                makeCustomContactValues: contact => ({ customField: contact.customField })
-              }}
-              onSubmit={handleSubmit}
-              onClose={close}
-            />
-          )}
-        </>
-      )}
-    </Variants>
-  </AlertProvider>
-</DemoProvider>
-```

package/react/Contacts/AddModal/index.jsx

@@ -1,85 +0,0 @@
-import React, { useState } from 'react'
-
-import ContactForm, { getSubmitContactForm } from './ContactForm'
-import { locales } from './locales'
-import Button from '../../Buttons'
-import { FixedDialog } from '../../CozyDialogs'
-import { useAlert } from '../../providers/Alert'
-import { useI18n, useExtendI18n } from '../../providers/I18n'
-
-const AddModal = ({
-  contacts,
-  contact,
-  customFieldsProps,
-  onSubmit,
-  onClose
-}) => {
-  useExtendI18n(locales)
-  const { t } = useI18n()
-  const { showAlert } = useAlert()
-  const [isBusy, setIsBusy] = useState(false)
-  // Tip to prevent fields from being filled with old information for a short period of time during form submission.
-  const [selfContact, setSelfContact] = useState(contact)
-
-  const handleClick = event => {
-    const submitContactForm = getSubmitContactForm()
-    submitContactForm(event)
-  }
-
-  /**
-   * @param {import('cozy-client/types/types').IOCozyContact} formData - Contact document (except _id, _rev & _type attrs to create a new contact)
-   */
-  const handleFormSubmit = async formData => {
-    setSelfContact(formData)
-    setIsBusy(true)
-    try {
-      await onSubmit(formData)
-      onClose()
-    } catch (err) {
-      setIsBusy(false)
-      console.warn(err) // eslint-disable-line no-console
-      showAlert({
-        severity: 'error',
-        message: t('Contacts.AddModal.error.save')
-      })
-    }
-  }
-
-  return (
-    <FixedDialog
-      open
-      onClose={onClose}
-      title={
-        contact
-          ? t('Contacts.AddModal.edit-contact')
-          : t('Contacts.AddModal.create_contact')
-      }
-      content={
-        <ContactForm
-          contacts={contacts}
-          contact={selfContact}
-          customFieldsProps={customFieldsProps}
-          onSubmit={handleFormSubmit}
-        />
-      }
-      actions={
-        <>
-          <Button
-            variant="secondary"
-            label={t('Contacts.AddModal.cancel')}
-            onClick={onClose}
-          />
-          <Button
-            className="u-ml-half"
-            type="submit"
-            label={t('Contacts.AddModal.save')}
-            busy={isBusy}
-            onClick={handleClick}
-          />
-        </>
-      }
-    />
-  )
-}
-
-export default AddModal

package/react/Contacts/AddModal/locales/en.json

@@ -1,13 +0,0 @@
-{
-  "Contacts": {
-    "AddModal": {
-      "error": {
-        "save": "An error occurred while saving the contact, please try again"
-      },
-      "edit-contact": "Edit contact",
-      "create_contact": "Create a contact",
-      "cancel": "Cancel",
-      "save": "Save"
-    }
-  }
-}

package/react/Contacts/AddModal/locales/fr.json

@@ -1,13 +0,0 @@
-{
-  "Contacts": {
-    "AddModal": {
-      "error": {
-        "save": "Une erreur est survenue lors de l'enregistrement du contact, veuillez réessayer"
-      },
-      "edit-contact": "Edit contact",
-      "create_contact": "Créer un contact",
-      "cancel": "Annuler",
-      "save": "Enregistrer"
-    }
-  }
-}

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

@@ -1,11 +0,0 @@
-import en from './en.json'
-import fr from './fr.json'
-import ru from './ru.json'
-import vi from './vi.json'
-
-export const locales = {
-  en,
-  fr,
-  ru,
-  vi
-}

package/react/Contacts/AddModal/locales/ru.json

@@ -1,13 +0,0 @@
-{
-  "Contacts": {
-    "AddModal": {
-      "error": {
-        "save": "Произошла ошибка при сохранении контакта, попробуйте еще раз"
-      },
-      "edit-contact": "Редактировать контакт",
-      "create_contact": "Создать контакт",
-      "cancel": "Отменить",
-      "save": "Сохранить"
-    }
-  }
-}

package/react/Contacts/AddModal/locales/vi.json

@@ -1,13 +0,0 @@
-{
-  "Contacts": {
-    "AddModal": {
-      "error": {
-        "save": "Có lỗi xảy ra khi lưu liên hệ, vui lòng thử lại"
-      },
-      "edit-contact": "Chỉnh sửa liên hệ",
-      "create_contact": "Tạo liên hệ",
-      "cancel": "Hủy",
-      "save": "Lưu"
-    }
-  }
-}

package/react/Contacts/AddModal/mocks.js

@@ -1,299 +0,0 @@
-export const johnDoeContact = {
-  id: '9ecfbf4b-20e7-4bac-87f1-eea53350857d',
-  _id: '9ecfbf4b-20e7-4bac-87f1-eea53350857d',
-  _type: 'io.cozy.contacts',
-  _rev: '1-19c313536e8b27473aa26bf105b03269',
-  address: [
-    {
-      formattedAddress: '94 Hinton Road 05034 Fresno, Singapore',
-      type: 'Home',
-      primary: true
-    },
-    {
-      pobox: '2',
-      street: '426 Runolfsson Knolls',
-      city: 'Port Easter',
-      region: undefined,
-      country: 'Cocos (Keeling) Islands',
-      postcode: '84573',
-      type: 'Work'
-    }
-  ],
-  email: [
-    {
-      address: 'john.doe@posteo.net',
-      type: 'personal',
-      primary: false
-    },
-    {
-      address: 'john.doe@cozycloud.cc',
-      primary: true
-    }
-  ],
-  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'
-    }
-  ],
-  birthday: '1999-5-1',
-  birthplace: 'somewhere',
-  gender: 'male',
-  company: 'Cozy cloud',
-  jobTitle: 'Dreamer',
-  cozy: [
-    {
-      type: 'MyCozy',
-      primary: true,
-      url: 'https://johndoe.mycozy.cloud'
-    }
-  ],
-  fullname: 'John Doe',
-  name: {
-    givenName: 'John',
-    familyName: 'Doe',
-    additionalName: 'J.'
-  },
-  metadata: {
-    cozy: true,
-    version: 1
-  },
-  note: 'Atque cupiditate saepe omnis quos ut molestiae labore voluptates omnis.',
-  phone: [
-    {
-      number: '+33 (2)0 90 00 54 04',
-      primary: true
-    },
-    {
-      number: '+33 6 77 11 22 33',
-      primary: false
-    },
-    {
-      label: 'Mobile', // could be this when importing from other sources i.e. google
-      number: '0876467998',
-      primary: false,
-      type: 'mobile'
-    }
-  ]
-}
-
-export const johnDoeFormValues = {
-  birthday: '1999-5-1',
-  birthplace: 'somewhere',
-  gender: 'male',
-  cozy: 'https://johndoe.mycozy.cloud',
-  cozyLabel: '{"type":"MyCozy"}',
-  matrix: 'john@doe.matrix.net',
-  address: [
-    {
-      fieldId: 'fieldId_1',
-      address: '94 Hinton Road 05034 Fresno, Singapore',
-      addressLabel: '{"type":"Home"}',
-      addressapartment: undefined,
-      addressbuilding: undefined,
-      addresscity: undefined,
-      addresscode: undefined,
-      addressregion: undefined,
-      addresscountry: undefined,
-      addressentrycode: undefined,
-      addressfloor: undefined,
-      addresslocality: undefined,
-      addressnumber: undefined,
-      addressstairs: undefined,
-      addressstreet: '94 Hinton Road 05034 Fresno, Singapore'
-    },
-    {
-      fieldId: 'fieldId_2',
-      address:
-        '426 Runolfsson Knolls 84573 Port Easter Cocos (Keeling) Islands',
-      addressLabel: '{"type":"Work"}',
-      addressapartment: undefined,
-      addressbuilding: undefined,
-      addresscity: 'Port Easter',
-      addressregion: undefined,
-      addresscode: '84573',
-      addresscountry: 'Cocos (Keeling) Islands',
-      addressentrycode: undefined,
-      addressfloor: undefined,
-      addresslocality: undefined,
-      addressnumber: undefined,
-      addressstairs: undefined,
-      addressstreet: '426 Runolfsson Knolls'
-    }
-  ],
-  email: [
-    {
-      fieldId: 'fieldId_3',
-      email: 'john.doe@cozycloud.cc',
-      emailLabel: undefined
-    },
-    {
-      fieldId: 'fieldId_4',
-      email: 'john.doe@posteo.net',
-      emailLabel: '{"type":"personal"}'
-    }
-  ],
-  phone: [
-    {
-      fieldId: 'fieldId_5',
-      phone: '+33 (2)0 90 00 54 04',
-      phoneLabel: undefined
-    },
-    {
-      fieldId: 'fieldId_6',
-      phone: '+33 6 77 11 22 33',
-      phoneLabel: undefined
-    },
-    {
-      fieldId: 'fieldId_7',
-      phone: '0876467998',
-      phoneLabel: '{"type":"mobile","label":"Mobile"}'
-    }
-  ],
-  givenName: 'John',
-  additionalName: 'J.',
-  familyName: 'Doe',
-  company: 'Cozy cloud',
-  jobTitle: 'Dreamer',
-  note: 'Atque cupiditate saepe omnis quos ut molestiae labore voluptates omnis.',
-  relatedContact: [
-    {
-      relatedContactId: 'relatedContactID',
-      relatedContactLabel: '{"type":"related"}'
-    }
-  ]
-}
-
-export const johnDoeContactWithRelated = {
-  id: '9ecfbf4b-20e7-4bac-87f1-eea53350857d',
-  _id: '9ecfbf4b-20e7-4bac-87f1-eea53350857d',
-  _type: 'io.cozy.contacts',
-  _rev: '1-19c313536e8b27473aa26bf105b03269',
-  address: [
-    {
-      formattedAddress: '94 Hinton Road 05034 Fresno, Singapore',
-      type: 'Home',
-      primary: true
-    },
-    {
-      pobox: '2',
-      street: '426 Runolfsson Knolls',
-      city: 'Port Easter',
-      region: undefined,
-      country: 'Cocos (Keeling) Islands',
-      postcode: '84573',
-      type: 'Work'
-    }
-  ],
-  impp: [
-    {
-      uri: 'john.doe@xmpp.net',
-      protocol: 'xmpp',
-      label: 'home',
-      primary: false
-    },
-    {
-      uri: 'john@doe.matrix.net',
-      protocol: 'matrix',
-      label: 'work',
-      primary: true
-    }
-  ],
-  email: [
-    {
-      address: 'john.doe@posteo.net',
-      type: 'personal',
-      primary: false
-    },
-    {
-      address: 'john.doe@cozycloud.cc',
-      primary: true
-    }
-  ],
-  birthday: '1999-5-1',
-  birthplace: 'somewhere',
-  gender: 'male',
-  company: 'Cozy cloud',
-  jobTitle: 'Dreamer',
-  cozy: [
-    {
-      type: 'MyCozy',
-      primary: true,
-      url: 'https://johndoe.mycozy.cloud'
-    }
-  ],
-  fullname: 'John Doe',
-  name: {
-    givenName: 'John',
-    familyName: 'Doe',
-    additionalName: 'J.'
-  },
-  metadata: {
-    cozy: true,
-    version: 1
-  },
-  note: 'Atque cupiditate saepe omnis quos ut molestiae labore voluptates omnis.',
-  phone: [
-    {
-      number: '+33 (2)0 90 00 54 04',
-      primary: true
-    },
-    {
-      number: '+33 6 77 11 22 33',
-      primary: false
-    }
-  ],
-  relationships: {
-    accounts: { data: [] },
-    groups: { data: [] },
-    related: {
-      data: [
-        {
-          metadata: { relationTypes: ['spouse'] },
-          _id: '5b49553c5916cf7b5b2a5f48600078a8',
-          _type: 'io.cozy.contacts'
-        }
-      ]
-    }
-  },
-  related: {
-    target: {
-      id: '4e33fd27e1d8e55a34742bac6d16d3bd',
-      _id: '4e33fd27e1d8e55a34742bac6d16d3bd',
-      _type: 'io.cozy.contacts',
-      _rev: '6-57f4ab78b1fb97bb90ea273ec881f196',
-      company: '',
-      fullname: 'John Doe',
-      me: true,
-      note: ''
-    },
-    name: 'related',
-    doctype: 'io.cozy.contacts',
-    data: [
-      {
-        displayName: 'Alice Doe',
-        _id: '5b49553c5916cf7b5b2a5f48600078a8',
-        _type: 'io.cozy.contacts'
-      }
-    ]
-  }
-}