weechatRN

commit bdf45f88ea03a897420273400c567bda07dfe755
parent 05a35bd190288fc546486f9c1956b75799ce4690
Author: Matthew Horan <matt@matthoran.com>
Date:   Mon, 21 Jan 2019 10:40:32 -0500

Connect BufferList to store instead of BufferListItem

We'll need access to hotlists in BufferList to determine whether a
server buffer should be hidden.

Diffstat:
M
src/usecase/buffers/ui/BufferList.tsx
 | 
19
+++++++++++++------
M
src/usecase/buffers/ui/BufferListItem.tsx
 | 
114
++++++++++++++++++++++++++++++++++++++-----------------------------------------

2 files changed, 68 insertions(+), 65 deletions(-)
diff --git a/src/usecase/buffers/ui/BufferList.tsx b/src/usecase/buffers/ui/BufferList.tsx
@@ -1,37 +1,40 @@
 import * as React from "react";
+import { connect } from "react-redux";
 import {
   StyleSheet,
-  Dimensions,
-  Text,
-  TouchableHighlight,
   FlatList,
   View,
   ListRenderItem
 } from "react-native";
 import BufferListItem from "./BufferListItem";
+import { StoreState } from "../../../store";
+import { getHotlistForBufferId } from "../../../store/selectors";
+import { HotListState } from '../../../store/hotlists';
 
 interface Props {
   buffers: WeechatBuffer[];
   currentBufferId: string | null;
   onSelectBuffer: (b: WeechatBuffer) => any;
+  hotlists: HotListState;
 }
 
 const keyExtractor = (buffer: WeechatBuffer): string => buffer.id;
 
-export default class BufferList extends React.Component<Props> {
+class BufferList extends React.Component<Props> {
   renderListItem: ListRenderItem<WeechatBuffer> = ({ item }) => {
-    const { onSelectBuffer, currentBufferId } = this.props;
+    const { onSelectBuffer, currentBufferId, hotlists } = this.props;
 
     return (
       <BufferListItem
         buffer={item}
         onSelectBuffer={onSelectBuffer}
         currentBufferId={currentBufferId}
+        hotlist={getHotlistForBufferId(hotlists, item.id)}
       />
     );
   };
   render() {
-    const { buffers, onSelectBuffer, currentBufferId } = this.props;
+    const { buffers } = this.props;
 
     return (
       <View style={styles.container}>
@@ -47,6 +50,10 @@ export default class BufferList extends React.Component<Props> {
   }
 }
 
+export default connect((state: StoreState) => ({
+  hotlists: state.hotlists
+}))(BufferList);
+
 const styles = StyleSheet.create({
   container: {
     flex: 1,
diff --git a/src/usecase/buffers/ui/BufferListItem.tsx b/src/usecase/buffers/ui/BufferListItem.tsx
@@ -1,16 +1,10 @@
 import * as React from "react";
-import { connect } from "react-redux";
 import {
   StyleSheet,
-  Dimensions,
   Text,
   TouchableHighlight,
-  View,
-  TextStyle,
-  ViewStyle
+  View
 } from "react-native";
-import { StoreState } from "../../../store";
-import { getHotlistForBufferId } from "../../../store/selectors";
 
 interface Props {
   buffer: WeechatBuffer;
@@ -19,63 +13,65 @@ interface Props {
   onSelectBuffer: (b: WeechatBuffer) => any;
 }
 
-const getBufferViewStyleFromProps = (props: Props): ViewStyle => {
-  if (props.currentBufferId === props.buffer.id) {
-    return { backgroundColor: "#f2777a" };
-  } else if (props.hotlist.highlight > 0) {
-    return { backgroundColor: "#ffcf7f" };
-  } else if (props.hotlist.sum > 0) {
-    return { backgroundColor: "#3b4252" };
-  } else {
-    return null;
-  }
-};
+export default class BufferListItem extends React.Component<Props> {
+  getBufferViewStyleFromProps = () => {
+    const { currentBufferId, buffer, hotlist} = this.props;
 
-const getBufferTextStyleFromProps = (props: Props): TextStyle => {
-  if (props.currentBufferId === props.buffer.id) {
-    return { color: "#fff" };
-  } else if (props.hotlist.highlight > 0) {
-    return { color: "#000" };
-  } else if (props.hotlist.sum > 0) {
-    return { color: "#ebcb8b" };
-  } else {
-    return null;
-  }
-};
+    if (currentBufferId === buffer.id) {
+      return { backgroundColor: "#f2777a" };
+    } else if (hotlist.highlight > 0) {
+      return { backgroundColor: "#ffcf7f" };
+    } else if (hotlist.sum > 0) {
+      return { backgroundColor: "#3b4252" };
+    } else {
+      return null;
+    }
+  };
+
+  getBufferTextStyleFromProps = () => {
+    const { currentBufferId, buffer, hotlist} = this.props;
 
-const BufferListItem = (props: Props) => {
-  const { buffer, hotlist, currentBufferId, onSelectBuffer } = props;
-  return (
-    <TouchableHighlight
-      onPress={() => onSelectBuffer(buffer)}
-      underlayColor="#F2777A"
-      style={[styles.listItem, getBufferViewStyleFromProps(props)]}
-    >
-      <View style={styles.row}>
-        <View style={styles.bufferName}>
-          <Text
-            style={[styles.listItemText, getBufferTextStyleFromProps(props)]}
-          >
-            {buffer.short_name || buffer.full_name}
-          </Text>
+    if (currentBufferId === buffer.id) {
+      return { color: "#fff" };
+    } else if (hotlist.highlight > 0) {
+      return { color: "#000" };
+    } else if (hotlist.sum > 0) {
+      return { color: "#ebcb8b" };
+    } else {
+      return null;
+    }
+  };
+
+  render() {
+    const { buffer, hotlist, onSelectBuffer } = this.props;
+
+    return (
+      <TouchableHighlight
+        onPress={() => onSelectBuffer(buffer)}
+        underlayColor="#F2777A"
+        style={[styles.listItem, this.getBufferViewStyleFromProps()]}
+      >
+        <View style={styles.row}>
+          <View style={styles.bufferName}>
+            <Text
+              style={[styles.listItemText, this.getBufferTextStyleFromProps()]}
+            >
+              {buffer.short_name || buffer.full_name}
+            </Text>
+          </View>
+          {hotlist.sum > 0 && (
+            <Text
+              style={[styles.listItemText, this.getBufferTextStyleFromProps()]}
+            >
+              {hotlist.sum}
+            </Text>
+          )}
         </View>
-        {hotlist.sum > 0 && (
-          <Text
-            style={[styles.listItemText, getBufferTextStyleFromProps(props)]}
-          >
-            {hotlist.sum}
-          </Text>
-        )}
-      </View>
-    </TouchableHighlight>
-  );
+      </TouchableHighlight>
+    );
+  }
 };
 
-export default connect((state: StoreState, props: Props) => {
-  const hotlist = getHotlistForBufferId(state.hotlists, props.buffer.id);
-  return { hotlist };
-})(BufferListItem);
-
 const styles = StyleSheet.create({
   listItem: {
     flex: 1,