WIP: Something to play with on iOS, for navigation.

src/nav/navActions.js

@@ -10,10 +10,9 @@ import type {
   UserOrBot,
   ApiResponseServerSettings,
 } from '../types';
-import { getSameRoutesCount } from '../selectors';
 
 export const navigateBack = () => (dispatch: Dispatch, getState: GetState): NavigationAction =>
-  dispatch(StackActions.pop({ n: getSameRoutesCount(getState()) }));
+  dispatch(StackActions.pop({}));
 
 // Other stack routes reached through `navReducer`:
 //    StackActions.push({ routeName: 'loading' });
@@ -25,6 +24,8 @@ export const navigateBack = () => (dispatch: Dispatch, getState: GetState): Navi
 export const navigateToChat = (narrow: Narrow): NavigationAction =>
   StackActions.push({ routeName: 'chat', params: { narrow } });
 
+export const navigatePopToTop = (): NavigationAction => StackActions.popToTop({});
+
 export const navigateToUsersScreen = (): NavigationAction =>
   StackActions.push({ routeName: 'users' });
 

src/title-buttons/ExtraNavButtonStream.js

@@ -6,7 +6,7 @@ import type { Dispatch, Narrow, Stream } from '../types';
 import { connect } from '../react-redux';
 import { getStreams } from '../selectors';
 import NavButton from '../nav/NavButton';
-import { navigateToTopicList } from '../actions';
+import { navigatePopToTop } from '../nav/navActions';
 
 type Props = $ReadOnly<{|
   dispatch: Dispatch,
@@ -17,17 +17,13 @@ type Props = $ReadOnly<{|
 
 class ExtraNavButtonStream extends PureComponent<Props> {
   handlePress = () => {
-    const { dispatch, narrow, streams } = this.props;
-    const stream = streams.find(x => x.name === narrow[0].operand);
-    if (stream) {
-      dispatch(navigateToTopicList(stream.stream_id));
-    }
+    this.props.dispatch(navigatePopToTop());
   };
 
   render() {
     const { color } = this.props;
 
-    return <NavButton name="list" color={color} onPress={this.handlePress} />;
+    return <NavButton name="home" color={color} onPress={this.handlePress} />;
   }
 }
 

src/title-buttons/ExtraNavButtonTopic.js

@@ -5,9 +5,8 @@ import React, { PureComponent } from 'react';
 import type { Dispatch, Narrow, Stream } from '../types';
 import { connect } from '../react-redux';
 import { getStreams } from '../selectors';
-import { streamNarrow } from '../utils/narrow';
 import NavButton from '../nav/NavButton';
-import { doNarrow } from '../actions';
+import { navigatePopToTop } from '../nav/navActions';
 
 type Props = $ReadOnly<{|
   dispatch: Dispatch,
@@ -18,17 +17,13 @@ type Props = $ReadOnly<{|
 
 class ExtraNavButtonTopic extends PureComponent<Props> {
   handlePress = () => {
-    const { dispatch, narrow, streams } = this.props;
-    const stream = streams.find(x => x.name === narrow[0].operand);
-    if (stream) {
-      dispatch(doNarrow(streamNarrow(stream.name)));
-    }
+    this.props.dispatch(navigatePopToTop());
   };
 
   render() {
     const { color } = this.props;
 
-    return <NavButton name="arrow-up" color={color} onPress={this.handlePress} />;
+    return <NavButton name="home" color={color} onPress={this.handlePress} />;
   }
 }
 

src/title-buttons/InfoNavButtonStream.js

@@ -6,7 +6,7 @@ import type { Dispatch, Narrow, Stream } from '../types';
 import { connect } from '../react-redux';
 import { getStreams } from '../selectors';
 import NavButton from '../nav/NavButton';
-import { navigateToStream } from '../actions';
+import { navigateToTopicList } from '../actions';
 
 type Props = $ReadOnly<{|
   dispatch: Dispatch,
@@ -20,14 +20,14 @@ class InfoNavButtonStream extends PureComponent<Props> {
     const { dispatch, narrow, streams } = this.props;
     const stream = streams.find(x => x.name === narrow[0].operand);
     if (stream) {
-      dispatch(navigateToStream(stream.stream_id));
+      dispatch(navigateToTopicList(stream.stream_id));
     }
   };
 
   render() {
     const { color } = this.props;
 
-    return <NavButton name="info" color={color} onPress={this.handlePress} />;
+    return <NavButton name="list" color={color} onPress={this.handlePress} />;
   }
 }
 

src/title/TitleStream.js

@@ -1,7 +1,7 @@
 /* @flow strict-local */
 
 import React, { PureComponent } from 'react';
-import { StyleSheet, Text, View, TouchableWithoutFeedback } from 'react-native';
+import { StyleSheet, Text, View, TouchableWithoutFeedback, TouchableOpacity } from 'react-native';
 
 import type { Narrow, Stream, Subscription, Dispatch } from '../types';
 import { connect } from '../react-redux';
@@ -10,6 +10,7 @@ import { isTopicNarrow } from '../utils/narrow';
 import { getStreamInNarrow } from '../selectors';
 import styles from '../styles';
 import { showToast } from '../utils/info';
+import { navigateToStream } from '../actions';
 
 type SelectorProps = {|
   stream: Subscription | {| ...Stream, in_home_view: boolean |},
@@ -37,11 +38,18 @@ class TitleStream extends PureComponent<Props> {
     },
   });
 
+  handlePress = () => {
+    const { dispatch, stream } = this.props;
+    if (stream) {
+      dispatch(navigateToStream(stream.stream_id));
+    }
+  };
+
   render() {
     const { narrow, stream, color } = this.props;
 
     return (
-      <View style={this.styles.outer}>
+      <TouchableOpacity onPress={this.handlePress} style={this.styles.outer}>
         <View style={this.styles.streamRow}>
           <StreamIcon
             style={styles.halfMarginRight}
@@ -65,7 +73,7 @@ class TitleStream extends PureComponent<Props> {
             </Text>
           </TouchableWithoutFeedback>
         )}
-      </View>
+      </TouchableOpacity>
     );
   }
 }