From 33913d8b167e60b933f508db33c51ef04bbd58b9 Mon Sep 17 00:00:00 2001
From: Patrick Browne <pt.browne@gmail.com>
Date: Mon, 19 Oct 2020 11:56:23 +0200
Subject: [PATCH 01/11] feat: Remove replaceTitleOnMobile

---
 examples/index.jsx            |  1 -
 src/components/Apps/index.jsx |  5 +----
 src/components/Bar.jsx        | 10 +---------
 src/index.jsx                 | 17 ++++++++---------
 4 files changed, 10 insertions(+), 23 deletions(-)

diff --git a/examples/index.jsx b/examples/index.jsx
index f197a511a..c888e5bc6 100644
--- a/examples/index.jsx
+++ b/examples/index.jsx
@@ -85,7 +85,6 @@ client.on('login', () => {
     appSlug: appInfo.slug,
     iconPath: appIcon,
     lang: 'en',
-    replaceTitleOnMobile: true,
     ...(isInitializedWithCozyClient() ? newOptions : oldOptions),
     // This should be done automatically
     onLogOut: async () => {
diff --git a/src/components/Apps/index.jsx b/src/components/Apps/index.jsx
index f0ce5e867..175021b78 100644
--- a/src/components/Apps/index.jsx
+++ b/src/components/Apps/index.jsx
@@ -40,7 +40,6 @@ class Apps extends Component {
   // data-tutorial attribute allows to be targeted in an application tutorial
   render() {
     const {
-      replaceTitleOnMobile,
       appName,
       appNamePrefix,
       appSlug,
@@ -50,9 +49,7 @@ class Apps extends Component {
     const { opened } = this.state
     return (
       <nav
-        className={`coz-nav coz-nav-apps${
-          replaceTitleOnMobile ? ' coz-bar-hide-sm' : ''
-        }`}
+        className='coz-nav coz-nav-apps'
         ref={ref => {
           this.rootRef = ref
         }}
diff --git a/src/components/Bar.jsx b/src/components/Bar.jsx
index a18cd7150..edb227ed3 100644
--- a/src/components/Bar.jsx
+++ b/src/components/Bar.jsx
@@ -140,21 +140,13 @@ export class Bar extends Component {
   }
 
   renderCenter() {
-    const {
-      appName,
-      appNamePrefix,
-      appSlug,
-      iconPath,
-      replaceTitleOnMobile,
-      isPublic
-    } = this.props
+    const { appName, appNamePrefix, appSlug, iconPath, isPublic } = this.props
     return (
       <Apps
         appName={appName}
         appNamePrefix={appNamePrefix}
         appSlug={appSlug}
         iconPath={iconPath}
-        replaceTitleOnMobile={replaceTitleOnMobile}
         isPublic={isPublic}
       />
     )
diff --git a/src/index.jsx b/src/index.jsx
index e806ceb85..93fb4df0a 100644
--- a/src/index.jsx
+++ b/src/index.jsx
@@ -124,18 +124,17 @@ let exposedAPI = {}
  * or a { cozyURL, ssl, token } tupple.
  *
  * @function
- * @param {Object}  arg
- * @param {string}  arg.appName    - App name to be displayed in the bar
- * @param {string}  arg.appNamePrefix
- * @param {string}  arg.lang       - Language for the bar
- * @param {string}  arg.iconPath   -
- * @param {Object}  arg.cozyClient - a cozy client instance
- * @param {string}  arg.cozyURL    - URL or domain of the stack
- * @param {boolean} arg.ssl        - Tells if we should use a secure
+ * @param {Object}  options
+ * @param {string}  options.appName    - App name to be displayed in the bar
+ * @param {string}  options.appNamePrefix
+ * @param {string}  options.lang       - Language for the bar
+ * @param {string}  options.iconPath   -
+ * @param {Object}  options.cozyClient - a cozy client instance
+ * @param {string}  options.cozyURL    - URL or domain of the stack
+ * @param {boolean} options.ssl        - Tells if we should use a secure
  *                                   protocol required if cozyURL does
  *                                   not have a protocol
  * @param {string}  arg.token      - Access token for the stack
- * @param {boolean} arg.replaceTitleOnMobile
  * @param {boolean} arg.isPublic
  * @param {Function} arg.onLogout
  */

From 0732d2b4b04b6b8bed00f138ab83e9f6564aa3bb Mon Sep 17 00:00:00 2001
From: Patrick Browne <pt.browne@gmail.com>
Date: Mon, 19 Oct 2020 09:13:16 +0200
Subject: [PATCH 02/11] fix: Do not use parcel cache as it brings problems

It can make the build fail with no reason
---
 examples/Procfile | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/examples/Procfile b/examples/Procfile
index 7c4783066..066ce8001 100644
--- a/examples/Procfile
+++ b/examples/Procfile
@@ -1,3 +1,3 @@
 build-bar: yarn watch
 serve-bar: cd dist; python3 -m http.server 8000
-serve-example: yarn parcel examples/index.html --port 1234
+serve-example: yarn parcel examples/index.html --no-cache --port 1234

From de5e48c10db0844d8f8cde517df690a17b106034 Mon Sep 17 00:00:00 2001
From: Patrick Browne <pt.browne@gmail.com>
Date: Tue, 20 Oct 2020 09:48:08 +0200
Subject: [PATCH 03/11] feat: Remove groups for bar actions

- We use minilog for logs so that we can activate/deactivate logs at
  runtime
- Minilog does not support the group/groupEnd so we cannot use title
  formatter
---
 src/lib/store/index.js | 13 +------------
 1 file changed, 1 insertion(+), 12 deletions(-)

diff --git a/src/lib/store/index.js b/src/lib/store/index.js
index d5259a1be..c09640d44 100644
--- a/src/lib/store/index.js
+++ b/src/lib/store/index.js
@@ -16,18 +16,7 @@ const config = {
   whitelist: persistWhitelist
 }
 
-// copied and changed from https://github.com/LogRocket/redux-logger/blob/3ca9f2c1ecf17a7acf18c6fa0bbf4b6b239738f1/src/core.js#L25
-function barTitleFormatter(action, time) {
-  const parts = ['[COZY-BAR]']
-
-  parts.push(`${String(action.type)}`)
-  if (time) parts.push(`@ ${time}`)
-
-  return parts.join(' ')
-}
-
 const loggerMiddleware = createLogger({
-  titleFormatter: barTitleFormatter,
   logger
 })
 
@@ -35,7 +24,7 @@ const reducer = persistCombineReducers(config, { ...reducers })
 
 const middlewares = [appsI18nMiddleware, thunkMiddleware]
 
-if (__DEVELOPMENT__) middlewares.push(loggerMiddleware)
+middlewares.push(loggerMiddleware)
 
 export const createStore = () => {
   store = createReduxStore(reducer, applyMiddleware.apply(null, middlewares))

From ab5a3370c4e71e6f448bd27daba5900d2f190db7 Mon Sep 17 00:00:00 2001
From: Patrick Browne <pt.browne@gmail.com>
Date: Fri, 16 Oct 2020 20:43:17 +0200
Subject: [PATCH 04/11] feat: Refactor to not use background-images for icons

---
 src/styles/base.css            | 20 --------------------
 src/styles/claudy.css          |  1 -
 src/styles/navigation_item.css |  5 -----
 src/styles/searchbar.css       |  2 --
 src/styles/settings.css        |  7 ++-----
 5 files changed, 2 insertions(+), 33 deletions(-)

diff --git a/src/styles/base.css b/src/styles/base.css
index 97de71a0d..099f1631a 100644
--- a/src/styles/base.css
+++ b/src/styles/base.css
@@ -15,26 +15,6 @@
   padding-left: calc(16px + .5em);
 }
 
-[role=banner] [data-icon='icon-profile'] {
-  background-image: url(~assets/icons/16/icon-people-16.svg);
-}
-
-[role=banner] [data-icon='icon-connectedDevices'] {
-  background-image: url(~assets/icons/16/icon-phone-16.svg);
-}
-
-[role=banner] [data-icon='icon-help'] {
-  background-image: url(~assets/icons/16/icon-question-mark-16.svg);
-}
-
-[role=banner] [data-icon='icon-logout'] {
-  background-image: url(~assets/icons/16/icon-logout-16.svg);
-}
-
-[role=banner] [data-icon='icon-storage'] {
-  background-image: url(~assets/icons/16/icon-storage-16.svg);
-}
-
 [role=banner] .u-flex-grow {
   display: flex;
   flex-grow: 1;
diff --git a/src/styles/claudy.css b/src/styles/claudy.css
index c4c28dfea..777b55c56 100644
--- a/src/styles/claudy.css
+++ b/src/styles/claudy.css
@@ -16,7 +16,6 @@
   border-radius: 100%;
   border: none;
   background-color: var(--dodgerBlue);
-  background-image: url('~assets/icons/32/icon-claudy.svg');
   background-repeat: no-repeat;
   background-size: 2em;
   background-position: .75em;
diff --git a/src/styles/navigation_item.css b/src/styles/navigation_item.css
index c0ad3d665..cdc71fcd9 100644
--- a/src/styles/navigation_item.css
+++ b/src/styles/navigation_item.css
@@ -28,11 +28,6 @@
   min-width: 20em;
 }
 
-/* Remove default margin for p elements */
-[role=banner] a[role=menuitem] p.coz-label {
-  margin: 0;
-}
-
 [role=banner] div[role=menuitem]:not([data-icon]) {
   margin: 0;
   padding-left: 1.5em;
diff --git a/src/styles/searchbar.css b/src/styles/searchbar.css
index 838310c8e..5e672b203 100644
--- a/src/styles/searchbar.css
+++ b/src/styles/searchbar.css
@@ -26,11 +26,9 @@
   position: absolute;
   left: 0;
   top: 0;
-  background: url('~assets/icons/16/icon-magnifier-16.svg') .6em center no-repeat;
 }
 [role=banner] .coz-searchbar-autosuggest-container.--searching:before{
   padding-left: .5em;
-  background: url('~assets/icons/spinner.svg') center no-repeat;
   background-size: 1em;
   animation: spin 1s linear infinite;
 }
diff --git a/src/styles/settings.css b/src/styles/settings.css
index ccbc9ebf0..fd570597b 100644
--- a/src/styles/settings.css
+++ b/src/styles/settings.css
@@ -22,10 +22,9 @@
   box-sizing: border-box;
   margin: 0;
   width: 100%;
-  padding: .8em 1.5em .8em calc(1.5em + 16px + .5em);
+  padding: 0.5rem 1rem;
   border: none;
   align-items: center;
-  background-position: 1.5em 50%;
   background-color: transparent;
   text-align: left;
   font-size: 1rem;
@@ -36,9 +35,7 @@
   text-decoration: none;
   outline: none;
 }
-[role=banner] .coz-nav-settings-item .coz-nav-settings-item-btn[role=menuitem] {
-  padding-left: 1.5rem;
-}
+
 [role=banner] .coz-nav-settings-item .coz-nav-settings-item-btn[role=menuitem] > span > span {
   margin-right: auto;
 }

From e31afc3eb1937a19c996e329f35514e46545254a Mon Sep 17 00:00:00 2001
From: Patrick Browne <pt.browne@gmail.com>
Date: Fri, 16 Oct 2020 19:26:02 +0200
Subject: [PATCH 05/11] WIP: Refactor to not use background-images for icons

---
 examples/index.jsx                          |   2 +
 src/components/Settings/SettingsContent.jsx | 101 +++++++++++---------
 2 files changed, 59 insertions(+), 44 deletions(-)

diff --git a/examples/index.jsx b/examples/index.jsx
index c888e5bc6..99cb710f3 100644
--- a/examples/index.jsx
+++ b/examples/index.jsx
@@ -8,6 +8,7 @@ import { Route, hashHistory } from 'react-router'
 import { MobileRouter } from 'cozy-authentication'
 import 'cozy-ui/transpiled/react/stylesheet.css'
 import appIcon from './icon.png'
+import { Sprite as IconSprite } from 'cozy-ui/transpiled/react/Icon'
 
 const minilog = window.minilog
 minilog.enable()
@@ -46,6 +47,7 @@ const Index = withClient(({ client }) => {
           Client options: <pre>{JSON.stringify(client.options, null, 2)}</pre>
         </div>
       </Main>
+      <IconSprite />
     </Layout>
   )
 })
diff --git a/src/components/Settings/SettingsContent.jsx b/src/components/Settings/SettingsContent.jsx
index 9064046ce..b14dbbc89 100644
--- a/src/components/Settings/SettingsContent.jsx
+++ b/src/components/Settings/SettingsContent.jsx
@@ -3,9 +3,22 @@ import PropTypes from 'prop-types'
 
 import { translate } from 'cozy-ui/react/I18n'
 import { Button, ButtonLink } from 'cozy-ui/react/Button'
+import Icon from 'cozy-ui/transpiled/react/Icon'
 import { isMobileApp } from 'cozy-device-helper'
 import StorageData from 'components/Settings/StorageData'
 
+const MenuIcon = ({ icon }) => {
+  return <Icon className="u-mr-half" color="var(--charcoalGrey)" icon={icon} />
+}
+
+const NavGroup = ({ children }) => {
+  return <ul className="coz-nav-group">{children}</ul>
+}
+
+const NavItem = ({ children }) => {
+  return <li className="coz-nav-settings-item">{children}</li>
+}
+
 const SettingsContent = ({
   t,
   onLogOut,
@@ -22,66 +35,68 @@ const SettingsContent = ({
   <div className="coz-nav-pop-content">
     {isDrawer && <hr />}
     {settingsAppURL && (
-      <ul className="coz-nav-group">
-        <li className="coz-nav-settings-item">
+      <NavGroup>
+        <NavItem>
           <a
             role="menuitem"
             href={`${settingsAppURL}#/profile`}
             target="_self"
-            data-icon="icon-profile"
             title={t('profile')}
           >
-            <p className="coz-label">{t('profile')}</p>
+            <Icon
+              className="u-mr-half"
+              color="var(--coolGrey)"
+              icon="profile"
+            />
+            {t('profile')}
           </a>
-        </li>
-        <li className="coz-nav-settings-item">
+        </NavItem>
+        <NavItem>
           <a
             role="menuitem"
             href={`${settingsAppURL}#/connectedDevices`}
             target="_self"
-            data-icon="icon-connectedDevices"
             title={t('connectedDevices')}
           >
-            <p className="coz-label">{t('connectedDevices')}</p>
+            <MenuIcon icon="connectedDevices" />
+            {t('connectedDevices')}
           </a>
-        </li>
-      </ul>
+        </NavItem>
+      </NavGroup>
     )}
     {isDrawer && onClaudy && !isMobileApp() && (
-      <ul className="coz-nav-group">
-        <li className="coz-nav-settings-item">
-          <Button
+      <NavGroup>
+        <NavItem>
+          <button
             type="button"
             role="menuitem"
             className="coz-nav-settings-item-btn"
-            icon="cloud"
             busy={isClaudyLoading}
             onClick={onClaudy}
-            title={t('claudy.title')}
-            label={t('claudy.title')}
-          />
-        </li>
-      </ul>
+          >
+            <MenuIcon icon="cloud" /> {t('claudy.title')}
+          </button>
+        </NavItem>
+      </NavGroup>
     )}
     {!isDrawer && storageData && (
-      <ul className="coz-nav-group">
-        <li className="coz-nav-settings-item">
+      <NavGroup>
+        <NavItem>
           <a
             role="menuitem"
-            data-icon="icon-storage"
             target="_self"
             title={t('storage')}
             href={`${settingsAppURL}#/storage`}
           >
-            {t('storage')}
+            <MenuIcon icon="storage" /> {t('storage')}
             <StorageData data={storageData} />
           </a>
-        </li>
-      </ul>
+        </NavItem>
+      </NavGroup>
     )}
     {(!isDrawer || !isMobileApp()) && shoulDisplayViewOfferButton && (
-      <ul className="coz-nav-group">
-        <li className="coz-nav-settings-item">
+      <NavGroup>
+        <NavItem>
           <ButtonLink
             subtle
             role="menuitem"
@@ -91,38 +106,36 @@ const SettingsContent = ({
             label={viewOfferButtonText}
             href={managerUrlPremiumLink}
           />
-        </li>
-      </ul>
+        </NavItem>
+      </NavGroup>
     )}
 
     {!isMobileApp() && (
-      <ul className="coz-nav-group">
-        <li className="coz-nav-settings-item">
-          <Button
+      <NavGroup>
+        <NavItem>
+          <button
             type="button"
             role="menuitem"
             className="coz-nav-settings-item-btn"
             onClick={toggleSupport}
-            icon="help"
-            title={t('help')}
-            label={t('help')}
-          />
-        </li>
-      </ul>
+          >
+            <MenuIcon icon="help" /> {t('help')}
+          </button>
+        </NavItem>
+      </NavGroup>
     )}
-    <ul className="coz-nav-group">
-      <li className="coz-nav-settings-item">
+    <NavGroup>
+      <NavItem>
         <button
           type="button"
           role="menuitem"
-          data-icon="icon-logout"
           onClick={onLogOut}
           title={t('logout')}
         >
-          {t('logout')}
+          <MenuIcon icon="logout" /> {t('logout')}
         </button>
-      </li>
-    </ul>
+      </NavItem>
+    </NavGroup>
   </div>
 )
 

From 70aa82822a540c46b488e6517b53bb9d7ca4371e Mon Sep 17 00:00:00 2001
From: Patrick Browne <pt.browne@gmail.com>
Date: Fri, 16 Oct 2020 19:26:02 +0200
Subject: [PATCH 06/11] refactor: Use only transpiled cozy-ui

---
 config/webpack.config.styles.js             | 29 ---------------------
 src/components/Apps/AppItem.jsx             |  4 +--
 src/components/Apps/AppNavButtons.jsx       |  4 +--
 src/components/Apps/AppsContent.jsx         |  4 +--
 src/components/Apps/IconCozyHome.jsx        |  2 +-
 src/components/Banner.jsx                   |  4 +--
 src/components/Bar.jsx                      |  6 ++---
 src/components/Drawer.spec.jsx              |  2 +-
 src/components/SearchBar.jsx                |  2 +-
 src/components/Settings/SettingsContent.jsx |  5 ++--
 src/components/Settings/StorageData.jsx     |  2 +-
 src/components/Settings/index.jsx           |  4 +--
 src/components/SupportModal.jsx             |  4 +--
 src/lib/middlewares/appsI18n.js             |  2 +-
 14 files changed, 23 insertions(+), 51 deletions(-)

diff --git a/config/webpack.config.styles.js b/config/webpack.config.styles.js
index d249b8adb..99fbb0c1d 100644
--- a/config/webpack.config.styles.js
+++ b/config/webpack.config.styles.js
@@ -31,35 +31,6 @@ module.exports = ({ production }) => ({
             loader: 'stylus-loader'
           }
         ]
-      },
-      {
-        test: /\.styl$/,
-        include: /cozy-ui\/react/,
-        use: [
-          {
-            loader: 'css-loader',
-            options: {
-              importLoaders: 2,
-              sourceMap: true,
-              modules: true,
-              localIdentName: 'cozy-ui-bar-[local]--[hash:base64:5]'
-            }
-          },
-          {
-            loader: 'postcss-loader',
-            options: {
-              config: {
-                ctx: {
-                  env: production ? 'production' : 'development'
-                }
-              },
-              sourceMap: true
-            }
-          },
-          {
-            loader: 'stylus-loader'
-          }
-        ]
       }
     ]
   },
diff --git a/src/components/Apps/AppItem.jsx b/src/components/Apps/AppItem.jsx
index 75d13989c..6b9b5596d 100644
--- a/src/components/Apps/AppItem.jsx
+++ b/src/components/Apps/AppItem.jsx
@@ -3,8 +3,8 @@ import get from 'lodash/get'
 import { appShape } from 'proptypes/index'
 import { models } from 'cozy-client'
 
-import AppIcon from 'cozy-ui/react/AppIcon'
-import AppLinker from 'cozy-ui/react/AppLinker'
+import AppIcon from 'cozy-ui/transpiled/react/AppIcon'
+import AppLinker from 'cozy-ui/transpiled/react/AppLinker'
 import HomeIcon from 'components/Apps/IconCozyHome'
 import stack from 'lib/stack'
 import PropTypes from 'prop-types'
diff --git a/src/components/Apps/AppNavButtons.jsx b/src/components/Apps/AppNavButtons.jsx
index 1272ba039..7ed8b804e 100644
--- a/src/components/Apps/AppNavButtons.jsx
+++ b/src/components/Apps/AppNavButtons.jsx
@@ -3,8 +3,8 @@ import { connect } from 'react-redux'
 
 import { getHomeApp } from 'lib/reducers'
 
-import { translate } from 'cozy-ui/react/I18n'
-import Icon from 'cozy-ui/react/Icon'
+import { translate } from 'cozy-ui/transpiled/react/I18n'
+import Icon from 'cozy-ui/transpiled/react/Icon'
 import HomeIcon from 'components/Apps/IconCozyHome'
 import { isFetchingApps } from 'lib/reducers'
 
diff --git a/src/components/Apps/AppsContent.jsx b/src/components/Apps/AppsContent.jsx
index d88844d4e..629cc2e16 100644
--- a/src/components/Apps/AppsContent.jsx
+++ b/src/components/Apps/AppsContent.jsx
@@ -2,8 +2,8 @@ import React, { Component } from 'react'
 import { connect } from 'react-redux'
 import Proptypes from 'prop-types'
 
-import { translate } from 'cozy-ui/react/I18n'
-import withBreakpoints from 'cozy-ui/react/helpers/withBreakpoints'
+import { translate } from 'cozy-ui/transpiled/react/I18n'
+import withBreakpoints from 'cozy-ui/transpiled/react/helpers/withBreakpoints'
 import { getApps, getHomeApp, isFetchingApps } from 'lib/reducers'
 
 import AppItem from 'components/Apps/AppItem'
diff --git a/src/components/Apps/IconCozyHome.jsx b/src/components/Apps/IconCozyHome.jsx
index 50f357c43..1216440c5 100644
--- a/src/components/Apps/IconCozyHome.jsx
+++ b/src/components/Apps/IconCozyHome.jsx
@@ -1,6 +1,6 @@
 import React, { PureComponent } from 'react'
 
-import AppIcon from 'cozy-ui/react/AppIcon'
+import AppIcon from 'cozy-ui/transpiled/react/AppIcon'
 
 import stack from 'lib/stack'
 import homeIcon from 'assets/sprites/icon-cozy-home.svg'
diff --git a/src/components/Banner.jsx b/src/components/Banner.jsx
index f07b88ea7..ed4f985cc 100644
--- a/src/components/Banner.jsx
+++ b/src/components/Banner.jsx
@@ -1,6 +1,6 @@
 import React, { Component } from 'react'
-import { ButtonLink } from 'cozy-ui/react/Button'
-import { translate } from 'cozy-ui/react/I18n'
+import { ButtonLink } from 'cozy-ui/transpiled/react/Button'
+import { translate } from 'cozy-ui/transpiled/react/I18n'
 
 class Banner extends Component {
   constructor(props) {
diff --git a/src/components/Bar.jsx b/src/components/Bar.jsx
index edb227ed3..2d2bd7ea5 100644
--- a/src/components/Bar.jsx
+++ b/src/components/Bar.jsx
@@ -3,13 +3,13 @@
 import React, { Component } from 'react'
 import { connect } from 'react-redux'
 
-import { translate } from 'cozy-ui/react/I18n'
-import Icon from 'cozy-ui/react/Icon'
+import { translate } from 'cozy-ui/transpiled/react/I18n'
+import Icon from 'cozy-ui/transpiled/react/Icon'
 import {
   shouldEnableTracking,
   getTracker,
   configureTracker
-} from 'cozy-ui/react/helpers/tracker'
+} from 'cozy-ui/transpiled/react/helpers/tracker'
 import { isMobileApp } from 'cozy-device-helper'
 
 import Banner from 'components/Banner'
diff --git a/src/components/Drawer.spec.jsx b/src/components/Drawer.spec.jsx
index dee506f28..9b15754a4 100644
--- a/src/components/Drawer.spec.jsx
+++ b/src/components/Drawer.spec.jsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import { Provider } from 'react-redux'
 
-import I18n from 'cozy-ui/react/I18n'
+import I18n from 'cozy-ui/transpiled/react/I18n'
 import { createStore } from 'lib/store'
 import enLocale from 'locales/en.json'
 import { render, screen, fireEvent, act } from '@testing-library/react'
diff --git a/src/components/SearchBar.jsx b/src/components/SearchBar.jsx
index 9ac88edbb..88d9e86d3 100644
--- a/src/components/SearchBar.jsx
+++ b/src/components/SearchBar.jsx
@@ -1,5 +1,5 @@
 import React, { Component } from 'react'
-import { translate } from 'cozy-ui/react/I18n'
+import { translate } from 'cozy-ui/transpiled/react/I18n'
 import Autosuggest from 'react-autosuggest'
 import debounce from 'lodash.debounce'
 import { fetchRawIntent } from 'lib/intents'
diff --git a/src/components/Settings/SettingsContent.jsx b/src/components/Settings/SettingsContent.jsx
index b14dbbc89..e79689e7c 100644
--- a/src/components/Settings/SettingsContent.jsx
+++ b/src/components/Settings/SettingsContent.jsx
@@ -1,9 +1,10 @@
 import React from 'react'
 import PropTypes from 'prop-types'
 
-import { translate } from 'cozy-ui/react/I18n'
-import { Button, ButtonLink } from 'cozy-ui/react/Button'
+import { translate } from 'cozy-ui/transpiled/react/I18n'
 import Icon from 'cozy-ui/transpiled/react/Icon'
+import { Button, ButtonLink } from 'cozy-ui/transpiled/react/Button'
+
 import { isMobileApp } from 'cozy-device-helper'
 import StorageData from 'components/Settings/StorageData'
 
diff --git a/src/components/Settings/StorageData.jsx b/src/components/Settings/StorageData.jsx
index b5091a7de..d77e47964 100644
--- a/src/components/Settings/StorageData.jsx
+++ b/src/components/Settings/StorageData.jsx
@@ -1,5 +1,5 @@
 import React from 'react'
-import { translate } from 'cozy-ui/react/I18n'
+import { translate } from 'cozy-ui/transpiled/react/I18n'
 
 const StorageData = ({ t, data }) => {
   const diskQuota = Number.isInteger(data.quota)
diff --git a/src/components/Settings/index.jsx b/src/components/Settings/index.jsx
index 41b364ea0..e5cbb1232 100644
--- a/src/components/Settings/index.jsx
+++ b/src/components/Settings/index.jsx
@@ -3,8 +3,8 @@ import { connect } from 'react-redux'
 import { compose } from 'redux'
 import get from 'lodash/get'
 
-import { translate } from 'cozy-ui/react/I18n'
-import { Button } from 'cozy-ui/react/Button'
+import { translate } from 'cozy-ui/transpiled/react/I18n'
+import { Button } from 'cozy-ui/transpiled/react/Button'
 import { queryConnect } from 'cozy-client/dist'
 import { models } from 'cozy-client'
 let instanceModel = undefined
diff --git a/src/components/SupportModal.jsx b/src/components/SupportModal.jsx
index d29dfbc23..8ae0ef8ab 100644
--- a/src/components/SupportModal.jsx
+++ b/src/components/SupportModal.jsx
@@ -1,6 +1,6 @@
 import React, { Component } from 'react'
-import Modal, { ModalContent } from 'cozy-ui/react/Modal'
-import Spinner from 'cozy-ui/react/Spinner'
+import Modal, { ModalContent } from 'cozy-ui/transpiled/react/Modal'
+import Spinner from 'cozy-ui/transpiled/react/Spinner'
 import { getIntents } from 'lib/stack'
 
 class SupportModal extends Component {
diff --git a/src/lib/middlewares/appsI18n.js b/src/lib/middlewares/appsI18n.js
index 145b1be37..6ee0d1254 100644
--- a/src/lib/middlewares/appsI18n.js
+++ b/src/lib/middlewares/appsI18n.js
@@ -1,4 +1,4 @@
-import { extend as extendI18n } from 'cozy-ui/react/I18n'
+import { extend as extendI18n } from 'cozy-ui/transpiled/react/I18n'
 import { SET_LOCALE } from 'lib/reducers/locale'
 
 const extendI18nWithApp = lang => app => {

From 1d6b7b7eb8efdc234a21142957e86ec85dfd37c9 Mon Sep 17 00:00:00 2001
From: Patrick Browne <pt.browne@gmail.com>
Date: Fri, 16 Oct 2020 20:27:11 +0200
Subject: [PATCH 07/11] feat: Update cozy-ui

---
 package.json |  2 +-
 yarn.lock    | 82 ++++++++++++++++++++++++----------------------------
 2 files changed, 38 insertions(+), 46 deletions(-)

diff --git a/package.json b/package.json
index 4157021d0..0c89f593e 100644
--- a/package.json
+++ b/package.json
@@ -88,7 +88,7 @@
     "cozy-device-helper": "1.8.0",
     "cozy-interapp": "0.4.9",
     "cozy-realtime": "3.2.1",
-    "cozy-ui": "35.22.0",
+    "cozy-ui": "38.2.0",
     "hammerjs": "2.0.8",
     "lerna-changelog": "0.8.2",
     "localforage": "1.7.3",
diff --git a/yarn.lock b/yarn.lock
index 27a66434e..d0570a8e3 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1324,6 +1324,11 @@
     "@parcel/utils" "^1.11.0"
     physical-cpu-count "^2.0.0"
 
+"@popperjs/core@^2.4.4":
+  version "2.5.3"
+  resolved "https://registry.yarnpkg.com/@popperjs/core/-/core-2.5.3.tgz#4982b0b66b7a4cf949b86f5d25a8cf757d3cfd9d"
+  integrity sha512-RFwCobxsvZ6j7twS7dHIZQZituMIDJJNHS/qY6iuthVebxS3zhRY+jaC2roEKiAYaVuTcGmX6Luc6YBcf6zJVg==
+
 "@semantic-release/commit-analyzer@^6.1.0":
   version "6.1.0"
   resolved "https://registry.yarnpkg.com/@semantic-release/commit-analyzer/-/commit-analyzer-6.1.0.tgz#32bbe3c23da86e23edf072fbb276fa2f383fcb17"
@@ -3564,6 +3569,11 @@ cozy-interapp@0.4.9:
   resolved "https://registry.yarnpkg.com/cozy-interapp/-/cozy-interapp-0.4.9.tgz#5ef68d54755cc99c3e154e5a4646b68cbe5f16fd"
   integrity sha512-skyjrewnMu5zMfST7vTNGl3jsuWae1Iwfdev6pW9RLgb58M7oBSpsIa3ofRANv5tx0XVQDVSEzWvbFQ84WJPSg==
 
+cozy-interapp@0.5.4:
+  version "0.5.4"
+  resolved "https://registry.yarnpkg.com/cozy-interapp/-/cozy-interapp-0.5.4.tgz#2573f1800f073c84c289267d04234954d88eae0c"
+  integrity sha512-f0UaKpBkRUnIKgAWND0e1IwfTTINjizlgDmfQwX3aMyWp8t9wX0xkNFn53TSyKUoBUnfovrclS3hm9fngjEp7A==
+
 cozy-logger@^1.6.0:
   version "1.6.0"
   resolved "https://registry.yarnpkg.com/cozy-logger/-/cozy-logger-1.6.0.tgz#51675e081e0a40baae6c38c64718cfaee5ee66ff"
@@ -3588,21 +3598,24 @@ cozy-stack-client@^13.8.3:
     mime "^2.4.0"
     qs "^6.7.0"
 
-cozy-ui@35.22.0:
-  version "35.22.0"
-  resolved "https://registry.yarnpkg.com/cozy-ui/-/cozy-ui-35.22.0.tgz#ce8e1703740a27073b3cff812f9a7027d3a27e41"
-  integrity sha512-oAP+EIgS4D2J2Y7CiRNPbR9jCFrDrkiLIfpQeWkTjFbGXiCkJTdQabAx7fiZdcI0gxCo9OCv7mhtirMHv/ylKw==
+cozy-ui@38.2.0:
+  version "38.2.0"
+  resolved "https://registry.yarnpkg.com/cozy-ui/-/cozy-ui-38.2.0.tgz#252363727b2aeb4b427a69315d45a85d9490adc1"
+  integrity sha512-SFotqf11ai+3UoZuyYLtaCwyqEzfk/db2qIBWCsUtNRxdvE2lWCvUyfVsvKjoD4JA90AXPKgHZsjOqweotcbXA==
   dependencies:
     "@babel/runtime" "^7.3.4"
+    "@popperjs/core" "^2.4.4"
     body-scroll-lock "^2.5.8"
     classnames "^2.2.5"
+    cozy-interapp "0.5.4"
     date-fns "^1.28.5"
     hammerjs "^2.0.8"
+    intersection-observer "0.11.0"
     node-polyglot "^2.2.2"
     normalize.css "^7.0.0"
-    react-hot-loader "^4.3.11"
     react-markdown "^4.0.8"
     react-pdf "^4.0.5"
+    react-popper "^2.2.3"
     react-select "2.2.0"
     react-swipeable-views "0.13.3"
 
@@ -4314,11 +4327,6 @@ dom-serializer@~0.1.1:
     domelementtype "^1.3.0"
     entities "^1.1.1"
 
-dom-walk@^0.1.0:
-  version "0.1.2"
-  resolved "https://registry.yarnpkg.com/dom-walk/-/dom-walk-0.1.2.tgz#0c548bef048f4d1f2a97249002236060daa3fd84"
-  integrity sha512-6QvTW9mrGeIegrFXdtQi9pk7O/nSK6lSdXW2eqUspN5LWD7UTji2Fqw5V2YLjBpHEoU9Xl/eUWNpDeZvoyOv2w==
-
 domain-browser@^1.1.1:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/domain-browser/-/domain-browser-1.2.0.tgz#3d31f50191a6749dd1375a7f522e823d42e54eda"
@@ -5240,7 +5248,7 @@ fast-json-stable-stringify@^2.0.0:
   resolved "https://registry.yarnpkg.com/fast-json-stable-stringify/-/fast-json-stable-stringify-2.1.0.tgz#874bf69c6f404c2b5d99c481341399fd55892633"
   integrity sha512-lhd/wF+Lk98HZoTCtlVraHtfh5XYijIjalXck7saUtuanSDyLMxnHhSXEDJqHxD7msR8D0uCmqlkwjCV8xvwHw==
 
-fast-levenshtein@^2.0.6, fast-levenshtein@~2.0.6:
+fast-levenshtein@~2.0.6:
   version "2.0.6"
   resolved "https://registry.yarnpkg.com/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz#3d8a5c66883a16a30ca8643e851f19baa7797917"
   integrity sha1-PYpcZog6FqMMqGQ+hR8Zuqd5eRc=
@@ -5805,14 +5813,6 @@ global-prefix@^3.0.0:
     kind-of "^6.0.2"
     which "^1.3.1"
 
-global@^4.3.0:
-  version "4.4.0"
-  resolved "https://registry.yarnpkg.com/global/-/global-4.4.0.tgz#3e7b105179006a323ed71aafca3e9c57a5cc6406"
-  integrity sha512-wv/LAoHdRE3BeTGz53FAamhGlPLhlssK45usmGFThIi4XqnBmjKQ16u+RNbP7WvigRZDxUsM0J3gcQ5yicaL0w==
-  dependencies:
-    min-document "^2.19.0"
-    process "^0.11.10"
-
 globals@^11.0.1, globals@^11.1.0, globals@^11.7.0:
   version "11.12.0"
   resolved "https://registry.yarnpkg.com/globals/-/globals-11.12.0.tgz#ab8795338868a0babd8525758018c2a7eb95c42e"
@@ -6521,6 +6521,11 @@ interpret@1.2.0:
   resolved "https://registry.yarnpkg.com/interpret/-/interpret-1.2.0.tgz#d5061a6224be58e8083985f5014d844359576296"
   integrity sha512-mT34yGKMNceBQUoVn7iCDKDntA7SC6gycMAWzGx1z/CMCTV7b2AAtXlo3nRyHZ1FelRkQbQjprHSYGwzLtkVbw==
 
+intersection-observer@0.11.0:
+  version "0.11.0"
+  resolved "https://registry.yarnpkg.com/intersection-observer/-/intersection-observer-0.11.0.tgz#f4ea067070326f68393ee161cc0a2ca4c0040c6f"
+  integrity sha512-KZArj2QVnmdud9zTpKf279m2bbGfG+4/kn16UU0NL3pTVl52ZHiJ9IRNSsnn6jaHrL9EGLFM5eWjTx2fz/+zoQ==
+
 into-stream@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/into-stream/-/into-stream-4.0.0.tgz#ef10ee2ffb6f78af34c93194bbdc36c35f7d8a9d"
@@ -8536,13 +8541,6 @@ mimic-response@^2.0.0:
   resolved "https://registry.yarnpkg.com/mimic-response/-/mimic-response-2.1.0.tgz#d13763d35f613d09ec37ebb30bac0469c0ee8f43"
   integrity sha512-wXqjST+SLt7R009ySCglWBCFpjUygmCIfD790/kVbiGmUgfYGuB14PiTd5DwVxSV4NcYHjzMkoj5LjQZwTQLEA==
 
-min-document@^2.19.0:
-  version "2.19.0"
-  resolved "https://registry.yarnpkg.com/min-document/-/min-document-2.19.0.tgz#7bd282e3f5842ed295bb748cdd9f1ffa2c824685"
-  integrity sha1-e9KC4/WELtKVu3SM3Z8f+iyCRoU=
-  dependencies:
-    dom-walk "^0.1.0"
-
 mini-css-extract-plugin@0.8.0:
   version "0.8.0"
   resolved "https://registry.yarnpkg.com/mini-css-extract-plugin/-/mini-css-extract-plugin-0.8.0.tgz#81d41ec4fe58c713a96ad7c723cdb2d0bd4d70e1"
@@ -10938,19 +10936,10 @@ react-event-listener@^0.6.0, react-event-listener@^0.6.2:
     prop-types "^15.6.0"
     warning "^4.0.1"
 
-react-hot-loader@^4.3.11:
-  version "4.12.21"
-  resolved "https://registry.yarnpkg.com/react-hot-loader/-/react-hot-loader-4.12.21.tgz#332e830801fb33024b5a147d6b13417f491eb975"
-  integrity sha512-Ynxa6ROfWUeKWsTHxsrL2KMzujxJVPjs385lmB2t5cHUxdoRPGind9F00tOkdc1l5WBleOF4XEAMILY1KPIIDA==
-  dependencies:
-    fast-levenshtein "^2.0.6"
-    global "^4.3.0"
-    hoist-non-react-statics "^3.3.0"
-    loader-utils "^1.1.0"
-    prop-types "^15.6.1"
-    react-lifecycles-compat "^3.0.4"
-    shallowequal "^1.1.0"
-    source-map "^0.7.3"
+react-fast-compare@^3.0.1:
+  version "3.2.0"
+  resolved "https://registry.yarnpkg.com/react-fast-compare/-/react-fast-compare-3.2.0.tgz#641a9da81b6a6320f270e89724fb45a0b39e43bb"
+  integrity sha512-rtGImPZ0YyLrscKI9xTpV8psd6I8VAtjKCzQDlzyDvqJA8XOW78TXYQwNRNd8g8JZnDu8q9Fu/1v4HPAVwVdHA==
 
 react-input-autosize@^2.2.1:
   version "2.2.2"
@@ -10995,6 +10984,14 @@ react-pdf@^4.0.5:
     pdfjs-dist "2.1.266"
     prop-types "^15.6.2"
 
+react-popper@^2.2.3:
+  version "2.2.3"
+  resolved "https://registry.yarnpkg.com/react-popper/-/react-popper-2.2.3.tgz#33d425fa6975d4bd54d9acd64897a89d904b9d97"
+  integrity sha512-mOEiMNT1249js0jJvkrOjyHsGvqcJd3aGW/agkiMoZk3bZ1fXN1wQszIQSjHIai48fE67+zwF8Cs+C4fWqlfjw==
+  dependencies:
+    react-fast-compare "^3.0.1"
+    warning "^4.0.2"
+
 react-redux@5.1.1:
   version "5.1.1"
   resolved "https://registry.yarnpkg.com/react-redux/-/react-redux-5.1.1.tgz#88e368682c7fa80e34e055cd7ac56f5936b0f52f"
@@ -11988,11 +11985,6 @@ shallow-equal@^1.0.0, shallow-equal@^1.2.1:
   resolved "https://registry.yarnpkg.com/shallow-equal/-/shallow-equal-1.2.1.tgz#4c16abfa56043aa20d050324efa68940b0da79da"
   integrity sha512-S4vJDjHHMBaiZuT9NPb616CSmLf618jawtv3sufLl6ivK8WocjAo58cXwbRV1cgqxH0Qbv+iUt6m05eqEa2IRA==
 
-shallowequal@^1.1.0:
-  version "1.1.0"
-  resolved "https://registry.yarnpkg.com/shallowequal/-/shallowequal-1.1.0.tgz#188d521de95b9087404fd4dcb68b13df0ae4e7f8"
-  integrity sha512-y0m1JoUZSlPAjXVtPPW70aZWfIL/dSP7AFkRnniLCrK/8MDKog3TySTBmckD+RObVxH0v4Tox67+F14PdED2oQ==
-
 shebang-command@^1.2.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/shebang-command/-/shebang-command-1.2.0.tgz#44aac65b695b03398968c39f363fee5deafdf1ea"
@@ -13601,7 +13593,7 @@ warning@^3.0.0:
   dependencies:
     loose-envify "^1.0.0"
 
-warning@^4.0.1, warning@^4.0.3:
+warning@^4.0.1, warning@^4.0.2, warning@^4.0.3:
   version "4.0.3"
   resolved "https://registry.yarnpkg.com/warning/-/warning-4.0.3.tgz#16e9e077eb8a86d6af7d64aa1e05fd85b4678ca3"
   integrity sha512-rpJyN222KWIvHJ/F53XSZv0Zl/accqHR8et1kpaMTD/fLCRxtV8iX8czMzY7sVZupTI3zcUTg8eycS2kNF9l6w==

From 59c84235b1bf931e66e158326f3757ec9effb558 Mon Sep 17 00:00:00 2001
From: Patrick Browne <pt.browne@gmail.com>
Date: Fri, 16 Oct 2020 20:46:19 +0200
Subject: [PATCH 08/11] feat: Add style loader

---
 config/webpack.config.styles.js | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/config/webpack.config.styles.js b/config/webpack.config.styles.js
index 99fbb0c1d..c317de59b 100644
--- a/config/webpack.config.styles.js
+++ b/config/webpack.config.styles.js
@@ -12,6 +12,9 @@ module.exports = ({ production }) => ({
         test: /\.styl$/,
         exclude: /cozy-ui\/react/,
         use: [
+          {
+            loader: 'style-loader'
+          },
           {
             loader: 'css-loader',
             options: { importLoaders: 2, sourceMap: true }

From 515a3c1e97df6ec723ec58a487e2cd50ed50b485 Mon Sep 17 00:00:00 2001
From: Patrick Browne <pt.browne@gmail.com>
Date: Mon, 19 Oct 2020 09:14:32 +0200
Subject: [PATCH 09/11] fix: Init the bar when it's possible WIP

TODO It should be possible to wait for the bar script to load completely
by using the load event, but it did not work at first, we need to
investigate.
---
 config/aliases/globalReact.js |  6 ++++++
 config/webpack.config.base.js | 10 +++++-----
 examples/index.html           |  1 -
 examples/index.jsx            | 17 ++++++++++++++---
 src/index.jsx                 | 16 ++++++++--------
 5 files changed, 33 insertions(+), 17 deletions(-)

diff --git a/config/aliases/globalReact.js b/config/aliases/globalReact.js
index 207b7d912..e773af670 100644
--- a/config/aliases/globalReact.js
+++ b/config/aliases/globalReact.js
@@ -1 +1,7 @@
+if (!window.React) {
+  throw new Error(
+    'React must be globally set on window for the cozy-bar to use it'
+  )
+}
+
 module.exports = window.React || require('my-react')
diff --git a/config/webpack.config.base.js b/config/webpack.config.base.js
index 0e64e7e5f..53bc9c8d4 100644
--- a/config/webpack.config.base.js
+++ b/config/webpack.config.base.js
@@ -13,13 +13,13 @@ module.exports = {
     libraryTarget: 'umd',
     umdNamedDefine: true
   },
+  externals: {
+    react: 'React',
+    'react-dom': 'ReactDOM'
+  },
   resolve: {
     extensions: ['.js', '.json', '.yaml', '.jsx'],
-    modules: [SRC_DIR, 'node_modules'],
-    alias: {
-      react: path.resolve(__dirname, 'aliases/globalReact'),
-      'react-dom': path.resolve(__dirname, 'aliases/globalReactDOM')
-    }
+    modules: [SRC_DIR, 'node_modules']
   },
   devtool: '#source-map',
   module: {
diff --git a/examples/index.html b/examples/index.html
index 2c636acce..3beaf79f9 100644
--- a/examples/index.html
+++ b/examples/index.html
@@ -3,5 +3,4 @@
 <!-- First thing is to configure minilog so that it is bound to window -->
 <script src='./logs.js'></script>
 <!-- Serves the bar from a server so that it is not processed by parcel -->
-<script src='http://localhost:8000/cozy-bar.mobile.js'></script>
 <script src='./index.jsx'></script>
diff --git a/examples/index.jsx b/examples/index.jsx
index 99cb710f3..8e1dfd51e 100644
--- a/examples/index.jsx
+++ b/examples/index.jsx
@@ -1,6 +1,6 @@
 /* global cozy */
 
-import React from 'react'
+import React, * as reactExports from 'react'
 import ReactDOM from 'react-dom'
 import { Layout, Main } from 'cozy-ui/transpiled/react/Layout'
 import CozyClient, { CozyProvider, withClient } from 'cozy-client'
@@ -71,8 +71,17 @@ const client = new CozyClient({
   }
 })
 
+const loadBar = async () => {
+  // TODO can we avoid this ?
+  window.React = React
+  Object.assign(React, reactExports)
+  window.ReactDOM = ReactDOM
+  await import('http://localhost:8000/cozy-bar.js')
+  return window.cozy.bar
+}
+
 // TODO bar: should only need a correctly configured client
-client.on('login', () => {
+client.on('login', async () => {
   const oldOptions = {
     token: client.stackClient.token.accessToken,
     cozyURL: client.stackClient.uri
@@ -80,7 +89,9 @@ client.on('login', () => {
   const newOptions = {
     cozyClient: client
   }
-  cozy.bar.init({
+
+  const bar = await loadBar()
+  bar.init({
     appNamePrefix: 'Cozy',
     appName: appInfo.name,
     appEditor: appInfo.editor,
diff --git a/src/index.jsx b/src/index.jsx
index 93fb4df0a..2bc3fd3ee 100644
--- a/src/index.jsx
+++ b/src/index.jsx
@@ -1,6 +1,14 @@
 /* global __VERSION__ */
 
+import React from 'react'
+import { render } from 'react-dom'
+import { connect, Provider } from 'react-redux'
+
 import { isMobileApp } from 'cozy-device-helper'
+import I18n from 'cozy-ui/transpiled/react/I18n'
+import { CozyProvider } from 'cozy-client'
+
+import Bar from 'components/Bar'
 
 import stack from 'lib/stack'
 import {
@@ -65,14 +73,6 @@ const injectBarInDOM = data => {
 }
 
 const renderBar = (barNode, options) => {
-  // import React related modules on init only
-  const React = require('react')
-  const { render } = require('react-dom')
-  const { connect, Provider } = require('react-redux')
-  const I18n = require('cozy-ui/react/I18n').default
-  const Bar = require('components/Bar').default
-  const CozyProvider = require('cozy-client').CozyProvider
-
   const { cozyClient } = options
 
   // we connect the I18n component to the store to listen

From 31b8fc83abcce45e6de040f3c9721033beac9d72 Mon Sep 17 00:00:00 2001
From: Patrick Browne <pt.browne@gmail.com>
Date: Mon, 19 Oct 2020 09:14:50 +0200
Subject: [PATCH 10/11] fix: App crashes if this check is not removed WIP

TODO Find out the cause of the crash and solve it
---
 src/components/Settings/index.jsx | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/components/Settings/index.jsx b/src/components/Settings/index.jsx
index e5cbb1232..5504fafdf 100644
--- a/src/components/Settings/index.jsx
+++ b/src/components/Settings/index.jsx
@@ -101,7 +101,8 @@ export class Settings extends Component {
     let isFetchingFromQueries
     let viewOfferButtonText = ''
     const canCheckPremium = cozyClientCanCheckPremium()
-    if (canCheckPremium) {
+    if (false && canCheckPremium) {
+      // console.log()
       isFetchingFromQueries = isFetchingQueries([
         diskUsageQuery,
         instanceQuery,

From 6c43a0c7e9fa2a190272e2845aa612cd41845202 Mon Sep 17 00:00:00 2001
From: Patrick Browne <pt.browne@gmail.com>
Date: Tue, 20 Oct 2020 09:49:23 +0200
Subject: [PATCH 11/11] refactor: Remove aliases to React and ReactDOM

Those aliases were used so that the bar used the React from the app
if it was provided. Now, in the next version of the bar, either the
app chooses to use the bar+react, or it uses only the bar and the bar
expects to find React and ReactDOM in the environment.
---
 config/aliases/globalReact.js    | 7 -------
 config/aliases/globalReactDOM.js | 1 -
 package.json                     | 2 --
 3 files changed, 10 deletions(-)
 delete mode 100644 config/aliases/globalReact.js
 delete mode 100644 config/aliases/globalReactDOM.js

diff --git a/config/aliases/globalReact.js b/config/aliases/globalReact.js
deleted file mode 100644
index e773af670..000000000
--- a/config/aliases/globalReact.js
+++ /dev/null
@@ -1,7 +0,0 @@
-if (!window.React) {
-  throw new Error(
-    'React must be globally set on window for the cozy-bar to use it'
-  )
-}
-
-module.exports = window.React || require('my-react')
diff --git a/config/aliases/globalReactDOM.js b/config/aliases/globalReactDOM.js
deleted file mode 100644
index e037d6746..000000000
--- a/config/aliases/globalReactDOM.js
+++ /dev/null
@@ -1 +0,0 @@
-module.exports = window.ReactDOM || require('my-react-dom')
diff --git a/package.json b/package.json
index 0c89f593e..200c1eba0 100644
--- a/package.json
+++ b/package.json
@@ -134,8 +134,6 @@
     },
     "moduleNameMapper": {
       "^config/(.*)": "<rootDir>/src/config/$1",
-      "^react$": "<rootDir>/config/aliases/globalReact",
-      "^(react-dom|react-dom/(.*))$": "<rootDir>/config/aliases/globalReactDOM",
       "\\.(png|gif|jpe?g|svg)$": "<rootDir>/test/__mocks__/fileMock.js",
       "\\.styl$": "identity-obj-proxy"
     },