weechatRN

commit ffb67a1229c95728a25b44fcdf2b5e01a01bf305
parent 221539b0168a29a349bb0d23726873bcf2bced74
Author: Johan Lindskogen <johan.lindskogen@gmail.com>
Date:   Sun,  1 Apr 2018 18:27:43 +0200

Extract styling props

Diffstat:
M
src/usecase/buffers/ui/BufferListItem.tsx
 | 
71
+++++++++++++++++++++++++++++++++++++++++++----------------------------

1 file changed, 43 insertions(+), 28 deletions(-)
diff --git a/src/usecase/buffers/ui/BufferListItem.tsx b/src/usecase/buffers/ui/BufferListItem.tsx
@@ -5,7 +5,9 @@ import {
   Text,
   TouchableHighlight,
   FlatList,
-  View
+  View,
+  TextStyle,
+  ViewStyle
 } from "react-native";
 
 interface Props {
@@ -14,34 +16,47 @@ interface Props {
   onSelectBuffer: (b: WeechatBuffer) => any;
 }
 
-export const BufferListItem = ({
-  buffer,
-  currentBufferId,
-  onSelectBuffer
-}: Props) => (
-  <TouchableHighlight
-    onPress={() => onSelectBuffer(buffer)}
-    underlayColor="#F2777A"
-    style={[
-      styles.listItem,
-      currentBufferId === buffer.id ? { backgroundColor: "#F2777A" } : null
-    ]}
-  >
-    <View style={styles.row}>
-      <View style={styles.bufferName}>
-        <Text
-          style={[
-            styles.listItemText,
-            currentBufferId !== buffer.id ? { color: "#888" } : null
-          ]}
-        >
-          {buffer.short_name || buffer.full_name}
-        </Text>
+const getBufferViewStyleFromProps = (props: Props): ViewStyle => {
+  if (props.currentBufferId === props.buffer.id) {
+    return { backgroundColor: "#f2777a" };
+  } else if (false /* highlight */) {
+    return { backgroundColor: "#ffcf7f" };
+  } else {
+    return null;
+  }
+};
+
+const getBufferTextStyleFromProps = (props: Props): TextStyle => {
+  if (props.currentBufferId === props.buffer.id) {
+    return { color: "#fff" };
+  } else if (false /* highlight */) {
+    return { color: "#000" };
+  } else {
+    return null;
+  }
+};
+
+export const BufferListItem = (props: Props) => {
+  const { buffer, 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>
+        </View>
+        <Text style={styles.listItemText}>1</Text>
       </View>
-      <Text style={styles.listItemText}>1</Text>
-    </View>
-  </TouchableHighlight>
-);
+    </TouchableHighlight>
+  );
+};
 
 const styles = StyleSheet.create({
   listItem: {