import React, { useState, useEffect } from 'react';
import { View, Text, FlatList, TextInput, Image } from 'react-native';
import styles from './styles';
import { Header } from 'react-native-cloud-ca';
import { useNavigate } from 'react-router-native';
const ListDocumentView = props => {
  const {
    documents
  } = props;
  const navigate = useNavigate();
  const [documentsData, setDocumentsData] = useState(documents);
  const [searchValue, setSearchValue] = useState('');
  useEffect(() => {
    if ((searchValue === null || searchValue === void 0 ? void 0 : searchValue.length) === 0) {
      setDocumentsData(documents);
    }
    const timer = setTimeout(() => {
      const results = documents.filter(document => {
        return document.Name.toUpperCase().includes(searchValue.toUpperCase());
      });
      setDocumentsData(results);
      console.log(results);
    }, 500);
    return () => clearTimeout(timer);
  }, [documents, searchValue]);
  function onGoBack() {
    navigate(-1);
  }
  const renderItem = _ref => {
    let {
      item,
      index
    } = _ref;
    return /*#__PURE__*/React.createElement(View, {
      style: styles.documentContainer
    }, /*#__PURE__*/React.createElement(Text, {
      numberOfLines: 1,
      key: index,
      style: styles.documentItemText
    }, `${index + 1}. ${item === null || item === void 0 ? void 0 : item.Name}`));
  };
  return /*#__PURE__*/React.createElement(View, {
    style: styles.container
  }, /*#__PURE__*/React.createElement(Header, {
    label: "Danh s\xE1ch t\xE0i li\u1EC7u k\xFD",
    goBack: onGoBack
  }), /*#__PURE__*/React.createElement(View, {
    style: styles.contentContainer
  }, /*#__PURE__*/React.createElement(View, {
    style: styles.searchContainer
  }, /*#__PURE__*/React.createElement(View, {
    style: styles.inputContainer
  }, /*#__PURE__*/React.createElement(Image, {
    style: styles.iconMagnify,
    source: require('../../asset/icon/IC_MAGNIFY.png')
  }), /*#__PURE__*/React.createElement(TextInput, {
    style: styles.inputField,
    placeholder: " Nh\u1EADp t\xEAn h\u1EE3p \u0111\u1ED3ng c\u1EA7n t\xECm ki\u1EBFm",
    placeholderTextColor: '#6C757D',
    selectionColor: '#121517',
    value: searchValue,
    onChangeText: setSearchValue
  }))), /*#__PURE__*/React.createElement(FlatList, {
    contentContainerStyle: styles.listDocumentContainer,
    data: documentsData,
    renderItem: renderItem,
    keyExtractor: (_item, index) => index.toString()
  })));
};
export default ListDocumentView;
//# sourceMappingURL=ListDocumentView.js.map