import React, { createRef, useEffect, useRef, useState } from 'react';
import { TouchableOpacity, View, FlatList, Platform, KeyboardAvoidingView, Dimensions } from 'react-native';
import { MText as Text } from '../../components';
import { observer } from 'mobx-react-lite';
import colors from '../../Styles';
import Swipeable from '../../components/swipeable';
import listChatStore from './ListChatStore';
import appStore from '../AppStore';
import moment from 'moment';
import { Navigation } from 'react-native-navigation';
import Image from 'react-native-fast-image';
import { SafeAreaView } from 'react-native-safe-area-context';
import { formatTimeLastMessage, orderStatus, scale } from '../../utils';
import { MTextInput as TextInput } from '../../components';
import BottomSheetChatOptions from '../../components/bottomSheetChatOptions';
import { BottomSheetModalProvider } from '../../components/bottomSheet/bottom-sheet';
import { toJS } from 'mobx';
import stickerStore from "../chat/StickerStore";
export const ListChatScreen = observer(function ListChatScreen(props) {
  const [showSearch, setShowSearch] = useState(false);
  const bottomSheetModalRef = useRef();
  const [query, setQuery] = useState("");
  const currentSwipe = /*#__PURE__*/createRef();
  useEffect(() => {
    listChatStore.search = '';
    stickerStore.getStickers();
    // intLoad();
    // bottomSheetModalRef.current?.present();
    return () => {
      var _bottomSheetModalRef$;
      (_bottomSheetModalRef$ = bottomSheetModalRef.current) === null || _bottomSheetModalRef$ === void 0 ? void 0 : _bottomSheetModalRef$.dismiss();
    };
  }, []);
  const intLoad = () => {
    listChatStore.page = 0;
    listChatStore.getData({});
  };
  const navigationChat = data => {
    Navigation.push(props.componentId, {
      component: {
        id: 'ChatScreen',
        name: 'ChatScreen',
        passProps: {
          data: data
        },
        options: {
          popGesture: false,
          bottomTabs: {
            visible: false
          },
          topBar: {
            visible: false,
            height: 0
          }
        }
      }
    });
  };
  const getLastMessage = (item, setting, isMe) => {
    var _item$message9;
    const prefix = isMe ? appStore.lang.list_chat.you + ': ' : '';
    try {
      var _item$message, _item$message2, _item$message3, _item$message4, _item$message5, _item$message6;
      if (((_item$message = item.message) === null || _item$message === void 0 ? void 0 : _item$message.type) === 'CREATED_QUOTE_ORDER') {
        return /*#__PURE__*/React.createElement(Text, {
          numberOfLines: 1,
          style: {
            flex: 1,
            fontSize: 15,
            fontWeight: (setting === null || setting === void 0 ? void 0 : setting.unread_count) > 0 ? '600' : '500',
            color: (setting === null || setting === void 0 ? void 0 : setting.unread_count) > 0 ? colors.primaryText : colors.neutralText
          }
        }, appStore.lang.list_chat.message_system);
      }
      if (((_item$message2 = item.message) === null || _item$message2 === void 0 ? void 0 : _item$message2.type) === 'VOICE') {
        return /*#__PURE__*/React.createElement(View, {
          style: {
            flex: 1,
            flexDirection: 'row',
            alignItems: 'center'
          }
        }, /*#__PURE__*/React.createElement(Image, {
          source: require('../../assets/ic_attach_message.png'),
          style: {
            width: 14,
            height: 14,
            resizeMode: 'contain',
            marginRight: 6
          }
        }), /*#__PURE__*/React.createElement(Text, {
          numberOfLines: 1,
          style: {
            fontSize: 15,
            fontWeight: (setting === null || setting === void 0 ? void 0 : setting.unread_count) > 0 ? '600' : '500',
            color: (setting === null || setting === void 0 ? void 0 : setting.unread_count) > 0 ? colors.primaryText : colors.neutralText
          }
        }, prefix + appStore.lang.list_chat.message_voice));
      }
      if (((_item$message3 = item.message) === null || _item$message3 === void 0 ? void 0 : _item$message3.type) === 'LOCATION') {
        return /*#__PURE__*/React.createElement(View, {
          style: {
            flex: 1,
            flexDirection: 'row',
            alignItems: 'center'
          }
        }, /*#__PURE__*/React.createElement(Image, {
          source: require('../../assets/ic_attach_message.png'),
          style: {
            width: 14,
            height: 14,
            resizeMode: 'contain',
            marginRight: 6
          }
        }), /*#__PURE__*/React.createElement(Text, {
          style: {
            fontSize: 15,
            fontWeight: (setting === null || setting === void 0 ? void 0 : setting.unread_count) > 0 ? '600' : '500',
            color: (setting === null || setting === void 0 ? void 0 : setting.unread_count) > 0 ? colors.primaryText : colors.neutralText
          }
        }, prefix + appStore.lang.list_chat.message_location));
      }
      if (((_item$message4 = item.message) === null || _item$message4 === void 0 ? void 0 : _item$message4.type) === 'FILE') {
        return /*#__PURE__*/React.createElement(View, {
          style: {
            flex: 1,
            flexDirection: 'row',
            alignItems: 'center'
          }
        }, /*#__PURE__*/React.createElement(Image, {
          source: require('../../assets/ic_attach_message.png'),
          style: {
            width: 12,
            height: 12,
            resizeMode: 'contain',
            marginRight: 6
          }
        }), /*#__PURE__*/React.createElement(Text, {
          numberOfLines: 1,
          style: {
            flex: 1,
            fontWeight: (setting === null || setting === void 0 ? void 0 : setting.unread_count) > 0 ? '600' : '500',
            color: (setting === null || setting === void 0 ? void 0 : setting.unread_count) > 0 ? colors.primaryText : colors.neutralText
          }
        }, prefix + appStore.lang.list_chat.message_doc));
      }
      if (((_item$message5 = item.message) === null || _item$message5 === void 0 ? void 0 : _item$message5.type) === 'STICKER') {
        return /*#__PURE__*/React.createElement(View, {
          style: {
            flex: 1,
            flexDirection: 'row',
            alignItems: 'center'
          }
        }, /*#__PURE__*/React.createElement(Text, {
          numberOfLines: 1,
          style: {
            flex: 1,
            fontWeight: (setting === null || setting === void 0 ? void 0 : setting.unread_count) > 0 ? '600' : '500',
            color: (setting === null || setting === void 0 ? void 0 : setting.unread_count) > 0 ? colors.primaryText : colors.neutralText
          }
        }, prefix + 'gửi 1 nhãn dán'));
      }
      if ((_item$message6 = item.message) !== null && _item$message6 !== void 0 && _item$message6.has_attachment) {
        var _item$message7, _item$message8;
        return /*#__PURE__*/React.createElement(Text, {
          numberOfLines: 1,
          style: {
            flex: 1,
            fontSize: 15,
            lineHeight: 21,
            fontWeight: (setting === null || setting === void 0 ? void 0 : setting.unread_count) > 0 ? '600' : '500',
            color: (setting === null || setting === void 0 ? void 0 : setting.unread_count) > 0 ? colors.primaryText : colors.neutralText
          }
        }, prefix + (isMe ? `Bạn đã gửi ${(_item$message7 = item.message) === null || _item$message7 === void 0 ? void 0 : _item$message7.attachment_ids.length} ảnh/video` : `Bạn đã nhận ${(_item$message8 = item.message) === null || _item$message8 === void 0 ? void 0 : _item$message8.attachment_ids.length} ảnh/video`));
      }
    } catch (e) {}
    return /*#__PURE__*/React.createElement(Text, {
      numberOfLines: 1,
      style: {
        flex: 1,
        fontSize: 15,
        fontWeight: (setting === null || setting === void 0 ? void 0 : setting.unread_count) > 0 ? '600' : '500',
        color: (setting === null || setting === void 0 ? void 0 : setting.unread_count) > 0 ? colors.primaryText : colors.neutralText
      }
    }, prefix + ((_item$message9 = item.message) === null || _item$message9 === void 0 ? void 0 : _item$message9.text));
  };
  const renderItem = _ref => {
    let {
      item,
      index
    } = _ref;
    let setting = {};
    try {
      var _item$settings;
      let mySetting = (_item$settings = item.settings) === null || _item$settings === void 0 ? void 0 : _item$settings.find(i => i.user_id === appStore.user.type + '_' + appStore.user.user_id);
      setting = mySetting ? mySetting : {};
    } catch (e) {}
    let receiver = {};
    let isMe = false;
    try {
      var _item$message10;
      isMe = appStore.user.type + '_' + appStore.user.user_id === ((_item$message10 = item.message) === null || _item$message10 === void 0 ? void 0 : _item$message10.sender);
      receiver = item.detail_participants.find(i => i.user_id !== appStore.user.user_id);
    } catch (e) {}
    const rightButtons = [/*#__PURE__*/React.createElement(TouchableOpacity, {
      onPress: () => {
        if (setting.is_pin) {
          listChatStore.unPin({
            conversation_id: item._id
          }, () => {
            try {
              item.settings = item.settings.map(i => {
                i.is_pin = false;
                return i;
              });
            } catch (e) {}
            listChatStore.data = [item, ...listChatStore.data];
            listChatStore.dataPin = [...listChatStore.dataPin.filter(i => i._id !== item._id)];
            listChatStore.data = [...listChatStore.data];
          });
        } else {
          listChatStore.pin({
            conversation_id: item._id
          }, () => {
            try {
              item.settings = item.settings.map(i => {
                i.is_pin = true;
                return i;
              });
            } catch (e) {}
            listChatStore.dataPin = [item, ...listChatStore.dataPin];
            listChatStore.data = [...listChatStore.data.filter(i => i._id !== item._id)];
            listChatStore.dataPin = [...listChatStore.dataPin];
          });
        }
      },
      style: {
        width: 66,
        justifyContent: 'center',
        alignItems: 'center',
        backgroundColor: '#3B7CEC',
        flex: 1
      }
    }, /*#__PURE__*/React.createElement(Image, {
      resizeMode: 'contain',
      source: setting.is_pin ? require('../../assets/ic_unpin.png') : require('../../assets/ic_pin_white.png'),
      style: {
        width: 20,
        height: 20,
        resizeMode: 'contain'
      }
    }), /*#__PURE__*/React.createElement(Text, {
      style: {
        color: 'white',
        fontSize: 13,
        fontWeight: '500',
        backgroundColor: 'transparent',
        textAlign: 'center',
        paddingTop: 4
      }
    }, setting.is_pin ? appStore.lang.list_chat.unpin : appStore.lang.list_chat.pin)), /*#__PURE__*/React.createElement(TouchableOpacity, {
      onPress: () => {
        try {
          listChatStore.mute({
            conversation_id: item._id,
            is_show: !setting.is_hide_notification
          }, () => {
            var _item$settings2;
            item.settings = (_item$settings2 = item.settings) === null || _item$settings2 === void 0 ? void 0 : _item$settings2.map(i => {
              i.is_hide_notification = !i.is_hide_notification;
              return i;
            });
            listChatStore.data = [...listChatStore.data];
            //   item.settings = item.settings.map(i=>{
            //     i.is_pin = true;
            //     return i
            //   })
            // listChatStore.data = [...listChatStore.data]
          });
        } catch (e) {}
      },
      style: {
        width: 66,
        justifyContent: 'center',
        alignItems: 'center',
        backgroundColor: '#EB960A',
        flex: 1
      }
    }, /*#__PURE__*/React.createElement(Image, {
      resizeMode: 'contain',
      source: !setting.is_hide_notification ? require('../../assets/ic_notify_off.png') : require('../../assets/ic_notify.png'),
      style: {
        width: 24,
        height: 24,
        resizeMode: 'contain'
      }
    }), /*#__PURE__*/React.createElement(Text, {
      style: {
        color: 'white',
        fontSize: 13,
        backgroundColor: 'transparent',
        textAlign: 'center',
        fontWeight: '500',
        paddingTop: 4
      }
    }, setting.is_hide_notification ? appStore.lang.list_chat.unmute : appStore.lang.list_chat.mute)), /*#__PURE__*/React.createElement(TouchableOpacity, {
      onPress: () => {
        listChatStore.hide({
          conversation_id: item._id
        }, () => intLoad());
      },
      style: {
        width: 66,
        justifyContent: 'center',
        alignItems: 'center',
        backgroundColor: '#EE0033',
        flex: 1
      }
    }, /*#__PURE__*/React.createElement(Image, {
      resizeMode: 'contain',
      source: require('../../assets/ic_delete.png'),
      style: {
        width: 24,
        height: 24,
        resizeMode: 'contain'
      }
    }), /*#__PURE__*/React.createElement(Text, {
      style: {
        color: 'white',
        fontSize: 13,
        backgroundColor: 'transparent',
        fontWeight: '500',
        textAlign: 'center',
        paddingTop: 4
      }
    }, appStore.lang.list_chat.delete))];
    if (item.type === 'GROUP') {
      var _setting, _item$orders$, _setting2, _item$message11, _setting3, _setting4, _item$message12, _item$message12$read_, _setting5, _setting6;
      //Group Chat
      return /*#__PURE__*/React.createElement(Swipeable, {
        onRightButtonsActivate: (event, gestureState, swipeable) => {
          var _currentSwipe$current;
          (_currentSwipe$current = currentSwipe.current) === null || _currentSwipe$current === void 0 ? void 0 : _currentSwipe$current.recenter();
        },
        onRightButtonsOpenRelease: (event, gestureState, swipeable) => {
          currentSwipe.current = swipeable;
        },
        rightButtonWidth: 66,
        rightButtons: rightButtons
      }, /*#__PURE__*/React.createElement(TouchableOpacity, {
        onPress: () => {
          try {
            navigationChat({
              ...item,
              ...{
                receiver: receiver
              }
            });
            item.settings = item.settings.map(i => {
              if (i.user_id === appStore.user.type + '_' + appStore.user.user_id) {
                i.unread_count = 0;
              }
              return i;
            });
            listChatStore.data = [...listChatStore.data];
          } catch (e) {}
          try {
            listChatStore.dataPin[index].settings = listChatStore.dataPin[index].settings.map(i => {
              if (i.user_id === appStore.user.type + '_' + appStore.user.user_id) {
                i.unread_count = 0;
              }
              return i;
            });
            listChatStore.dataPin = [...listChatStore.dataPin];
          } catch (e) {}
        },
        style: {
          flexDirection: 'row',
          backgroundColor: (_setting = setting) !== null && _setting !== void 0 && _setting.is_pin ? '#F8F8FA' : 'white',
          paddingVertical: 12,
          paddingHorizontal: 16
        }
      }, /*#__PURE__*/React.createElement(View, {
        style: {
          height: 48,
          width: 48,
          resizeMode: 'center',
          marginRight: 12
        }
      }, /*#__PURE__*/React.createElement(Image, {
        style: {
          height: 48,
          width: 48,
          resizeMode: 'center'
        },
        source: require('../../assets/avatar_group.png')
      })), /*#__PURE__*/React.createElement(View, {
        style: {
          flex: 1
        }
      }, /*#__PURE__*/React.createElement(View, {
        style: {
          flexDirection: 'row'
        }
      }, /*#__PURE__*/React.createElement(Text, {
        numberOfLines: 1,
        style: {
          flex: 1,
          fontSize: 17,
          fontWeight: '600',
          color: colors.primaryText
        }
      }, "\u0110\u01A1n ", item.order_numbers[0], ' ', /*#__PURE__*/React.createElement(Text, {
        style: {
          fontSize: 13,
          fontWeight: '400',
          color: colors.neutralText
        }
      }, "- ", orderStatus((_item$orders$ = item.orders[0]) === null || _item$orders$ === void 0 ? void 0 : _item$orders$.order_status), ' ')), /*#__PURE__*/React.createElement(Text, {
        style: {
          textAlign: 'right',
          color: colors.neutralText,
          fontSize: 13,
          fontWeight: ((_setting2 = setting) === null || _setting2 === void 0 ? void 0 : _setting2.unread_count) > 0 ? '600' : '500'
        }
      }, formatTimeLastMessage((_item$message11 = item.message) === null || _item$message11 === void 0 ? void 0 : _item$message11.created_at))), /*#__PURE__*/React.createElement(View, {
        style: {
          flexDirection: 'row',
          paddingTop: 6,
          alignItems: 'center'
        }
      }, getLastMessage(item, setting, isMe), /*#__PURE__*/React.createElement(View, {
        style: {
          flexDirection: 'row'
        }
      }, ((_setting3 = setting) === null || _setting3 === void 0 ? void 0 : _setting3.is_pin) && /*#__PURE__*/React.createElement(Image, {
        style: {
          height: 16,
          width: 16,
          resizeMode: 'center',
          marginLeft: 6
        },
        source: require('../../assets/ic_pin.png')
      }), ((_setting4 = setting) === null || _setting4 === void 0 ? void 0 : _setting4.is_hide_notification) && /*#__PURE__*/React.createElement(Image, {
        style: {
          height: 16,
          width: 16,
          resizeMode: 'center',
          marginLeft: 6
        },
        source: require('../../assets/ic_mute.png')
      }), (_item$message12 = item.message) === null || _item$message12 === void 0 ? void 0 : (_item$message12$read_ = _item$message12.read_by) === null || _item$message12$read_ === void 0 ? void 0 : _item$message12$read_.map((item, index) => /*#__PURE__*/React.createElement(View, {
        key: index + ''
      }, item !== appStore.user.type + '_' + appStore.user.user_id && /*#__PURE__*/React.createElement(Image, {
        style: {
          height: 16,
          width: 16,
          resizeMode: 'center',
          marginLeft: 6
        },
        source: item.includes('VTM') ? require('../../assets/avatar_default.png') : require('../../assets/avatar_default_customer.png')
      }))), ((_setting5 = setting) === null || _setting5 === void 0 ? void 0 : _setting5.unread_count) > 0 && /*#__PURE__*/React.createElement(View, {
        style: {
          height: 16,
          width: 16,
          backgroundColor: colors.primary,
          borderRadius: 8,
          marginLeft: 6,
          alignItems: 'center',
          justifyContent: 'center'
        }
      }, /*#__PURE__*/React.createElement(Text, {
        style: {
          color: 'white',
          fontSize: 10,
          textAlign: 'center'
        }
      }, (_setting6 = setting) === null || _setting6 === void 0 ? void 0 : _setting6.unread_count)))))));
    } else if (item.type === 'PAIR') {
      var _setting7, _receiver, _receiver$state, _receiver2, _receiver3, _receiver4, _receiver5, _receiver6, _setting8, _item$message13, _item$message14, _item$message14$read_, _setting9, _setting10, _setting11, _setting12;
      //Private Chat

      return (
        /*#__PURE__*/
        // <ChatSwipeableRow
        //   isPin={setting?.is_pin}
        //   onPress1={(isPin)=>{
        //     listChatStore.pin({
        //       conversation_id: item._id
        //     })
        //   }}
        //   onPress3={()=>{
        //     listChatStore.hide({
        //       conversation_id: item._id
        //     })
        //   }}
        // >
        React.createElement(Swipeable, {
          onRightButtonsActivate: (event, gestureState, swipeable) => {
            var _currentSwipe$current2;
            (_currentSwipe$current2 = currentSwipe.current) === null || _currentSwipe$current2 === void 0 ? void 0 : _currentSwipe$current2.recenter();
          },
          onRightButtonsOpenRelease: (event, gestureState, swipeable) => {
            currentSwipe.current = swipeable;
          },
          rightButtonWidth: 66,
          rightButtons: rightButtons
        }, /*#__PURE__*/React.createElement(TouchableOpacity, {
          onPress: () => {
            try {
              navigationChat({
                ...item,
                ...{
                  receiver: receiver
                }
              });
              listChatStore.data[index].settings = listChatStore.data[index].settings.map(i => {
                if (i.user_id === appStore.user.type + '_' + appStore.user.user_id) {
                  i.unread_count = 0;
                }
                return i;
              });
              listChatStore.data = [...listChatStore.data];
            } catch (e) {}
            try {
              listChatStore.dataPin[index].settings = listChatStore.dataPin[index].settings.map(i => {
                if (i.user_id === appStore.user.type + '_' + appStore.user.user_id) {
                  i.unread_count = 0;
                }
                return i;
              });
              listChatStore.dataPin = [...listChatStore.dataPin];
            } catch (e) {}
          },
          style: {
            flexDirection: 'row',
            backgroundColor: (_setting7 = setting) !== null && _setting7 !== void 0 && _setting7.is_pin ? '#F8F8FA' : 'white',
            paddingVertical: 12,
            paddingHorizontal: 16
          }
        }, /*#__PURE__*/React.createElement(View, {
          style: {
            height: 48,
            width: 48,
            resizeMode: 'center',
            marginRight: 12
          }
        }, /*#__PURE__*/React.createElement(Image, {
          style: {
            height: 48,
            width: 48,
            resizeMode: 'center'
          },
          source: ((_receiver = receiver) === null || _receiver === void 0 ? void 0 : _receiver.type) === 'VTMAN' ? require('../../assets/avatar_default.png') : require('../../assets/avatar_default_customer.png')
        }), ((_receiver$state = receiver.state) === null || _receiver$state === void 0 ? void 0 : _receiver$state.includes('ONLINE')) && /*#__PURE__*/React.createElement(Image, {
          style: {
            height: 12,
            width: 12,
            resizeMode: 'center',
            position: 'absolute',
            top: 36,
            left: 36
          },
          source: require('../../assets/ic_online.png')
        })), /*#__PURE__*/React.createElement(View, {
          style: {
            flex: 1
          }
        }, /*#__PURE__*/React.createElement(View, {
          style: {
            flexDirection: 'row',
            alignItems: 'center'
          }
        }, /*#__PURE__*/React.createElement(Text, {
          style: {
            flex: 1,
            fontSize: 17,
            fontWeight: '600',
            color: colors.primaryText
          }
        }, ((_receiver2 = receiver) !== null && _receiver2 !== void 0 && _receiver2.last_name ? (_receiver3 = receiver) === null || _receiver3 === void 0 ? void 0 : _receiver3.last_name : '') + ' ' + ((_receiver4 = receiver) !== null && _receiver4 !== void 0 && _receiver4.first_name ? (_receiver5 = receiver) === null || _receiver5 === void 0 ? void 0 : _receiver5.first_name : ''), ' ', ((_receiver6 = receiver) === null || _receiver6 === void 0 ? void 0 : _receiver6.type) === 'VTMAN' && /*#__PURE__*/React.createElement(Text, {
          style: {
            fontSize: 13,
            fontWeight: '400',
            color: colors.neutralText
          }
        }, "- ", appStore.lang.common.postman, ' '), ' '), /*#__PURE__*/React.createElement(Text, {
          style: {
            textAlign: 'right',
            color: colors.neutralText,
            fontWeight: ((_setting8 = setting) === null || _setting8 === void 0 ? void 0 : _setting8.unread_count) > 0 ? '600' : '500',
            fontSize: 13
          }
        }, formatTimeLastMessage((_item$message13 = item.message) === null || _item$message13 === void 0 ? void 0 : _item$message13.created_at))), /*#__PURE__*/React.createElement(View, {
          style: {
            flexDirection: 'row',
            paddingTop: 6,
            alignItems: 'center'
          }
        }, getLastMessage(item, setting, isMe), (_item$message14 = item.message) === null || _item$message14 === void 0 ? void 0 : (_item$message14$read_ = _item$message14.read_by) === null || _item$message14$read_ === void 0 ? void 0 : _item$message14$read_.map((reader, index) => /*#__PURE__*/React.createElement(View, {
          key: index + ''
        }, reader !== appStore.user.type + '_' + appStore.user.user_id && reader !== (item === null || item === void 0 ? void 0 : item.sender) && /*#__PURE__*/React.createElement(Image, {
          style: {
            height: 16,
            width: 16,
            resizeMode: 'center',
            marginLeft: 6
          },
          source: reader.includes('VTM') ? require('../../assets/avatar_default.png') : require('../../assets/avatar_default_customer.png')
        }))), /*#__PURE__*/React.createElement(View, {
          style: {
            flexDirection: 'row'
          }
        }, ((_setting9 = setting) === null || _setting9 === void 0 ? void 0 : _setting9.is_pin) && /*#__PURE__*/React.createElement(Image, {
          style: {
            height: 16,
            width: 16,
            resizeMode: 'center',
            marginLeft: 6
          },
          source: require('../../assets/ic_pin.png')
        }), ((_setting10 = setting) === null || _setting10 === void 0 ? void 0 : _setting10.is_hide_notification) && /*#__PURE__*/React.createElement(Image, {
          style: {
            height: 16,
            width: 16,
            resizeMode: 'center',
            marginLeft: 6
          },
          source: require('../../assets/ic_mute.png')
        }), ((_setting11 = setting) === null || _setting11 === void 0 ? void 0 : _setting11.unread_count) > 0 && /*#__PURE__*/React.createElement(View, {
          style: {
            height: 16,
            width: 16,
            backgroundColor: colors.primary,
            borderRadius: 8,
            marginLeft: 6,
            alignItems: 'center',
            justifyContent: 'center'
          }
        }, /*#__PURE__*/React.createElement(Text, {
          style: {
            color: 'white',
            fontSize: 10,
            textAlign: 'center'
          }
        }, (_setting12 = setting) === null || _setting12 === void 0 ? void 0 : _setting12.unread_count)))))))
      );
    }
  };
  function renderHeader() {
    return /*#__PURE__*/React.createElement(FlatList, {
      keyExtractor: item => {
        var _item$message15;
        return item === null || item === void 0 ? void 0 : (_item$message15 = item.message) === null || _item$message15 === void 0 ? void 0 : _item$message15._id;
      },
      style: {
        backgroundColor: 'white'
      },
      data: listChatStore.dataPin,
      extraData: listChatStore.data,
      ItemSeparatorComponent: () => /*#__PURE__*/React.createElement(View, {
        style: {
          backgroundColor: '#F8F8FA',
          height: 1
        }
      }, /*#__PURE__*/React.createElement(View, {
        style: {
          backgroundColor: '#E5E5E5',
          height: 1,
          marginLeft: 76,
          marginRight: 16
        }
      })),
      renderItem: renderItem
    });
  }
  useEffect(() => {
    const delayDebounceFn = setTimeout(() => {
      listChatStore.search = query;
      listChatStore.page = 0;
      listChatStore.getData({});
    }, 1000);
    return () => clearTimeout(delayDebounceFn);
  }, [query]);
  return /*#__PURE__*/React.createElement(SafeAreaView, {
    style: {
      flex: 1,
      backgroundColor: colors.primary
    }
  }, /*#__PURE__*/React.createElement(KeyboardAvoidingView, {
    style: {
      flex: 1
    },
    behavior: Platform.OS === 'ios' ? 'padding' : ''
  }, /*#__PURE__*/React.createElement(View, {
    style: {
      height: scale(64),
      backgroundColor: colors.primary
    }
  }, showSearch === true ? /*#__PURE__*/React.createElement(View, {
    style: {
      height: scale(64),
      flexDirection: 'row',
      alignItems: 'center'
    }
  }, /*#__PURE__*/React.createElement(View, {
    style: {
      width: 50,
      height: 50,
      justifyContent: 'center',
      alignItems: 'center'
    }
  }, /*#__PURE__*/React.createElement(Image, {
    style: {
      height: 24,
      width: 24,
      resizeMode: 'contain'
    },
    source: require('../../assets/ic_search.png')
  })), /*#__PURE__*/React.createElement(TextInput, {
    placeholder: appStore.appId === 'VTPost' ? appStore.lang.list_chat.placeholder_search : appStore.lang.list_chat.placeholder_search_VTM,
    placeholderTextColor: '#eeeeeed1',
    value: query,
    autoFocus: true,
    onChangeText: setQuery,
    style: {
      fontWeight: '500',
      fontSize: scale(15),
      color: 'white',
      flex: 1
    }
  }), query !== '' && /*#__PURE__*/React.createElement(TouchableOpacity, {
    onPress: () => {
      setQuery('');
      listChatStore.search = '';
      listChatStore.page = 0;
      listChatStore.getData({});
    },
    style: {
      width: 50,
      height: 50,
      justifyContent: 'center',
      alignItems: 'center'
    }
  }, /*#__PURE__*/React.createElement(Image, {
    style: {
      height: 24,
      width: 24,
      resizeMode: 'contain'
    },
    source: require('../../assets/ic_clear.png')
  })), /*#__PURE__*/React.createElement(View, {
    style: {
      width: 1,
      backgroundColor: '#eeeeee99',
      height: scale(20)
    }
  }), /*#__PURE__*/React.createElement(TouchableOpacity, {
    onPress: () => {
      setShowSearch(false);
      setQuery('');
      listChatStore.search = '';
      // listChatStore.page = 0;
      // listChatStore.getData({});
    },

    style: {
      width: scale(54),
      height: scale(50),
      justifyContent: 'center',
      alignItems: 'flex-end'
    }
  }, /*#__PURE__*/React.createElement(Text, {
    style: {
      fontWeight: '600',
      fontSize: scale(15),
      color: 'white',
      marginRight: 16
    }
  }, appStore.lang.common.cancel))) : /*#__PURE__*/React.createElement(View, {
    style: {
      height: scale(64),
      flexDirection: 'row',
      alignItems: 'center'
    }
  }, /*#__PURE__*/React.createElement(TouchableOpacity, {
    onPress: () => {
      if (appStore.appId === 'Admin') {
        Navigation.push(props.componentId, {
          component: {
            name: 'Admin.ScanQR',
            options: {
              popGesture: false,
              bottomTabs: {
                visible: false
              },
              topBar: {
                visible: false,
                height: 0
              }
            },
            passProps: {
              callback: data => {
                console.log(data);
              }
            }
          }
        });
      } else {
        if (props.buttonBack !== false) {
          Navigation.pop(props.componentId);
        }
      }
    },
    style: {
      width: 50,
      height: 50,
      justifyContent: 'center',
      alignItems: 'center'
    }
  }, props.buttonBack !== false && appStore.appId !== 'Admin' && /*#__PURE__*/React.createElement(Image, {
    style: {
      height: 36,
      width: 36,
      resizeMode: 'contain'
    },
    source: require('../../assets/ic_back.png')
  }), appStore.appId === 'Admin' && /*#__PURE__*/React.createElement(Image, {
    style: {
      height: 36,
      width: 36,
      resizeMode: 'contain'
    },
    source: require('../../assets/ic_qr.png')
  })), /*#__PURE__*/React.createElement(Text, {
    style: {
      fontWeight: '600',
      fontSize: scale(17),
      color: 'white',
      flex: 1,
      textAlign: 'center'
    }
  }, appStore.appId === 'VTPost' ? appStore.lang.list_chat.message : 'Trò chuyện'), /*#__PURE__*/React.createElement(TouchableOpacity, {
    onPress: () => setShowSearch(true),
    style: {
      width: 50,
      height: 50,
      justifyContent: 'center',
      alignItems: 'center'
    }
  }, /*#__PURE__*/React.createElement(Image, {
    style: {
      height: 24,
      width: 24,
      resizeMode: 'contain'
    },
    source: require('../../assets/ic_search.png')
  })))), /*#__PURE__*/React.createElement(FlatList, {
    refreshing: listChatStore.isLoading,
    onRefresh: () => {
      listChatStore.page = 0;
      listChatStore.getData({});
    },
    ListHeaderComponent: renderHeader,
    keyExtractor: item => {
      var _item$message16;
      return item === null || item === void 0 ? void 0 : (_item$message16 = item.message) === null || _item$message16 === void 0 ? void 0 : _item$message16._id;
    },
    onEndReached: () => () => {
      listChatStore.getData({});
    },
    style: {
      flex: 1,
      backgroundColor: 'white'
    },
    data: listChatStore.data,
    extraData: listChatStore.data,
    ListEmptyComponent: () => {
      if (!listChatStore.isLoading) {
        return /*#__PURE__*/React.createElement(TouchableOpacity, {
          onPress: () => intLoad(),
          style: {
            alignItems: 'center',
            height: Dimensions.get('window').height
          }
        }, /*#__PURE__*/React.createElement(Image, {
          source: require('../../assets/ic_message_empty.png'),
          style: {
            width: 120,
            height: 120,
            resizeMode: 'contain',
            marginTop: 28
          }
        }), /*#__PURE__*/React.createElement(Text, {
          style: {
            fontWight: '500',
            fontSize: 15,
            color: colors.neutralText,
            marginTop: 16
          }
        }, "Qu\xFD kh\xE1ch ch\u01B0a c\xF3 tin nh\u1EAFn"));
      } else {
        return null;
      }
    },
    ItemSeparatorComponent: () => /*#__PURE__*/React.createElement(View, {
      style: {
        backgroundColor: 'white',
        height: 1
      }
    }, /*#__PURE__*/React.createElement(View, {
      style: {
        backgroundColor: '#E5E5E5',
        height: 1,
        marginLeft: 76,
        marginRight: 16
      }
    })),
    renderItem: renderItem
  }), props.admin && /*#__PURE__*/React.createElement(View, {
    style: {
      width: 58,
      height: 58,
      alignItems: 'center',
      justifyContent: 'center',
      position: 'absolute',
      right: 27,
      bottom: 27,
      backgroundColor: colors.primary,
      borderRadius: 58 / 2
    }
  }, /*#__PURE__*/React.createElement(Image, {
    style: {
      height: 25,
      width: 25,
      resizeMode: 'contain'
    },
    source: require('../../assets/ic_add_chat.png')
  }))), /*#__PURE__*/React.createElement(BottomSheetChatOptions, {
    ref: bottomSheetModalRef
  }));
});
//# sourceMappingURL=index.js.map