import React from 'react';
import { Image, View } from 'react-native';
import { useStyles } from './styles';
import CommunityJoinedButton from '../../../../../elements/CommunityJoinedButtonElement/CommunityJoinedButtonElement';
import CommunityJoinButton from '../../../../../elements/CommunityJoinButtonElement/CommunityJoinButtonElement';
import { SvgXml } from 'react-native-svg';
import { community as communityIcon } from '../../../../../../core/assets/icons';
import CommunityPrivateBadge from '../../../../../elements/CommunityPrivateBadge/CommunityPrivateBadge';
import CommunityOfficialBadge from '../../../../../elements/CommunityOfficialBadge/CommunityOfficialBadge';
import CommunityMemeberCount from '../../../../../elements/CommunityMemeberCount/CommunityMemeberCount';
import CommunityDisplayname from '../../../../../elements/CommunityDisplayname/CommunityDisplayname';
import { getFileUrlWithSize } from '../../../../../utils';
import { ComponentID, PageID } from '../../../../../enums';
import { CommunityCategories } from '../../CommunityCategories/CommunityCategories';
export const RecommendedCommunityItem = ({
  community,
  pageId = PageID.WildCardPage
}) => {
  var _community$avatar, _community$avatar2;
  const componentId = ComponentID.recommended_communities;
  const styles = useStyles();
  return /*#__PURE__*/React.createElement(View, {
    style: styles.container
  }, (_community$avatar = community.avatar) !== null && _community$avatar !== void 0 && _community$avatar.fileUrl ? /*#__PURE__*/React.createElement(Image, {
    style: styles.image,
    source: {
      uri: getFileUrlWithSize((_community$avatar2 = community.avatar) === null || _community$avatar2 === void 0 ? void 0 : _community$avatar2.fileUrl)
    },
    resizeMode: "cover"
  }) : /*#__PURE__*/React.createElement(View, {
    style: styles.imagePlaceholder
  }, /*#__PURE__*/React.createElement(SvgXml, {
    xml: communityIcon()
  })), /*#__PURE__*/React.createElement(View, {
    style: styles.detailWrap
  }, /*#__PURE__*/React.createElement(View, {
    style: styles.displayName
  }, !community.isPublic && /*#__PURE__*/React.createElement(CommunityPrivateBadge, {
    pageId: pageId,
    componentId: componentId
  }), /*#__PURE__*/React.createElement(CommunityDisplayname, {
    communityName: community.displayName,
    pageId: pageId,
    componentId: componentId
  }), community.isOfficial && /*#__PURE__*/React.createElement(CommunityOfficialBadge, {
    pageId: pageId,
    componentId: componentId
  })), /*#__PURE__*/React.createElement(View, {
    style: styles.detailBottomWrap
  }, /*#__PURE__*/React.createElement(View, {
    style: styles.detailBottomWrapLeft
  }, /*#__PURE__*/React.createElement(CommunityCategories, {
    categories: community.categories,
    pageId: pageId,
    componentId: componentId
  }), /*#__PURE__*/React.createElement(CommunityMemeberCount, {
    counts: community.membersCount,
    pageId: pageId,
    componentId: componentId
  })), /*#__PURE__*/React.createElement(View, {
    style: styles.detailBottomWrapRight
  }, community.isJoined ? /*#__PURE__*/React.createElement(CommunityJoinedButton, {
    pageId: pageId,
    componentId: componentId,
    communityId: community.communityId
  }) : /*#__PURE__*/React.createElement(CommunityJoinButton, {
    pageId: pageId,
    componentId: componentId,
    communityId: community.communityId
  })))));
};
//# sourceMappingURL=RecommenedCommunityItems.js.map