diff --git a/package.json b/package.json
index ad9923ecc800785a9ecc516500466c1c635eb735..ec3601049aa61a2e378be7d61a1be5b18a9ffc7d 100644
--- a/package.json
+++ b/package.json
@@ -111,7 +111,7 @@
     "cozy-logger": ">1.7.0",
     "cozy-realtime": "4.2.1",
     "cozy-scripts": "5.13.0",
-    "cozy-ui": "60.6.0",
+    "cozy-ui": "68.8.0",
     "d3": "^5.15.0",
     "detect-browser": "^5.1.1",
     "eslint-config-cozy-app": "1.6.0",
diff --git a/src/components/FAQ/FAQContent.tsx b/src/components/FAQ/FAQContent.tsx
index 996c0ac54c5dd46e83a7641bd8bf5b56dba1b7d2..2574e4d7dd61161629e2bd1ec0adf64e2326707e 100644
--- a/src/components/FAQ/FAQContent.tsx
+++ b/src/components/FAQ/FAQContent.tsx
@@ -3,9 +3,11 @@ import './faqContent.scss'
 import { useClient } from 'cozy-client'
 import { useI18n } from 'cozy-ui/transpiled/react/I18n'
 import FaqData from 'components/FAQ/FAQData'
-import ExpansionPanel from '@material-ui/core/ExpansionPanel'
-import ExpansionPanelSummary from '@material-ui/core/ExpansionPanelSummary'
-import ExpansionPanelDetails from '@material-ui/core/ExpansionPanelDetails'
+import {
+  Accordion,
+  AccordionSummary,
+  AccordionDetails,
+} from '@material-ui/core'
 import ChevronOffIcon from 'assets/icons/ico/chevron-off.svg'
 import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
 import { FAQSection } from 'models'
