weechatRN

Weechat relay client for iOS using websockets https://github.com/mhoran/weechatRN
git clone http://git.hanabi.in/repos/weechatRN.git
Log | Files | Refs | README | LICENSE

BufferListItem.tsx (2288B)

      1 import * as React from 'react';
      2 import {
      3   StyleSheet,
      4   Text,
      5   TextStyle,
      6   TouchableHighlight,
      7   View
      8 } from 'react-native';
      9 
     10 interface Props {
     11   buffer: WeechatBuffer;
     12   hotlist: Hotlist;
     13   currentBufferId: string | null;
     14   onSelectBuffer: (b: WeechatBuffer) => void;
     15 }
     16 
     17 export default class BufferListItem extends React.Component<Props> {
     18   getBufferViewStyleFromProps = (): TextStyle | null => {
     19     const { currentBufferId, buffer, hotlist } = this.props;
     20 
     21     if (currentBufferId === buffer.id) {
     22       return { backgroundColor: '#f2777a' };
     23     } else if (hotlist.highlight > 0) {
     24       return { backgroundColor: '#ffcf7f' };
     25     } else if (hotlist.sum > 0) {
     26       return { backgroundColor: '#3b4252' };
     27     } else {
     28       return null;
     29     }
     30   };
     31 
     32   getBufferTextStyleFromProps = (): TextStyle | null => {
     33     const { currentBufferId, buffer, hotlist } = this.props;
     34 
     35     if (currentBufferId === buffer.id) {
     36       return { color: '#fff' };
     37     } else if (hotlist.highlight > 0) {
     38       return { color: '#000' };
     39     } else if (hotlist.sum > 0) {
     40       return { color: '#ebcb8b' };
     41     } else {
     42       return null;
     43     }
     44   };
     45 
     46   render(): JSX.Element {
     47     const { buffer, hotlist, onSelectBuffer } = this.props;
     48 
     49     return (
     50       <TouchableHighlight
     51         onPress={() => onSelectBuffer(buffer)}
     52         underlayColor="#F2777A"
     53         style={[styles.listItem, this.getBufferViewStyleFromProps()]}
     54       >
     55         <View style={styles.row}>
     56           <View style={styles.bufferName}>
     57             <Text
     58               style={[styles.listItemText, this.getBufferTextStyleFromProps()]}
     59             >
     60               {buffer.short_name || buffer.full_name}
     61             </Text>
     62           </View>
     63           {hotlist.sum > 0 && (
     64             <Text
     65               style={[styles.listItemText, this.getBufferTextStyleFromProps()]}
     66             >
     67               {hotlist.sum}
     68             </Text>
     69           )}
     70         </View>
     71       </TouchableHighlight>
     72     );
     73   }
     74 }
     75 
     76 const styles = StyleSheet.create({
     77   listItem: {
     78     flex: 1,
     79     height: 40,
     80     paddingHorizontal: 20,
     81     justifyContent: 'center'
     82   },
     83   listItemText: {
     84     color: '#eee',
     85     fontFamily: 'Thonburi',
     86     fontWeight: 'bold',
     87     fontSize: 15
     88   },
     89   row: {
     90     flexDirection: 'row'
     91   },
     92   bufferName: {
     93     flex: 1
     94   }
     95 });