Fix epic fetch timeframe on Roadmap

Fix an issue when scrolling horizontally
on Roadmap and new epics are getting added
to the Roadmap

ee/app/assets/javascripts/roadmap/components/epics_list_section.vue

@@ -54,7 +54,7 @@ export default {
   computed: {
     ...mapState(['bufferSize', 'epicIid', 'childrenEpics', 'childrenFlags', 'epicIds']),
     emptyRowContainerVisible() {
-      return this.epics.length < this.bufferSize;
+      return this.displayedEpics.length < this.bufferSize;
     },
     sectionContainerStyles() {
       return {

ee/app/assets/javascripts/roadmap/store/actions.js

@@ -107,13 +107,13 @@ export const receiveEpicsSuccess = (
   }, []);
 
   commit(types.UPDATE_EPIC_IDS, epicIds);
+  dispatch('initItemChildrenFlags', { epics });
 
   if (timeframeExtended) {
     const updatedEpics = state.epics.concat(epics);
     sortEpics(updatedEpics, state.sortedBy);
     commit(types.RECEIVE_EPICS_FOR_TIMEFRAME_SUCCESS, updatedEpics);
   } else {
-    dispatch('initItemChildrenFlags', { epics });
     commit(types.RECEIVE_EPICS_SUCCESS, epics);
   }
 };

ee/spec/frontend/roadmap/store/actions_spec.js

@@ -155,7 +155,21 @@ describe('Roadmap Vuex Actions', () => {
             payload: [{ ...mockFormattedEpic, newEpic: true }],
           },
         ],
-        [],
+        [
+          {
+            type: 'initItemChildrenFlags',
+            payload: {
+              epics: [
+                {
+                  ...mockFormattedEpic,
+                  startDateOutOfRange: true,
+                  endDateOutOfRange: false,
+                  newEpic: true,
+                },
+              ],
+            },
+          },
+        ],
       );
     });
   });