@@ -57,7 +59,7 @@ const FAQContent: React.FC = () => {
               <div className="text-16-normal-uppercase">{faq.section}</div>
               {faq.questions.map((question, index2) => {
                 return (
-                  <ExpansionPanel
+                  <Accordion
                     key={index2}
                     expanded={expanded === `panel${index}_${index2}`}
                     onChange={handleChange(`panel${index}_${index2}`)}
@@ -65,7 +67,7 @@ const FAQContent: React.FC = () => {
                       root: 'expansion-panel-root',
                     }}
                   >
-                    <ExpansionPanelSummary
+                    <AccordionSummary
                       aria-label={t('faq.accessibility.button_toggle_detail')}
                       expandIcon={<StyledIcon icon={ChevronOffIcon} />}
                       classes={{
@@ -74,15 +76,15 @@ const FAQContent: React.FC = () => {
                       }}
                     >
                       {question.summary}
-                    </ExpansionPanelSummary>
-                    <ExpansionPanelDetails
+                    </AccordionSummary>
+                    <AccordionDetails
                       classes={{
                         root: 'expansion-panel-details',
                       }}
                     >
                       {question.details}
-                    </ExpansionPanelDetails>
-                  </ExpansionPanel>
+                    </AccordionDetails>
+                  </Accordion>
                 )
               })}
             </div>
diff --git a/src/components/FAQ/__snapshots__/FAQContent.spec.tsx.snap b/src/components/FAQ/__snapshots__/FAQContent.spec.tsx.snap
index d7dd81b6bde912dc0038eb94803d51a64fd6a1c7..2a395d05dd96bb4ad578c010d150c736f31edc47 100644
--- a/src/components/FAQ/__snapshots__/FAQContent.spec.tsx.snap
+++ b/src/components/FAQ/__snapshots__/FAQContent.spec.tsx.snap
@@ -17,7 +17,7 @@ exports[`FAQContent should render the full FAQ 1`] = `
         >
           Mes données
         </div>
-        <WithStyles(ForwardRef(ExpansionPanel))
+        <WithStyles(ForwardRef(Accordion))
           classes={
             Object {
               "root": "expansion-panel-root",
@@ -27,24 +27,24 @@ exports[`FAQContent should render the full FAQ 1`] = `
           key="0"
           onChange={[Function]}
         >
-          <ForwardRef(ExpansionPanel)
+          <ForwardRef(Accordion)
             classes={
               Object {
                 "disabled": "Mui-disabled",
                 "expanded": "Mui-expanded",
-                "root": "MuiExpansionPanel-root expansion-panel-root",
-                "rounded": "MuiExpansionPanel-rounded",
+                "root": "MuiAccordion-root expansion-panel-root",
+                "rounded": "MuiAccordion-rounded",
               }
             }
             expanded={false}
             onChange={[Function]}
           >
             <WithStyles(ForwardRef(Paper))
-              className="MuiExpansionPanel-root expansion-panel-root MuiExpansionPanel-rounded"
+              className="MuiAccordion-root expansion-panel-root MuiAccordion-rounded"
               square={false}
             >
               <ForwardRef(Paper)
-                className="MuiExpansionPanel-root expansion-panel-root MuiExpansionPanel-rounded"
+                className="MuiAccordion-root expansion-panel-root MuiAccordion-rounded"
                 classes={
                   Object {
                     "elevation0": "MuiPaper-elevation0",
@@ -80,9 +80,9 @@ exports[`FAQContent should render the full FAQ 1`] = `
                 square={false}
               >
                 <div
-                  className="MuiPaper-root MuiExpansionPanel-root expansion-panel-root MuiExpansionPanel-rounded MuiPaper-elevation1 MuiPaper-rounded"
+                  className="MuiPaper-root MuiAccordion-root expansion-panel-root MuiAccordion-rounded MuiPaper-elevation1 MuiPaper-rounded"
                 >
-                  <WithStyles(ForwardRef(ExpansionPanelSummary))
+                  <WithStyles(ForwardRef(AccordionSummary))
                     aria-label="faq.accessibility.button_toggle_detail"
                     classes={
                       Object {
@@ -97,16 +97,17 @@ exports[`FAQContent should render the full FAQ 1`] = `
                     }
                     key=".0"
                   >
-                    <ForwardRef(ExpansionPanelSummary)
+                    <ForwardRef(AccordionSummary)
                       aria-label="faq.accessibility.button_toggle_detail"
                       classes={
                         Object {
-                          "content": "MuiExpansionPanelSummary-content expansion-panel-content",
+                          "content": "MuiAccordionSummary-content expansion-panel-content",
                           "disabled": "Mui-disabled",
-                          "expandIcon": "MuiExpansionPanelSummary-expandIcon",
+                          "expandIcon": "MuiAccordionSummary-expandIcon",
                           "expanded": "Mui-expanded",
+                          "focusVisible": "Mui-focusVisible",
                           "focused": "Mui-focused",
-                          "root": "MuiExpansionPanelSummary-root expansion-panel-summary small bold-text",
+                          "root": "MuiAccordionSummary-root expansion-panel-summary small bold-text",
                         }
                       }
                       expandIcon={
@@ -118,19 +119,18 @@ exports[`FAQContent should render the full FAQ 1`] = `
                       <WithStyles(ForwardRef(ButtonBase))
                         aria-expanded={false}
                         aria-label="faq.accessibility.button_toggle_detail"
-                        className="MuiExpansionPanelSummary-root expansion-panel-summary small bold-text"
+                        className="MuiAccordionSummary-root expansion-panel-summary small bold-text"
                         component="div"
                         disableRipple={true}
                         disabled={false}
                         focusRipple={false}
-                        onBlur={[Function]}
+                        focusVisibleClassName="Mui-focusVisible Mui-focused"
                         onClick={[Function]}
-                        onFocusVisible={[Function]}
                       >
                         <ForwardRef(ButtonBase)
                           aria-expanded={false}
                           aria-label="faq.accessibility.button_toggle_detail"
-                          className="MuiExpansionPanelSummary-root expansion-panel-summary small bold-text"
+                          className="MuiAccordionSummary-root expansion-panel-summary small bold-text"
                           classes={
                             Object {
                               "disabled": "Mui-disabled",
@@ -142,15 +142,14 @@ exports[`FAQContent should render the full FAQ 1`] = `
                           disableRipple={true}
                           disabled={false}
                           focusRipple={false}
-                          onBlur={[Function]}
+                          focusVisibleClassName="Mui-focusVisible Mui-focused"
                           onClick={[Function]}
-                          onFocusVisible={[Function]}
                         >
                           <div
                             aria-disabled={false}
                             aria-expanded={false}
                             aria-label="faq.accessibility.button_toggle_detail"
-                            className="MuiButtonBase-root MuiExpansionPanelSummary-root expansion-panel-summary small bold-text"
+                            className="MuiButtonBase-root MuiAccordionSummary-root expansion-panel-summary small bold-text"
                             onBlur={[Function]}
                             onClick={[Function]}
                             onDragLeave={[Function]}
@@ -167,13 +166,13 @@ exports[`FAQContent should render the full FAQ 1`] = `
                             tabIndex={0}
                           >
                             <div
-                              className="MuiExpansionPanelSummary-content expansion-panel-content"
+                              className="MuiAccordionSummary-content expansion-panel-content"
                             >
                               Comment accéder à mes données électricité ?
                             </div>
                             <WithStyles(ForwardRef(IconButton))
                               aria-hidden={true}
-                              className="MuiExpansionPanelSummary-expandIcon"
+                              className="MuiAccordionSummary-expandIcon"
                               component="div"
                               edge="end"
                               role={null}
@@ -181,7 +180,7 @@ exports[`FAQContent should render the full FAQ 1`] = `
                             >
                               <ForwardRef(IconButton)
                                 aria-hidden={true}
-                                className="MuiExpansionPanelSummary-expandIcon"
+                                className="MuiAccordionSummary-expandIcon"
                                 classes={
                                   Object {
                                     "colorInherit": "MuiIconButton-colorInherit",
@@ -203,7 +202,7 @@ exports[`FAQContent should render the full FAQ 1`] = `
                                 <WithStyles(ForwardRef(ButtonBase))
                                   aria-hidden={true}
                                   centerRipple={true}
-                                  className="MuiIconButton-root MuiExpansionPanelSummary-expandIcon MuiIconButton-edgeEnd"
+                                  className="MuiIconButton-root MuiAccordionSummary-expandIcon MuiIconButton-edgeEnd"
                                   component="div"
                                   disabled={false}
                                   focusRipple={true}
@@ -213,7 +212,7 @@ exports[`FAQContent should render the full FAQ 1`] = `
                                   <ForwardRef(ButtonBase)
                                     aria-hidden={true}
                                     centerRipple={true}
-                                    className="MuiIconButton-root MuiExpansionPanelSummary-expandIcon MuiIconButton-edgeEnd"
+                                    className="MuiIconButton-root MuiAccordionSummary-expandIcon MuiIconButton-edgeEnd"
                                     classes={
                                       Object {
                                         "disabled": "Mui-disabled",
@@ -230,7 +229,7 @@ exports[`FAQContent should render the full FAQ 1`] = `
                                     <div
                                       aria-disabled={false}
                                       aria-hidden={true}
-                                      className="MuiButtonBase-root MuiIconButton-root MuiExpansionPanelSummary-expandIcon MuiIconButton-edgeEnd"
+                                      className="MuiButtonBase-root MuiIconButton-root MuiAccordionSummary-expandIcon MuiIconButton-edgeEnd"
                                       onBlur={[Function]}
                                       onDragLeave={[Function]}
                                       onFocus={[Function]}
@@ -315,8 +314,8 @@ exports[`FAQContent should render the full FAQ 1`] = `
                           </div>
                         </ForwardRef(ButtonBase)>
                       </WithStyles(ForwardRef(ButtonBase))>
-                    </ForwardRef(ExpansionPanelSummary)>
-                  </WithStyles(ForwardRef(ExpansionPanelSummary))>
+                    </ForwardRef(AccordionSummary)>
+                  </WithStyles(ForwardRef(AccordionSummary))>
                   <WithStyles(ForwardRef(Collapse))
                     in={false}
                     timeout="auto"
@@ -367,7 +366,7 @@ exports[`FAQContent should render the full FAQ 1`] = `
                               <div
                                 role="region"
                               >
-                                <WithStyles(ForwardRef(ExpansionPanelDetails))
+                                <WithStyles(ForwardRef(AccordionDetails))
                                   classes={
                                     Object {
                                       "root": "expansion-panel-details",
@@ -375,22 +374,22 @@ exports[`FAQContent should render the full FAQ 1`] = `
                                   }
                                   key=".1"
                                 >
-                                  <ForwardRef(ExpansionPanelDetails)
+                                  <ForwardRef(AccordionDetails)
                                     classes={
                                       Object {
-                                        "root": "MuiExpansionPanelDetails-root expansion-panel-details",
+                                        "root": "MuiAccordionDetails-root expansion-panel-details",
                                       }
                                     }
                                   >
                                     <div
-                                      className="MuiExpansionPanelDetails-root expansion-panel-details"
+                                      className="MuiAccordionDetails-root expansion-panel-details"
                                     >
                                       <div>
                                         Rendez-vous dans la partie Options du service et cliquer sur le bouton "Se connecter à l\\'électricité". Suivez la procédure (en vous créant un compte Enedis si nécessaire). Une fois votre consentement donné, vos données de consommation seront récupérées.
                                       </div>
                                     </div>
-                                  </ForwardRef(ExpansionPanelDetails)>
-                                </WithStyles(ForwardRef(ExpansionPanelDetails))>
+                                  </ForwardRef(AccordionDetails)>
+                                </WithStyles(ForwardRef(AccordionDetails))>
                               </div>
                             </div>
                           </div>
@@ -401,9 +400,9 @@ exports[`FAQContent should render the full FAQ 1`] = `
                 </div>
               </ForwardRef(Paper)>
             </WithStyles(ForwardRef(Paper))>
-          </ForwardRef(ExpansionPanel)>
-        </WithStyles(ForwardRef(ExpansionPanel))>
-        <WithStyles(ForwardRef(ExpansionPanel))
+          </ForwardRef(Accordion)>
+        </WithStyles(ForwardRef(Accordion))>
+        <WithStyles(ForwardRef(Accordion))
           classes={
             Object {
               "root": "expansion-panel-root",
@@ -413,24 +412,24 @@ exports[`FAQContent should render the full FAQ 1`] = `
           key="1"
           onChange={[Function]}
         >
-          <ForwardRef(ExpansionPanel)
+          <ForwardRef(Accordion)
             classes={
               Object {
                 "disabled": "Mui-disabled",
                 "expanded": "Mui-expanded",
-                "root": "MuiExpansionPanel-root expansion-panel-root",
-                "rounded": "MuiExpansionPanel-rounded",
+                "root": "MuiAccordion-root expansion-panel-root",
+                "rounded": "MuiAccordion-rounded",
               }
             }
             expanded={false}
             onChange={[Function]}
           >
             <WithStyles(ForwardRef(Paper))
-              className="MuiExpansionPanel-root expansion-panel-root MuiExpansionPanel-rounded"
+              className="MuiAccordion-root expansion-panel-root MuiAccordion-rounded"
               square={false}
             >
               <ForwardRef(Paper)
-                className="MuiExpansionPanel-root expansion-panel-root MuiExpansionPanel-rounded"
+                className="MuiAccordion-root expansion-panel-root MuiAccordion-rounded"
                 classes={
                   Object {
                     "elevation0": "MuiPaper-elevation0",
@@ -466,9 +465,9 @@ exports[`FAQContent should render the full FAQ 1`] = `
                 square={false}
               >
                 <div
-                  className="MuiPaper-root MuiExpansionPanel-root expansion-panel-root MuiExpansionPanel-rounded MuiPaper-elevation1 MuiPaper-rounded"
+                  className="MuiPaper-root MuiAccordion-root expansion-panel-root MuiAccordion-rounded MuiPaper-elevation1 MuiPaper-rounded"
                 >
-                  <WithStyles(ForwardRef(ExpansionPanelSummary))
+                  <WithStyles(ForwardRef(AccordionSummary))
                     aria-label="faq.accessibility.button_toggle_detail"
                     classes={
                       Object {
@@ -483,16 +482,17 @@ exports[`FAQContent should render the full FAQ 1`] = `
                     }
                     key=".0"
                   >
-                    <ForwardRef(ExpansionPanelSummary)
+                    <ForwardRef(AccordionSummary)
                       aria-label="faq.accessibility.button_toggle_detail"
                       classes={
                         Object {
-                          "content": "MuiExpansionPanelSummary-content expansion-panel-content",
+                          "content": "MuiAccordionSummary-content expansion-panel-content",
                           "disabled": "Mui-disabled",
-                          "expandIcon": "MuiExpansionPanelSummary-expandIcon",
+                          "expandIcon": "MuiAccordionSummary-expandIcon",
                           "expanded": "Mui-expanded",
+                          "focusVisible": "Mui-focusVisible",
                           "focused": "Mui-focused",
-                          "root": "MuiExpansionPanelSummary-root expansion-panel-summary small bold-text",
+                          "root": "MuiAccordionSummary-root expansion-panel-summary small bold-text",
                         }
                       }
                       expandIcon={
@@ -504,19 +504,18 @@ exports[`FAQContent should render the full FAQ 1`] = `
                       <WithStyles(ForwardRef(ButtonBase))
                         aria-expanded={false}
                         aria-label="faq.accessibility.button_toggle_detail"
-                        className="MuiExpansionPanelSummary-root expansion-panel-summary small bold-text"
+                        className="MuiAccordionSummary-root expansion-panel-summary small bold-text"
                         component="div"
                         disableRipple={true}
                         disabled={false}
                         focusRipple={false}
-                        onBlur={[Function]}
+                        focusVisibleClassName="Mui-focusVisible Mui-focused"
                         onClick={[Function]}
-                        onFocusVisible={[Function]}
                       >
                         <ForwardRef(ButtonBase)
                           aria-expanded={false}
                           aria-label="faq.accessibility.button_toggle_detail"
-                          className="MuiExpansionPanelSummary-root expansion-panel-summary small bold-text"
+                          className="MuiAccordionSummary-root expansion-panel-summary small bold-text"
                           classes={
                             Object {
                               "disabled": "Mui-disabled",
@@ -528,15 +527,14 @@ exports[`FAQContent should render the full FAQ 1`] = `
                           disableRipple={true}
                           disabled={false}
                           focusRipple={false}
-                          onBlur={[Function]}
+                          focusVisibleClassName="Mui-focusVisible Mui-focused"
                           onClick={[Function]}
-                          onFocusVisible={[Function]}
                         >
                           <div
                             aria-disabled={false}
                             aria-expanded={false}
                             aria-label="faq.accessibility.button_toggle_detail"
-                            className="MuiButtonBase-root MuiExpansionPanelSummary-root expansion-panel-summary small bold-text"
+                            className="MuiButtonBase-root MuiAccordionSummary-root expansion-panel-summary small bold-text"
                             onBlur={[Function]}
                             onClick={[Function]}
                             onDragLeave={[Function]}
@@ -553,13 +551,13 @@ exports[`FAQContent should render the full FAQ 1`] = `
                             tabIndex={0}
                           >
                             <div
-                              className="MuiExpansionPanelSummary-content expansion-panel-content"
+                              className="MuiAccordionSummary-content expansion-panel-content"
                             >
                               Comment accéder à mes données gaz ?
                             </div>
                             <WithStyles(ForwardRef(IconButton))
                               aria-hidden={true}
-                              className="MuiExpansionPanelSummary-expandIcon"
+                              className="MuiAccordionSummary-expandIcon"
                               component="div"
                               edge="end"
                               role={null}
@@ -567,7 +565,7 @@ exports[`FAQContent should render the full FAQ 1`] = `
                             >
                               <ForwardRef(IconButton)
                                 aria-hidden={true}
-                                className="MuiExpansionPanelSummary-expandIcon"
+                                className="MuiAccordionSummary-expandIcon"
                                 classes={
                                   Object {
                                     "colorInherit": "MuiIconButton-colorInherit",
@@ -589,7 +587,7 @@ exports[`FAQContent should render the full FAQ 1`] = `
                                 <WithStyles(ForwardRef(ButtonBase))
                                   aria-hidden={true}
                                   centerRipple={true}
-                                  className="MuiIconButton-root MuiExpansionPanelSummary-expandIcon MuiIconButton-edgeEnd"
+                                  className="MuiIconButton-root MuiAccordionSummary-expandIcon MuiIconButton-edgeEnd"
                                   component="div"
                                   disabled={false}
                                   focusRipple={true}
@@ -599,7 +597,7 @@ exports[`FAQContent should render the full FAQ 1`] = `
                                   <ForwardRef(ButtonBase)
                                     aria-hidden={true}
                                     centerRipple={true}
-                                    className="MuiIconButton-root MuiExpansionPanelSummary-expandIcon MuiIconButton-edgeEnd"
+                                    className="MuiIconButton-root MuiAccordionSummary-expandIcon MuiIconButton-edgeEnd"
                                     classes={
                                       Object {
                                         "disabled": "Mui-disabled",
@@ -616,7 +614,7 @@ exports[`FAQContent should render the full FAQ 1`] = `
                                     <div
                                       aria-disabled={false}
                                       aria-hidden={true}
-                                      className="MuiButtonBase-root MuiIconButton-root MuiExpansionPanelSummary-expandIcon MuiIconButton-edgeEnd"
+                                      className="MuiButtonBase-root MuiIconButton-root MuiAccordionSummary-expandIcon MuiIconButton-edgeEnd"
                                       onBlur={[Function]}
                                       onDragLeave={[Function]}
                                       onFocus={[Function]}
@@ -701,8 +699,8 @@ exports[`FAQContent should render the full FAQ 1`] = `
                           </div>
                         </ForwardRef(ButtonBase)>
                       </WithStyles(ForwardRef(ButtonBase))>
-                    </ForwardRef(ExpansionPanelSummary)>
-                  </WithStyles(ForwardRef(ExpansionPanelSummary))>
+                    </ForwardRef(AccordionSummary)>
+                  </WithStyles(ForwardRef(AccordionSummary))>
                   <WithStyles(ForwardRef(Collapse))
                     in={false}
                     timeout="auto"
@@ -753,7 +751,7 @@ exports[`FAQContent should render the full FAQ 1`] = `
                               <div
                                 role="region"
                               >
-                                <WithStyles(ForwardRef(ExpansionPanelDetails))
+                                <WithStyles(ForwardRef(AccordionDetails))
                                   classes={
                                     Object {
                                       "root": "expansion-panel-details",
@@ -761,22 +759,22 @@ exports[`FAQContent should render the full FAQ 1`] = `
                                   }
                                   key=".1"
                                 >
-                                  <ForwardRef(ExpansionPanelDetails)
+                                  <ForwardRef(AccordionDetails)
                                     classes={
                                       Object {
-                                        "root": "MuiExpansionPanelDetails-root expansion-panel-details",
+                                        "root": "MuiAccordionDetails-root expansion-panel-details",
                                       }
                                     }
                                   >
                                     <div
-                                      className="MuiExpansionPanelDetails-root expansion-panel-details"
+                                      className="MuiAccordionDetails-root expansion-panel-details"
                                     >
                                       <div>
                                         Rendez-vous dans la partie Options du service et cliquez sur le bouton "Se connecter au gaz". Suivez la procédure (en vous créant un compte GRDF si nécessaire). Une fois votre consentement donné, vos données de consommation seront récupérées.',
                                       </div>
                                     </div>
-                                  </ForwardRef(ExpansionPanelDetails)>
-                                </WithStyles(ForwardRef(ExpansionPanelDetails))>
+                                  </ForwardRef(AccordionDetails)>
+                                </WithStyles(ForwardRef(AccordionDetails))>
                               </div>
                             </div>
                           </div>
@@ -787,8 +785,8 @@ exports[`FAQContent should render the full FAQ 1`] = `
                 </div>
               </ForwardRef(Paper)>
             </WithStyles(ForwardRef(Paper))>
-          </ForwardRef(ExpansionPanel)>
-        </WithStyles(ForwardRef(ExpansionPanel))>
+          </ForwardRef(Accordion)>
+        </WithStyles(ForwardRef(Accordion))>
       </div>
       <div
         className="faq-section"
@@ -799,7 +797,7 @@ exports[`FAQContent should render the full FAQ 1`] = `
         >
           Contenu du service
         </div>
-        <WithStyles(ForwardRef(ExpansionPanel))
+        <WithStyles(ForwardRef(Accordion))
           classes={
             Object {
               "root": "expansion-panel-root",
@@ -809,24 +807,24 @@ exports[`FAQContent should render the full FAQ 1`] = `
           key="0"
           onChange={[Function]}
         >
-          <ForwardRef(ExpansionPanel)
+          <ForwardRef(Accordion)
             classes={
               Object {
                 "disabled": "Mui-disabled",
                 "expanded": "Mui-expanded",
-                "root": "MuiExpansionPanel-root expansion-panel-root",
-                "rounded": "MuiExpansionPanel-rounded",
+                "root": "MuiAccordion-root expansion-panel-root",
+                "rounded": "MuiAccordion-rounded",
               }
             }
             expanded={false}
             onChange={[Function]}
           >
             <WithStyles(ForwardRef(Paper))
-              className="MuiExpansionPanel-root expansion-panel-root MuiExpansionPanel-rounded"
+              className="MuiAccordion-root expansion-panel-root MuiAccordion-rounded"
               square={false}
             >
               <ForwardRef(Paper)
-                className="MuiExpansionPanel-root expansion-panel-root MuiExpansionPanel-rounded"
+                className="MuiAccordion-root expansion-panel-root MuiAccordion-rounded"
                 classes={
                   Object {
                     "elevation0": "MuiPaper-elevation0",
@@ -862,9 +860,9 @@ exports[`FAQContent should render the full FAQ 1`] = `
                 square={false}
               >
                 <div
-                  className="MuiPaper-root MuiExpansionPanel-root expansion-panel-root MuiExpansionPanel-rounded MuiPaper-elevation1 MuiPaper-rounded"
+                  className="MuiPaper-root MuiAccordion-root expansion-panel-root MuiAccordion-rounded MuiPaper-elevation1 MuiPaper-rounded"
                 >
-                  <WithStyles(ForwardRef(ExpansionPanelSummary))
+                  <WithStyles(ForwardRef(AccordionSummary))
                     aria-label="faq.accessibility.button_toggle_detail"
                     classes={
                       Object {
@@ -879,16 +877,17 @@ exports[`FAQContent should render the full FAQ 1`] = `
                     }
                     key=".0"
                   >
-                    <ForwardRef(ExpansionPanelSummary)
+                    <ForwardRef(AccordionSummary)
                       aria-label="faq.accessibility.button_toggle_detail"
                       classes={
                         Object {
-                          "content": "MuiExpansionPanelSummary-content expansion-panel-content",
+                          "content": "MuiAccordionSummary-content expansion-panel-content",
                           "disabled": "Mui-disabled",
-                          "expandIcon": "MuiExpansionPanelSummary-expandIcon",
+                          "expandIcon": "MuiAccordionSummary-expandIcon",
                           "expanded": "Mui-expanded",
+                          "focusVisible": "Mui-focusVisible",
                           "focused": "Mui-focused",
-                          "root": "MuiExpansionPanelSummary-root expansion-panel-summary small bold-text",
+                          "root": "MuiAccordionSummary-root expansion-panel-summary small bold-text",
                         }
                       }
                       expandIcon={
@@ -900,19 +899,18 @@ exports[`FAQContent should render the full FAQ 1`] = `
                       <WithStyles(ForwardRef(ButtonBase))
                         aria-expanded={false}
                         aria-label="faq.accessibility.button_toggle_detail"
-                        className="MuiExpansionPanelSummary-root expansion-panel-summary small bold-text"
+                        className="MuiAccordionSummary-root expansion-panel-summary small bold-text"
                         component="div"
                         disableRipple={true}
                         disabled={false}
                         focusRipple={false}
-                        onBlur={[Function]}
+                        focusVisibleClassName="Mui-focusVisible Mui-focused"
                         onClick={[Function]}
-                        onFocusVisible={[Function]}
                       >
                         <ForwardRef(ButtonBase)
                           aria-expanded={false}
                           aria-label="faq.accessibility.button_toggle_detail"
-                          className="MuiExpansionPanelSummary-root expansion-panel-summary small bold-text"
+                          className="MuiAccordionSummary-root expansion-panel-summary small bold-text"
                           classes={
                             Object {
                               "disabled": "Mui-disabled",
@@ -924,15 +922,14 @@ exports[`FAQContent should render the full FAQ 1`] = `
                           disableRipple={true}
                           disabled={false}
                           focusRipple={false}
-                          onBlur={[Function]}
+                          focusVisibleClassName="Mui-focusVisible Mui-focused"
                           onClick={[Function]}
-                          onFocusVisible={[Function]}
                         >
                           <div
                             aria-disabled={false}
                             aria-expanded={false}
                             aria-label="faq.accessibility.button_toggle_detail"
-                            className="MuiButtonBase-root MuiExpansionPanelSummary-root expansion-panel-summary small bold-text"
+                            className="MuiButtonBase-root MuiAccordionSummary-root expansion-panel-summary small bold-text"
                             onBlur={[Function]}
                             onClick={[Function]}
                             onDragLeave={[Function]}
@@ -949,13 +946,13 @@ exports[`FAQContent should render the full FAQ 1`] = `
                             tabIndex={0}
                           >
                             <div
-                              className="MuiExpansionPanelSummary-content expansion-panel-content"
+                              className="MuiAccordionSummary-content expansion-panel-content"
                             >
                               Pourquoi les prix affichés sont-ils différents de ceux indiqués sur ma facture ?
                             </div>
                             <WithStyles(ForwardRef(IconButton))
                               aria-hidden={true}
-                              className="MuiExpansionPanelSummary-expandIcon"
+                              className="MuiAccordionSummary-expandIcon"
                               component="div"
                               edge="end"
                               role={null}
@@ -963,7 +960,7 @@ exports[`FAQContent should render the full FAQ 1`] = `
                             >
                               <ForwardRef(IconButton)
                                 aria-hidden={true}
-                                className="MuiExpansionPanelSummary-expandIcon"
+                                className="MuiAccordionSummary-expandIcon"
                                 classes={
                                   Object {
                                     "colorInherit": "MuiIconButton-colorInherit",
@@ -985,7 +982,7 @@ exports[`FAQContent should render the full FAQ 1`] = `
                                 <WithStyles(ForwardRef(ButtonBase))
                                   aria-hidden={true}
                                   centerRipple={true}
-                                  className="MuiIconButton-root MuiExpansionPanelSummary-expandIcon MuiIconButton-edgeEnd"
+                                  className="MuiIconButton-root MuiAccordionSummary-expandIcon MuiIconButton-edgeEnd"
                                   component="div"
                                   disabled={false}
                                   focusRipple={true}
@@ -995,7 +992,7 @@ exports[`FAQContent should render the full FAQ 1`] = `
                                   <ForwardRef(ButtonBase)
                                     aria-hidden={true}
                                     centerRipple={true}
-                                    className="MuiIconButton-root MuiExpansionPanelSummary-expandIcon MuiIconButton-edgeEnd"
+                                    className="MuiIconButton-root MuiAccordionSummary-expandIcon MuiIconButton-edgeEnd"
                                     classes={
                                       Object {
                                         "disabled": "Mui-disabled",
@@ -1012,7 +1009,7 @@ exports[`FAQContent should render the full FAQ 1`] = `
                                     <div
                                       aria-disabled={false}
                                       aria-hidden={true}
-                                      className="MuiButtonBase-root MuiIconButton-root MuiExpansionPanelSummary-expandIcon MuiIconButton-edgeEnd"
+                                      className="MuiButtonBase-root MuiIconButton-root MuiAccordionSummary-expandIcon MuiIconButton-edgeEnd"
                                       onBlur={[Function]}
                                       onDragLeave={[Function]}
                                       onFocus={[Function]}
@@ -1097,8 +1094,8 @@ exports[`FAQContent should render the full FAQ 1`] = `
                           </div>
                         </ForwardRef(ButtonBase)>
                       </WithStyles(ForwardRef(ButtonBase))>
-                    </ForwardRef(ExpansionPanelSummary)>
-                  </WithStyles(ForwardRef(ExpansionPanelSummary))>
+                    </ForwardRef(AccordionSummary)>
+                  </WithStyles(ForwardRef(AccordionSummary))>
                   <WithStyles(ForwardRef(Collapse))
                     in={false}
                     timeout="auto"
@@ -1149,7 +1146,7 @@ exports[`FAQContent should render the full FAQ 1`] = `
                               <div
                                 role="region"
                               >
-                                <WithStyles(ForwardRef(ExpansionPanelDetails))
+                                <WithStyles(ForwardRef(AccordionDetails))
                                   classes={
                                     Object {
                                       "root": "expansion-panel-details",
@@ -1157,15 +1154,15 @@ exports[`FAQContent should render the full FAQ 1`] = `
                                   }
                                   key=".1"
                                 >
-                                  <ForwardRef(ExpansionPanelDetails)
+                                  <ForwardRef(AccordionDetails)
                                     classes={
                                       Object {
-                                        "root": "MuiExpansionPanelDetails-root expansion-panel-details",
+                                        "root": "MuiAccordionDetails-root expansion-panel-details",
                                       }
                                     }
                                   >
                                     <div
-                                      className="MuiExpansionPanelDetails-root expansion-panel-details"
+                                      className="MuiAccordionDetails-root expansion-panel-details"
                                     >
                                       <div>
                                         <p>
@@ -1176,8 +1173,8 @@ exports[`FAQContent should render the full FAQ 1`] = `
                                         </p>
                                       </div>
                                     </div>
-                                  </ForwardRef(ExpansionPanelDetails)>
-                                </WithStyles(ForwardRef(ExpansionPanelDetails))>
+                                  </ForwardRef(AccordionDetails)>
+                                </WithStyles(ForwardRef(AccordionDetails))>
                               </div>
                             </div>
                           </div>
@@ -1188,8 +1185,8 @@ exports[`FAQContent should render the full FAQ 1`] = `
                 </div>
               </ForwardRef(Paper)>
             </WithStyles(ForwardRef(Paper))>
-          </ForwardRef(ExpansionPanel)>
-        </WithStyles(ForwardRef(ExpansionPanel))>
+          </ForwardRef(Accordion)>
+        </WithStyles(ForwardRef(Accordion))>
       </div>
     </div>
   </div>
diff --git a/src/components/Konnector/KonnectorViewerCard.tsx b/src/components/Konnector/KonnectorViewerCard.tsx
index d7cb6b235827ea72c3ba258276dab460503a479e..b23c5f5fd9534baa80596c20522d52bca48f3222 100644
--- a/src/components/Konnector/KonnectorViewerCard.tsx
+++ b/src/components/Konnector/KonnectorViewerCard.tsx
@@ -30,9 +30,11 @@ import AccountService from 'services/account.service'
 
 import chevronDown from 'assets/icons/ico/chevron-down.svg'
 import Icon from 'cozy-ui/transpiled/react/Icon'
-import ExpansionPanel from '@material-ui/core/ExpansionPanel'
-import ExpansionPanelSummary from '@material-ui/core/ExpansionPanelSummary'
-import ExpansionPanelDetails from '@material-ui/core/ExpansionPanelDetails'
+import {
+  Accordion,
+  AccordionSummary,
+  AccordionDetails,
+} from '@material-ui/core'
 import ErrorNotif from 'assets/icons/ico/notif_error.svg'
 import PartnersIssueNotif from 'assets/icons/ico/notif_maintenance.svg'
 import ConnectionNotFound from 'components/Connection/ConnectionNotFound'
@@ -163,7 +165,9 @@ const KonnectorViewerCard: React.FC<KonnectorViewerCardProps> = ({
     await refreshChallengeState()
     const _updatedFluidStatus = await updateGlobalFluidStatus()
     if (_updatedFluidStatus.length > 0) {
-      const partnersInfo: PartnersInfo = await partnersInfoService.getPartnersInfo()
+      const partnersInfo:
+        | PartnersInfo
+        | undefined = await partnersInfoService.getPartnersInfo()
       const updatedFluidStatus: FluidStatus[] = await fluidService.getFluidStatus(
         partnersInfo
       )
@@ -202,7 +206,9 @@ const KonnectorViewerCard: React.FC<KonnectorViewerCardProps> = ({
           )
         }
         if (updatedFluidStatus.length > 0) {
-          const partnersInfo: PartnersInfo = await partnersInfoService.getPartnersInfo()
+          const partnersInfo:
+            | PartnersInfo
+            | undefined = await partnersInfoService.getPartnersInfo()
           const _updatedFluidStatus: FluidStatus[] = await fluidService.getFluidStatus(
             partnersInfo
           )
@@ -458,7 +464,7 @@ const KonnectorViewerCard: React.FC<KonnectorViewerCardProps> = ({
   return (
     <>
       {!isDisconnected ? (
-        <ExpansionPanel
+        <Accordion
           expanded={active}
           onChange={toggleAccordion}
           classes={{
@@ -472,7 +478,7 @@ const KonnectorViewerCard: React.FC<KonnectorViewerCardProps> = ({
             }`,
           }}
         >
-          <ExpansionPanelSummary
+          <AccordionSummary
             aria-label={t(
               `konnector_options.accessibility.button_toggle_detail_${FluidType[
                 fluidStatus.fluidType
@@ -496,15 +502,15 @@ const KonnectorViewerCard: React.FC<KonnectorViewerCardProps> = ({
             >
               {displayKonnectorHeader()}
             </div>
-          </ExpansionPanelSummary>
-          <ExpansionPanelDetails
+          </AccordionSummary>
+          <AccordionDetails
             classes={{
               root: 'expansion-panel-details',
             }}
           >
             {getConnectionCard()}
-          </ExpansionPanelDetails>
-        </ExpansionPanel>
+          </AccordionDetails>
+        </Accordion>
       ) : (
         <>{getConnectionCard()}</>
       )}
diff --git a/src/components/Options/ProfileTypeOptions.tsx b/src/components/Options/ProfileTypeOptions.tsx
index e73c1cf2cadf205d238080a4bf6b3b6fb15be5da..dea8c9317f72766a0a96237a947e22192d091127 100644
--- a/src/components/Options/ProfileTypeOptions.tsx
+++ b/src/components/Options/ProfileTypeOptions.tsx
@@ -13,9 +13,11 @@ import {
 import { FluidType } from 'enum/fluid.enum'
 import { useHistory } from 'react-router-dom'
 
-import ExpansionPanel from '@material-ui/core/ExpansionPanel'
-import ExpansionPanelSummary from '@material-ui/core/ExpansionPanelSummary'
-import ExpansionPanelDetails from '@material-ui/core/ExpansionPanelDetails'
+import {
+  Accordion,
+  AccordionSummary,
+  AccordionDetails,
+} from '@material-ui/core'
 import Icon from 'cozy-ui/transpiled/react/Icon'
 import chevronDown from 'assets/icons/ico/chevron-down.svg'
 import StyledCard from 'components/CommonKit/Card/StyledCard'
@@ -50,14 +52,14 @@ const ProfileTypeOptions: React.FC = () => {
           {t('profile_type.title_profile')}
         </div>
         {profile.isProfileTypeCompleted && (
-          <ExpansionPanel
+          <Accordion
             expanded={active}
             onChange={toggleAccordion}
             classes={{
               root: 'expansion-panel-root',
             }}
           >
-            <ExpansionPanelSummary
+            <AccordionSummary
               aria-label={t(
                 'profile_type.accessibility.button_toggle_detail_profile'
               )}
@@ -70,8 +72,8 @@ const ProfileTypeOptions: React.FC = () => {
               <div className="text-18-normal">
                 {t('profile_type.your_profile')}
               </div>
-            </ExpansionPanelSummary>
-            <ExpansionPanelDetails
+            </AccordionSummary>
+            <AccordionDetails
               classes={{
                 root: 'expansion-panel-details',
               }}
@@ -228,8 +230,8 @@ const ProfileTypeOptions: React.FC = () => {
                   </Button>
                 </div>
               </div>
-            </ExpansionPanelDetails>
-          </ExpansionPanel>
+            </AccordionDetails>
+          </Accordion>
         )}
         {profile.isProfileTypeCompleted === false && (
           <StyledCard onClick={goToForm} className="profile-link">
diff --git a/yarn.lock b/yarn.lock
index 04ac835dd3b936909e7dcf639c7cce71b978cc60..a753febcac4ee67bd25d3e62d72de692f7ef05e9 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2910,6 +2910,11 @@
   resolved "https://registry.yarnpkg.com/@types/lodash/-/lodash-4.14.177.tgz#f70c0d19c30fab101cad46b52be60363c43c4578"
   integrity sha512-0fDwydE2clKe9MNfvXHBHF9WEahRuj+msTuQqOmAApNORFvhMYZKNGGJdCzuhheVjMps/ti0Ak/iJPACMaevvw==
 
+"@types/lodash@^4.14.175":
+  version "4.14.182"
+  resolved "https://registry.yarnpkg.com/@types/lodash/-/lodash-4.14.182.tgz#05301a4d5e62963227eaafe0ce04dd77c54ea5c2"
+  integrity sha512-/THyiqyQAP9AfARo4pF+aCGcyiQ94tX/Is2I7HofNRqoYLgN1PBoOWu2/zTA5zMxzP5EFutMtWtGAFRKUe961Q==
+
 "@types/luxon@^1.21.0":
   version "1.27.1"
   resolved "https://registry.yarnpkg.com/@types/luxon/-/luxon-1.27.1.tgz#aceeb2d5be8fccf541237e184e37ecff5faa9096"
@@ -3879,6 +3884,13 @@ aws4@^1.8.0:
   resolved "https://registry.yarnpkg.com/aws4/-/aws4-1.11.0.tgz#d61f46d83b2519250e2784daf5b09479a8b41c59"
   integrity sha512-xh1Rl34h6Fi1DC2WWKfxUTVqRsNnr6LsKz2+hfwDxQJWmrx8+c7ylaqBMcHfl1U1r2dsifOvKX3LQuLNZ+XSvA==
 
+axios@^0.21.1:
+  version "0.21.4"
+  resolved "https://registry.yarnpkg.com/axios/-/axios-0.21.4.tgz#c67b90dc0568e5c1cf2b0b858c43ba28e2eda575"
+  integrity sha512-ut5vewkiu8jjGBdqpM44XxjuCjq9LAKeHVmoVfHVzy8eHgxxq8SbAVQNovDA8mVi05kP0Ea/n/UzcSHcTJQfNg==
+  dependencies:
+    follow-redirects "^1.14.0"
+
 axios@^0.27.0:
   version "0.27.2"
   resolved "https://registry.yarnpkg.com/axios/-/axios-0.27.2.tgz#207658cc8621606e586c85db4b41a750e756d972"
@@ -4319,6 +4331,13 @@ brorand@^1.0.1, brorand@^1.1.0:
   resolved "https://registry.yarnpkg.com/brorand/-/brorand-1.1.0.tgz#12c25efe40a45e3c323eb8675a0a0ce57b22371f"
   integrity sha1-EsJe/kCkXjwyPrhnWgoM5XsiNx8=
 
+brotli-size@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/brotli-size/-/brotli-size-4.0.0.tgz#a05ee3faad3c0e700a2f2da826ba6b4d76e69e5e"
+  integrity sha512-uA9fOtlTRC0iqKfzff1W34DXUA3GyVqbUaeo3Rw3d4gd1eavKVCETXrn3NzO74W+UVkG3UHu8WxUi+XvKI/huA==
+  dependencies:
+    duplexer "0.1.1"
+
 browser-process-hrtime@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/browser-process-hrtime/-/browser-process-hrtime-1.0.0.tgz#3c9b4b7d782c8121e56f10106d84c0d0ffc94626"
@@ -4475,6 +4494,29 @@ builtins@^1.0.3:
   resolved "https://registry.yarnpkg.com/builtins/-/builtins-1.0.3.tgz#cb94faeb61c8696451db36534e1422f94f0aee88"
   integrity sha1-y5T662HIaWRR2zZTThQi+U8K7og=
 
+bundlemon-utils@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/bundlemon-utils/-/bundlemon-utils-1.0.0.tgz#9c3e10f09107568913db2e69a3d3317a82b00633"
+  integrity sha512-+rc1Zautuch9MT7+n4O7T1+ASxcudaxisAIBVqN2xjOCaA+wYn5lyQnMPx2Ky2Cg8N4GrvuSfjNopli/GFrqVQ==
+  dependencies:
+    bytes "^3.1.0"
+
+bundlemon@^1.3.2:
+  version "1.4.0"
+  resolved "https://registry.yarnpkg.com/bundlemon/-/bundlemon-1.4.0.tgz#5593e00cd913e638f69a489d4d97a9abecdac85d"
+  integrity sha512-A5mzeMZrnUzKNNo8ng1PFlxZr57XM2HDsaX07kJ1u59BDWn2JFYNeUIUSXhmLdoqBHK9Ln7wTLXDnoqOlcJP5A==
+  dependencies:
+    axios "^0.21.1"
+    brotli-size "^4.0.0"
+    bundlemon-utils "^1.0.0"
+    bytes "^3.1.0"
+    chalk "^4.1.1"
+    commander "^8.0.0"
+    cosmiconfig "^7.0.0"
+    gzip-size "^6.0.0"
+    micromatch "^4.0.4"
+    yup "^0.32.11"
+
 bytes@3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/bytes/-/bytes-3.0.0.tgz#d32815404d689699f85a4ea4fa8755dd13a96048"
@@ -4490,6 +4532,11 @@ bytes@3.1.1:
   resolved "https://registry.yarnpkg.com/bytes/-/bytes-3.1.1.tgz#3f018291cb4cbad9accb6e6970bca9c8889e879a"
   integrity sha512-dWe4nWO/ruEOY7HkUJ5gFt1DCFV9zPRoJr8pV0/ASQermOZjtq8jMjOprC0Kd10GLN+l7xaUPvxzJFWtxGu8Fg==
 
+bytes@^3.1.0:
+  version "3.1.2"
+  resolved "https://registry.yarnpkg.com/bytes/-/bytes-3.1.2.tgz#8b0beeb98605adf1b128fa4386403c009e0221a5"
+  integrity sha512-/Nf7TyzTx6S3yRJObOAV7956r8cr2+Oj8AC5dt8wSP3BQAoeX58NoHyCU8P8zGkNXStjTSi6fzO6F0pBdcYbEg==
+
 cacache@^10.0.4:
   version "10.0.4"
   resolved "https://registry.yarnpkg.com/cacache/-/cacache-10.0.4.tgz#6452367999eff9d4188aefd9a14e9d7c6a263460"
@@ -4741,7 +4788,7 @@ chalk@3, chalk@^3.0.0:
     ansi-styles "^4.1.0"
     supports-color "^7.1.0"
 
-chalk@^4.0.0, chalk@^4.1.0:
+chalk@^4.0.0, chalk@^4.1.0, chalk@^4.1.1:
   version "4.1.2"
   resolved "https://registry.yarnpkg.com/chalk/-/chalk-4.1.2.tgz#aac4e2b7734a740867aeb16bf02aad556a1e7a01"
   integrity sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==
@@ -4779,6 +4826,11 @@ charenc@0.0.2:
   resolved "https://registry.yarnpkg.com/charenc/-/charenc-0.0.2.tgz#c0a1d2f3a7092e03774bfa83f14c0fc5790a8667"
   integrity sha1-wKHS86cJLgN3S/qD8UwPxXkKhmc=
 
+chart.js@3.7.1:
+  version "3.7.1"
+  resolved "https://registry.yarnpkg.com/chart.js/-/chart.js-3.7.1.tgz#0516f690c6a8680c6c707e31a4c1807a6f400ada"
+  integrity sha512-8knRegQLFnPQAheZV8MjxIXc5gQEfDFD897BJgv/klO/vtIyFFmgMXrNfgrXpbTr/XbTturxRgxIXx/Y+ASJBA==
+
 check-types@^8.0.3:
   version "8.0.3"
   resolved "https://registry.yarnpkg.com/check-types/-/check-types-8.0.3.tgz#3356cca19c889544f2d7a95ed49ce508a0ecf552"
@@ -5208,7 +5260,7 @@ commander@^5.1.0:
   resolved "https://registry.yarnpkg.com/commander/-/commander-5.1.0.tgz#46abbd1652f8e059bddaef99bbdcb2ad9cf179ae"
   integrity sha512-P0CysNDQ7rtVw4QIQtm+MRxV66vKFSvlsQvGYXZWR3qFU0jlMKHZZZgw8e+8DSah4UDKMqnknRDQz+xuQXQ/Zg==
 
-commander@^8.3.0:
+commander@^8.0.0, commander@^8.3.0:
   version "8.3.0"
   resolved "https://registry.yarnpkg.com/commander/-/commander-8.3.0.tgz#4837ea1b2da67b9c616a67afbb0fafee567bca66"
   integrity sha512-OkTL9umf+He2DZkUq8f8J9of7yL6RJKI24dVITBmNfZBmri9zYZQrKkuXiKhyfPSu8tUhnVBB1iKXevvnlR4Ww==
@@ -6121,28 +6173,34 @@ cozy-ui@35.22.0:
     react-select "2.2.0"
     react-swipeable-views "0.13.3"
 
-cozy-ui@60.6.0:
-  version "60.6.0"
-  resolved "https://registry.yarnpkg.com/cozy-ui/-/cozy-ui-60.6.0.tgz#8454767932ff4f9d078b8780d3433b6a93e6b855"
-  integrity sha512-bNVK+TRjmtEtHzh272npmOiK64MCSIlo2bvWsBzevHhksd6x+TzazXkGR84iBQGGmm+CQI7F1+YNcg6gE7s2Yw==
+cozy-ui@68.8.0:
+  version "68.8.0"
+  resolved "https://registry.yarnpkg.com/cozy-ui/-/cozy-ui-68.8.0.tgz#4112bfe2a2fde5cc22ae046683ff7230c0c5038f"
+  integrity sha512-HIsL3z0KZVeNzMSKDOTRxawUqehJDNZLAWM9VtbiS0DEpYJ5zYvWyyLi8CDJP6swv/6RuuH7KRO403iic8WWgQ==
   dependencies:
     "@babel/runtime" "^7.3.4"
     "@popperjs/core" "^2.4.4"
+    bundlemon "^1.3.2"
+    chart.js "3.7.1"
     classnames "^2.2.5"
     cozy-interapp "^0.5.4"
     date-fns "^1.28.5"
     filesize "8.0.7"
     hammerjs "^2.0.8"
     intersection-observer "0.11.0"
+    mime-types "2.1.35"
     mui-bottom-sheet "https://github.com/cozy/mui-bottom-sheet.git#v1.0.6"
     node-polyglot "^2.2.2"
-    normalize.css "^7.0.0"
+    normalize.css "^8.0.0"
+    piwik-react-router "0.12.1"
+    react-chartjs-2 "4.1.0"
     react-markdown "^4.0.8"
     react-pdf "^4.0.5"
     react-popper "^2.2.3"
     react-remove-scroll "^2.4.0"
     react-select "^4.3.0"
     react-swipeable-views "^0.13.3"
+    rooks "^5.11.2"
 
 create-ecdh@^4.0.0:
   version "4.0.4"
@@ -7136,7 +7194,12 @@ dotgitignore@^2.1.0:
     find-up "^3.0.0"
     minimatch "^3.0.4"
 
-duplexer@^0.1.1:
+duplexer@0.1.1:
+  version "0.1.1"
+  resolved "https://registry.yarnpkg.com/duplexer/-/duplexer-0.1.1.tgz#ace6ff808c1ce66b57d1ebf97977acb02334cfc1"
+  integrity sha512-sxNZ+ljy+RA1maXoUReeqBBpBC6RLKmg5ewzV+x+mSETmWNoKdZN6vcQjpFROemza23hGFskJtFNoUWUaQ+R4Q==
+
+duplexer@^0.1.1, duplexer@^0.1.2:
   version "0.1.2"
   resolved "https://registry.yarnpkg.com/duplexer/-/duplexer-0.1.2.tgz#3abe43aef3835f8ae077d136ddce0f276b0400e6"
   integrity sha512-jtD6YG370ZCIi/9GTaJKQxWTZD045+4R4hTk/x1UyoqadyJ9x9CgSi1RlVDQF8U2sxLLSnFkCaMihqljHIWgMg==
@@ -8501,7 +8564,7 @@ follow-redirects@^1.0.0:
   resolved "https://registry.yarnpkg.com/follow-redirects/-/follow-redirects-1.14.5.tgz#f09a5848981d3c772b5392309778523f8d85c381"
   integrity sha512-wtphSXy7d4/OR+MvIFbCVBDzZ5520qV8XfPklSN5QtxuMUJZ+b0Wnst1e1lCDocfzuCkHqj8k0FpZqO+UIaKNA==
 
-follow-redirects@^1.14.9:
+follow-redirects@^1.14.0, follow-redirects@^1.14.9:
   version "1.15.1"
   resolved "https://registry.yarnpkg.com/follow-redirects/-/follow-redirects-1.15.1.tgz#0ca6a452306c9b276e4d3127483e29575e207ad5"
   integrity sha512-yLAMQs+k0b2m7cVxpS1VKJVvoz7SS9Td1zss3XRwXj+ZDH00RJgnuLx7E44wx02kQLrdM3aOOy+FpzS7+8OizA==
@@ -8993,6 +9056,13 @@ gzip-size@^5.0.0:
     duplexer "^0.1.1"
     pify "^4.0.1"
 
+gzip-size@^6.0.0:
+  version "6.0.0"
+  resolved "https://registry.yarnpkg.com/gzip-size/-/gzip-size-6.0.0.tgz#065367fd50c239c0671cbcbad5be3e2eeb10e462"
+  integrity sha512-ax7ZYomf6jqPTQ4+XCpUGyXKHk5WweS+e05MBO4/y3WJ5RkmPXNKvX+bx1behVILVwr6JSQvZAku021CHPXG3Q==
+  dependencies:
+    duplexer "^0.1.2"
+
 hammerjs@2.0.8, hammerjs@^2.0.8:
   version "2.0.8"
   resolved "https://registry.yarnpkg.com/hammerjs/-/hammerjs-2.0.8.tgz#04ef77862cff2bb79d30f7692095930222bf60f1"
@@ -11351,7 +11421,7 @@ locate-path@^6.0.0:
   dependencies:
     p-locate "^5.0.0"
 
-lodash-es@^4.17.11, lodash-es@^4.2.1:
+lodash-es@^4.17.11, lodash-es@^4.17.21, lodash-es@^4.2.1:
   version "4.17.21"
   resolved "https://registry.yarnpkg.com/lodash-es/-/lodash-es-4.17.21.tgz#43e626c46e6591b7750beb2b50117390c609e3ee"
   integrity sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw==
@@ -11904,6 +11974,18 @@ mime-db@1.51.0, "mime-db@>= 1.43.0 < 2":
   resolved "https://registry.yarnpkg.com/mime-db/-/mime-db-1.51.0.tgz#d9ff62451859b18342d960850dc3cfb77e63fb0c"
   integrity sha512-5y8A56jg7XVQx2mbv1lu49NR4dokRnhZYTtL+KGfaa27uq4pSTXkwQkFJl4pkRMyNFz/EtYDSkiiEHx3F7UN6g==
 
+mime-db@1.52.0:
+  version "1.52.0"
+  resolved "https://registry.yarnpkg.com/mime-db/-/mime-db-1.52.0.tgz#bbabcdc02859f4987301c856e3387ce5ec43bf70"
+  integrity sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==
+
+mime-types@2.1.35:
+  version "2.1.35"
+  resolved "https://registry.yarnpkg.com/mime-types/-/mime-types-2.1.35.tgz#381a871b62a734450660ae3deee44813f70d959a"
+  integrity sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==
+  dependencies:
+    mime-db "1.52.0"
+
 mime-types@^2.1.12, mime-types@^2.1.31, mime-types@~2.1.17, mime-types@~2.1.19, mime-types@~2.1.24:
   version "2.1.34"
   resolved "https://registry.yarnpkg.com/mime-types/-/mime-types-2.1.34.tgz#5a712f9ec1503511a945803640fafe09d3793c24"
@@ -12529,9 +12611,9 @@ msgpack5@^4.0.2:
     readable-stream "^2.3.6"
     safe-buffer "^5.1.2"
 
-"mui-bottom-sheet@https://github.com/cozy/mui-bottom-sheet.git#v1.0.6":
+"mui-bottom-sheet@git+https://github.com/cozy/mui-bottom-sheet.git#v1.0.6":
   version "1.0.6"
-  resolved "https://github.com/cozy/mui-bottom-sheet.git#494c40416ecde95732c864f9b921e7e545075aa5"
+  resolved "git+https://github.com/cozy/mui-bottom-sheet.git#494c40416ecde95732c864f9b921e7e545075aa5"
   dependencies:
     "@juggle/resize-observer" "^3.1.3"
     jest-environment-jsdom-sixteen "^1.0.3"
@@ -12576,6 +12658,11 @@ nan@^2.12.1, nan@^2.13.2:
   resolved "https://registry.yarnpkg.com/nan/-/nan-2.15.0.tgz#3f34a473ff18e15c1b5626b62903b5ad6e665fee"
   integrity sha512-8ZtvEnA2c5aYCZYd1cvgdnU6cqwixRoYg70xPLWUws5ORTa/lnw+u4amixRS/Ac5U5mQVgp9pnlSUnbNWFaWZQ==
 
+nanoclone@^0.2.1:
+  version "0.2.1"
+  resolved "https://registry.yarnpkg.com/nanoclone/-/nanoclone-0.2.1.tgz#dd4090f8f1a110d26bb32c49ed2f5b9235209ed4"
+  integrity sha512-wynEP02LmIbLpcYw8uBKpcfF6dmg2vcpKqxeH5UcoKEYdExslsdUA4ugFauuaeYdTB76ez6gJW8XAZ6CgkXYxA==
+
 nanoid@^3.1.30:
   version "3.1.30"
   resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-3.1.30.tgz#63f93cc548d2a113dc5dfbc63bfa09e2b9b64362"
@@ -12907,6 +12994,11 @@ normalize.css@^7.0.0:
   resolved "https://registry.yarnpkg.com/normalize.css/-/normalize.css-7.0.0.tgz#abfb1dd82470674e0322b53ceb1aaf412938e4bf"
   integrity sha1-q/sd2CRwZ04DIrU86xqvQSk45L8=
 
+normalize.css@^8.0.0:
+  version "8.0.1"
+  resolved "https://registry.yarnpkg.com/normalize.css/-/normalize.css-8.0.1.tgz#9b98a208738b9cc2634caacbc42d131c97487bf3"
+  integrity sha512-qizSNPO93t1YUuUhP22btGOo3chcvDFqFaj2TRybP0DMxkHOCTYwp3n34fel4a31ORXy4m1Xq0Gyqpb5m33qIg==
+
 npm-run-all@^4.1.5:
   version "4.1.5"
   resolved "https://registry.yarnpkg.com/npm-run-all/-/npm-run-all-4.1.5.tgz#04476202a15ee0e2e214080861bff12a51d98fba"
@@ -14257,6 +14349,11 @@ propagate@^2.0.0:
   resolved "https://registry.yarnpkg.com/propagate/-/propagate-2.0.1.tgz#40cdedab18085c792334e64f0ac17256d38f9a45"
   integrity sha512-vGrhOavPSTz4QVNuBNdcNXePNdNMaO1xj9yBeH1ScQPjk/rhg9sSlCXPhMkFuaNNW/syTvYqsnbIJxMBfRbbag==
 
+property-expr@^2.0.4:
+  version "2.0.5"
+  resolved "https://registry.yarnpkg.com/property-expr/-/property-expr-2.0.5.tgz#278bdb15308ae16af3e3b9640024524f4dc02cb4"
+  integrity sha512-IJUkICM5dP5znhCckHSv30Q4b5/JA5enCtkRHYaOVOAocnH/1BQEYTC5NMfT3AVl/iXKdr3aqQbQn9DxyWknwA==
+
 proto-list@~1.2.1:
   version "1.2.4"
   resolved "https://registry.yarnpkg.com/proto-list/-/proto-list-1.2.4.tgz#212d5bfe1318306a420f6402b8e26ff39647a849"
@@ -14495,6 +14592,11 @@ react-autowhatever@^10.1.2:
     react-themeable "^1.1.0"
     section-iterator "^2.0.0"
 
+react-chartjs-2@4.1.0:
+  version "4.1.0"
+  resolved "https://registry.yarnpkg.com/react-chartjs-2/-/react-chartjs-2-4.1.0.tgz#2a123df16d3a987c54eb4e810ed766d3c03adf8d"
+  integrity sha512-AsUihxEp8Jm1oBhbEovE+w50m9PVNhz1sfwEIT4hZduRC0m14gHWHd0cUaxkFDb8HNkdMIGzsNlmVqKiOpU74g==
+
 react-dom@16.14.0:
   version "16.14.0"
   resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-16.14.0.tgz#7ad838ec29a777fb3c75c3a190f661cf92ab8b89"
@@ -14561,7 +14663,7 @@ react-input-autosize@^3.0.0:
   dependencies:
     prop-types "^15.5.8"
 
-react-is@^16.13.1, react-is@^16.6.0, react-is@^16.7.0, react-is@^16.8.1, react-is@^16.8.4, react-is@^16.8.6:
+react-is@^16.13.1, react-is@^16.6.0, react-is@^16.7.0, react-is@^16.8.1, react-is@^16.8.6:
   version "16.13.1"
   resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4"
   integrity sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==
@@ -15489,6 +15591,14 @@ ripemd160@^2.0.0, ripemd160@^2.0.1:
     hash-base "^3.0.0"
     inherits "^2.0.1"
 
+rooks@^5.11.2:
+  version "5.11.2"
+  resolved "https://registry.yarnpkg.com/rooks/-/rooks-5.11.2.tgz#f7ba3a758c512c7cc807af38615f3052439578b8"
+  integrity sha512-kOVYjNW/0Emq9NN3DbmC41xcltK25gVV2PMGw+Et9vC5UiIKrwWYRYmMid2/WRGQ0oodOeksCkrqGwJcV2buuQ==
+  dependencies:
+    lodash.debounce "^4.0.8"
+    raf "^3.4.1"
+
 route-recognizer@^0.3.4:
   version "0.3.4"
   resolved "https://registry.yarnpkg.com/route-recognizer/-/route-recognizer-0.3.4.tgz#39ab1ffbce1c59e6d2bdca416f0932611e4f3ca3"
@@ -17082,6 +17192,11 @@ toposort@^1.0.0:
   resolved "https://registry.yarnpkg.com/toposort/-/toposort-1.0.7.tgz#2e68442d9f64ec720b8cc89e6443ac6caa950029"
   integrity sha1-LmhELZ9k7HILjMieZEOsbKqVACk=
 
+toposort@^2.0.2:
+  version "2.0.2"
+  resolved "https://registry.yarnpkg.com/toposort/-/toposort-2.0.2.tgz#ae21768175d1559d48bef35420b2f4962f09c330"
+  integrity sha512-0a5EOkAUp8D4moMi2W8ZF8jcga7BgZd91O/yabJCFY8az+XSzeGyTKs0Aoo897iV1Nj6guFq8orWDS96z91oGg==
+
 tough-cookie@^2.3.1, tough-cookie@^2.3.3, tough-cookie@~2.5.0:
   version "2.5.0"
   resolved "https://registry.yarnpkg.com/tough-cookie/-/tough-cookie-2.5.0.tgz#cd9fb2a0aa1d5a12b473bd9fb96fa3dcff65ade2"
@@ -18429,6 +18544,19 @@ yocto-queue@^0.1.0:
   resolved "https://registry.yarnpkg.com/yocto-queue/-/yocto-queue-0.1.0.tgz#0294eb3dee05028d31ee1a5fa2c556a6aaf10a1b"
   integrity sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q==
 
+yup@^0.32.11:
+  version "0.32.11"
+  resolved "https://registry.yarnpkg.com/yup/-/yup-0.32.11.tgz#d67fb83eefa4698607982e63f7ca4c5ed3cf18c5"
+  integrity sha512-Z2Fe1bn+eLstG8DRR6FTavGD+MeAwyfmouhHsIUgaADz8jvFKbO/fXc2trJKZg+5EBjh4gGm3iU/t3onKlXHIg==
+  dependencies:
+    "@babel/runtime" "^7.15.4"
+    "@types/lodash" "^4.14.175"
+    lodash "^4.17.21"
+    lodash-es "^4.17.21"
+    nanoclone "^0.2.1"
+    property-expr "^2.0.4"
+    toposort "^2.0.2"
+
 zxcvbn@^4.4.2:
   version "4.4.2"
   resolved "https://registry.yarnpkg.com/zxcvbn/-/zxcvbn-4.4.2.tgz#28ec17cf09743edcab056ddd8b1b06262cc73c30"