import { memo, useCallback } from 'react';
import { Pressable, View } from 'react-native';
import { ComponentID, PageID } from '../../../../enums';
import { useStyles } from './styles';
import { useAmityComponent } from '../../../../hooks';
import TrendingCommunityTitleComponent from './TrendingCommunityTitle/TrendingCommunityTitle';
import CommunityRowItem from '../../../../components/CommunityRowItem/CommunityRowItem';
import { useExplore } from '../../../../providers/ExploreProvider';
import { useNavigation } from '@react-navigation/native';
const AmityTrendingCommunitiesCommunity = ({
  pageId = PageID.WildCardPage
}) => {
  const componentId = ComponentID.trending_communities;
  const {
    isExcluded,
    accessibilityId
  } = useAmityComponent({
    pageId,
    componentId
  });
  const {
    trendingCommunities
  } = useExplore();
  const styles = useStyles();
  const navigation = useNavigation();
  const onPressCommunity = useCallback(({
    communityId
  }) => {
    navigation.navigate('CommunityProfilePage', {
      communityId
    });
  }, [navigation]);
  if (isExcluded || (trendingCommunities === null || trendingCommunities === void 0 ? void 0 : trendingCommunities.length) === 0) return null;
  return /*#__PURE__*/React.createElement(View, {
    testID: accessibilityId
  }, /*#__PURE__*/React.createElement(TrendingCommunityTitleComponent, {
    pageId: pageId
  }), /*#__PURE__*/React.createElement(View, {
    style: styles.container
  }, trendingCommunities === null || trendingCommunities === void 0 ? void 0 : trendingCommunities.map((community, index) => {
    return /*#__PURE__*/React.createElement(Pressable, {
      key: community.communityId,
      onPress: () => onPressCommunity({
        communityId: community.communityId
      })
    }, /*#__PURE__*/React.createElement(CommunityRowItem, {
      pageId: pageId,
      community: community,
      label: `0${index + 1}`,
      componentId: componentId
    }));
  })));
};
export default /*#__PURE__*/memo(AmityTrendingCommunitiesCommunity);
//# sourceMappingURL=TrendingCommunities.js.map