1
|
import { Box, Center, HStack, Image, Pressable, ScrollView, Text, VStack } from "native-base"
|
2
|
import { useEffect } from "react"
|
3
|
import { DrawerScreenProps } from "@react-navigation/drawer"
|
4
|
import { RootStackParamList } from "../../pages/Navigation"
|
5
|
import { ItemPreviewMissingImage } from "./ItemPreviewMissingImage"
|
6
|
import { ITEM_PREVIEW_IMG_PREFIX_URL } from "../../api/constants"
|
7
|
|
8
|
interface ItemPreviewProps {
|
9
|
caption: string
|
10
|
title: string
|
11
|
name?: string
|
12
|
image?: string
|
13
|
itemId: string
|
14
|
inventoryLabel: string
|
15
|
navigation: any
|
16
|
}
|
17
|
|
18
|
const ItemPreview = (props: ItemPreviewProps) => {
|
19
|
|
20
|
return (
|
21
|
<>
|
22
|
<Pressable
|
23
|
onPress={() => props.navigation.navigate("Item", {itemId: props.itemId})}
|
24
|
key={props.itemId}
|
25
|
>
|
26
|
<HStack
|
27
|
space={ 2 }
|
28
|
flex={ 1 }
|
29
|
alignItems={ "flex-start" }
|
30
|
key={props.itemId}
|
31
|
>
|
32
|
{props.image ? (
|
33
|
<Image
|
34
|
source={ {uri: `${ITEM_PREVIEW_IMG_PREFIX_URL}${props.image}`} }
|
35
|
size={ "sm" }
|
36
|
alt={ props.image }
|
37
|
/>
|
38
|
) : (
|
39
|
<ItemPreviewMissingImage inventoryLabel={props.inventoryLabel} h={65} w={65} />
|
40
|
)}
|
41
|
<VStack h={70} maxW={"80%"}>
|
42
|
<Text fontSize={"sm"} italic>{ props.name }</Text>
|
43
|
<Text fontSize={"sm"} bold noOfLines={1}>{ props.caption }</Text>
|
44
|
<Text fontSize={"2xs"} lineHeight={"2xs"} noOfLines={2}>{ props.title }</Text>
|
45
|
</VStack>
|
46
|
</HStack>
|
47
|
</Pressable>
|
48
|
</>
|
49
|
)
|
50
|
}
|
51
|
|
52
|
export default ItemPreview
|