import React from 'react';
import { FlatList, View, TouchableOpacity } from 'react-native';
import { useAmityElement, useAmityPage, useCommunities, useUser } from '../../hooks';
import TargetItem from './TargetItem/TargetItem';
import { Divider, useTheme } from 'react-native-paper';
import useAuth from '../../../core/hooks/useAuth';
import CloseButtonIconElement from '../../elements/CloseButtonIconElement/CloseButtonIconElement';
import { ComponentID, ElementID } from '../../enums';
import { SafeAreaView } from 'react-native-safe-area-context';
import TextKeyElement from '../../elements/TextKeyElement/TextKeyElement';
import { Typography } from '../../../core/components/Typography/Typography';
import { useStyles } from './styles';
import { Illustration } from '../../features/feed/components/EmptyNewsFeed/Elements';
import { useNavigation } from '@react-navigation/native';
import { CommunityPostSettings } from '@amityco/ts-sdk-react-native';
import { usePostPermission } from '../../hooks/usePostPermission';
const TargetSelectionPage = ({
  pageId,
  hideMyTimelineTarget = false,
  onSelectFeed,
  onClickClose
}) => {
  const {
    client
  } = useAuth();
  const defaultTheme = useTheme();
  const user = useUser(client === null || client === void 0 ? void 0 : client.userId);
  const {
    communities,
    onNextCommunityPage,
    loading
  } = useCommunities();
  const {
    themeStyles,
    accessibilityId
  } = useAmityPage({
    pageId
  });
  const navigation = useNavigation();
  const theme = themeStyles || defaultTheme;
  const styles = useStyles(theme);
  const {
    config: myTimelineConfig
  } = useAmityElement({
    pageId,
    componentId: ComponentID.WildCardComponent,
    elementId: ElementID.my_timeline_text
  });
  const renderItem = ({
    item
  }) => {
    const target = /*#__PURE__*/React.createElement(TargetItem, {
      key: item.communityId,
      displayName: item.displayName,
      isBadgeShow: item.isOfficial,
      isPrivate: !item.isPublic,
      onSelect: () => onSelectFeed({
        targetId: item.communityId,
        targetName: item.displayName,
        targetType: 'community',
        community: item,
        postSetting: item.postSetting,
        isPublic: item.isPublic
      }),
      avatarElementId: ElementID.community_avatar,
      avatarFileId: item.avatarFileId
    });
    if ((item === null || item === void 0 ? void 0 : item.postSetting) === CommunityPostSettings.ONLY_ADMIN_CAN_POST) {
      return /*#__PURE__*/React.createElement(AdminOnlyCommunity, {
        community: item
      }, target);
    }
    return target;
  };
  return /*#__PURE__*/React.createElement(SafeAreaView, {
    style: styles.container,
    testID: accessibilityId,
    accessibilityLabel: accessibilityId
  }, /*#__PURE__*/React.createElement(View, {
    style: styles.header
  }, /*#__PURE__*/React.createElement(TouchableOpacity, {
    style: styles.closeButton,
    onPress: () => {
      onClickClose === null || onClickClose === void 0 || onClickClose();
      if (navigation.canGoBack()) {
        navigation.goBack();
      }
    }
  }, /*#__PURE__*/React.createElement(CloseButtonIconElement, {
    style: styles.closeIcon,
    pageID: pageId
  })), /*#__PURE__*/React.createElement(TextKeyElement, {
    style: styles.title,
    pageID: pageId,
    componentID: ComponentID.WildCardComponent,
    elementID: ElementID.title
  })), !hideMyTimelineTarget && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(TargetItem, {
    pageId: pageId,
    displayNameElementId: ElementID.my_timeline_text,
    displayName: (myTimelineConfig === null || myTimelineConfig === void 0 ? void 0 : myTimelineConfig.text) || 'My timeline',
    avatarElementId: ElementID.my_timeline_avatar,
    onSelect: () => user && onSelectFeed({
      targetId: user === null || user === void 0 ? void 0 : user.userId,
      targetName: (myTimelineConfig === null || myTimelineConfig === void 0 ? void 0 : myTimelineConfig.text) || 'My timeline',
      targetType: 'user'
    }),
    avatarCustomUrl: user === null || user === void 0 ? void 0 : user.avatarCustomUrl,
    avatarFileId: user === null || user === void 0 ? void 0 : user.avatarFileId
  }), /*#__PURE__*/React.createElement(View, {
    style: styles.divider
  }, /*#__PURE__*/React.createElement(Divider, {
    theme: {
      colors: {
        outlineVariant: theme.colors.baseShade4
      }
    }
  })), /*#__PURE__*/React.createElement(Typography.Body, {
    style: styles.communityHeader
  }, "My communities")), !loading && ((communities === null || communities === void 0 ? void 0 : communities.length) === 0 || !communities) && /*#__PURE__*/React.createElement(View, {
    style: styles.noCommunityContainer
  }, /*#__PURE__*/React.createElement(Illustration, null), /*#__PURE__*/React.createElement(Typography.TitleBold, {
    style: styles.noCommunityTitle
  }, "You haven't joined any communities yet.")), /*#__PURE__*/React.createElement(FlatList, {
    data: communities,
    renderItem: renderItem,
    onEndReached: onNextCommunityPage,
    keyExtractor: item => item.communityId.toString()
  }));
};
export default /*#__PURE__*/React.memo(TargetSelectionPage);
function AdminOnlyCommunity({
  community,
  children
}) {
  const hasPostPermission = usePostPermission({
    community
  });
  return hasPostPermission ? children : null;
}
//# sourceMappingURL=TargetSelectionPage.js.map