Revize f4af30c8
Přidáno uživatelem Fantič před více než 1 rok
| src/components/item/ItemTabBar.tsx | ||
|---|---|---|
| 1 |
import { HStack, CircleIcon, View, ScrollView, Button, Center, Heading, Pressable, Text, Box, Container, VStack, Icon, ArrowBackIcon, ChevronLeftIcon, ChevronRightIcon, useToast } from "native-base";
|
|
| 1 |
import { HStack, CircleIcon, View, ScrollView, Button, Center, Heading, Pressable, Text, Box, Container, VStack, Icon, ArrowBackIcon, ChevronLeftIcon, ChevronRightIcon, useToast, Divider } from "native-base";
|
|
| 2 | 2 |
import { CertaintyWithColors } from "../../stores/reducers/itemSlice";
|
| 3 | 3 |
import { Certainty, Concordance } from "../../types/item";
|
| 4 | 4 |
import LoadingBox from "../loading/LoadingBox"; |
| ... | ... | |
| 7 | 7 |
import { InfoToast } from "../toast/InfoToast";
|
| 8 | 8 |
|
| 9 | 9 |
// custom render Tab |
| 10 |
const ItemTabBar = (props: { navigationState: { routes: any[] }, concordances: Concordance[], index: number, onIndexChange: any, onBackPressed: any, navigation: DrawerNavigationProp<RootStackParamList, "Item", undefined>, nextItem?: string | boolean, prevItem?:string | boolean }) => {
|
|
| 10 |
const ItemTabBar = (props: { navigationState: { routes: any[] }, concordances: Concordance[], index: number, onIndexChange: any, onBackPressed: any, navigation: DrawerNavigationProp<RootStackParamList, "Item", undefined>, nextItem?: string | boolean, prevItem?: string | boolean }) => {
|
|
| 11 | 11 |
|
| 12 | 12 |
const { concordances, onIndexChange, index, onBackPressed, nextItem, prevItem } = props
|
| 13 | 13 |
|
| 14 | 14 |
const toast = useToast(); |
| 15 | 15 |
|
| 16 |
console.log(concordances) |
|
| 17 |
|
|
| 16 | 18 |
if (concordances && concordances.length > 0) {
|
| 17 | 19 |
return ( |
| 18 | 20 |
<VStack> |
| 19 |
<HStack h="16" > |
|
| 21 |
{/* <HStack h="16" >
|
|
| 20 | 22 |
<HStack width="50%"> |
| 21 | 23 |
<Button variant="ghost" size="lg" marginLeft={0}
|
| 22 | 24 |
onPress={onBackPressed}
|
| ... | ... | |
| 69 | 71 |
</Button> |
| 70 | 72 |
</HStack> |
| 71 | 73 |
</HStack> |
| 72 |
</HStack> |
|
| 73 |
<View h="8">
|
|
| 74 |
</HStack> */}
|
|
| 75 |
<View height={16} backgroundColor={"#F5F4F1"}>
|
|
| 74 | 76 |
<ScrollView contentContainerStyle={{ flexGrow: 1 }} flex="1" horizontal={true}>
|
| 75 | 77 |
{props.navigationState.routes.length > 1 ? (
|
| 76 | 78 |
<HStack borderBottomWidth={1} flex="1" borderColor="light.400">
|
| 77 | 79 |
{props.navigationState.routes.map((route, i) => {
|
| 78 | 80 |
return ( |
| 79 |
<Pressable key={i} onPress={() => { onIndexChange(i) }}>
|
|
| 80 |
<HStack alignItems={"center"} width="32" borderColor="light.400" height="100%" borderBottomWidth={i == index ? 2 : 0}>
|
|
| 81 |
<Pressable onPress={() => { onIndexChange(i) }} width="100%">
|
|
| 82 |
<VStack alignItems={"center"} >
|
|
| 83 |
<HStack alignItems={"center"} width={32}>
|
|
| 81 | 84 |
<CircleIcon |
| 82 |
marginLeft="5" |
|
| 83 | 85 |
size="2" |
| 84 | 86 |
color={CertaintyWithColors[concordances[i]?.cert ?? Certainty.Unknown].color}
|
| 85 | 87 |
/> |
| 86 |
<Text marginLeft="5%"> |
|
| 87 |
{i == index ? <Text bold>{concordances[i]?.id}</Text> : concordances[i]?.id}
|
|
| 88 |
|
|
| 88 |
<Text marginLeft={1}>
|
|
| 89 |
<Text bold>{concordances[i]?.id}</Text>
|
|
| 89 | 90 |
</Text> |
| 90 | 91 |
</HStack> |
| 91 |
</Pressable> |
|
| 92 |
{i == index && <Divider color="primary" borderWidth={1} width={30} mt={2} />}
|
|
| 93 |
</VStack> |
|
| 94 |
|
|
| 95 |
</Pressable> |
|
| 92 | 96 |
); |
| 93 | 97 |
})} |
| 94 | 98 |
</HStack> |
| 95 | 99 |
) : ( |
| 96 | 100 |
// One item only |
| 101 |
|
|
| 102 |
|
|
| 97 | 103 |
<Pressable onPress={() => { onIndexChange(0) }} width="100%">
|
| 98 |
<HStack alignItems={"center"} width="100%" borderColor="light.400" height="100%" borderBottomWidth={2}>
|
|
| 99 |
<CircleIcon |
|
| 100 |
marginLeft="42%" |
|
| 101 |
size="2" |
|
| 102 |
color={CertaintyWithColors[concordances[0]?.cert ?? Certainty.Unknown].color}
|
|
| 103 |
/> |
|
| 104 |
<Text marginLeft="2%"> |
|
| 105 |
<Text bold>{concordances[0]?.id}</Text>
|
|
| 106 |
</Text> |
|
| 107 |
</HStack> |
|
| 108 |
</Pressable> |
|
| 104 |
<VStack alignItems={"center"} >
|
|
| 105 |
<HStack alignItems={"center"} width="100%">
|
|
| 106 |
<CircleIcon |
|
| 107 |
size="2" |
|
| 108 |
color={CertaintyWithColors[concordances[0]?.cert ?? Certainty.Unknown].color}
|
|
| 109 |
/> |
|
| 110 |
<Text marginLeft={1}>
|
|
| 111 |
<Text bold>{concordances[0]?.id}</Text>
|
|
| 112 |
</Text> |
|
| 113 |
</HStack> |
|
| 114 |
<Divider color="primary" borderWidth={1} width={30} mt={2} />
|
|
| 115 |
</VStack> |
|
| 116 |
|
|
| 117 |
</Pressable> |
|
| 109 | 118 |
)} |
| 110 | 119 |
</ScrollView> |
| 111 | 120 |
</View> |
| src/components/item/ItemView.tsx | ||
|---|---|---|
| 1 |
import { Center, Box, VStack, Button, HStack, Text, Image, ScrollView, View, Spacer, Card, Heading, Switch, Flex, ChevronLeftIcon, ChevronRightIcon } from "native-base"
|
|
| 1 |
import { Center, Box, VStack, Button, HStack, Text, Image, ScrollView, View, Spacer, Card, Heading, Switch, Flex, ChevronLeftIcon, ChevronRightIcon, Divider, Pressable } from "native-base"
|
|
| 2 | 2 |
import React, { useCallback, useEffect, useState } from "react"
|
| 3 | 3 |
import { Item } from "../../types/item"
|
| 4 | 4 |
import { Note } from "../../types/note"
|
| ... | ... | |
| 14 | 14 |
import { Dimensions } from "react-native";
|
| 15 | 15 |
import { DrawerNavigationProp } from "@react-navigation/drawer"
|
| 16 | 16 |
import { RootStackParamList } from "../../pages/Navigation"
|
| 17 |
import { select } from "d3"
|
|
| 17 | 18 |
|
| 18 | 19 |
interface ItemDetailProps {
|
| 19 | 20 |
item: Item, |
| ... | ... | |
| 23 | 24 |
navigation: DrawerNavigationProp<RootStackParamList, "Item", undefined> |
| 24 | 25 |
} |
| 25 | 26 |
|
| 26 |
const ItemDetail = (props: { item: Item, itemLoading: boolean }) => {
|
|
| 27 |
const ItemDetail = (props: ItemDetailProps) => {
|
|
| 27 | 28 |
const item = props.item; |
| 28 | 29 |
|
| 29 | 30 |
const [selectedImage, setSelectedImage] = useState<number>(0); |
| 30 | 31 |
|
| 32 |
const [images, setImages] = useState<{ imageUrl: string, title: string }[]>([]);
|
|
| 33 |
|
|
| 34 |
|
|
| 35 |
useEffect(() => {
|
|
| 36 |
if (item.images?.[0]) {
|
|
| 37 |
setImages([item.images[0], item.images[0], item.images[0], item.images[0], item.images[0], item.images[0], item.images[0]]) |
|
| 38 |
} |
|
| 39 |
}, [item]) |
|
| 40 |
|
|
| 31 | 41 |
return (<> |
| 32 | 42 |
{
|
| 33 | 43 |
item && props.itemLoading ? |
| 34 | 44 |
(<LoadingBox text="Item loading..." />) |
| 35 | 45 |
: |
| 36 | 46 |
( |
| 37 |
<ScrollView flex="1"> |
|
| 47 |
<ScrollView flex="1" paddingLeft={2.5} paddingRight={2.5}>
|
|
| 38 | 48 |
<VStack> |
| 39 | 49 |
<HStack marginLeft={2.5} alignItems={"center"}>
|
| 40 | 50 |
<VStack flex={1} marginTop={3.5}>
|
| 41 |
<Text> |
|
| 51 |
<Text fontSize={13} color="#4D4D4D">
|
|
| 42 | 52 |
{item.authorDisplayName ? item.authorDisplayName : item.authorName}
|
| 43 | 53 |
</Text> |
| 44 |
<Heading size="sm">
|
|
| 54 |
<Heading marginTop={1} fontSize={18} color="#4D4D4D">
|
|
| 45 | 55 |
{item.workName}
|
| 46 | 56 |
</Heading> |
| 57 |
|
|
| 47 | 58 |
</VStack> |
| 48 | 59 |
<Box marginLeft="auto" marginTop={0}> {/* marginLeft: "auto" pushes the Box to the right */}
|
| 49 |
<Button variant="outline" size="md"> |
|
| 50 |
{item?.concordances?.[0]?.id}
|
|
| 60 |
<Button variant="outline" backgroundColor={"#F4DFAB"} borderRadius={8} size="sm" padding={1.5} >
|
|
| 61 |
<Text color="#654B07" fontSize={14}>
|
|
| 62 |
{item?.concordances?.[0]?.id}
|
|
| 63 |
</Text> |
|
| 51 | 64 |
</Button> |
| 52 | 65 |
</Box> |
| 53 | 66 |
</HStack> |
| 54 |
<Card shadow="1" marginTop={5}>
|
|
| 67 |
|
|
| 68 |
|
|
| 69 |
<View marginTop={5} backgroundColor="#F5F4F1" borderRadius={10} borderColor="#F5F4F1" padding={2}>
|
|
| 55 | 70 |
{item.inventoryItem &&
|
| 56 | 71 |
<VStack> |
| 57 | 72 |
<Text italic> |
| 58 |
<Text color="light.500">Inventory item: </Text>
|
|
| 73 |
<Text color="#654B07" italic fontWeight={"semibold"}>Inventory item: </Text>
|
|
| 59 | 74 |
{item.inventoryItem}
|
| 60 | 75 |
</Text> |
| 61 | 76 |
<Text italic marginTop="2.5%"> |
| 62 | 77 |
{item.searchSubjects != undefined && item?.searchSubjects?.map((subject, index) => (
|
| 63 |
item.searchSubjects && index < item.searchSubjects.length - 1 ? (subject + ", ") : (subject) |
|
| 78 |
subject != "" ? |
|
| 79 |
item.searchSubjects && index < item.searchSubjects.length - 1 ? (subject + ", ") : (subject) |
|
| 80 |
: |
|
| 81 |
"" |
|
| 64 | 82 |
))} |
| 65 | 83 |
</Text> |
| 66 | 84 |
</VStack>} |
| 67 |
</Card>
|
|
| 85 |
</View>
|
|
| 68 | 86 |
{item.fullView && item.images && item.images.length > 0 && (
|
| 69 |
<VStack background="primary.100" marginTop={5} alignItems="center" justifyContent="center">
|
|
| 70 |
<Text marginBottom={2}>Resembling objects {selectedImage + 1 + "/" + item.images.length}</Text>
|
|
| 87 |
<VStack marginTop={5} alignItems="center" justifyContent="center" backgroundColor="#F5F4F1" borderRadius={10} borderColor="#F5F4F1" padding={2}>
|
|
| 88 |
|
|
| 89 |
<Box marginTop={2.5} borderWidth={1} width={Dimensions.get('window').width - 110} alignItems="center" backgroundColor="red" borderTopRadius={10} >
|
|
| 90 |
<Text marginBottom={2}>{"Resembling objects"}
|
|
| 91 |
{selectedImage + 1 + "/" + item.images.length + item.images[selectedImage].cert + item.images[selectedImage].relationship_type}
|
|
| 92 |
</Text> |
|
| 93 |
</Box> |
|
| 94 |
|
|
| 71 | 95 |
<HStack space={4}>
|
| 72 | 96 |
<Button variant="ghost" size="lg" onPress={() => {
|
| 73 | 97 |
if (item.images && selectedImage - 1 >= 0) {
|
| 74 | 98 |
setSelectedImage(selectedImage - 1); |
| 75 | 99 |
} |
| 76 | 100 |
}} leftIcon={<ChevronLeftIcon size="lg" />} />
|
| 77 |
<Image size={250} alt="image" source={{ uri: IMAGE_URL + "/" + item.images[selectedImage].imageUrl }} />
|
|
| 101 |
<Image size={Dimensions.get('window').width - 110} alt="image" source={{ uri: IMAGE_URL + "/" + item.images[selectedImage].imageUrl }} />
|
|
| 78 | 102 |
<Button variant="ghost" size="lg" onPress={() => {
|
| 79 | 103 |
if (item.images && selectedImage + 1 < item.images.length) {
|
| 80 | 104 |
setSelectedImage(selectedImage + 1); |
| 81 | 105 |
} |
| 82 | 106 |
}} leftIcon={<ChevronRightIcon size="lg" />} />
|
| 83 | 107 |
</HStack> |
| 108 |
<ScrollView horizontal marginBottom={2.5} marginTop={5}>
|
|
| 109 |
|
|
| 110 |
{item.images.map((image, index) => (
|
|
| 111 |
<Pressable |
|
| 112 |
onPress={() => { setSelectedImage(index); }}>
|
|
| 113 |
<Image marginLeft={2.5} size={90} alt="image" source={{ uri: IMAGE_URL + "/" + image.imageUrl }}
|
|
| 114 |
borderColor={selectedImage == index ? "#1782FF" : undefined}
|
|
| 115 |
borderWidth={3}
|
|
| 116 |
/> |
|
| 117 |
</Pressable> |
|
| 118 |
|
|
| 119 |
))} |
|
| 120 |
</ScrollView> |
|
| 84 | 121 |
</VStack> |
| 85 | 122 |
)} |
| 86 | 123 |
{item.fullView && (
|
| 87 |
<Card shadow={1} marginTop={5} marginBottom={5}>
|
|
| 124 |
<View marginTop={5} backgroundColor="#F5F4F1" borderRadius={10} borderColor="#F5F4F1" padding={2} marginBottom={5}>
|
|
| 88 | 125 |
{item.authorName &&
|
| 89 | 126 |
<HStack> |
| 90 |
<Text italic marginTop={2.5}>
|
|
| 91 |
<Text color="light.500">Author name: </Text>
|
|
| 127 |
<Text marginTop={2.5}>
|
|
| 128 |
<Text color="#654B07" italic fontWeight={"semibold"}>Author name: </Text>
|
|
| 92 | 129 |
{item.authorName}
|
| 93 | 130 |
</Text> |
| 94 | 131 |
</HStack>} |
| 95 | 132 |
{item.title &&
|
| 96 | 133 |
<HStack> |
| 97 |
<Text italic marginTop={2.5}>
|
|
| 98 |
<Text color="light.500">Title: </Text>
|
|
| 134 |
<Text marginTop={2.5}>
|
|
| 135 |
<Text color="#654B07" italic fontWeight={"semibold"}>Title: </Text>
|
|
| 99 | 136 |
{item.title}
|
| 100 | 137 |
</Text> |
| 101 | 138 |
</HStack>} |
| 102 | 139 |
{item.institution &&
|
| 103 | 140 |
<HStack> |
| 104 |
<Text italic marginTop={2.5}>
|
|
| 105 |
<Text color="light.500">Institution: </Text>
|
|
| 141 |
<Text marginTop={2.5}>
|
|
| 142 |
<Text color="#654B07" italic fontWeight={"semibold"}>Institution: </Text>
|
|
| 106 | 143 |
{item.institution.name}, Inv. No. {item.institution.inventoryNumber}, {item.institution.city} {"(" + item.institution.country + ")"}
|
| 107 | 144 |
</Text> |
| 108 | 145 |
</HStack>} |
| 109 | 146 |
{item.repository &&
|
| 110 | 147 |
<HStack> |
| 111 |
<Text italic marginTop={2.5}>
|
|
| 112 |
<Text color="light.500">Repository: </Text>
|
|
| 148 |
<Text marginTop={2.5}>
|
|
| 149 |
<Text color="#654B07" italic fontWeight={"semibold"}>Repository: </Text>
|
|
| 113 | 150 |
{item.repository}
|
| 114 | 151 |
</Text> |
| 115 | 152 |
</HStack>} |
| 116 | 153 |
{item.provenance &&
|
| 117 | 154 |
<HStack> |
| 118 |
<Text italic marginTop={2.5}>
|
|
| 119 |
<Text color="light.500">Provenance: </Text>
|
|
| 155 |
<Text marginTop={2.5}>
|
|
| 156 |
<Text color="#654B07" italic fontWeight={"semibold"}>Provenance: </Text>
|
|
| 120 | 157 |
{item.provenance}
|
| 121 | 158 |
</Text> |
| 122 | 159 |
</HStack>} |
| 123 | 160 |
{item.description &&
|
| 124 | 161 |
<HStack> |
| 125 |
<Text italic marginTop={2.5}>
|
|
| 126 |
<Text color="light.500">Description: </Text>
|
|
| 162 |
<Text marginTop={2.5}>
|
|
| 163 |
<Text color="#654B07" italic fontWeight={"semibold"}>Description: </Text>
|
|
| 127 | 164 |
{item.description}
|
| 128 | 165 |
</Text> |
| 129 | 166 |
</HStack>} |
| 130 |
</Card>)} |
|
| 167 |
</View>)} |
|
| 168 |
|
|
| 169 |
{
|
|
| 170 |
item.room && item.room.id && |
|
| 171 |
<Flex direction="row" alignItems="center" justify="flex-end"> |
|
| 172 |
<Button |
|
| 173 |
onPress={() => props.navigation.navigate("Plan", { roomId: item?.room?.id, placeId: undefined })}
|
|
| 174 |
variant={"link"}
|
|
| 175 |
backgroundColor={"#F4DFAB"}
|
|
| 176 |
borderRadius={7}
|
|
| 177 |
marginTop={0}
|
|
| 178 |
marginBottom={5}
|
|
| 179 |
width={125}
|
|
| 180 |
rightIcon={<ChevronRightIcon size="xs" />}>
|
|
| 181 |
Show in map |
|
| 182 |
</Button> |
|
| 183 |
</Flex> |
|
| 184 |
|
|
| 185 |
} |
|
| 186 |
|
|
| 131 | 187 |
</VStack> |
| 132 |
</ScrollView> |
|
| 188 |
</ScrollView >
|
|
| 133 | 189 |
) |
| 134 | 190 |
}</> |
| 135 | 191 |
); |
| ... | ... | |
| 152 | 208 |
dispatch(getItemNotes({ item: props.item, relatedComments: showRelatedComments }));
|
| 153 | 209 |
} |
| 154 | 210 |
}, [triggerRefresh]) |
| 155 |
|
|
| 211 |
|
|
| 156 | 212 |
const toggleRelatedComments = useCallback(() => {
|
| 157 | 213 |
if (!props.notesLoading) {
|
| 158 | 214 |
|
| ... | ... | |
| 161 | 217 |
setShowRelatedComments(value); |
| 162 | 218 |
dispatch(getItemNotes({ item: props.item, relatedComments: value }));
|
| 163 | 219 |
} |
| 164 |
}, [showRelatedComments]);
|
|
| 220 |
}, [showRelatedComments]); |
|
| 165 | 221 |
|
| 166 | 222 |
|
| 167 | 223 |
const handleCreateItemComment = useCallback( |
| ... | ... | |
| 183 | 239 |
props.notesLoading ? |
| 184 | 240 |
(<LoadingBox text="Notes loading..." />) |
| 185 | 241 |
: |
| 186 |
(<VStack> |
|
| 242 |
(<VStack paddingLeft={2.5} paddingRight={2.5}>
|
|
| 187 | 243 |
<Flex direction="row" alignItems="center" justify="flex-end"> |
| 188 | 244 |
<Text fontSize={"12"}>Show related comments</Text>
|
| 189 | 245 |
<Switch value={showRelatedComments} onChange={toggleRelatedComments} size="md" />
|
| ... | ... | |
| 213 | 269 |
} |
| 214 | 270 |
|
| 215 | 271 |
return ( |
| 216 |
<Box marginLeft={2.5} marginRight={2.5}>
|
|
| 272 |
<Box> |
|
| 217 | 273 |
|
| 218 | 274 |
<Box height={Dimensions.get('window').height - 210}>
|
| 219 | 275 |
{itemShown ? (
|
| 220 |
<ItemDetail itemLoading={itemLoading} item={props.item} />
|
|
| 276 |
<ItemDetail itemLoading={props.itemLoading} item={props.item} notesLoading={props.notesLoading} notes={props.notes} navigation={props.navigation} />
|
|
| 221 | 277 |
) : ( |
| 222 | 278 |
<ItemNotes item={props.item} notesLoading={props.notesLoading} notes={props.notes} navigation={props.navigation} />
|
| 223 | 279 |
)} |
| ... | ... | |
| 226 | 282 |
{/* item notes switch tab */}
|
| 227 | 283 |
<HStack alignItems="center"> |
| 228 | 284 |
<Button |
| 229 |
variant={itemShown ? "subtle" : "outline"}
|
|
| 285 |
variant={"unstyled"}
|
|
| 230 | 286 |
w="50%" |
| 231 | 287 |
onPress={handleItemClick}
|
| 232 | 288 |
> |
| 233 |
Item |
|
| 289 |
<VStack alignItems={"center"}>
|
|
| 290 |
<Text color="primary" bold={itemShown} mb={itemShown ? undefined : 2}>
|
|
| 291 |
Item |
|
| 292 |
</Text> |
|
| 293 |
{itemShown && <Divider borderWidth={1} width={60} mt={2} color="primary" />}
|
|
| 294 |
</VStack> |
|
| 234 | 295 |
</Button> |
| 235 | 296 |
<Button |
| 236 |
variant={itemShown ? "outline" : "subtle"}
|
|
| 297 |
variant={"unstyled"}
|
|
| 237 | 298 |
w="50%" |
| 238 | 299 |
onPress={handleNotesClick}
|
| 239 | 300 |
> |
| 240 |
Notes |
|
| 301 |
<VStack alignItems={"center"}>
|
|
| 302 |
<Text color="primary" bold={!itemShown} mb={!itemShown ? undefined : 2}>
|
|
| 303 |
Notes |
|
| 304 |
</Text> |
|
| 305 |
{!itemShown && <Divider borderWidth={1} width={60} mt={2} color="primary" />}
|
|
| 306 |
</VStack> |
|
| 241 | 307 |
</Button> |
| 242 | 308 |
</HStack> |
| 243 | 309 |
</Box> |
| src/components/listView/ListViewInventoryGroup.tsx | ||
|---|---|---|
| 92 | 92 |
} |
| 93 | 93 |
}, [isExpanded]) |
| 94 | 94 |
|
| 95 |
// Po načtení prvních data zůstal inventory results zavřený... -> zakomentováno
|
|
| 96 |
useEffect(() => {
|
|
| 97 |
if (loading) {
|
|
| 98 |
setIsExpanded(false) |
|
| 99 |
} |
|
| 100 |
}, [loading]) |
|
| 95 |
// Proč by se mělo zavírat když loading? stejně nic uvnitř není, pak akorát musí znovu kliknout pro otevření aneví že už je načteno... double click nucený
|
|
| 96 |
// useEffect(() => {
|
|
| 97 |
// if (loading) {
|
|
| 98 |
// setIsExpanded(false)
|
|
| 99 |
// }
|
|
| 100 |
// }, [loading])
|
|
| 101 | 101 |
|
| 102 | 102 |
useEffect(() => {
|
| 103 | 103 |
setIsInventoryDataLoading(inventoriesDataLoading[props.inventoryName] ? inventoriesDataLoading[props.inventoryName] : false) |
| src/components/plan/CastlePlanView.tsx | ||
|---|---|---|
| 292 | 292 |
> |
| 293 | 293 |
{/* control panel */}
|
| 294 | 294 |
<Flex direction="row" alignItems="center" justify="flex-end" style={{ height: 50, width: 100, top: fullScreenMode ? 10 : 0, right: fullScreenMode ? 20 : 15, position: "absolute", zIndex: 5 }}>
|
| 295 |
<Pressable padding={1.5} backgroundColor={"#654B07"} borderRadius={5} marginRight={selectedRoom ? 1 : -2} onPress={handleFullScreenPressed}>
|
|
| 295 |
<Pressable padding={1.5} backgroundColor={"primary"} borderRadius={5} marginRight={selectedRoom ? 1 : -2} onPress={handleFullScreenPressed}>
|
|
| 296 | 296 |
<FullscreenIcon color="white" /> |
| 297 | 297 |
</Pressable> |
| 298 | 298 |
{
|
| 299 | 299 |
selectedRoom && |
| 300 |
<Pressable padding={1.5} backgroundColor={"#654B07"} borderRadius={5} marginRight={-2} onPress={() => { zoomToRoom(selectedRoom) }}>
|
|
| 300 |
<Pressable padding={1.5} backgroundColor={"primary"} borderRadius={5} marginRight={-2} onPress={() => { zoomToRoom(selectedRoom) }}>
|
|
| 301 | 301 |
<ExitfullscreenIcon color="white" /> |
| 302 | 302 |
</Pressable> |
| 303 | 303 |
} |
| src/pages/PlanViewPage.tsx | ||
|---|---|---|
| 13 | 13 |
import CastlePlanView from "../components/plan/CastlePlanView" |
| 14 | 14 |
|
| 15 | 15 |
import { Dimensions } from 'react-native';
|
| 16 |
import { login } from "../stores/actions/userThunks"
|
|
| 16 | 17 |
|
| 17 | 18 |
const PlanViewPage = ({ route, navigation }: DrawerScreenProps<RootStackParamList, 'Plan'>) => {
|
| 18 | 19 |
|
| ... | ... | |
| 277 | 278 |
} |
| 278 | 279 |
|
| 279 | 280 |
}} |
| 280 |
backgroundColor={"#654B07"}
|
|
| 281 |
backgroundColor={"primary"}
|
|
| 281 | 282 |
variant="subtle" |
| 282 | 283 |
borderRadius={10}
|
| 283 | 284 |
size={"sm"}
|
| ... | ... | |
| 350 | 351 |
onPress={() => { setCastlePlanShown(true) }}
|
| 351 | 352 |
> |
| 352 | 353 |
<VStack alignItems={"center"}>
|
| 353 |
<Text bold={castlePlanShown} mb={castlePlanShown ? undefined : 2}>
|
|
| 354 |
<Text color="primary" bold={castlePlanShown} mb={castlePlanShown ? undefined : 2}>
|
|
| 354 | 355 |
Castle |
| 355 | 356 |
</Text> |
| 356 |
{castlePlanShown && <Divider borderWidth={1} width={60} mt={2} />}
|
|
| 357 |
{castlePlanShown && <Divider color="primary" borderWidth={1} width={60} mt={2} />}
|
|
| 357 | 358 |
</VStack> |
| 358 | 359 |
</Button> |
| 359 | 360 |
<Button |
| ... | ... | |
| 362 | 363 |
onPress={() => { setCastlePlanShown(false) }}
|
| 363 | 364 |
> |
| 364 | 365 |
<VStack alignItems={"center"}>
|
| 365 |
<Text bold={!castlePlanShown} mb={!castlePlanShown ? undefined : 2}>
|
|
| 366 |
<Text color="primary" bold={!castlePlanShown} mb={!castlePlanShown ? undefined : 2}>
|
|
| 366 | 367 |
Results |
| 367 | 368 |
</Text> |
| 368 |
{!castlePlanShown && <Divider borderWidth={1} width={60} mt={2} />}
|
|
| 369 |
{!castlePlanShown && <Divider color="primary" borderWidth={1} width={60} mt={2} />}
|
|
| 369 | 370 |
</VStack> |
| 370 | 371 |
</Button> |
| 371 | 372 |
</HStack> |
| src/stores/actions/itemThunks.ts | ||
|---|---|---|
| 16 | 16 |
if (response.status === 200 && response.data.object.length > 1) {
|
| 17 | 17 |
// TODO IMAGES to array :-) |
| 18 | 18 |
const authorName = response.data?.object[1]?.name?.[0]?.getty_data?.display_name ?? undefined; |
| 19 |
const images : {imageUrl: string, title: string}[] = []
|
|
| 19 |
const images : {imageUrl: string, title: string, relationship_type: string, cert: Certainty}[] = []
|
|
| 20 | 20 |
for(let i = 1; i < response.data.object.length; i++){
|
| 21 |
images.push({imageUrl: response.data.object[i]?.images?.[0]?.file, title: response.data.object[i]?.images?.[0]?.text})
|
|
| 21 |
images.push({imageUrl: response.data.object[i]?.images?.[0]?.file ?? "", title: response.data.object[i]?.images?.[0]?.text ?? "", relationship_type: response.data.object[i].relationship_type ?? "", cert: response.data.object[i].cert ?? Certainty.Unknown })
|
|
| 22 | 22 |
} |
| 23 | 23 |
|
| 24 | 24 |
const institution = {
|
| ... | ... | |
| 44 | 44 |
searchSubjects: response.data.search_subject ?? undefined, |
| 45 | 45 |
prevItem: response.data.prevItem ?? undefined, |
| 46 | 46 |
nextItem: response.data.nextItem ?? undefined, |
| 47 |
room: response.data.room ?? undefined, |
|
| 47 | 48 |
authorName, |
| 48 | 49 |
images, |
| 49 | 50 |
institution, |
| ... | ... | |
| 67 | 68 |
nextItem: response.data.nextItem ?? undefined, |
| 68 | 69 |
inventoryItem: response.data.text ?? undefined, |
| 69 | 70 |
searchSubjects: response.data.search_subject ?? undefined, |
| 71 |
room: response.data.room ?? undefined, |
|
| 70 | 72 |
} |
| 71 | 73 |
} |
| 72 | 74 |
else {
|
| src/stores/reducers/itemSlice.ts | ||
|---|---|---|
| 42 | 42 |
prevItem: action.payload.prevItem, |
| 43 | 43 |
nextItem: action.payload.nextItem, |
| 44 | 44 |
fullView : action.payload.fullView, |
| 45 |
room: action.payload.room |
|
| 45 | 46 |
} |
| 46 | 47 |
|
| 47 | 48 |
if (action.payload.fullView) {
|
| src/types/item.ts | ||
|---|---|---|
| 14 | 14 |
fullView : boolean |
| 15 | 15 |
|
| 16 | 16 |
authorName?: string |
| 17 |
images?: {imageUrl : string, title : string}[]
|
|
| 17 |
images?: {imageUrl : string, title : string, relationship_type: string, cert: Certainty}[]
|
|
| 18 | 18 |
title?: string |
| 19 | 19 |
institution?: {
|
| 20 | 20 |
name :string, |
| ... | ... | |
| 26 | 26 |
provenance?: string |
| 27 | 27 |
description?: string |
| 28 | 28 |
|
| 29 |
room?: {id: number, original_description: string}
|
|
| 30 |
|
|
| 29 | 31 |
prevItem?: string | boolean |
| 30 | 32 |
nextItem?: string | boolean |
| 31 | 33 |
} |
Také k dispozici: Unified diff
re #10895: ItemView redesign, refactor