"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = exports.Story = void 0;
var _react = require("react");
var _reactNative = require("react-native");
var _reactNativeModalbox = _interopRequireDefault(require("react-native-modalbox"));
var _StoryListItem = _interopRequireDefault(require("./StoryListItem"));
var _StoryCircleListView = _interopRequireDefault(require("./StoryCircleListView"));
var _helpers = require("./helpers");
var _AndroidCubeEffect = _interopRequireDefault(require("./components/AndroidCubeEffect"));
var _CubeNavigationHorizontal = _interopRequireDefault(require("./components/CubeNavigationHorizontal"));
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
const {
  height,
  width
} = _reactNative.Dimensions.get('window');
const Story = ({
  data,
  unPressedBorderColor,
  pressedBorderColor,
  unPressedAvatarTextColor,
  pressedAvatarTextColor,
  style,
  onStart,
  onClose,
  duration,
  swipeText,
  avatarSize,
  showAvatarText,
  avatarTextStyle,
  onStorySeen,
  renderCloseComponent,
  renderSwipeUpComponent,
  renderTextComponent,
  loadedAnimationBarStyle,
  unloadedAnimationBarStyle,
  animationBarContainerStyle,
  storyUserContainerStyle,
  storyImageStyle,
  storyAvatarImageStyle,
  storyContainerStyle,
  avatarImageStyle,
  avatarWrapperStyle,
  avatarFlatListProps,
  isCommunityStory = false
}) => {
  const [dataState, setDataState] = (0, _react.useState)(data);
  const [isModalOpen, setIsModalOpen] = (0, _react.useState)(false);
  const [currentPage, setCurrentPage] = (0, _react.useState)(0);
  const [selectedData, setSelectedData] = (0, _react.useState)([]);
  const cube = (0, _react.useRef)(null);

  // Component Functions
  const _handleStoryItemPress = (item, index) => {
    const newData = dataState.slice(index);
    if (onStart) {
      onStart(item);
    }
    setCurrentPage(0);
    setSelectedData(newData);
    setIsModalOpen(true);
  };
  (0, _react.useEffect)(() => {
    handleSeen();
  }, [currentPage]);
  const handleSeen = () => {
    const seen = selectedData[currentPage];
    const seenIndex = dataState.indexOf(seen);
    if (seenIndex > 0) {
      var _dataState$seenIndex;
      if (!((_dataState$seenIndex = dataState[seenIndex]) !== null && _dataState$seenIndex !== void 0 && _dataState$seenIndex.seen)) {
        let tempData = dataState;
        dataState[seenIndex] = {
          ...dataState[seenIndex],
          seen: true
        };
        setDataState(tempData);
      }
    }
  };
  function onStoryFinish(state) {
    if (!(0, _helpers.isNullOrWhitespace)(state)) {
      if (state === 'next') {
        const newPage = currentPage + 1;
        if (newPage < selectedData.length) {
          var _cube$current;
          setCurrentPage(newPage);
          cube === null || cube === void 0 || (_cube$current = cube.current) === null || _cube$current === void 0 || _cube$current.scrollTo(newPage);
        } else {
          setIsModalOpen(false);
          setCurrentPage(0);
          if (onClose) {
            onClose(selectedData[selectedData.length - 1]);
          }
        }
      } else if (state === 'previous') {
        const newPage = currentPage - 1;
        if (newPage < 0) {
          setIsModalOpen(false);
          setCurrentPage(0);
        } else {
          var _cube$current2;
          setCurrentPage(newPage);
          cube === null || cube === void 0 || (_cube$current2 = cube.current) === null || _cube$current2 === void 0 || _cube$current2.scrollTo(newPage);
        }
      }
    }
  }
  const renderStoryList = () => selectedData.map((x, i) => {
    return /*#__PURE__*/React.createElement(_StoryListItem.default, {
      duration: duration * 1000,
      key: i,
      userId: x.user_id,
      profileName: x.user_name,
      profileImage: x.user_image,
      stories: x.stories,
      currentPage: currentPage,
      onFinish: onStoryFinish,
      swipeText: swipeText,
      renderSwipeUpComponent: renderSwipeUpComponent,
      renderCloseComponent: renderCloseComponent,
      renderTextComponent: renderTextComponent,
      onClosePress: () => {
        setIsModalOpen(false);
        if (onClose) {
          onClose(x);
        }
      },
      index: i,
      onStorySeen: onStorySeen,
      unloadedAnimationBarStyle: unloadedAnimationBarStyle,
      animationBarContainerStyle: animationBarContainerStyle,
      loadedAnimationBarStyle: loadedAnimationBarStyle,
      storyUserContainerStyle: storyUserContainerStyle,
      storyImageStyle: storyImageStyle,
      storyAvatarImageStyle: storyAvatarImageStyle,
      storyContainerStyle: storyContainerStyle,
      isCommunityStory: isCommunityStory
    });
  });
  const renderCube = () => {
    if (_reactNative.Platform.OS === 'ios') {
      return /*#__PURE__*/React.createElement(_CubeNavigationHorizontal.default, {
        ref: cube,
        callBackAfterSwipe: x => {
          if (x !== currentPage) {
            setCurrentPage(parseInt(x, 10));
          }
        }
      }, renderStoryList());
    } else {
      return /*#__PURE__*/React.createElement(_AndroidCubeEffect.default, {
        ref: cube,
        callBackAfterSwipe: x => {
          if (x !== currentPage) {
            setCurrentPage(parseInt(x, 10));
          }
        }
      }, renderStoryList());
    }
  };
  return /*#__PURE__*/React.createElement(_react.Fragment, null, /*#__PURE__*/React.createElement(_reactNative.View, {
    style: style
  }, /*#__PURE__*/React.createElement(_StoryCircleListView.default, {
    handleStoryItemPress: _handleStoryItemPress,
    data: dataState,
    avatarSize: avatarSize,
    unPressedBorderColor: unPressedBorderColor,
    pressedBorderColor: pressedBorderColor,
    unPressedAvatarTextColor: unPressedAvatarTextColor,
    pressedAvatarTextColor: pressedAvatarTextColor,
    showText: showAvatarText,
    avatarTextStyle: avatarTextStyle,
    avatarWrapperStyle: avatarWrapperStyle,
    avatarImageStyle: avatarImageStyle,
    avatarFlatListProps: avatarFlatListProps,
    isCommunityStory: isCommunityStory
  })), /*#__PURE__*/React.createElement(_reactNativeModalbox.default, {
    style: styles.modal,
    isOpen: isModalOpen,
    onClosed: () => setIsModalOpen(false),
    position: "center",
    swipeToClose: true,
    swipeArea: 250,
    backButtonClose: true,
    coverScreen: true
  }, renderCube()));
};
exports.Story = Story;
const styles = _reactNative.StyleSheet.create({
  modal: {
    flex: 1,
    height,
    width
  }
});
var _default = exports.default = Story;
Story.defaultProps = {
  showAvatarText: true
};
//# sourceMappingURL=Story.js.map