1import { ImageSource } from 'expo-image';
2import * as React from 'react';
3import { StyleSheet, View } from 'react-native';
4
5import ComparisonImage from './ComparisonImage';
6
7type ComparisonRowProps = {
8  source: ImageSource;
9  blurhash: ImageSource;
10  thumbhash: string;
11  showRealImage?: boolean;
12  showGrid?: boolean;
13};
14
15export default function ComparisonRow({
16  source,
17  blurhash,
18  thumbhash,
19  showRealImage = false,
20  showGrid = false,
21}: ComparisonRowProps) {
22  return (
23    <View style={styles.rowContainer}>
24      <ComparisonImage source={source} showGrid={showGrid} transition={0} />
25      <ComparisonImage
26        source={showRealImage ? source : null}
27        placeholder={blurhash}
28        showGrid={showGrid}
29      />
30      <ComparisonImage
31        source={showRealImage ? source : null}
32        placeholder={{ thumbhash }}
33        showGrid={showGrid}
34      />
35    </View>
36  );
37}
38const styles = StyleSheet.create({
39  rowContainer: {
40    flexDirection: 'row',
41    justifyContent: 'center',
42    gap: 15,
43  },
44});
45