Updated CommunityTimeline to add option for "all federated" content

added a toggle for showing only gab (off) or all fediverse content (on)

app/javascript/gabsocial/features/community_timeline/components/column_settings.js

@@ -20,6 +20,7 @@ class ColumnSettings extends React.PureComponent {
       <div>
         <div className='column-settings__row'>
           <SettingToggle settings={settings} settingPath={['other', 'onlyMedia']} onChange={onChange} label={<FormattedMessage id='community.column_settings.media_only' defaultMessage='Media Only' />} />
+          <SettingToggle settings={settings} settingPath={['other', 'allFediverse']} onChange={onChange} label={<FormattedMessage id='community.column_settings.all_fediverse' defaultMessage='All Fediverse' />} />
         </div>
       </div>
     );

app/javascript/gabsocial/features/community_timeline/index.js

@@ -4,19 +4,34 @@ import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
 import PropTypes from 'prop-types';
 import StatusListContainer from '../ui/containers/status_list_container';
 import Column from '../../components/column';
-import { expandCommunityTimeline } from '../../actions/timelines';
 import ColumnSettingsContainer from './containers/column_settings_container';
-import { connectCommunityStream } from '../../actions/streaming';
 import HomeColumnHeader from '../../components/home_column_header';
+import {
+  expandCommunityTimeline,
+  expandPublicTimeline,
+} from '../../actions/timelines';
+import {
+  connectCommunityStream,
+  connectPublicStream,
+} from '../../actions/streaming';
 
 const messages = defineMessages({
-  title: { id: 'column.community', defaultMessage: 'Local timeline' },
+  title: { id: 'column.community', defaultMessage: 'Community timeline' },
 });
 
-const mapStateToProps = (state, { onlyMedia }) => ({
+const mapStateToProps = state => {
-  hasUnread: state.getIn(['timelines', `community${onlyMedia ? ':media' : ''}`, 'unread']) > 0,
+  const allFediverse = state.getIn(['settings', 'community', 'other', 'allFediverse']);
-  onlyMedia: state.getIn(['settings', 'community', 'other', 'onlyMedia']),
+  const onlyMedia = state.getIn(['settings', 'community', 'other', 'onlyMedia']);
-});
+
+  const timelineId = allFediverse ? 'public' : 'community';
+
+  return {
+    timelineId,
+    allFediverse,
+    onlyMedia,
+    hasUnread: state.getIn(['timelines', `${timelineId}${onlyMedia ? ':media' : ''}`, 'unread']) > 0,
+  };
+};
 
 export default @connect(mapStateToProps)
 @injectIntl
@@ -28,6 +43,7 @@ class CommunityTimeline extends React.PureComponent {
 
   static defaultProps = {
     onlyMedia: false,
+    allFediverse: false,
   };
 
   static propTypes = {
@@ -35,22 +51,37 @@ class CommunityTimeline extends React.PureComponent {
     intl: PropTypes.object.isRequired,
     hasUnread: PropTypes.bool,
     onlyMedia: PropTypes.bool,
+    allFediverse: PropTypes.bool,
+    timelineId: PropTypes.string,
   };
 
   componentDidMount () {
-    const { dispatch, onlyMedia } = this.props;
+    const { dispatch, onlyMedia, allFediverse } = this.props;
 
-    dispatch(expandCommunityTimeline({ onlyMedia }));
+    if (allFediverse) {
-    this.disconnect = dispatch(connectCommunityStream({ onlyMedia }));
+      dispatch(expandPublicTimeline({ onlyMedia }));
+      this.disconnect = dispatch(connectPublicStream({ onlyMedia }));
+    }
+    else {
+      dispatch(expandCommunityTimeline({ onlyMedia }));
+      this.disconnect = dispatch(connectCommunityStream({ onlyMedia }));
+    }
   }
 
   componentDidUpdate (prevProps) {
-    if (prevProps.onlyMedia !== this.props.onlyMedia) {
+    if (prevProps.onlyMedia !== this.props.onlyMedia || prevProps.allFediverse !== this.props.allFediverse) {
-      const { dispatch, onlyMedia } = this.props;
+      const { dispatch, onlyMedia, allFediverse } = this.props;
 
       this.disconnect();
-      dispatch(expandCommunityTimeline({ onlyMedia }));
+
-      this.disconnect = dispatch(connectCommunityStream({ onlyMedia }));
+      if (allFediverse) {
+        dispatch(expandPublicTimeline({ onlyMedia }));
+        this.disconnect = dispatch(connectPublicStream({ onlyMedia }));
+      }
+      else {
+        dispatch(expandCommunityTimeline({ onlyMedia }));
+        this.disconnect = dispatch(connectCommunityStream({ onlyMedia }));
+      }
     }
   }
 
@@ -62,27 +93,29 @@ class CommunityTimeline extends React.PureComponent {
   }
 
   handleLoadMore = maxId => {
-    const { dispatch, onlyMedia } = this.props;
+    const { dispatch, onlyMedia, allFediverse } = this.props;
 
-    dispatch(expandCommunityTimeline({ maxId, onlyMedia }));
+    if (allFediverse) {
+      dispatch(expandPublicTimeline({ maxId, onlyMedia }));
+    }
+    else {
+      dispatch(expandCommunityTimeline({ maxId, onlyMedia }));
+    }
   }
 
   render () {
-    const { intl, hasUnread, onlyMedia } = this.props;
+    const { intl, hasUnread, onlyMedia, timelineId, allFediverse } = this.props;
 
     return (
       <Column label={intl.formatMessage(messages.title)}>
-        <HomeColumnHeader
+        <HomeColumnHeader activeItem='all' active={hasUnread} >
-          activeItem='all'
-          active={hasUnread}
-        >
           <ColumnSettingsContainer />
         </HomeColumnHeader>
         <StatusListContainer
-          scrollKey='community_timeline'
+          scrollKey={`${timelineId}_timeline`}
-          timelineId={`community${onlyMedia ? ':media' : ''}`}
+          timelineId={`${timelineId}${onlyMedia ? ':media' : ''}`}
           onLoadMore={this.handleLoadMore}
-          emptyMessage={<FormattedMessage id='empty_column.community' defaultMessage='The local timeline is empty. Write something publicly to get the ball rolling!' />}
+          emptyMessage={<FormattedMessage id='empty_column.community' defaultMessage='The community timeline is empty. Write something publicly to get the ball rolling!' />}
         />
       </Column>
     );