ChatItem.js 2.66 KB

import { useState } from 'react';
import {post} from 'axios'
import {Dimensions, View,Text,Image,StyleSheet,TouchableOpacity,Modal,TouchableHighlight,Alert} from 'react-native'
import * as React from 'react'
import moment from 'moment'
import Star from '../assets/star.svg'
import Options from '../assets/Options.svg'

export default ({ item,navigation,keyword}) => {

    const [visible,setVisible] = React.useState(true)
    React.useEffect(() => {
        if(keyword) {
            if(item.title.indexOf(keyword)>=0 || item.Message.filter((e,i) => {return e.indexOf(keyword) >= 0}).length > 0) {
                setVisible(true)
            }
            else {
                setVisible(false)
            }
        }
        if(!keyword) {
            setVisible(true)
        }
    },[keyword])
    return (
        <View>
        {visible?
        <TouchableOpacity onPress={() => navigation.navigate("ChatRoom")} style={{backgroundColor:"white"}}>
            <View style={{width:"100%",paddingTop:16,paddingBottom:15.3,borderBottomColor:"#BCBCBD",borderBottomWidth:1}}>
                <View style={{flexDirection:"row"}}>
                    <View style={{justifyContent:"center"}}>
                        <Image style={{width:45,height:45,marginRight:31,marginLeft:32}} source={require('../assets/img.png')}/>
                    </View>
                    <View style={{marginTop:7}}>
                        <Text style={{fontSize:12,color:"black",marginBottom:9}}>
                            {item.title}
                        </Text>
                        <Text style={{fontSize:12,color:"#615F5F"}}>
                            {item.Message[item.Message.length-1]}
                        </Text>
                    </View>
                    <View style={{marginLeft:"auto"}}>
                        <Text style={{fontSize:9,color:"#979292"}}>
                            12 21
                        </Text>
                    </View>
                </View>
                <View style={{flexDirection:"row",marginLeft:"auto"}}>
                    <Star style={{alignSelf:"center"}}/>
                    <Star style={{alignSelf:"center"}}/>
                    <Star style={{alignSelf:"center"}}/>
                    <Star style={{alignSelf:"center"}}/>
                    <Star style={{alignSelf:"center"}}/>
                    <Text style={{marginLeft:8,color:"#615F5F",fontSize:11}}>
                        4.5
                    </Text>
                </View>
            </View>
        </TouchableOpacity>:undefined}
        </View>
    )
}

const style = StyleSheet.create({
    text:{
        color:"#707070",
        fontSize:11,
        fontWeight:"900"
    }
})