"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _reactNative = require("react-native");
var _react = require("react");
var _styles = require("./styles");
var _enums = require("../../enums");
var _hooks = require("../../hooks");
var _Header = _interopRequireDefault(require("./components/Header"));
var _Feed = _interopRequireDefault(require("./components/Feed/Feed"));
var _Tab = _interopRequireWildcard(require("./components/Tab"));
var _ImageFeed = _interopRequireDefault(require("./components/ImageFeed"));
var _VideoFeed = _interopRequireDefault(require("./components/VideoFeed"));
var _components = require("./components");
var _CommunityCreatePostButton = _interopRequireDefault(require("../../elements/CommunityCreatePostButton/CommunityCreatePostButton"));
var _reactNativeSvg = require("react-native-svg");
var _BehaviourProvider = require("../../providers/BehaviourProvider");
var _icons = require("../../../core/assets/icons");
var _native = require("@react-navigation/native");
var _reactNativePaper = require("react-native-paper");
var _PinnedPost = _interopRequireDefault(require("./components/PinnedPost/PinnedPost"));
var _usePostPermission = require("../../../social/hooks/usePostPermission");
var _utils = require("../../../social/utils");
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
const AmityCommunityProfilePage = ({
  defaultCommunityId
}) => {
  var _route$params;
  const pageId = _enums.PageID.community_profile_page;
  const {
    accessibilityId,
    themeStyles
  } = (0, _hooks.useAmityPage)({
    pageId
  });
  const route = (0, _native.useRoute)();
  const routeCommunityId = route === null || route === void 0 || (_route$params = route.params) === null || _route$params === void 0 ? void 0 : _route$params.communityId;
  const navigation = (0, _native.useNavigation)();
  const [communityId, setCommunityId] = (0, _react.useState)();
  const [currentTab, setCurrentTab] = (0, _react.useState)(_Tab.CommunityProfileTab.community_feed);
  const [headerHeight, setHeaderHeight] = (0, _react.useState)(0);
  const [isScrolledPastHeader, setIsScrolledPastHeader] = (0, _react.useState)(false);
  const [isScrolling, setIsScrolling] = (0, _react.useState)(false);
  const [isLoadingMore, setIsLoadingMore] = (0, _react.useState)(false);
  const animatedOpacity = (0, _react.useRef)(new _reactNative.Animated.Value(0)).current;
  const animatedTranslateY = (0, _react.useRef)(new _reactNative.Animated.Value(15)).current;
  const stickyHeaderAnimation = (0, _react.useRef)(null);
  const scrollY = (0, _react.useRef)(new _reactNative.Animated.Value(0)).current;
  const feedRef = (0, _react.useRef)(null);
  const styles = (0, _styles.useStyles)(themeStyles);
  (0, _react.useEffect)(() => {
    const routes = navigation.getState().routes;
    if (defaultCommunityId && routes.length === 1) {
      setCommunityId(defaultCommunityId);
    } else if (routeCommunityId) {
      setCommunityId(routeCommunityId);
    }
    return () => {
      setCommunityId(undefined);
    };
  }, [defaultCommunityId, routeCommunityId, navigation]);
  (0, _react.useEffect)(() => {
    if (isScrolledPastHeader) {
      // Reset animation values
      animatedOpacity.setValue(0);
      animatedTranslateY.setValue(15);

      // Run entrance animation
      stickyHeaderAnimation.current = _reactNative.Animated.parallel([_reactNative.Animated.timing(animatedOpacity, {
        toValue: 1,
        duration: 200,
        useNativeDriver: true
      }), _reactNative.Animated.timing(animatedTranslateY, {
        toValue: 0,
        duration: 250,
        easing: _reactNative.Easing.out(_reactNative.Easing.ease),
        useNativeDriver: true
      })]);
      stickyHeaderAnimation.current.start();
    }
    return () => {
      var _stickyHeaderAnimatio;
      (_stickyHeaderAnimatio = stickyHeaderAnimation.current) === null || _stickyHeaderAnimatio === void 0 || _stickyHeaderAnimatio.stop();
    };
  }, [isScrolledPastHeader, animatedOpacity, animatedTranslateY]);
  const handleLoadMore = (0, _react.useCallback)(() => {
    setIsLoadingMore(true);
    if (feedRef.current) {
      feedRef.current.handleLoadMore();
    }
    setTimeout(() => setIsLoadingMore(false), 2000);
  }, [feedRef]);
  const handleScroll = event => {
    const {
      contentOffset,
      layoutMeasurement,
      contentSize
    } = event.nativeEvent;
    const yOffset = contentOffset.y;
    const isPastHeader = yOffset >= headerHeight - 100;
    if (isPastHeader !== isScrolledPastHeader) {
      setIsScrolledPastHeader(isPastHeader);
    }
    if (yOffset > 0) {
      setIsScrolling(true);
    } else {
      setIsScrolling(false);
    }
    const isScrollEndReached = layoutMeasurement.height + contentOffset.y + 200 >= contentSize.height;
    if (isScrollEndReached && feedRef.current && !isLoadingMore) {
      handleLoadMore();
    }
  };
  const renderCommunityProfileTab = (0, _react.useCallback)(() => {
    return /*#__PURE__*/React.createElement(_Tab.default, {
      pageId: pageId,
      currentTab: currentTab,
      onTabChange: tab => {
        setCurrentTab(tab);
      }
    });
  }, [pageId, currentTab]);
  const renderTabComponent = () => {
    switch (currentTab) {
      case _Tab.CommunityProfileTab.community_feed:
        return /*#__PURE__*/React.createElement(_Feed.default, {
          pageId: pageId,
          communityId: communityId,
          ref: feedRef
        });
      case _Tab.CommunityProfileTab.community_pin:
        return /*#__PURE__*/React.createElement(_PinnedPost.default, {
          communityId: communityId
        });
      case _Tab.CommunityProfileTab.community_image_feed:
        return /*#__PURE__*/React.createElement(_ImageFeed.default, {
          pageId: pageId,
          communityId: communityId,
          ref: feedRef
        });
      case _Tab.CommunityProfileTab.community_video_feed:
        return /*#__PURE__*/React.createElement(_VideoFeed.default, {
          pageId: pageId,
          communityId: communityId,
          ref: feedRef
        });
      default:
        return null;
    }
  };
  return /*#__PURE__*/React.createElement(_reactNative.View, {
    style: styles.container
  }, isScrolling && !isScrolledPastHeader && /*#__PURE__*/React.createElement(_reactNative.View, {
    style: styles.smallHeaderNavigationWrap
  }, /*#__PURE__*/React.createElement(_components.TopBar, {
    pageId: pageId,
    componentId: _enums.ComponentID.community_header,
    communityId: communityId,
    isFromComponent: !!defaultCommunityId
  })), isScrolledPastHeader && /*#__PURE__*/React.createElement(_reactNative.Animated.View, {
    style: [styles.stickyHeaderContainer, {
      opacity: animatedOpacity,
      transform: [{
        translateY: animatedTranslateY
      }]
    }]
  }, /*#__PURE__*/React.createElement(_Header.default, {
    pageId: pageId,
    communityId: communityId,
    isScrolled: true,
    isScrolling: isScrolling,
    isFromComponent: !!defaultCommunityId
  }), /*#__PURE__*/React.createElement(_reactNative.View, {
    style: styles.smallHeaderCommunityTabWrap
  }, renderCommunityProfileTab())), /*#__PURE__*/React.createElement(_reactNative.Animated.ScrollView, {
    testID: accessibilityId,
    style: styles.container,
    accessibilityLabel: accessibilityId,
    onScroll: _reactNative.Animated.event([{
      nativeEvent: {
        contentOffset: {
          y: scrollY
        }
      }
    }], {
      useNativeDriver: true,
      listener: handleScroll
    }),
    scrollEventThrottle: 16
  }, /*#__PURE__*/React.createElement(_Header.default, {
    pageId: pageId,
    communityId: communityId,
    onHeightChange: setHeaderHeight,
    isScrolling: isScrolling,
    isFromComponent: !!defaultCommunityId
  }), renderCommunityProfileTab(), renderTabComponent()), /*#__PURE__*/React.createElement(CommunityProfileActions, {
    pageId: pageId,
    styles: styles,
    communityId: communityId
  }));
};
var _default = exports.default = /*#__PURE__*/(0, _react.memo)(AmityCommunityProfilePage);
function CommunityProfileActions({
  pageId,
  communityId,
  styles
}) {
  const {
    community
  } = (0, _hooks.useCommunity)(communityId);
  const {
    colors
  } = (0, _reactNativePaper.useTheme)();
  const [isBottomSheetVisible, setIsBottomSheetVisible] = (0, _react.useState)(false);
  const {
    AmityPostTargetSelectionPageBehavior,
    AmityPollTargetSelectionPageBehavior,
    AmityStoryTargetSelectionPageBehavior,
    AmityLivestreamPostTargetSelectionPageBehavior
  } = (0, _BehaviourProvider.useBehaviour)();
  const navigation = (0, _native.useNavigation)();
  const {
    hasStoryPermission
  } = (0, _hooks.useStoryPermission)(communityId);
  const hasPostPermission = (0, _usePostPermission.usePostPermission)({
    community
  });
  const openBottomSheet = () => setIsBottomSheetVisible(true);
  const closeBottomSheet = () => setIsBottomSheetVisible(false);
  const handleCreatePost = () => {
    closeBottomSheet();
    if (AmityPostTargetSelectionPageBehavior.goToPostComposerPage) {
      return AmityPostTargetSelectionPageBehavior.goToPostComposerPage({
        community,
        targetId: communityId,
        targetType: 'community'
      });
    }
    return navigation.navigate('CreatePost', {
      community: (0, _utils.serializeCommunity)(community),
      targetId: communityId,
      targetType: 'community'
    });
  };
  const handleCreateStory = () => {
    closeBottomSheet();
    if (AmityStoryTargetSelectionPageBehavior.goToStoryComposerPage) {
      return AmityStoryTargetSelectionPageBehavior.goToStoryComposerPage({
        targetId: communityId,
        targetType: 'community'
      });
    }
    navigation.navigate('CreateStory', {
      targetId: communityId,
      targetType: 'community'
    });
  };
  const handleCreateLivestream = () => {
    closeBottomSheet();
    if (AmityLivestreamPostTargetSelectionPageBehavior.goToCreateLivestreamPage) {
      return AmityLivestreamPostTargetSelectionPageBehavior.goToCreateLivestreamPage({
        targetId: communityId,
        targetType: 'community',
        targetName: community === null || community === void 0 ? void 0 : community.displayName
      });
    }
    navigation.navigate('CreateLivestream', {
      targetId: communityId,
      targetType: 'community',
      targetName: community === null || community === void 0 ? void 0 : community.displayName
    });
  };
  const handleCreatePoll = () => {
    closeBottomSheet();
    if (AmityPollTargetSelectionPageBehavior.goToPollPostComposerPage) {
      return AmityPollTargetSelectionPageBehavior.goToPollPostComposerPage({
        targetId: communityId,
        targetType: 'community',
        targetName: community === null || community === void 0 ? void 0 : community.displayName,
        community
      });
    }
    navigation.navigate('PollPostComposer', {
      targetId: communityId,
      targetType: 'community',
      targetName: community === null || community === void 0 ? void 0 : community.displayName,
      community
    });
  };
  if (!(community !== null && community !== void 0 && community.isJoined) || !hasPostPermission && !hasStoryPermission) return null;
  return /*#__PURE__*/React.createElement(_react.Fragment, null, /*#__PURE__*/React.createElement(_CommunityCreatePostButton.default, {
    pageId: pageId,
    onPress: openBottomSheet
  }), /*#__PURE__*/React.createElement(_reactNative.Modal, {
    transparent: true,
    animationType: "fade",
    visible: isBottomSheetVisible,
    onRequestClose: closeBottomSheet,
    statusBarTranslucent: true
  }, /*#__PURE__*/React.createElement(_reactNative.Pressable, {
    onPress: closeBottomSheet,
    style: styles.modalOverlay
  }, /*#__PURE__*/React.createElement(_reactNative.Animated.View, {
    style: styles.modalContent
  }, /*#__PURE__*/React.createElement(_reactNative.View, {
    style: styles.dragHandle
  }), hasPostPermission && /*#__PURE__*/React.createElement(_reactNative.TouchableOpacity, {
    onPress: handleCreatePost,
    style: styles.bottomSheetOption
  }, /*#__PURE__*/React.createElement(_reactNativeSvg.SvgXml, {
    xml: (0, _icons.post)({
      fill: colors.base
    }),
    width: 24,
    height: 24
  }), /*#__PURE__*/React.createElement(_reactNative.Text, {
    style: styles.bottomSheetOptionText
  }, "Post")), hasStoryPermission && /*#__PURE__*/React.createElement(_reactNative.TouchableOpacity, {
    onPress: handleCreateStory,
    style: styles.bottomSheetOption
  }, /*#__PURE__*/React.createElement(_reactNativeSvg.SvgXml, {
    width: 24,
    height: 24,
    xml: (0, _icons.story)({
      fill: colors.base
    }),
    fill: colors.base
  }), /*#__PURE__*/React.createElement(_reactNative.Text, {
    style: styles.bottomSheetOptionText
  }, "Story")), hasPostPermission && /*#__PURE__*/React.createElement(_reactNative.TouchableOpacity, {
    onPress: handleCreatePoll,
    style: styles.bottomSheetOption
  }, /*#__PURE__*/React.createElement(_reactNativeSvg.SvgXml, {
    width: 24,
    height: 24,
    xml: (0, _icons.poll)(),
    color: colors.base
  }), /*#__PURE__*/React.createElement(_reactNative.Text, {
    style: styles.bottomSheetOptionText
  }, "Poll")), hasPostPermission && /*#__PURE__*/React.createElement(_reactNative.TouchableOpacity, {
    onPress: handleCreateLivestream,
    style: styles.bottomSheetOption
  }, /*#__PURE__*/React.createElement(_reactNativeSvg.SvgXml, {
    width: 24,
    height: 24,
    xml: (0, _icons.livestream)(),
    color: colors.base
  }), /*#__PURE__*/React.createElement(_reactNative.Text, {
    style: styles.bottomSheetOptionText
  }, "Livestream"))))));
}
//# sourceMappingURL=index.js.map