cozy-ui 111.5.0 → 111.7.0

package/react/Toggle/index.jsx

@@ -1,7 +1,7 @@
-import styles from './styles.styl'
-
-import React, { Component } from 'react'
 import PropTypes from 'prop-types'
+import React, { Component } from 'react'
+
+import styles from './styles.styl'
 
 class Toggle extends Component {
   componentDidMount() {

package/react/Typography/index.jsx

@@ -1,5 +1,5 @@
-import React, { forwardRef } from 'react'
 import MuiTypography from '@material-ui/core/Typography'
+import React, { forwardRef } from 'react'
 
 const Typography = forwardRef(({ color, variant, children, ...props }, ref) => {
   const madeColor =

package/react/UnorderedList/index.jsx

@@ -1,5 +1,6 @@
-import React from 'react'
 import cx from 'classnames'
+import React from 'react'
+
 import styles from './styles.styl'
 import Stack from '../Stack'
 

package/react/UploadQueue/index.jsx

@@ -1,17 +1,18 @@
-import React, { Component, useState } from 'react'
-import cx from 'classnames'
 import LinearProgress from '@material-ui/core/LinearProgress'
+import cx from 'classnames'
+import React, { Component, useState } from 'react'
 import { useIntervalWhen } from 'rooks'
 
 import { splitFilename } from 'cozy-client/dist/models/file'
 
-import { withStyles } from '../styles'
+import localeEn from './locales/en.json'
+import localeEs from './locales/es.json'
+import localeFr from './locales/fr.json'
+import styles from './styles.styl'
+import Icon from '../Icon'
+import CheckIcon from '../Icons/Check'
 import CrossIcon from '../Icons/Cross'
 import WarningIcon from '../Icons/Warning'
-import CheckIcon from '../Icons/Check'
-import { translate, useI18n } from '../providers/I18n'
-import withLocales from '../providers/I18n/withLocales'
-import Icon from '../Icon'
 import Spinner from '../Spinner'
 import Typography from '../Typography'
 import List from '../List'
@@ -20,12 +21,10 @@ import ListItemText from '../ListItemText'
 import ListItemIcon from '../ListItemIcon'
 import { Img } from '../deprecated/Media'
 import Button from '../deprecated/Button'
-
-import styles from './styles.styl'
-import localeEn from './locales/en.json'
-import localeEs from './locales/es.json'
-import localeFr from './locales/fr.json'
+import { translate, useI18n } from '../providers/I18n'
 import { formatLocallyDistanceToNow } from '../providers/I18n/format'
+import withLocales from '../providers/I18n/withLocales'
+import { withStyles } from '../styles'
 
 const locales = {
   en: localeEn,

package/react/UploadQueue/index.spec.jsx

@@ -1,6 +1,7 @@
+import { render } from '@testing-library/react'
 import React from 'react'
+
 import { UploadQueue, formatRemainingTime } from '.'
-import { render } from '@testing-library/react'
 import { useI18n } from '../providers/I18n'
 
 jest.mock('../providers/I18n/withLocales', () =>

package/react/Viewer/Footer/BottomSheetContent.jsx

@@ -1,8 +1,7 @@
-import React from 'react'
 import PropTypes from 'prop-types'
+import React from 'react'
 
 import { BottomSheetItem } from '../../BottomSheet'
-
 import getPanelBlocks, { getPanelBlocksSpecs } from '../Panel/getPanelBlocks'
 
 const BottomSheetContent = ({ file, isPublic }) => {

package/react/Viewer/Footer/DownloadButton.jsx

@@ -1,14 +1,14 @@
-import React from 'react'
 import PropTypes from 'prop-types'
+import React from 'react'
 
 import { useClient } from 'cozy-client'
 
-import { useI18n } from '../../providers/I18n'
+import Button from '../../Buttons'
 import Icon from '../../Icon'
 import IconButton from '../../IconButton'
 import DownloadIcon from '../../Icons/Download'
-import Button from '../../Buttons'
 import Alerter from '../../deprecated/Alerter'
+import { useI18n } from '../../providers/I18n'
 
 const DownloadButton = ({ file, variant }) => {
   const client = useClient()

package/react/Viewer/Footer/FooterActionButtons.jsx

@@ -1,5 +1,5 @@
-import { cloneElement } from 'react'
 import PropTypes from 'prop-types'
+import { cloneElement } from 'react'
 
 import { mapToAllChildren } from './helpers'
 

package/react/Viewer/Footer/FooterActionButtons.spec.jsx

@@ -1,5 +1,5 @@
-import React from 'react'
 import { render } from '@testing-library/react'
+import React from 'react'
 
 import FooterActionButtons from './FooterActionButtons'
 

package/react/Viewer/Footer/FooterContent.jsx

@@ -1,13 +1,13 @@
-import React, { useMemo } from 'react'
-import PropTypes from 'prop-types'
 import cx from 'classnames'
+import PropTypes from 'prop-types'
+import React, { useMemo } from 'react'
 
+import BottomSheetContent from './BottomSheetContent'
+import { extractChildrenCompByName } from './helpers'
 import BottomSheet, { BottomSheetHeader } from '../../BottomSheet'
 import { makeStyles } from '../../styles'
-import { isValidForPanel } from '../helpers'
 import PrintButton from '../components/PrintButton'
-import { extractChildrenCompByName } from './helpers'
-import BottomSheetContent from './BottomSheetContent'
+import { isValidForPanel } from '../helpers'
 
 const FooterButtons = ({
   file,

package/react/Viewer/Footer/ForwardButton.jsx

@@ -1,18 +1,18 @@
-import React from 'react'
 import PropTypes from 'prop-types'
+import React from 'react'
 
 import { useClient } from 'cozy-client'
+import { getSharingLink } from 'cozy-client/dist/models/sharing'
 import { isIOS, isMobileApp } from 'cozy-device-helper'
 
-import { useI18n } from '../../providers/I18n'
+import { exportFilesNative } from './helpers'
+import Button from '../../Buttons'
 import Icon from '../../Icon'
 import IconButton from '../../IconButton'
 import ReplyIcon from '../../Icons/Reply'
 import ShareIosIcon from '../../Icons/ShareIos'
-import Button from '../../Buttons'
 import Alerter from '../../deprecated/Alerter'
-import { exportFilesNative } from './helpers'
-import { getSharingLink } from 'cozy-client/dist/models/sharing'
+import { useI18n } from '../../providers/I18n'
 
 const ForwardIcon = isIOS() ? ShareIosIcon : ReplyIcon
 

package/react/Viewer/Footer/ForwardButton.spec.jsx

@@ -1,12 +1,12 @@
-import React from 'react'
 import { render, fireEvent } from '@testing-library/react'
+import React from 'react'
 
 import { getSharingLink } from 'cozy-client/dist/models/sharing'
 import { isMobileApp } from 'cozy-device-helper'
 
-import DemoProvider from '../docs/DemoProvider'
 import ForwardButton from './ForwardButton'
 import { exportFilesNative } from './helpers'
+import DemoProvider from '../docs/DemoProvider'
 
 jest.mock('cozy-device-helper')
 jest.mock('cozy-client/dist/models/sharing', () => ({

package/react/Viewer/Footer/ForwardOrDownloadButton.jsx

@@ -1,10 +1,10 @@
-import React from 'react'
 import PropTypes from 'prop-types'
+import React from 'react'
 
 import { useClient } from 'cozy-client'
 
-import ForwardButton from './ForwardButton'
 import DownloadButton from './DownloadButton'
+import ForwardButton from './ForwardButton'
 import { shouldBeForwardButton } from './helpers'
 
 const ForwardOrDownloadButton = ({ file, ...props }) => {

package/react/Viewer/Footer/Sharing.jsx

@@ -1,12 +1,12 @@
-import React, { useState } from 'react'
 import PropTypes from 'prop-types'
+import React, { useState } from 'react'
 
 import { useClient } from 'cozy-client'
 import { ShareModal, ShareButton } from 'cozy-sharing'
 import { SharingProvider } from 'cozy-sharing/dist/SharingProvider'
 
-import IconButton from '../../IconButton'
 import Icon from '../../Icon'
+import IconButton from '../../IconButton'
 import ShareIcon from '../../Icons/Share'
 
 const Sharing = ({ file, variant }) => {

package/react/Viewer/Footer/helpers.js

@@ -1,4 +1,5 @@
 import { isValidElement, Children, cloneElement } from 'react'
+
 import { saveFileWithCordova } from 'cozy-client/dist/models/fsnative'
 import { isIOS, isMobileApp } from 'cozy-device-helper'
 

package/react/Viewer/NoViewer/DownloadButton.jsx

@@ -1,12 +1,11 @@
-import React from 'react'
 import PropTypes from 'prop-types'
+import React from 'react'
 
 import { withClient } from 'cozy-client'
 
-import { useI18n } from '../../providers/I18n'
-import { FileDoctype } from '../../proptypes'
 import Button from '../../deprecated/Button'
-
+import { FileDoctype } from '../../proptypes'
+import { useI18n } from '../../providers/I18n'
 import { downloadFile } from '../helpers'
 
 const DownloadButton = ({ client, file, url }) => {

package/react/Viewer/NoViewer/FileIcon.jsx

@@ -3,12 +3,12 @@ import React from 'react'
 import Icon from '../../Icon'
 import FileTypeBinIcon from '../../Icons/FileTypeBin'
 import FileTypeCodeIcon from '../../Icons/FileTypeCode'
+import FileTypeFilesIcon from '../../Icons/FileTypeFiles'
+import FileTypePdfIcon from '../../Icons/FileTypePdf'
 import FileTypeSheetIcon from '../../Icons/FileTypeSheet'
 import FileTypeSlideIcon from '../../Icons/FileTypeSlide'
 import FileTypeTextIcon from '../../Icons/FileTypeText'
 import FileTypeZipIcon from '../../Icons/FileTypeZip'
-import FileTypePdfIcon from '../../Icons/FileTypePdf'
-import FileTypeFilesIcon from '../../Icons/FileTypeFiles'
 
 const FileIcon = ({ type }) => {
   let icon

package/react/Viewer/NoViewer/NoViewer.jsx

@@ -1,9 +1,10 @@
-import React from 'react'
 import PropTypes from 'prop-types'
-import FileIcon from './FileIcon'
+import React from 'react'
+
 import DownloadButton from './DownloadButton'
-import styles from '../ViewersByFile/styles.styl'
+import FileIcon from './FileIcon'
 import { FileDoctype } from '../../proptypes'
+import styles from '../ViewersByFile/styles.styl'
 
 const NoViewer = ({ file, url, renderFallbackExtraContent }) => (
   <div className={styles['viewer-noviewer']}>

package/react/Viewer/NoViewer/NoViewer.spec.jsx

@@ -1,9 +1,8 @@
-import React from 'react'
 import { render } from '@testing-library/react'
-
-import DemoProvider from '../docs/DemoProvider'
+import React from 'react'
 
 import NoViewer from './NoViewer'
+import DemoProvider from '../docs/DemoProvider'
 
 const file = {
   _id: 'notSupported',

package/react/Viewer/Panel/ActionMenuDesktop.jsx

@@ -1,14 +1,14 @@
-import React, { forwardRef } from 'react'
 import PropTypes from 'prop-types'
-import styles from './styles.styl'
+import React, { forwardRef } from 'react'
 
+import styles from './styles.styl'
+import AppLinker from '../../AppLinker'
 import Icon from '../../Icon'
 import Copy from '../../Icons/Copy'
 import Edit from '../../Icons/Rename'
-import ActionMenu, { ActionMenuItem } from '../../deprecated/ActionMenu'
 import Typography from '../../Typography'
+import ActionMenu, { ActionMenuItem } from '../../deprecated/ActionMenu'
 import { useI18n } from '../../providers/I18n'
-import AppLinker from '../../AppLinker'
 
 const ActionMenuDesktop = forwardRef(
   ({ onClose, isEditable, actions, appLink, appSlug }, ref) => {

package/react/Viewer/Panel/ActionMenuMobile.jsx

@@ -1,16 +1,16 @@
-import React from 'react'
 import PropTypes from 'prop-types'
+import React from 'react'
 
+import AppLinker from '../../AppLinker'
+import BottomSheet, { BottomSheetItem } from '../../BottomSheet'
+import Icon from '../../Icon'
+import Copy from '../../Icons/Copy'
+import Edit from '../../Icons/Rename'
 import List from '../../List'
 import ListItem from '../../ListItem'
 import ListItemIcon from '../../ListItemIcon'
 import ListItemText from '../../ListItemText'
-import Icon from '../../Icon'
-import Copy from '../../Icons/Copy'
-import Edit from '../../Icons/Rename'
-import BottomSheet, { BottomSheetItem } from '../../BottomSheet'
 import { useI18n } from '../../providers/I18n'
-import AppLinker from '../../AppLinker'
 
 const ActionMenuMobile = ({
   onClose,

package/react/Viewer/Panel/ActionMenuWrapper.jsx

@@ -1,19 +1,19 @@
-import React, { forwardRef } from 'react'
 import PropTypes from 'prop-types'
+import React, { forwardRef } from 'react'
 
 import { useAppLinkWithStoreFallback, useClient } from 'cozy-client'
 
+import ActionMenuDesktop from './ActionMenuDesktop'
+import ActionMenuMobile from './ActionMenuMobile'
+import { useAlert } from '../../providers/Alert'
 import useBreakpoints from '../../providers/Breakpoints'
 import { useI18n } from '../../providers/I18n'
-import { useAlert } from '../../providers/Alert'
 import {
   buildEditAttributePath,
   isEditableAttribute,
   getCurrentModel
 } from '../helpers'
 import useActionMenuContext from '../providers/ActionMenuProvider'
-import ActionMenuMobile from './ActionMenuMobile'
-import ActionMenuDesktop from './ActionMenuDesktop'
 
 const mespapiersAppSlug = 'mespapiers'
 

package/react/Viewer/Panel/Certifications.jsx

@@ -1,17 +1,17 @@
-import React from 'react'
-import PropTypes from 'prop-types'
 import has from 'lodash/has'
+import PropTypes from 'prop-types'
+import React from 'react'
 
-import Typography from '../../Typography'
-import { Media, Img, Bd } from '../../deprecated/Media'
 import Icon, { iconPropType } from '../../Icon'
 import CarbonCopyIcon from '../../Icons/CarbonCopy'
 import SafeIcon from '../../Icons/Safe'
+import Typography from '../../Typography'
+import { Media, Img, Bd } from '../../deprecated/Media'
 import { withViewerLocales } from '../hoc/withViewerLocales'
 
 const Certification = ({ icon, title, caption }) => {
   return (
-    <div className={'u-ph-2 u-pv-1'}>
+    <div className="u-ph-2 u-pv-1">
       <Media className="u-mb-half" align="top">
         <Img className="u-mr-half">
           <Icon icon={icon} />

package/react/Viewer/Panel/PanelContent.jsx

@@ -1,14 +1,13 @@
-import React from 'react'
-import PropTypes from 'prop-types'
 import cx from 'classnames'
+import PropTypes from 'prop-types'
+import React from 'react'
 
-import Stack from '../../Stack'
+import getPanelBlocks, { getPanelBlocksSpecs } from './getPanelBlocks'
 import Paper from '../../Paper'
+import Stack from '../../Stack'
 import Typography from '../../Typography'
 import { withViewerLocales } from '../hoc/withViewerLocales'
 
-import getPanelBlocks, { getPanelBlocksSpecs } from './getPanelBlocks'
-
 const PanelContent = ({ file, isPublic, t }) => {
   const panelBlocks = getPanelBlocks({
     panelBlocksSpecs: getPanelBlocksSpecs(isPublic),
@@ -33,7 +32,7 @@ const PanelContent = ({ file, isPublic, t }) => {
           elevation={2}
           square
         >
-          <Typography variant="h4" className={'u-pv-1'}>
+          <Typography variant="h4" className="u-pv-1">
             <PanelBlock file={file} />
           </Typography>
         </Paper>

package/react/Viewer/Panel/Qualification.jsx

@@ -1,5 +1,5 @@
-import React, { useRef, useState, createRef, useMemo, useEffect } from 'react'
 import PropTypes from 'prop-types'
+import React, { useRef, useState, createRef, useMemo, useEffect } from 'react'
 
 import {
   isExpiringSoon,
@@ -8,14 +8,14 @@ import {
   getMetadataQualificationType
 } from 'cozy-client/dist/models/paper'
 
-import List from '../../List'
-import { withViewerLocales } from '../hoc/withViewerLocales'
-import ExpirationAlert from '../components/ExpirationAlert'
 import ActionMenuWrapper from './ActionMenuWrapper'
 import QualificationListItemContact from './QualificationListItemContact'
 import QualificationListItemDate from './QualificationListItemDate'
 import QualificationListItemInformation from './QualificationListItemInformation'
 import QualificationListItemOther from './QualificationListItemOther'
+import List from '../../List'
+import ExpirationAlert from '../components/ExpirationAlert'
+import { withViewerLocales } from '../hoc/withViewerLocales'
 
 const ComponentFromMetadataQualificationType = {
   contact: QualificationListItemContact,
@@ -76,7 +76,7 @@ const Qualification = ({ file }) => {
       {isExpiringSoon(file) && !isExpirationAlertHidden(file) && (
         <ExpirationAlert file={file} />
       )}
-      <List className={'u-pv-1'}>
+      <List className="u-pv-1">
         {formattedMetadataQualification.map((meta, idx) => {
           const { name } = meta
           const metadataQualificationType = getMetadataQualificationType(name)

package/react/Viewer/Panel/QualificationListItemContact.jsx

@@ -1,21 +1,21 @@
-import React, { useRef, useState } from 'react'
 import PropTypes from 'prop-types'
+import React, { useRef, useState } from 'react'
 
 import {
   getTranslatedNameForContact,
   formatContactValue
 } from 'cozy-client/dist/models/paper'
 
-import ListItem from '../../ListItem'
-import ListItemSecondaryAction from '../../ListItemSecondaryAction'
-import IconButton from '../../IconButton'
+import ActionMenuWrapper from './ActionMenuWrapper'
+import QualificationListItemText from './QualificationListItemText'
 import Icon from '../../Icon'
+import IconButton from '../../IconButton'
 import Dots from '../../Icons/Dots'
-import QualificationListItemText from './QualificationListItemText'
+import ListItem from '../../ListItem'
+import ListItemSecondaryAction from '../../ListItemSecondaryAction'
 import Spinner from '../../Spinner'
-import useReferencedContactName from '../hooks/useReferencedContactName'
 import { useI18n } from '../../providers/I18n'
-import ActionMenuWrapper from './ActionMenuWrapper'
+import useReferencedContactName from '../hooks/useReferencedContactName'
 
 const QualificationListItemContact = ({ file }) => {
   const { lang } = useI18n()
@@ -36,7 +36,7 @@ const QualificationListItemContact = ({ file }) => {
 
   if (isLoadingContacts) {
     return (
-      <ListItem className={'u-pl-2 u-pr-3'}>
+      <ListItem className="u-pl-2 u-pr-3">
         <Spinner color="var(--secondaryTextColor)" />
       </ListItem>
     )
@@ -51,7 +51,7 @@ const QualificationListItemContact = ({ file }) => {
 
   return (
     <>
-      <ListItem className={'u-ph-2'}>
+      <ListItem className="u-ph-2">
         <QualificationListItemText
           primary={formattedTitle}
           secondary={formattedValue}

package/react/Viewer/Panel/QualificationListItemDate.jsx

@@ -1,5 +1,5 @@
-import React, { forwardRef } from 'react'
 import PropTypes from 'prop-types'
+import React, { forwardRef } from 'react'
 
 import {
   isExpired,
@@ -8,15 +8,15 @@ import {
   formatDateMetadataValue
 } from 'cozy-client/dist/models/paper'
 
-import ListItem from '../../ListItem'
-import ListItemSecondaryAction from '../../ListItemSecondaryAction'
-import IconButton from '../../IconButton'
+import QualificationListItemText from './QualificationListItemText'
 import Icon from '../../Icon'
+import IconButton from '../../IconButton'
 import Dots from '../../Icons/Dots'
+import ListItem from '../../ListItem'
+import ListItemSecondaryAction from '../../ListItemSecondaryAction'
 import Typography from '../../Typography'
-import ExpirationAnnotation from '../components/ExpirationAnnotation'
-import QualificationListItemText from './QualificationListItemText'
 import { useI18n } from '../../providers/I18n'
+import ExpirationAnnotation from '../components/ExpirationAnnotation'
 
 const QualificationListItemDate = forwardRef(
   ({ file, formattedMetadataQualification, toggleActionsMenu }, ref) => {
@@ -30,7 +30,7 @@ const QualificationListItemDate = forwardRef(
     const isExpirationDate = name === 'expirationDate'
 
     return (
-      <ListItem className={'u-pl-2 u-pr-3'}>
+      <ListItem className="u-pl-2 u-pr-3">
         <QualificationListItemText
           primary={formattedTitle}
           secondary={

package/react/Viewer/Panel/QualificationListItemInformation.jsx

@@ -1,19 +1,19 @@
-import React, { forwardRef } from 'react'
 import PropTypes from 'prop-types'
+import React, { forwardRef } from 'react'
 
 import {
   getTranslatedNameForInformationMetadata,
   formatInformationMetadataValue
 } from 'cozy-client/dist/models/paper'
 
-import ListItem from '../../ListItem'
-import ListItemSecondaryAction from '../../ListItemSecondaryAction'
-import IconButton from '../../IconButton'
+import QualificationListItemText from './QualificationListItemText'
 import Icon from '../../Icon'
+import IconButton from '../../IconButton'
 import Dots from '../../Icons/Dots'
-import QualificationListItemText from './QualificationListItemText'
-import { useI18n } from '../../providers/I18n'
+import ListItem from '../../ListItem'
+import ListItemSecondaryAction from '../../ListItemSecondaryAction'
 import MidEllipsis from '../../MidEllipsis'
+import { useI18n } from '../../providers/I18n'
 
 const QualificationListItemInformation = forwardRef(
   ({ formattedMetadataQualification, file, toggleActionsMenu }, ref) => {
@@ -35,7 +35,7 @@ const QualificationListItemInformation = forwardRef(
       formattedTitle === name ? <MidEllipsis text={name} /> : formattedTitle
 
     return (
-      <ListItem className={'u-pl-2 u-pr-3'}>
+      <ListItem className="u-pl-2 u-pr-3">
         <QualificationListItemText
           primary={titleComponent}
           secondary={formattedValue}

package/react/Viewer/Panel/QualificationListItemInformation.spec.jsx

@@ -1,5 +1,5 @@
-import React from 'react'
 import { fireEvent, render } from '@testing-library/react'
+import React from 'react'
 
 import QualificationListItemInformation from './QualificationListItemInformation'
 
@@ -30,6 +30,7 @@ describe('QualificationListItemInformation', () => {
 
       expect(getByText('No information'))
     })
+    // eslint-disable-next-line jest/no-focused-tests
     it.only('should display current value if it is truthy', () => {
       const formattedMetadataQualification = {
         name: 'country',

package/react/Viewer/Panel/QualificationListItemOther.jsx

@@ -1,19 +1,19 @@
-import React, { forwardRef } from 'react'
 import PropTypes from 'prop-types'
+import React, { forwardRef } from 'react'
 
 import {
   getTranslatedNameForOtherMetadata,
   formatOtherMetadataValue
 } from 'cozy-client/dist/models/paper'
 
-import ListItem from '../../ListItem'
-import ListItemSecondaryAction from '../../ListItemSecondaryAction'
-import IconButton from '../../IconButton'
+import QualificationListItemText from './QualificationListItemText'
 import Icon from '../../Icon'
+import IconButton from '../../IconButton'
 import Dots from '../../Icons/Dots'
-import QualificationListItemText from './QualificationListItemText'
-import { useI18n } from '../../providers/I18n'
+import ListItem from '../../ListItem'
+import ListItemSecondaryAction from '../../ListItemSecondaryAction'
 import MidEllipsis from '../../MidEllipsis'
+import { useI18n } from '../../providers/I18n'
 
 const QualificationListItemOther = forwardRef(
   ({ formattedMetadataQualification, toggleActionsMenu }, ref) => {
@@ -31,7 +31,7 @@ const QualificationListItemOther = forwardRef(
     })
 
     return (
-      <ListItem className={'u-pl-2 u-pr-3'}>
+      <ListItem className="u-pl-2 u-pr-3">
         <QualificationListItemText
           primary={formattedTitle}
           secondary={<MidEllipsis text={formattedValue} />}

package/react/Viewer/Panel/QualificationListItemText.jsx

@@ -1,5 +1,5 @@
-import React from 'react'
 import PropTypes from 'prop-types'
+import React from 'react'
 
 import ListItemText from '../../ListItemText'
 import Typography from '../../Typography'

package/react/Viewer/Panel/getPanelBlocks.jsx

@@ -1,5 +1,5 @@
-import KonnectorBlock from 'cozy-harvest-lib/dist/components/KonnectorBlock'
 import { models } from 'cozy-client'
+import KonnectorBlock from 'cozy-harvest-lib/dist/components/KonnectorBlock'
 
 import Certifications from './Certifications'
 import Qualification from './Qualification'

package/react/Viewer/Viewer.jsx

@@ -1,11 +1,10 @@
-import React, { Component } from 'react'
 import PropTypes from 'prop-types'
+import React, { Component } from 'react'
 
-import { FileDoctype } from '../proptypes'
-
-import ViewerControls from './components/ViewerControls'
-import ViewerByFile from './components/ViewerByFile'
 import { toolbarPropsPropType } from '.'
+import ViewerByFile from './components/ViewerByFile'
+import ViewerControls from './components/ViewerControls'
+import { FileDoctype } from '../proptypes'
 
 const KEY_CODE_LEFT = 37
 const KEY_CODE_RIGHT = 39