connect: Demonstrate SelectorProps pattern.

This is the one kind of annotation we do need at some call sites
of `connect`.  Specifically:
 * when `mapStateToProps` actually takes a `props` parameter,
 * we need to annotate its *return* type, as here.

Before merging the Flow upgrade, we'll need to do the same thing on
the other call sites.  Fortunately that shouldn't be much work.

Author: gnprice

src/chat/UnreadNotice.js

@@ -30,11 +30,16 @@ const styles = StyleSheet.create({
   },
 });
 
+type SelectorProps = {|
+  unreadCount: number,
+|};
+
 type Props = {|
-  dispatch: Dispatch,
   limited: boolean,
   narrow: Narrow,
-  unreadCount: number,
+
+  dispatch: Dispatch,
+  ...SelectorProps,
 |};
 
 class UnreadNotice extends PureComponent<Props> {
@@ -65,6 +70,6 @@ class UnreadNotice extends PureComponent<Props> {
   }
 }
 
-export default connect((state, props) => ({
+export default connect((state, props): SelectorProps => ({
   unreadCount: getUnreadCountForNarrow(state, props.narrow),
 }))(UnreadNotice);

src/compose/ComposeBox.js

@@ -12,7 +12,6 @@ import type {
   UserOrBot,
   Dispatch,
   Dimensions,
-  GlobalState,
 } from '../types';
 import { connect } from '../react-redux';
 import {
@@ -47,18 +46,22 @@ import { getDraftForNarrow } from '../drafts/draftsSelectors';
 import TopicAutocomplete from '../autocomplete/TopicAutocomplete';
 import AutocompleteView from '../autocomplete/AutocompleteView';
 
-type Props = {|
+type SelectorProps = {|
   auth: Auth,
-  narrow: Narrow,
   usersByEmail: Map<string, UserOrBot>,
-  draft: string,
-  lastMessageTopic: string,
+  safeAreaInsets: Dimensions,
   isAdmin: boolean,
   isAnnouncementOnly: boolean,
   isSubscribed: boolean,
   editMessage: ?EditMessage,
-  safeAreaInsets: Dimensions,
+  draft: string,
+  lastMessageTopic: string,
+|};
+
+type Props = {|
+  narrow: Narrow,
   dispatch: Dispatch,
+  ...SelectorProps,
 |};
 
 type State = {|
@@ -402,7 +405,7 @@ class ComposeBox extends PureComponent<Props, State> {
   }
 }
 
-export default connect((state: GlobalState, props) => ({
+export default connect((state, props): SelectorProps => ({
   auth: getAuth(state),
   usersByEmail: getActiveUsersByEmail(state),
   safeAreaInsets: getSession(state).safeAreaInsets,

src/nav/ChatNavBar.js

@@ -3,7 +3,7 @@
 import React, { PureComponent } from 'react';
 import { View } from 'react-native';
 
-import type { Dispatch, GlobalState, Narrow } from '../types';
+import type { Dispatch, Narrow } from '../types';
 import { connect } from '../react-redux';
 import styles, { BRAND_COLOR } from '../styles';
 import Title from '../title/Title';
@@ -13,10 +13,15 @@ import { foregroundColorFromBackground } from '../utils/color';
 import { navigateBack } from '../actions';
 import { ExtraButton, InfoButton } from '../title-buttons/titleButtonFromNarrow';
 
-type Props = {|
-  dispatch: Dispatch,
+type SelectorProps = {|
   backgroundColor: string,
+|};
+
+type Props = {|
   narrow: Narrow,
+
+  dispatch: Dispatch,
+  ...SelectorProps,
 |};
 
 class ChatNavBar extends PureComponent<Props> {
@@ -44,6 +49,6 @@ class ChatNavBar extends PureComponent<Props> {
   }
 }
 
-export default connect((state: GlobalState, props) => ({
+export default connect((state, props): SelectorProps => ({
   backgroundColor: getTitleBackgroundColor(props.narrow)(state),
 }))(ChatNavBar);