Merge branch 'filter-invalid-chats-again' into 'develop'

Filter invalid chats again

Closes #648

See merge request soapbox-pub/soapbox-fe!582

app/soapbox/actions/settings.js

@@ -4,6 +4,7 @@ import { patchMe } from 'soapbox/actions/me';
 import { Map as ImmutableMap, List as ImmutableList } from 'immutable';
 import { isLoggedIn } from 'soapbox/utils/auth';
 import uuid from '../uuid';
+import { createSelector } from 'reselect';
 
 export const SETTING_CHANGE = 'SETTING_CHANGE';
 export const SETTING_SAVE   = 'SETTING_SAVE';
@@ -136,12 +137,14 @@ export const defaultSettings = ImmutableMap({
   ]),
 });
 
-export function getSettings(state) {
+export const getSettings = createSelector([
-  const soapboxSettings = state.getIn(['soapbox', 'defaultSettings']);
+  state => state.getIn(['soapbox', 'defaultSettings']),
+  state => state.get('settings'),
+], (soapboxSettings, settings) => {
   return defaultSettings
     .mergeDeep(soapboxSettings)
-    .mergeDeep(state.get('settings'));
+    .mergeDeep(settings);
-}
+});
 
 export function changeSetting(path, value) {
   return dispatch => {

app/soapbox/actions/soapbox.js

@@ -1,6 +1,7 @@
 import api from '../api';
 import { Map as ImmutableMap, List as ImmutableList } from 'immutable';
 import { getFeatures } from 'soapbox/utils/features';
+import { createSelector } from 'reselect';
 
 export const SOAPBOX_CONFIG_REQUEST_SUCCESS = 'SOAPBOX_CONFIG_REQUEST_SUCCESS';
 export const SOAPBOX_CONFIG_REQUEST_FAIL    = 'SOAPBOX_CONFIG_REQUEST_FAIL';
@@ -50,20 +51,19 @@ export const defaultConfig = ImmutableMap({
   aboutPages: ImmutableMap(),
 });
 
-export function getSoapboxConfig(state) {
+export const getSoapboxConfig = createSelector([
-  const instance = state.get('instance');
+  state => state.get('soapbox'),
-  const soapbox = state.get('soapbox');
+  state => getFeatures(state.get('instance')).emojiReactsRGI,
-  const features = getFeatures(instance);
+], (soapbox, emojiReactsRGI) => {
-
   // https://git.pleroma.social/pleroma/pleroma/-/issues/2355
-  if (features.emojiReactsRGI) {
+  if (emojiReactsRGI) {
     return defaultConfig
       .set('allowedEmoji', allowedEmojiRGI)
       .merge(soapbox);
   } else {
     return defaultConfig.merge(soapbox);
   }
-}
+});
 
 export function fetchSoapboxConfig() {
   return (dispatch, getState) => {

app/soapbox/features/chats/components/chat_panes.js

@@ -10,18 +10,39 @@ import { openChat, toggleMainWindow } from 'soapbox/actions/chats';
 import ChatWindow from './chat_window';
 import { shortNumberFormat } from 'soapbox/utils/numbers';
 import AudioToggle from 'soapbox/features/chats/components/audio_toggle';
+import { List as ImmutableList } from 'immutable';
+import { createSelector } from 'reselect';
 
-const mapStateToProps = state => {
+const getChatsUnreadCount = state => {
-  const settings = getSettings(state);
+  const chats = state.get('chats');
-
+  return chats.reduce((acc, curr) => acc + Math.min(curr.get('unread', 0), 1), 0);
-  return {
-    panes: settings.getIn(['chats', 'panes']),
-    mainWindowState: settings.getIn(['chats', 'mainWindow']),
-    unreadCount: state.get('chats').reduce((acc, curr) => acc + Math.min(curr.get('unread', 0), 1), 0),
-  };
 };
 
-export default @connect(mapStateToProps)
+// Filter out invalid chats
+const normalizePanes = (chats, panes = ImmutableList()) => (
+  panes.filter(pane => chats.get(pane.get('chat_id')))
+);
+
+const makeNormalizeChatPanes = () => createSelector([
+  state => state.get('chats'),
+  state => getSettings(state).getIn(['chats', 'panes']),
+], normalizePanes);
+
+const makeMapStateToProps = () => {
+  const mapStateToProps = state => {
+    const normalizeChatPanes = makeNormalizeChatPanes();
+
+    return {
+      panes: normalizeChatPanes(state),
+      mainWindowState: getSettings(state).getIn(['chats', 'mainWindow']),
+      unreadCount: getChatsUnreadCount(state),
+    };
+  };
+
+  return mapStateToProps;
+};
+
+export default @connect(makeMapStateToProps)
 class ChatPanes extends ImmutablePureComponent {
 
   static propTypes = {

app/soapbox/utils/features.js

@@ -1,10 +1,12 @@
 // Detect backend features to conditionally render elements
 import gte from 'semver/functions/gte';
 import { List as ImmutableList } from 'immutable';
+import { createSelector } from 'reselect';
 
-export const getFeatures = instance => {
+export const getFeatures = createSelector([
-  const v = parseVersion(instance.get('version'));
+  instance => parseVersion(instance.get('version')),
-  const f = instance.getIn(['pleroma', 'metadata', 'features'], ImmutableList());
+  instance => instance.getIn(['pleroma', 'metadata', 'features'], ImmutableList()),
+], (v, f) => {
   return {
     suggestions: v.software === 'Mastodon' && gte(v.compatVersion, '2.4.3'),
     trends: v.software === 'Mastodon' && gte(v.compatVersion, '3.0.0'),
@@ -15,7 +17,7 @@ export const getFeatures = instance => {
     importMutes: v.software === 'Pleroma' && gte(v.version, '2.2.0'),
     emailList: f.includes('email_list'),
   };
-};
+});
 
 export const parseVersion = version => {
   let regex = /^([\w\.]*)(?: \(compatible; ([\w]*) (.*)\))?$/;