import { rgba } from 'polished';
import { PageID } from '../../../../../enums';
import { useStyles } from './styles';
import { SvgXml } from 'react-native-svg';
import { ImageButton } from '../../../../../elements';
import { getFileUrlWithSize } from '../../../../../utils';
import { imageUpload } from '../../../../../../core/assets/icons';
import CameraButton from '../../../../../elements/CameraButton';
import LinearGradient from 'react-native-linear-gradient';
import { useBottomSheet } from '../../../../../../core/stores/slices/bottomSheetSlice';
import { Image, Platform, TouchableOpacity, View } from 'react-native';
import { CircularProgressIndicator } from '../../../../../components/CircularProgressIndicator';
function CoverImageUpload({
  value,
  progress,
  onChange,
  openCamera,
  openImageGallery
}) {
  const {
    styles,
    theme
  } = useStyles();
  const {
    openBottomSheet,
    closeBottomSheet
  } = useBottomSheet();
  const onImageFromCamera = async () => {
    closeBottomSheet();
    const file = await openCamera({
      mediaType: 'photo',
      quality: 1,
      includeExtra: true,
      saveToPhotos: false,
      presentationStyle: 'overFullScreen'
    });
    onChange(file || null);
  };
  const onImageUpload = async () => {
    closeBottomSheet();
    const file = await openImageGallery({
      quality: 1,
      mediaType: 'photo',
      selectionLimit: 1,
      includeExtra: true
    });
    onChange(file || null);
  };
  return /*#__PURE__*/React.createElement(View, {
    style: styles.container
  }, value ? /*#__PURE__*/React.createElement(Image, {
    style: styles.uploadedImage,
    source: {
      uri: getFileUrlWithSize(value.fileUrl)
    }
  }) : /*#__PURE__*/React.createElement(View, {
    style: styles.defaultImage
  }), /*#__PURE__*/React.createElement(LinearGradient, {
    locations: [1, 1],
    style: styles.imageOverlay,
    colors: value ? ['rgba(0,0,0,0.5)', 'rgba(0,0,0,0.5)'] : ['rgba(0,0,0,0.5)', theme.colors.primaryShade3]
  }), progress > 0 ? /*#__PURE__*/React.createElement(View, {
    style: styles.button
  }, /*#__PURE__*/React.createElement(CircularProgressIndicator, {
    size: 24,
    strokeWidth: 2.3,
    progress: progress,
    progressColor: theme.colors.primary,
    backgroundColor: theme.colors.background
  })) : /*#__PURE__*/React.createElement(TouchableOpacity, {
    style: styles.button,
    onPress: () => openBottomSheet({
      content: /*#__PURE__*/React.createElement(View, null, /*#__PURE__*/React.createElement(CameraButton, {
        onPress: onImageFromCamera,
        pageId: PageID.community_setup_page
      }), /*#__PURE__*/React.createElement(ImageButton, {
        onPress: onImageUpload,
        pageId: PageID.community_setup_page
      }))
    })
  }, /*#__PURE__*/React.createElement(SvgXml, {
    width: 32,
    height: 32,
    xml: imageUpload(),
    color: rgba(theme.colors.background, Platform.OS === 'android' ? 1 : 0.8)
  })));
}
export default CoverImageUpload;
//# sourceMappingURL=index.js.map