Large update for all components

reorganization, linting, updating file imports, consolidation
warning: there will be errors in this commit
todo: update webpack, add missing styles, scss files, consolidate the rest of components within features/*

app/javascript/gabsocial/containers/compose_container.js

@@ -1,7 +1,7 @@
 import { Provider } from 'react-redux';
+import { IntlProvider, addLocaleData } from 'react-intl';
 import configureStore from '../store/configureStore';
 import { hydrateStore } from '../actions/store';
-import { IntlProvider, addLocaleData } from 'react-intl';
 import { getLocale } from '../locales';
 import Compose from '../features/standalone/compose';
 import initialState from '../initial_state';

app/javascript/gabsocial/containers/domain_container.js

@@ -1,5 +1,5 @@
-import { blockDomain, unblockDomain } from '../actions/domain_blocks';
 import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
+import { blockDomain, unblockDomain } from '../actions/domain_blocks';
 import Domain from '../components/domain';
 import { openModal } from '../actions/modal';
 
@@ -7,12 +7,6 @@ const messages = defineMessages({
   blockDomainConfirm: { id: 'confirmations.domain_block.confirm', defaultMessage: 'Hide entire domain' },
 });
 
-const makeMapStateToProps = () => {
-  const mapStateToProps = () => ({});
-
-  return mapStateToProps;
-};
-
 const mapDispatchToProps = (dispatch, { intl }) => ({
   onBlockDomain (domain) {
     dispatch(openModal('CONFIRM', {
@@ -27,4 +21,4 @@ const mapDispatchToProps = (dispatch, { intl }) => ({
   },
 });
 
-export default injectIntl(connect(makeMapStateToProps, mapDispatchToProps)(Domain));
+export default injectIntl(connect(null, mapDispatchToProps)(Domain));

app/javascript/gabsocial/containers/gabsocial.js

@@ -1,6 +1,6 @@
 'use strict';
 
-import { Provider, connect } from 'react-redux';
+import { Provider } from 'react-redux';
 import configureStore from '../store/configureStore';
 import { INTRODUCTION_VERSION } from '../actions/onboarding';
 import { BrowserRouter, Route } from 'react-router-dom';
@@ -15,6 +15,7 @@ import { getLocale } from '../locales';
 import initialState from '../initial_state';
 import { me } from '../initial_state';
 import ErrorBoundary from '../components/error_boundary';
+// import { whyDidYouUpdate } from 'why-did-you-update';
 
 const { localeData, messages } = getLocale();
 addLocaleData(localeData);
@@ -31,8 +32,8 @@ const mapStateToProps = (state) => {
 
   return {
     showIntroduction,
-  }
-}
+  };
+};
 
 @connect(mapStateToProps)
 class GabSocialMount extends PureComponent {
@@ -60,6 +61,10 @@ class GabSocialMount extends PureComponent {
 
 }
 
+// whyDidYouUpdate(React);
+// whyDidYouUpdate(React, { groupByComponent: true, collapseComponentGroups: false });
+// whyDidYouUpdate(React, { exclude: [/^Connect|Link|NavLink|Route/] });
+
 export default class GabSocial extends PureComponent {
 
   static propTypes = {

app/javascript/gabsocial/containers/loading_bar_container.js

@@ -0,0 +1,7 @@
+import LoadingBar from 'react-redux-loading-bar';
+
+const mapStateToProps = (state, ownProps) => ({
+  loading: state.get('loadingBar')[ownProps.scope || 'default'],
+});
+
+export default connect(mapStateToProps)(LoadingBar.WrappedComponent);

app/javascript/gabsocial/containers/media_container.js

@@ -7,7 +7,7 @@ import Video from '../features/video';
 import Card from '../features/status/components/card';
 import Poll from 'gabsocial/components/poll';
 import ModalRoot from '../components/modal_root';
-import MediaModal from '../features/ui/components/media_modal';
+import MediaModal from '../components/modal';
 import { List as ImmutableList, fromJS } from 'immutable';
 
 const { localeData, messages } = getLocale();

app/javascript/gabsocial/containers/modal_container.js

@@ -0,0 +1,20 @@
+import { closeModal } from '../actions/modal';
+import { cancelReplyCompose } from '../actions/compose';
+import ModalRoot from '../components/modal_root';
+
+const mapStateToProps = state => ({
+  type: state.get('modal').modalType,
+  props: state.get('modal').modalProps,
+});
+
+const mapDispatchToProps = (dispatch) => ({
+  onClose (optionalType) {
+    if (optionalType === 'COMPOSE') {
+        dispatch(cancelReplyCompose());
+    }
+
+    dispatch(closeModal());
+  },
+});
+
+export default connect(mapStateToProps, mapDispatchToProps)(ModalRoot);

app/javascript/gabsocial/containers/notifications_container.js

@@ -0,0 +1,28 @@
+import { injectIntl } from 'react-intl';
+import { NotificationStack } from 'react-notification';
+import { dismissAlert } from '../actions/alerts';
+import { getAlerts } from '../selectors';
+
+const mapStateToProps = (state, { intl }) => {
+  const notifications = getAlerts(state);
+
+  notifications.forEach(notification => ['title', 'message'].forEach(key => {
+    const value = notification[key];
+
+    if (typeof value === 'object') {
+      notification[key] = intl.formatMessage(value);
+    }
+  }));
+
+  return { notifications };
+};
+
+const mapDispatchToProps = (dispatch) => {
+  return {
+    onDismiss: alert => {
+      dispatch(dismissAlert(alert));
+    },
+  };
+};
+
+export default injectIntl(connect(mapStateToProps, mapDispatchToProps)(NotificationStack));

app/javascript/gabsocial/containers/poll_container.js

@@ -1,7 +0,0 @@
-import Poll from 'gabsocial/components/poll';
-
-const mapStateToProps = (state, { pollId }) => ({
-  poll: state.getIn(['polls', pollId]),
-});
-
-export default connect(mapStateToProps)(Poll);

app/javascript/gabsocial/containers/status_list_container.js

@@ -0,0 +1,56 @@
+import { Map as ImmutableMap, List as ImmutableList } from 'immutable';
+import { createSelector } from 'reselect';
+import { debounce } from 'lodash';
+import { me } from '../initial_state';
+import StatusList from '../components/status_list/status_list';
+import { dequeueTimeline } from 'gabsocial/actions/timelines';
+import { scrollTopTimeline } from '../actions/timelines';
+
+const makeGetStatusIds = () => createSelector([
+  (state, { type }) => state.getIn(['settings', type], ImmutableMap()),
+  (state, { type }) => state.getIn(['timelines', type, 'items'], ImmutableList()),
+  (state)           => state.get('statuses'),
+], (columnSettings, statusIds, statuses) => {
+  return statusIds.filter(id => {
+    if (id === null) return true;
+
+    const statusForId = statuses.get(id);
+    let showStatus    = true;
+
+    if (columnSettings.getIn(['shows', 'reblog']) === false) {
+      showStatus = showStatus && statusForId.get('reblog') === null;
+    }
+
+    if (columnSettings.getIn(['shows', 'reply']) === false) {
+      showStatus = showStatus && (statusForId.get('in_reply_to_id') === null || statusForId.get('in_reply_to_account_id') === me);
+    }
+
+    return showStatus;
+  });
+});
+
+const mapStateToProps = (state, {timelineId}) => {
+  const getStatusIds = makeGetStatusIds();
+
+  return {
+    statusIds: getStatusIds(state, { type: timelineId }),
+    isLoading: state.getIn(['timelines', timelineId, 'isLoading'], true),
+    isPartial: state.getIn(['timelines', timelineId, 'isPartial'], false),
+    hasMore:   state.getIn(['timelines', timelineId, 'hasMore']),
+    totalQueuedItemsCount: state.getIn(['timelines', timelineId, 'totalQueuedItemsCount']),
+  };
+};
+
+const mapDispatchToProps = (dispatch, ownProps) => ({
+  onDequeueTimeline(timelineId) {
+    dispatch(dequeueTimeline(timelineId, ownProps.onLoadMore));
+  },
+  onScrollToTop: debounce(() => {
+    dispatch(scrollTopTimeline(ownProps.timelineId, true));
+  }, 100),
+  onScroll: debounce(() => {
+    dispatch(scrollTopTimeline(ownProps.timelineId, false));
+  }, 100),
+});
+
+export default connect(mapStateToProps, mapDispatchToProps)(StatusList);

app/javascript/gabsocial/containers/timeline_container.js

@@ -1,13 +1,13 @@
-import React, { Fragment } from 'react';
+import { Fragment } from 'react';
 import ReactDOM from 'react-dom';
 import { Provider } from 'react-redux';
+import { IntlProvider, addLocaleData } from 'react-intl';
 import configureStore from '../store/configureStore';
 import { hydrateStore } from '../actions/store';
-import { IntlProvider, addLocaleData } from 'react-intl';
 import { getLocale } from '../locales';
 import PublicTimeline from '../features/standalone/public_timeline';
 import HashtagTimeline from '../features/standalone/hashtag_timeline';
-import ModalContainer from '../features/ui/containers/modal_container';
+import ModalContainer from './modal_container';
 import initialState from '../initial_state';
 
 const { localeData, messages } = getLocale();
@@ -34,13 +34,7 @@ export default class TimelineContainer extends PureComponent {
   render () {
     const { locale, hashtag, local } = this.props;
 
-    let timeline;
-
-    if (hashtag) {
-      timeline = <HashtagTimeline hashtag={hashtag} />;
-    } else {
-      timeline = <PublicTimeline local={local} />;
-    }
+    const timeline = hashtag ? <HashtagTimeline hashtag={hashtag} /> : <PublicTimeline local={local} />;
 
     return (
       <IntlProvider locale={locale} messages={messages}>