All files / apps/host/src/components/ChatBox ImagePreview.tsx

100% Statements 6/6
100% Branches 2/2
100% Functions 1/1
100% Lines 5/5

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35                            1x 3x 3x 3x   2x                              
import React from 'react';
import { TouchableOpacity, View } from 'react-native';
 
import { CachedImage } from '@repo/ui/components/CachedImage';
import { CloseIcon } from '@repo/ui/icons/Close';
import { useTheme } from '@repo/ui/themes';
 
import { useStyles } from './styles';
 
interface ImagePreviewProps {
  uri: string | null;
  onRemove: () => void;
}
 
export const ImagePreview: React.FC<ImagePreviewProps> = ({ uri, onRemove }) => {
  const styles = useStyles();
  const { theme } = useTheme();
  if (!uri) return null;
 
  return (
    <View style={styles.previewContainer}>
      <View style={styles.previewWrapper}>
        <CachedImage
          source={{ uri, cache: 'web', priority: 'high' }}
          style={styles.imagePreview}
          resizeMode="cover"
        />
        <TouchableOpacity style={styles.removeImageBtn} onPress={onRemove}>
          <CloseIcon width={16} height={16} color={theme.colors.white} />
        </TouchableOpacity>
      </View>
    </View>
  );
};