"use strict";

import { useCallback, useEffect, useRef, useState } from 'react';
import { AlsoCheckbox, AlsoContainer } from '../styled/StyledComponents';
import SendInput from '../styled/SendInput';
import { useDispatch } from 'react-redux';
import { useXmppClient } from '../../context/xmppProvider';
import MessageList from '../MainComponents/MessageList';
import ModalHeaderComponent from '../Modals/ModalHeaderComponent';
import { setCloseActiveMessage, setEditAction } from '../../roomStore/roomsSlice';
import { EditWrapper } from '../MainComponents/EditWrapper';
import { useSendMessage } from '../../hooks/useSendMessage';
import { createMainMessageForThread } from '../../helpers/createMainMessageForThread';
import { useRoomState } from '../../hooks/useRoomState';
import { useChatSettingState } from '../../hooks/useChatSettingState';
import { Animated, Text, TouchableOpacity, StyleSheet, PanResponder } from 'react-native';
import CustomTypingIndicator from '../styled/StyledInputComponents/CustomTypingIndicator';
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
const ThreadWrapper = ({
  activeMessage,
  user,
  customMessageComponent: CustomMessageComponent
}) => {
  const {
    client
  } = useXmppClient();
  const dispatch = useDispatch();
  const {
    loading,
    roomsList,
    editAction,
    activeRoomJID
  } = useRoomState();
  const {
    config
  } = useChatSettingState();
  const {
    sendMessage: sendMs,
    sendMedia: sendMessageMedia,
    sendEditMessage,
    isLastMessageFromUserAndProcessing
  } = useSendMessage();
  const [isLoadingMore, setIsLoadingMore] = useState(false);
  const [isChecked, setIsChecked] = useState(false);
  const slideAnim = useRef(new Animated.Value(300)).current;
  const panResponder = useRef(PanResponder.create({
    onStartShouldSetPanResponder: (e, gestureState) => {
      return gestureState.x0 <= 100;
    },
    onMoveShouldSetPanResponder: (e, gestureState) => {
      return gestureState.x0 <= 100 && gestureState.dx > 0;
    },
    onPanResponderMove: (e, gestureState) => {
      if (gestureState.x0 <= 100 && gestureState.dx > 0) {
        slideAnim.setValue(gestureState.dx);
      }
    },
    onPanResponderRelease: (e, gestureState) => {
      if (gestureState.x0 <= 100 && gestureState.dx > 150) {
        closeThread();
      } else {
        Animated.spring(slideAnim, {
          toValue: 0,
          useNativeDriver: true
        }).start();
      }
    }
  })).current;
  const loadMoreMessages = useCallback(async (chatJID, max, idOfMessageBefore) => {
    if (!isLoadingMore) {
      client?.getHistoryStanza(chatJID, max, idOfMessageBefore).then(() => {
        setIsLoadingMore(false);
      }).catch(err => {
        console.warn('getHistoryStanza failed', err);
        setIsLoadingMore(false);
      });
    }
  }, [client]);
  const sendMessage = useCallback(message => {
    sendMs(message, activeMessage.roomJid, true, isChecked, createMainMessageForThread(activeMessage));
  }, [activeMessage, isChecked]);
  const sendMedia = useCallback((data, type) => {
    sendMessageMedia(data, type, activeMessage.roomJid, true, isChecked, createMainMessageForThread(activeMessage));
  }, [activeMessage, isChecked]);
  const sendStartComposing = useCallback(() => {
    if (config?.disableTypingIndicator) {
      return;
    }
    client?.sendTypingRequestStanza(activeMessage.roomJid, `${user.firstName} ${user.lastName}`, true);
  }, []);
  const sendEndComposing = useCallback(() => {
    if (config?.disableTypingIndicator) {
      return;
    }
    client?.sendTypingRequestStanza(activeMessage.roomJid, `${user.firstName} ${user.lastName}`, false);
  }, []);
  const onCloseEdit = () => {
    dispatch(setEditAction({
      isEdit: false
    }));
  };
  const closeThread = () => {
    dispatch(setCloseActiveMessage({
      chatJID: activeMessage.roomJid
    }));
    dispatch(setEditAction({
      isEdit: false
    }));
  };
  useEffect(() => {
    if (activeMessage?.activeMessage) {
      Animated.timing(slideAnim, {
        toValue: 0,
        duration: 300,
        useNativeDriver: true
      }).start();
    } else {
      Animated.timing(slideAnim, {
        toValue: 300,
        duration: 300,
        useNativeDriver: true
      }).start();
    }
  }, [activeMessage?.activeMessage]);
  return /*#__PURE__*/_jsxs(Animated.View, {
    ...panResponder.panHandlers,
    style: [styles.threadContainer, {
      transform: [{
        translateX: slideAnim
      }]
    }
    // ...config?.chatRoomStyles,
    ],
    children: [/*#__PURE__*/_jsx(ModalHeaderComponent, {
      headerTitle: "Thread",
      handleCloseModal: closeThread
    }), /*#__PURE__*/_jsx(MessageList, {
      loadMoreMessages: loadMoreMessages,
      CustomMessage: CustomMessageComponent,
      user: user,
      roomJID: activeMessage.roomJid,
      config: config,
      loading: isLoadingMore,
      activeMessage: activeMessage,
      isReply: true
    }), /*#__PURE__*/_jsxs(AlsoContainer, {
      onPress: () => setIsChecked(prev => !prev),
      children: [/*#__PURE__*/_jsx(AlsoCheckbox, {
        accentColor: isChecked ? config?.colors?.primary || '#0052CD' : '#fff'
        // checked={isChecked}
        // onPress={() => setIsChecked(!isChecked)}
      }), /*#__PURE__*/_jsx(Text, {
        children: "Also send to"
      }), /*#__PURE__*/_jsx(TouchableOpacity, {
        onPress: closeThread,
        children: /*#__PURE__*/_jsx(Text, {
          style: {
            color: config?.colors?.primary || '#0052CD',
            fontWeight: 500
          },
          children: roomsList[activeMessage.roomJid].name
        })
      })]
    }), editAction && editAction.isEdit && /*#__PURE__*/_jsx(EditWrapper, {
      text: editAction.text || '',
      onClose: onCloseEdit
    }), /*#__PURE__*/_jsx(SendInput, {
      editMessage: editAction && editAction.text,
      sendMedia: sendMedia,
      sendMessage: editAction && editAction.isEdit ? sendEditMessage : sendMessage,
      config: config,
      onFocus: sendStartComposing,
      onBlur: sendEndComposing,
      isLoading: loading,
      isMessageProcessing: isLastMessageFromUserAndProcessing(activeMessage.roomJid)
    }), config?.customTypingIndicator?.enabled && (config.customTypingIndicator.position === 'overlay' || config.customTypingIndicator.position === 'floating') && roomsList[activeMessage.roomJid]?.composing && /*#__PURE__*/_jsx(CustomTypingIndicator, {
      usersTyping: roomsList[activeMessage.roomJid]?.composingList || ['User'],
      text: config.customTypingIndicator.text,
      position: config.customTypingIndicator.position,
      styles: config.customTypingIndicator.styles,
      customComponent: config.customTypingIndicator.customComponent,
      isVisible: roomsList[activeMessage.roomJid]?.composing || false
    })]
  });
};
export default ThreadWrapper;
const styles = StyleSheet.create({
  threadContainer: {
    zIndex: 999,
    position: 'absolute',
    top: 0,
    bottom: 0,
    right: 0,
    width: '100%',
    height: '100%',
    backgroundColor: '#f3f6fc',
    flexDirection: 'column',
    justifyContent: 'space-between',
    flex: 1
  },
  text: {
    color: '#fff',
    fontSize: 18
  }
});
//# sourceMappingURL=ThreadWrapper.js.map