function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
import React, { useEffect, useState } from 'react';
import { TouchableOpacity, View, FlatList, TextInput, Platform, KeyboardAvoidingView, Linking, Dimensions } from 'react-native';
import { observer } from 'mobx-react-lite';
import colors from '../../Styles';
import Swipeable from 'react-native-swipeable';
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, scale } from "../../utils";
import { useSafeAreaInsets } from 'react-native-safe-area-context';
import attachsStore from "./AttachsStore";
import uuid from "react-native-uuid";
import { VideoItem } from "../chat/Item";
import ImageViewing from "../../components/imageView/ImageViewing";
import { MText as Text } from '../../components';
export const AttachsScreen = observer(function AttachsScreen(props) {
  var _receiver$state;
  const conversation = props.data;
  const receiver = props.receiver;
  const insets = useSafeAreaInsets();
  const [images, setImages] = useState([]);
  const [imageVisible, setImageVisible] = useState(false);
  const loadData = () => {
    attachsStore.getData({
      conversation_id: conversation === null || conversation === void 0 ? void 0 : conversation._id
    });
  };
  useEffect(() => {
    attachsStore.data = [];
    attachsStore.currentTab = 0;
    attachsStore.page = 0;
    loadData();
  }, []);
  const renderItem = _ref => {
    let {
      item,
      index
    } = _ref;
    const attach = item;
    if (attachsStore.currentTab === 0) {
      if (attach.url.toLowerCase().includes('jpg') || attach.url.toLowerCase().includes('png') || attach.url.toLowerCase().includes('jpeg') || attach.url.toLowerCase().includes('heic')) {
        return /*#__PURE__*/React.createElement(TouchableOpacity, {
          onPress: () => {
            setImages([{
              uri: attach.url
            }]);
            setImageVisible(true);
          }
        }, /*#__PURE__*/React.createElement(Image, {
          source: {
            uri: attach.url
          },
          style: {
            borderWidth: 0.5,
            borderColor: '#f2f2f2',
            backgroundColor: "#F2F2F2",
            borderRadius: 5,
            overflow: 'hidden',
            width: Dimensions.get('window').width / 3,
            height: Dimensions.get('window').width / 3
          }
        }));
      }
      if (attach.url.toLowerCase().includes('.mov') || attach.url.toLowerCase().includes('.mp4')) {
        return /*#__PURE__*/React.createElement(VideoItem, _extends({}, props, {
          url: attach.url,
          style: {
            backgroundColor: "#F2F2F2",
            borderRadius: 5,
            overflow: 'hidden',
            width: Dimensions.get('window').width / 3,
            height: Dimensions.get('window').width / 3
          }
        }));
      }
    } else {
      return /*#__PURE__*/React.createElement(TouchableOpacity, {
        onPress: () => {
          try {
            Linking.openURL(item.url);
          } catch (e) {
            console.log(e);
          }
        },
        style: {
          // borderRadius: 8,
          // borderWidth: 1,
          // borderColor: "#DCE6F0",
          // backgroundColor: '#F8F8FA',
          paddingHorizontal: 12,
          paddingVertical: 12,
          flexDirection: 'row',
          alignItems: 'center'
        }
      }, attach.type.includes('pdf') && /*#__PURE__*/React.createElement(Image, {
        source: require('../../assets/file_pdf.png'),
        style: {
          width: 42,
          height: 42,
          resizeMode: 'contain',
          marginRight: 14
        }
      }), (attach.type.includes('.doc') || attach.url.includes('.docx')) && /*#__PURE__*/React.createElement(Image, {
        source: require('../../assets/file_doc.png'),
        style: {
          width: 42,
          height: 42,
          resizeMode: 'contain',
          marginRight: 14
        }
      }), (attach.type.includes('.xls') || attach.url.includes('.xlsx')) && /*#__PURE__*/React.createElement(Image, {
        source: require('../../assets/file_xls.png'),
        style: {
          width: 42,
          height: 42,
          resizeMode: 'contain',
          marginRight: 14
        }
      }), /*#__PURE__*/React.createElement(View, {
        style: {
          flex: 1
        }
      }, /*#__PURE__*/React.createElement(Text, {
        numberOfLines: 1,
        style: {
          fontSize: 15,
          fontWeight: '600',
          color: "#44494D"
        }
      }, attach.key.replace("conversation/", "")), /*#__PURE__*/React.createElement(Text, {
        style: {
          fontSize: 13,
          color: "#828282",
          marginTop: 8
        }
      }, moment(attach.created_at).format('HH:mm DD/MM/YYYY'))));
    }
  };
  return /*#__PURE__*/React.createElement(SafeAreaView, {
    style: {
      flex: 1,
      backgroundColor: colors.primary
    }
  }, /*#__PURE__*/React.createElement(View, {
    style: {
      height: scale(64),
      backgroundColor: colors.primary
    }
  }, /*#__PURE__*/React.createElement(TouchableOpacity, {
    onPress: () => {
      Navigation.pop(props.componentId);
    },
    style: {
      width: 50,
      height: 50,
      justifyContent: 'center',
      alignItems: 'center'
    }
  }, /*#__PURE__*/React.createElement(Image, {
    style: {
      height: 36,
      width: 36,
      resizeMode: 'contain'
    },
    source: require('../../assets/ic_close_attach.png')
  }))), /*#__PURE__*/React.createElement(View, {
    style: {
      alignItems: 'center',
      backgroundColor: 'white'
    }
  }, /*#__PURE__*/React.createElement(Text, {
    style: {
      fontWeight: '600',
      fontSize: 20,
      marginTop: insets.top + 118 - scale(64),
      color: colors.primaryText
    }
  }, (receiver === null || receiver === void 0 ? void 0 : receiver.first_name) + " " + (receiver === null || receiver === void 0 ? void 0 : receiver.last_name)), /*#__PURE__*/React.createElement(View, {
    style: {
      flexDirection: 'row',
      alignItems: 'center',
      marginTop: 4
    }
  }, /*#__PURE__*/React.createElement(Text, {
    style: {
      fontWeight: '500',
      fontSize: 13,
      color: colors.neutralText,
      textAlign: 'center'
    }
  }, (conversation === null || conversation === void 0 ? void 0 : conversation.type) === 'PAIR' && (receiver === null || receiver === void 0 ? void 0 : receiver.type) === 'VTMAN' && appStore.lang.common.postman)), /*#__PURE__*/React.createElement(View, {
    style: {
      flexDirection: 'row',
      alignItems: 'center',
      marginTop: 16
    }
  }, /*#__PURE__*/React.createElement(TouchableOpacity, {
    onPress: () => {
      try {
        Linking.openURL(`tel:${receiver === null || receiver === void 0 ? void 0 : receiver.phone}`);
      } catch (e) {
        console.log(e);
      }
    }
  }, /*#__PURE__*/React.createElement(Image, {
    style: {
      height: 48,
      width: 48,
      resizeMode: 'contain'
    },
    source: require('../../assets/ic_call.png')
  })), /*#__PURE__*/React.createElement(TouchableOpacity, {
    style: {
      marginLeft: 16
    },
    onPress: () => {
      Navigation.pop(props.componentId);
    }
  }, /*#__PURE__*/React.createElement(Image, {
    style: {
      height: 48,
      width: 48,
      resizeMode: 'contain'
    },
    source: require('../../assets/ic_message.png')
  })), /*#__PURE__*/React.createElement(TouchableOpacity, {
    style: {
      marginLeft: 16
    },
    onPress: () => {
      alert('Tính năng đang phát triển');
    }
  }, /*#__PURE__*/React.createElement(Image, {
    style: {
      height: 48,
      width: 48,
      resizeMode: 'contain'
    },
    source: require('../../assets/ic_star.png')
  })))), /*#__PURE__*/React.createElement(View, {
    style: {
      flexDirection: 'row',
      alignItems: 'center',
      height: 74,
      backgroundColor: 'white',
      paddingTop: 24
    }
  }, /*#__PURE__*/React.createElement(TouchableOpacity, {
    onPress: () => {
      attachsStore.currentTab = 0;
      attachsStore.page = 0;
      loadData();
    },
    style: {
      flex: 1,
      height: 50,
      justifyContent: 'center',
      borderBottomWidth: 2,
      borderColor: attachsStore.currentTab === 0 ? colors.primary : '#DCE6F0'
    }
  }, /*#__PURE__*/React.createElement(Text, {
    style: {
      fontWeight: '600',
      fontSize: 17,
      color: attachsStore.currentTab === 0 ? colors.primary : colors.primaryText,
      textAlign: 'center'
    }
  }, "\u1EA2nh, video")), /*#__PURE__*/React.createElement(TouchableOpacity, {
    onPress: () => {
      attachsStore.currentTab = 1;
      attachsStore.page = 0;
      loadData();
    },
    style: {
      flex: 1,
      height: 50,
      justifyContent: 'center',
      borderBottomWidth: 2,
      borderColor: attachsStore.currentTab === 1 ? colors.primary : '#DCE6F0'
    }
  }, /*#__PURE__*/React.createElement(Text, {
    style: {
      borderLeftWidth: 1,
      borderColor: '#DCE6F0',
      fontWeight: '600',
      fontSize: 17,
      color: attachsStore.currentTab === 1 ? colors.primary : colors.primaryText,
      textAlign: 'center'
    }
  }, "T\xE0i li\u1EC7u"))), /*#__PURE__*/React.createElement(View, {
    style: {
      backgroundColor: '#f2f2f2',
      height: 8
    }
  }), /*#__PURE__*/React.createElement(FlatList, {
    key: attachsStore.currentTab === 0 ? '0' : '1',
    refreshing: attachsStore.isLoading,
    onRefresh: () => {
      attachsStore.page = 0;
      loadData();
    },
    keyExtractor: item => item._id,
    numColumns: attachsStore.currentTab === 0 ? 3 : 1,
    onEndReached: () => loadData(),
    style: {
      flex: 1,
      backgroundColor: 'white'
    },
    data: attachsStore.data,
    renderItem: renderItem,
    ItemSeparatorComponent: () => /*#__PURE__*/React.createElement(View, {
      style: {
        backgroundColor: 'white',
        height: 1
      }
    }, /*#__PURE__*/React.createElement(View, {
      style: {
        backgroundColor: '#E5E5E5',
        height: 1,
        marginLeft: 66,
        marginRight: 16
      }
    })),
    ListEmptyComponent: () => {
      return /*#__PURE__*/React.createElement(View, {
        style: {
          alignItems: 'center',
          marginTop: 50
        }
      }, attachsStore.currentTab === 0 ? /*#__PURE__*/React.createElement(Image, {
        style: {
          width: 102,
          height: 102,
          resizeMode: 'contain'
        },
        source: require('../../assets/ic_no_picture.png')
      }) : /*#__PURE__*/React.createElement(Image, {
        style: {
          width: 102,
          height: 102,
          resizeMode: 'contain'
        },
        source: require('../../assets/ic_no_file.png')
      }), /*#__PURE__*/React.createElement(Text, {
        style: {
          fontWeight: '600',
          fontSize: 15,
          color: '#828282'
        }
      }, attachsStore.currentTab === 0 ? "Chưa có ảnh, video được gửi trong hội thoại " : "Chưa có tài liệu được gửi trong hội thoại "));
    }
  }), /*#__PURE__*/React.createElement(View, {
    style: {
      height: 94,
      width: 94,
      top: insets.top + 20,
      resizeMode: 'contain',
      position: 'absolute',
      alignSelf: 'center'
    }
  }, (receiver === null || receiver === void 0 ? void 0 : receiver.type) === 'VTMAN' ? /*#__PURE__*/React.createElement(Image, {
    style: {
      height: 94,
      width: 94,
      resizeMode: 'contain'
    },
    source: require('../../assets/avatar_default.png')
  }) : /*#__PURE__*/React.createElement(Image, {
    style: {
      height: 94,
      width: 94,
      resizeMode: 'contain'
    },
    source: 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: 70,
      left: 60
    },
    source: require('../../assets/ic_online.png')
  })), /*#__PURE__*/React.createElement(ImageViewing, {
    images: images,
    swipeToCloseEnabled: true,
    doubleTapToZoomEnabled: true,
    imageIndex: 0,
    visible: imageVisible,
    onRequestClose: () => setImageVisible(false)
  }));
});
//# sourceMappingURL=index.js.map