From e069bf1bc1f962bf9d4acf630619b511b5548d44 Mon Sep 17 00:00:00 2001
From: Nikhil Nayak <iamnikhilnayak@outlook.com>
Date: Mon, 16 Apr 2018 20:06:36 +0530
Subject: [PATCH] topics: Fix failure to load from offline state.

This fix first checks for the online status in TopicListScreen, and if
found to be online, renders TopicList, which houses all the Redux logic
and the call to Selectors that were originally in TopicListScreen.

Fixes #2310
---
 src/streams/TopicItem.js      |  2 +-
 src/topics/TopicList.js       | 32 ++++++++++++++++++++++++++------
 src/topics/TopicListScreen.js | 28 ++++++----------------------
 3 files changed, 33 insertions(+), 29 deletions(-)

diff --git a/src/streams/TopicItem.js b/src/streams/TopicItem.js
index f1084b47816..56f5f9e1bf3 100644
--- a/src/streams/TopicItem.js
+++ b/src/streams/TopicItem.js
@@ -32,7 +32,7 @@ type Props = {
   isMuted: boolean,
   isSelected: boolean,
   unreadCount: number,
-  onPress: (topic: string, stream: string) => void,
+  onPress: (stream: string, topic: string) => void,
 };
 
 export default class StreamItem extends PureComponent<Props> {
diff --git a/src/topics/TopicList.js b/src/topics/TopicList.js
index a057a4d3e75..d6ddd39b866 100644
--- a/src/topics/TopicList.js
+++ b/src/topics/TopicList.js
@@ -2,7 +2,11 @@
 import React, { PureComponent } from 'react';
 import { FlatList, StyleSheet } from 'react-native';
 
-import type { TopicDetails } from '../types';
+import type { Actions, Stream, TopicDetails } from '../types';
+import connectWithActions from '../connectWithActions';
+import { getStreamEditInitialValues } from '../subscriptions/subscriptionSelectors';
+import { topicNarrow } from '../utils/narrow';
+import { getTopicsInScreen } from '../selectors';
 import TopicItem from '../streams/TopicItem';
 import { LoadingIndicator, SectionSeparatorBetween, SearchEmptyState } from '../common';
 
@@ -14,13 +18,19 @@ const styles = StyleSheet.create({
 });
 
 type Props = {
-  topics: ?(TopicDetails[]),
-  onPress: (stream: string, topic: string) => void,
+  actions: Actions,
+  stream: Stream,
+  topics: TopicDetails[],
 };
 
-export default class TopicList extends PureComponent<Props> {
+class TopicList extends PureComponent<Props> {
   props: Props;
 
+  componentDidMount() {
+    const { actions, stream } = this.props;
+    actions.fetchTopics(stream.stream_id);
+  }
+
   static defaultProps = {
     showDescriptions: false,
     showSwitch: false,
@@ -28,8 +38,13 @@ export default class TopicList extends PureComponent<Props> {
     streams: [],
   };
 
+  handlePress = (streamObj: string, topic: string) => {
+    const { actions, stream } = this.props;
+    actions.doNarrow(topicNarrow(stream.name, topic));
+  };
+
   render() {
-    const { topics, onPress } = this.props;
+    const { topics } = this.props;
 
     if (!topics) {
       return <LoadingIndicator size={40} />;
@@ -45,10 +60,15 @@ export default class TopicList extends PureComponent<Props> {
         data={topics}
         keyExtractor={item => item.name}
         renderItem={({ item }) => (
-          <TopicItem name={item.name} isMuted={false} unreadCount={0} onPress={onPress} />
+          <TopicItem name={item.name} isMuted={false} unreadCount={0} onPress={this.handlePress} />
         )}
         SectionSeparatorComponent={SectionSeparatorBetween}
       />
     );
   }
 }
+
+export default connectWithActions(state => ({
+  stream: getStreamEditInitialValues(state),
+  topics: getTopicsInScreen(state),
+}))(TopicList);
diff --git a/src/topics/TopicListScreen.js b/src/topics/TopicListScreen.js
index aabe5a4e9a2..6151dfb32e8 100644
--- a/src/topics/TopicListScreen.js
+++ b/src/topics/TopicListScreen.js
@@ -1,45 +1,29 @@
 /* @flow */
 import React, { PureComponent } from 'react';
 
-import type { Actions, Stream, TopicDetails } from '../types';
 import connectWithActions from '../connectWithActions';
-import { Screen } from '../common';
-import { topicNarrow } from '../utils/narrow';
-import { getTopicsInScreen } from '../selectors';
-import { getStreamEditInitialValues } from '../subscriptions/subscriptionSelectors';
+import { LoadingIndicator, Screen } from '../common';
+import { getSession } from '../selectors';
 import TopicList from './TopicList';
 
 type Props = {
-  actions: Actions,
-  stream: Stream,
-  topics: TopicDetails[],
+  isOnline: boolean,
 };
 
 class TopicListScreen extends PureComponent<Props> {
   props: Props;
 
-  componentDidMount() {
-    const { actions, stream } = this.props;
-    actions.fetchTopics(stream.stream_id);
-  }
-
-  handlePress = (streamObj: string, topic: string) => {
-    const { actions, stream } = this.props;
-    actions.doNarrow(topicNarrow(stream.name, topic));
-  };
-
   render() {
-    const { topics } = this.props;
+    const { isOnline } = this.props;
 
     return (
       <Screen title="Topics" padding>
-        <TopicList topics={topics} onPress={this.handlePress} />
+        {isOnline ? <TopicList /> : <LoadingIndicator size={40} />}
       </Screen>
     );
   }
 }
 
 export default connectWithActions(state => ({
-  stream: getStreamEditInitialValues(state),
-  topics: getTopicsInScreen(state),
+  isOnline: getSession(state).isOnline,
 }))(TopicListScreen);