import { useCallback } from 'react';
import { PageID, ComponentID, ElementID } from '../../../../enums';
import { useAmityElement } from '../../../../hooks';
import LinearGradient from 'react-native-linear-gradient';
import { Image, StyleSheet, View } from 'react-native';
import { TopBar } from '../../components';
import useAuth from '../../../../../core/hooks/useAuth';
export function CommunityCover({
  pageId = PageID.WildCardPage,
  componentId = ComponentID.WildCardComponent,
  community,
  smallHeader = false,
  hideButtons = false,
  isFromComponent
}) {
  const {
    apiRegion
  } = useAuth();
  const elementId = ElementID.community_cover;
  const {
    accessibilityId,
    themeStyles
  } = useAmityElement({
    pageId,
    componentId,
    elementId
  });
  const styles = StyleSheet.create({
    smallContainer: {
      height: 100
    },
    placehoder: {
      width: '100%',
      height: 187.5
    },
    coverImage: {
      width: '100%',
      height: 187.5
    }
  });
  const renderImage = useCallback(() => {
    if (community.avatarFileId) {
      return /*#__PURE__*/React.createElement(Image, {
        source: {
          uri: `https://api.${apiRegion}.amity.co/api/v3/files/${community.avatarFileId}/download?size=medium`
        },
        style: [styles.coverImage, smallHeader ? styles.smallContainer : {}],
        blurRadius: smallHeader ? 10 : 0
      });
    } else {
      return /*#__PURE__*/React.createElement(LinearGradient, {
        colors: [themeStyles.colors.baseShade3, themeStyles.colors.baseShade2],
        style: [styles.placehoder, smallHeader ? styles.smallContainer : {}],
        start: {
          x: 0,
          y: 1
        },
        end: {
          x: 0,
          y: 0
        }
      });
    }
  }, [community.avatarFileId, smallHeader, styles, themeStyles, apiRegion]);
  return /*#__PURE__*/React.createElement(View, {
    testID: accessibilityId
  }, renderImage(), !hideButtons && /*#__PURE__*/React.createElement(TopBar, {
    pageId: pageId,
    componentId: componentId,
    communityId: community.communityId,
    isFromComponent: isFromComponent
  }));
}
//# sourceMappingURL=CommunityCover.js.map