From a7f2837a377d7639b6163b76a157bcd917d97da0 Mon Sep 17 00:00:00 2001
From: mgabdev <>
Date: Thu, 11 Jul 2019 12:14:27 -0400
Subject: [PATCH] Added TimelineQueueButtonHeader to status_list

updated render return to add timeline queue button header before scrollable list
added handleDequeueTimeline action with totalQueuedItemsCount props
---
 .../gabsocial/components/status_list.js       | 22 ++++++++++++++-----
 1 file changed, 17 insertions(+), 5 deletions(-)

diff --git a/app/javascript/gabsocial/components/status_list.js b/app/javascript/gabsocial/components/status_list.js
index 7bbe01cc..262f9635 100644
--- a/app/javascript/gabsocial/components/status_list.js
+++ b/app/javascript/gabsocial/components/status_list.js
@@ -7,6 +7,7 @@ import StatusContainer from '../containers/status_container';
 import ImmutablePureComponent from 'react-immutable-pure-component';
 import LoadGap from './load_gap';
 import ScrollableList from './scrollable_list';
+import TimelineQueueButtonHeader from './timeline_queue_button_header';
 
 export default class StatusList extends ImmutablePureComponent {
 
@@ -22,6 +23,12 @@ export default class StatusList extends ImmutablePureComponent {
     emptyMessage: PropTypes.node,
     alwaysPrepend: PropTypes.bool,
     timelineId: PropTypes.string,
+    queuedItemSize: PropTypes.number,
+    onDequeueTimeline: PropTypes.func,
+  };
+
+  componentWillUnmount() {
+    this.handleDequeueTimeline();
   };
 
   getFeaturedStatusCount = () => {
@@ -64,13 +71,17 @@ export default class StatusList extends ImmutablePureComponent {
     }
   }
 
+  handleDequeueTimeline = () => {
+    const { onDequeueTimeline, timelineId } = this.props;
+    onDequeueTimeline(timelineId);
+  }
+
   setRef = c => {
     this.node = c;
   }
 
   render () {
-    const { statusIds, featuredStatusIds, onLoadMore, timelineId, ...other }  = this.props;
-    const { isLoading, isPartial } = other;
+    const { statusIds, featuredStatusIds, onLoadMore, timelineId, totalQueuedItemsCount, isLoading, isPartial, ...other }  = this.props;
 
     if (isPartial) {
       return (
@@ -119,11 +130,12 @@ export default class StatusList extends ImmutablePureComponent {
       )).concat(scrollableContent);
     }
 
-    return (
-      <ScrollableList {...other} showLoading={isLoading && statusIds.size === 0} onLoadMore={onLoadMore && this.handleLoadOlder} ref={this.setRef}>
+    return [
+      <TimelineQueueButtonHeader key='timeline-queue-button-header' onClick={this.handleDequeueTimeline} count={totalQueuedItemsCount} itemType='gab' />,
+      <ScrollableList key='scrollable-list' {...other} showLoading={isLoading && statusIds.size === 0} onLoadMore={onLoadMore && this.handleLoadOlder} ref={this.setRef}>
         {scrollableContent}
       </ScrollableList>
-    );
+    ];
   }
 
 }