fix: Fix issue with svg loader

cozy · Jan 17, 2020 · 8028e13 · 8028e13
1 parent a5a08ce
commit 8028e13
Show file tree

Hide file tree

Showing 10 changed files with 43 additions and 37 deletions.
diff --git a/packages/cozy-sharing/assets/icons/icon-cross-bold.svg b/packages/cozy-sharing/assets/icons/icon-cross-bold.svg
diff --git a/packages/cozy-sharing/assets/icons/icon-eye-16.svg b/packages/cozy-sharing/assets/icons/icon-eye-16.svg
diff --git a/packages/cozy-sharing/assets/icons/icon-hourglass-16.svg b/packages/cozy-sharing/assets/icons/icon-hourglass-16.svg
diff --git a/packages/cozy-sharing/assets/icons/icon-link-16.svg b/packages/cozy-sharing/assets/icons/icon-link-16.svg
diff --git a/packages/cozy-sharing/assets/icons/icon-link.svg b/packages/cozy-sharing/assets/icons/icon-link.svg
diff --git a/packages/cozy-sharing/assets/icons/icon-pen-write-16.svg b/packages/cozy-sharing/assets/icons/icon-pen-write-16.svg
diff --git a/packages/cozy-sharing/babel.config.js b/packages/cozy-sharing/babel.config.js
@@ -18,7 +18,20 @@ module.exports = {
             : '[name]__[local]___[hash:base64:5]'
       }
     ],
-    'inline-react-svg'
+    [
+      'inline-react-svg',
+      {
+        svgo: {
+          plugins: [
+            {
+              cleanupIDs: {
+                minify: false
+              }
+            }
+          ]
+        }
+      }
+    ]
   ],
   env: {
     test: {

diff --git a/packages/cozy-sharing/src/components/Recipient.jsx b/packages/cozy-sharing/src/components/Recipient.jsx
@@ -1,12 +1,7 @@
 import React, { Component } from 'react'
 import classNames from 'classnames'
 import PropTypes from 'prop-types'
-import {
-  Spinner,
-  MenuItem,
-  withBreakpoints,
-  Icon
-} from 'cozy-ui/transpiled/react'
+import { Spinner, MenuItem, withBreakpoints } from 'cozy-ui/transpiled/react'
 
 import MenuAwareMobile from './MenuAwareMobile'
 import { AvatarPlusX, AvatarLink, Avatar } from './Avatar'
@@ -99,11 +94,11 @@ class Status extends Component {
   getStatusIcon = type => {
     switch (type) {
       case 'one-way':
-        return IconEye
+        return <IconEye />
       case 'two-way':
-        return IconPen
+        return <IconPen />
       default:
-        return IconHourglass
+        return <IconHourglass />
     }
   }
 
@@ -138,7 +133,7 @@ class Status extends Component {
             }}
             name={name}
           >
-            <MenuItem icon={<Icon icon={this.getStatusIcon(status)} />}>
+            <MenuItem icon={this.getStatusIcon(status)}>
               {status === 'ready' && type
                 ? t(`Share.type.${type}`)
                 : t(`Share.status.${status}`)}
@@ -148,7 +143,7 @@ class Status extends Component {
             <MenuItem
               onSelect={this.onRevoke}
               onClick={this.onRevoke}
-              icon={<Icon icon={IconTrash} />}
+              icon={<IconTrash />}
             >
               <div className={styles['action-unshare']}>
                 {isOwner

diff --git a/packages/cozy-sharing/src/components/ShareAutosuggest.jsx b/packages/cozy-sharing/src/components/ShareAutosuggest.jsx
@@ -1,7 +1,7 @@
 import React, { Component } from 'react'
 import Autosuggest from 'react-autosuggest'
 
-import { Icon, Spinner } from 'cozy-ui/transpiled/react'
+import { Spinner } from 'cozy-ui/transpiled/react'
 import palette from 'cozy-ui/transpiled/react/palette'
 
 import styles from './autosuggest.styl'
@@ -115,7 +115,7 @@ export default class ShareAutocomplete extends Component {
                 className={styles['removeRecipient']}
                 onClick={() => this.onRemove(recipient)}
               >
-                <Icon icon={BoldCross} width="16" height="16" />
+                <BoldCross />
               </button>
             </div>
           )

diff --git a/packages/cozy-sharing/src/components/SharedStatus.jsx b/packages/cozy-sharing/src/components/SharedStatus.jsx
@@ -2,7 +2,6 @@ import React from 'react'
 import { translate } from 'cozy-ui/transpiled/react/I18n'
 import { SharingTooltip, TooltipRecipientList } from './Tooltip'
 import cx from 'classnames'
-import Icon from 'cozy-ui/transpiled/react/Icon'
 
 import { Contact } from '../models'
 import styles from './status.styl'
@@ -28,7 +27,7 @@ const SharedStatus = ({ className, docId, recipients, link, t }) => (
         />
       </SharingTooltip>
     )}
-    {link && <Icon icon={LinkIcon} />}
+    {link && <LinkIcon />}
   </span>
 )