Timelines: fix dequeue, fix component propTypes

app/soapbox/actions/timelines.js

@@ -63,42 +63,30 @@ export function updateTimelineQueue(timeline, statusId, accept) {
   };
 };
 
-export function dequeueTimeline(timeline, expandFunc, optionalExpandArgs) {
+export function dequeueTimeline(timelineId, expandFunc, optionalExpandArgs) {
   return (dispatch, getState) => {
-    const queuedItems = getState().getIn(['timelines', timeline, 'queuedItems'], ImmutableOrderedSet());
-    const totalQueuedItemsCount = getState().getIn(['timelines', timeline, 'totalQueuedItemsCount'], 0);
+    const state = getState();
+    const queuedCount = state.getIn(['timelines', timelineId, 'totalQueuedItemsCount'], 0);
 
-    let shouldDispatchDequeue = true;
+    if (queuedCount <= 0) return;
 
-    if (totalQueuedItemsCount === 0) {
+    if (queuedCount <= MAX_QUEUED_ITEMS) {
+      dispatch({ type: TIMELINE_DEQUEUE, timeline: timelineId });
       return;
-    } else if (totalQueuedItemsCount > 0 && totalQueuedItemsCount <= MAX_QUEUED_ITEMS) {
-      queuedItems.forEach(statusId => {
-        dispatch(updateTimeline(timeline, statusId, null));
-      });
-    } else {
-      if (typeof expandFunc === 'function') {
-        dispatch(clearTimeline(timeline));
-        expandFunc();
-      } else {
-        if (timeline === 'home') {
-          dispatch(clearTimeline(timeline));
-          dispatch(expandHomeTimeline(optionalExpandArgs));
-        } else if (timeline === 'community') {
-          dispatch(clearTimeline(timeline));
-          dispatch(expandCommunityTimeline(optionalExpandArgs));
-        } else {
-          shouldDispatchDequeue = false;
-        }
-      }
     }
 
-    if (!shouldDispatchDequeue) return;
-
-    dispatch({
-      type: TIMELINE_DEQUEUE,
-      timeline,
-    });
+    if (typeof expandFunc === 'function') {
+      dispatch(clearTimeline(timelineId));
+      expandFunc();
+    } else {
+      if (timelineId === 'home') {
+        dispatch(clearTimeline(timelineId));
+        dispatch(expandHomeTimeline(optionalExpandArgs));
+      } else if (timelineId === 'community') {
+        dispatch(clearTimeline(timelineId));
+        dispatch(expandCommunityTimeline(optionalExpandArgs));
+      }
+    }
   };
 };
 

app/soapbox/components/status_list.js

@@ -19,7 +19,7 @@ export default class StatusList extends ImmutablePureComponent {
     scrollKey: PropTypes.string.isRequired,
     statusIds: ImmutablePropTypes.orderedSet.isRequired,
     lastStatusId: PropTypes.string,
-    featuredStatusIds: ImmutablePropTypes.list,
+    featuredStatusIds: ImmutablePropTypes.orderedSet,
     onLoadMore: PropTypes.func,
     isLoading: PropTypes.bool,
     isPartial: PropTypes.bool,

app/soapbox/features/account_timeline/index.js

@@ -7,7 +7,7 @@ import { expandAccountFeaturedTimeline, expandAccountTimeline } from '../../acti
 import StatusList from '../../components/status_list';
 import LoadingIndicator from '../../components/loading_indicator';
 import Column from '../ui/components/column';
-import { List as ImmutableList } from 'immutable';
+import { OrderedSet as ImmutableOrderedSet } from 'immutable';
 import ImmutablePureComponent from 'react-immutable-pure-component';
 import { FormattedMessage } from 'react-intl';
 import { fetchAccountIdentityProofs } from '../../actions/identity_proofs';
@@ -16,8 +16,6 @@ import { NavLink } from 'react-router-dom';
 import { fetchPatronAccount } from '../../actions/patron';
 import { getSoapboxConfig } from 'soapbox/actions/soapbox';
 
-const emptyList = ImmutableList();
-
 const mapStateToProps = (state, { params, withReplies = false }) => {
   const username = params.username || '';
   const me = state.get('me');
@@ -48,8 +46,8 @@ const mapStateToProps = (state, { params, withReplies = false }) => {
     accountUsername,
     accountApId,
     isAccount: !!state.getIn(['accounts', accountId]),
-    statusIds: state.getIn(['timelines', `account:${path}`, 'items'], emptyList),
-    featuredStatusIds: withReplies ? ImmutableList() : state.getIn(['timelines', `account:${accountId}:pinned`, 'items'], emptyList),
+    statusIds: state.getIn(['timelines', `account:${path}`, 'items'], ImmutableOrderedSet()),
+    featuredStatusIds: withReplies ? ImmutableOrderedSet() : state.getIn(['timelines', `account:${accountId}:pinned`, 'items'], ImmutableOrderedSet()),
     isLoading: state.getIn(['timelines', `account:${path}`, 'isLoading']),
     hasMore: state.getIn(['timelines', `account:${path}`, 'hasMore']),
     me,
@@ -63,8 +61,8 @@ class AccountTimeline extends ImmutablePureComponent {
   static propTypes = {
     params: PropTypes.object.isRequired,
     dispatch: PropTypes.func.isRequired,
-    statusIds: ImmutablePropTypes.list,
-    featuredStatusIds: ImmutablePropTypes.list,
+    statusIds: ImmutablePropTypes.orderedSet,
+    featuredStatusIds: ImmutablePropTypes.orderedSet,
     isLoading: PropTypes.bool,
     hasMore: PropTypes.bool,
     withReplies: PropTypes.bool,

app/soapbox/features/ui/containers/status_list_container.js

@@ -1,6 +1,6 @@
 import { connect } from 'react-redux';
 import StatusList from '../../../components/status_list';
-import { Map as ImmutableMap, List as ImmutableList } from 'immutable';
+import { Map as ImmutableMap, OrderedSet as ImmutableOrderedSet } from 'immutable';
 import { createSelector } from 'reselect';
 import { debounce } from 'lodash';
 import { dequeueTimeline } from 'soapbox/actions/timelines';
@@ -10,7 +10,7 @@ import { shouldFilter } from 'soapbox/utils/timelines';
 
 const makeGetStatusIds = () => createSelector([
   (state, { type }) => getSettings(state).get(type, ImmutableMap()),
-  (state, { type }) => state.getIn(['timelines', type, 'items'], ImmutableList()),
+  (state, { type }) => state.getIn(['timelines', type, 'items'], ImmutableOrderedSet()),
   (state)           => state.get('statuses'),
   (state)           => state.get('me'),
 ], (columnSettings, statusIds, statuses, me) => {
@@ -25,7 +25,7 @@ const makeMapStateToProps = () => {
   const getStatusIds = makeGetStatusIds();
 
   const mapStateToProps = (state, { timelineId }) => {
-    const lastStatusId = state.getIn(['timelines', timelineId, 'items'], ImmutableList()).last();
+    const lastStatusId = state.getIn(['timelines', timelineId, 'items'], ImmutableOrderedSet()).last();
 
     return {
       statusIds: getStatusIds(state, { type: timelineId }),

app/soapbox/reducers/timelines.js

@@ -110,10 +110,7 @@ const updateTimelineQueue = (state, timelineId, statusId) => {
 
   return state.update(timelineId, initialTimeline, timeline => timeline.withMutations(timeline => {
     timeline.set('totalQueuedItemsCount', queuedCount + 1);
-
-    if (queuedCount < MAX_QUEUED_ITEMS) {
-      timeline.set('queuedItems', addStatusId(queuedIds, statusId));
-    }
+    timeline.set('queuedItems', addStatusId(queuedIds, statusId).take(MAX_QUEUED_ITEMS));
   }));
 };
 
@@ -182,6 +179,8 @@ const removeStatusFromGroup = (state, groupId, statusId) => {
 
 const timelineDequeue = (state, timelineId) => {
   return state.update(timelineId, initialTimeline, timeline => timeline.withMutations(timeline => {
+    const queuedIds = timeline.get('queuedItems');
+    timeline.update('items', ids => mergeStatusIds(ids, queuedIds));
     timeline.set('queuedItems', ImmutableOrderedSet());
     timeline.set('totalQueuedItemsCount', 0);
   }));