feat: Re-fetch apps if app not loaded and drawer opens

src/components/Bar.jsx

@@ -19,6 +19,7 @@ import SearchBar from 'components/SearchBar'
 import Claudy from 'components/Claudy'
 import SupportModal from 'components/SupportModal'
 import {
+  hasFetched,
   getContent,
   getCurrentApp,
   fetchApps,
@@ -38,29 +39,47 @@ class Bar extends Component {
       supportDisplayed: false,
       searchBarEnabled: props.currentApp === 'Cozy Drive' && !props.isPublic
     }
-    if (!props.isPublic) {
-      props.fetchContext()
-      props.fetchSettingsData(false)
-      props.fetchApps()
-    }
   }
 
   componentDidMount() {
-    // if tracking enabled, init the piwik tracker
     if (shouldEnableTracking()) {
-      const trackerInstance = getTracker(
-        __PIWIK_TRACKER_URL__,
-        __PIWIK_SITEID__,
-        false,
-        false
-      )
-      configureTracker({
-        appDimensionId: __PIWIK_DIMENSION_ID_APP__,
-        app: 'Cozy Bar',
-        heartbeat: 0
-      })
-      this.setState({ usageTracker: trackerInstance })
+      this.initPiwikTracker()
+    }
+    this.fetchInitialData()
+  }
+
+  componentDidUpdate(prevProps, prevState) {
+    if (
+      !this.props.hasFetchedApps &&
+      this.state.drawerVisible &&
+      prevState.drawerVisible !== this.state.drawerVisible
+    ) {
+      this.props.fetchApps()
+    }
+  }
+
+  initPiwikTracker() {
+    const trackerInstance = getTracker(
+      __PIWIK_TRACKER_URL__,
+      __PIWIK_SITEID__,
+      false,
+      false
+    )
+    configureTracker({
+      appDimensionId: __PIWIK_DIMENSION_ID_APP__,
+      app: 'Cozy Bar',
+      heartbeat: 0
+    })
+    this.setState({ usageTracker: trackerInstance })
+  }
+
+  fetchInitialData() {
+    if (this.props.isPublic) {
+      return
     }
+    this.props.fetchContext()
+    this.props.fetchSettingsData(false)
+    this.props.fetchApps()
   }
 
   toggleDrawer = () => {
@@ -206,7 +225,8 @@ const mapStateToProps = state => ({
   barRight: getContent(state, 'right'),
   barCenter: getContent(state, 'center'),
   currentApp: getCurrentApp(state),
-  claudyEnabled: shouldEnableClaudy(state)
+  claudyEnabled: shouldEnableClaudy(state),
+  hasFetchedApps: hasFetched(state)
 })
 
 const mapDispatchToProps = dispatch => ({
@@ -215,6 +235,10 @@ const mapDispatchToProps = dispatch => ({
   fetchSettingsData: displayBusy => dispatch(fetchSettingsData(displayBusy))
 })
 
+export {
+  Bar
+}
+
 export default translate()(
   connect(
     mapStateToProps,

test/components/Bar.spec.jsx

@@ -0,0 +1,52 @@
+import React from 'react'
+import { Bar } from 'components/Bar'
+import { shallow } from 'enzyme'
+
+describe('Bar', () => {
+
+  let props
+  beforeEach(() => {
+    props = {
+      fetchContext: jest.fn().mockResolvedValue({}),
+      fetchApps: jest.fn().mockResolvedValue([]),
+      fetchSettingsData: jest.fn().mockResolvedValue({}),
+      t: x => x
+    }
+  })
+
+  it('should fetch data when mounted', () => {
+    const root = shallow(
+      <Bar { ...props} />
+    )
+    expect(props.fetchContext).toHaveBeenCalled()
+    expect(props.fetchApps).toHaveBeenCalled()
+    expect(props.fetchSettingsData).toHaveBeenCalled()
+  })
+
+  it('should not fetch data if public', () => {
+    const root = shallow(
+      <Bar { ...props} isPublic={true } />
+    )
+    expect(props.fetchContext).not.toHaveBeenCalled()
+    expect(props.fetchApps).not.toHaveBeenCalled()
+    expect(props.fetchSettingsData).not.toHaveBeenCalled()
+  })
+
+  it('should not fetch apps if hasFetchedApps is true', () => {
+    const root = shallow(
+      <Bar { ...props} hasFetchedApps={true } />
+    )
+    expect(props.fetchApps).toHaveBeenCalled()
+  })
+
+  it('should re-fetch apps if apps are not fetched and drawer opens', () => {
+    const root = shallow(
+      <Bar { ...props} />
+    )
+    expect(props.fetchApps).toHaveBeenCalledTimes(1)
+    root.setState({ drawerVisible: true })
+    expect(props.fetchApps).toHaveBeenCalledTimes(2)
+    root.setState({ drawerVisible: true, usageTracker: {} })
+    expect(props.fetchApps).toHaveBeenCalledTimes(2)
+  })
+})