NotificaitonView.js 2.75 KB
Newer Older
Giang Tran committed
1
import React, {useState} from 'react';
Giang Tran committed
2 3 4 5 6 7 8 9
import {
  View,
  Text,
  FlatList,
  StyleSheet,
  TouchableOpacity,
  ScrollView,
} from 'react-native';
Giang Tran committed
10

Giang Tran committed
11
import HeaderDrawer from '../../components/Header/HeaderDrawer';
Giang Tran committed
12
import Item from './Item';
Giang Tran committed
13
import {getFontXD} from '../../Config/Functions';
Giang Tran committed
14
import AppText from '../../components/AppText';
Giang Tran committed
15 16 17 18

const Fillters = [
  {
    id: '1',
Giang Tran committed
19
    name: 'All',
Giang Tran committed
20
    value: 'ALL',
Giang Tran committed
21 22 23
  },
  {
    id: '2',
Giang Tran committed
24
    name: 'Deposit',
Giang Tran committed
25
    value: 'DEPOSIT',
Giang Tran committed
26 27 28
  },
  {
    id: '3',
Giang Tran committed
29
    name: 'Withdraw',
Giang Tran committed
30
    value: 'WITHDRAW',
Giang Tran committed
31
  },
32 33
  {
    id: '4',
Giang Tran committed
34
    name: 'Transfer',
35 36
    value: 'TRANSFER',
  },
Giang Tran committed
37
];
Giang Tran committed
38 39

const NotificaitonView = (props) => {
Giang Tran committed
40
  const {onRefresh, isRefresh, onLoadMore, setFillters, fillter, data} = props;
Giang Tran committed
41

Giang Tran committed
42
  return (
Giang Tran committed
43
    <View style={{flex: 1}}>
Giang Tran committed
44
      <HeaderDrawer isWhite={true} title={'Notification'} />
Giang Tran committed
45

Giang Tran committed
46
      <View style={styles.headerContainer}>
Giang Tran committed
47 48 49 50 51
        <ScrollView horizontal showsHorizontalScrollIndicator={false}>
          {Fillters.map((e) => (
            <TouchableOpacity
              key={e.value}
              onPress={() => setFillters(e.value)}
Giang Tran committed
52
              style={[
Giang Tran committed
53 54
                styles.itemFillter,
                fillter == e.value ? {borderColor: '#1473E6'} : null,
Giang Tran committed
55
              ]}>
Giang Tran committed
56 57
              <AppText
                i18nKey={e.name}
Giang Tran committed
58 59 60
                style={[
                  styles.txtFillter,
                  fillter == e.value ? {color: '#1473E6'} : {},
Giang Tran committed
61
                ]}></AppText>
Giang Tran committed
62 63 64
            </TouchableOpacity>
          ))}
        </ScrollView>
Giang Tran committed
65
      </View>
Giang Tran committed
66

67 68
      {data.length == 0 ? (
        <View style={{justifyContent: 'center', alignItems: 'center', flex: 1}}>
Giang Tran committed
69 70
          <AppText
            i18nKey={'NoData'}
71
            style={{
Giang Tran committed
72
              fontSize: 18,
73
              fontWeight: 'bold',
Giang Tran committed
74
            }}></AppText>
75 76 77 78 79 80 81 82 83 84 85 86 87 88
        </View>
      ) : (
        <FlatList
          keyExtractor={(item) => item.id}
          data={data}
          refreshing={isRefresh}
          onRefresh={onRefresh}
          onEndReachedThreshold={0.01}
          onEndReached={(info) => {
            onLoadMore();
          }}
          renderItem={({item}) => <Item item={item} />}
        />
      )}
Giang Tran committed
89 90 91 92
    </View>
  );
};

Giang Tran committed
93 94 95 96
const styles = StyleSheet.create({
  headerContainer: {
    paddingVertical: 10,
    backgroundColor: 'white',
Giang Tran committed
97 98
    flexDirection: 'row',
    alignItems: 'center',
99
    paddingHorizontal: 10,
Giang Tran committed
100 101 102 103 104 105 106
  },
  itemFillter: {
    borderRadius: 10,
    paddingVertical: 5,
    paddingHorizontal: 10,
    borderWidth: 1,
    borderColor: '#929292',
Giang Tran committed
107 108
    justifyContent: 'center',
    alignItems: 'center',
Giang Tran committed
109
    marginRight: 10,
Giang Tran committed
110 111 112 113
  },
  txtFillter: {
    fontSize: getFontXD(36),
    color: '#929292',
Giang Tran committed
114
    fontWeight: 'bold',
Giang Tran committed
115
  },
116 117 118 119
  txtTitle: {
    fontSize: getFontXD(46),
    fontWeight: 'bold',
  },
Giang Tran committed
120 121
});

Giang Tran committed
122
export default NotificaitonView;