Revize faf84222
Přidáno uživatelem Fantič před téměř 2 roky(ů)
| src/components/item/ItemTabBar.tsx | ||
|---|---|---|
| 1 |
import { HStack, CircleIcon, View, ScrollView, Button } from "native-base";
|
|
| 1 |
import { HStack, CircleIcon, View, ScrollView, Button, Center, Heading, Pressable, Text, Box } from "native-base";
|
|
| 2 | 2 |
import { CertaintyWithColors } from "../../stores/reducers/itemSlice";
|
| 3 | 3 |
import { Concordance } from "../../types/item";
|
| 4 | 4 |
import LoadingBox from "../loading/LoadingBox"; |
| ... | ... | |
| 8 | 8 |
|
| 9 | 9 |
const { concordances, onIndexChange, index } = props
|
| 10 | 10 |
|
| 11 |
if (concordances && concordances.length > 0) |
|
| 11 |
if (concordances && concordances.length > 0) {
|
|
| 12 | 12 |
return ( |
| 13 | 13 |
<View h="16"> |
| 14 |
<ScrollView horizontal={true} >
|
|
| 15 |
<HStack> |
|
| 16 |
{props.navigationState.routes.map((route, i) => {
|
|
| 17 |
return ( |
|
| 18 |
<Button size="lg" key={i}
|
|
| 19 |
variant={index == i ? "subtle" : "outline"}
|
|
| 20 |
rightIcon={<CircleIcon size="2" color={CertaintyWithColors[concordances[i].cert].color} />}
|
|
| 21 |
onPress={() => onIndexChange(i)}
|
|
| 22 |
> |
|
| 23 |
{concordances[i].id}
|
|
| 24 |
</Button> |
|
| 25 |
); |
|
| 26 |
})} |
|
| 27 |
</HStack> |
|
| 14 |
<ScrollView width="100%" horizontal={true}>
|
|
| 15 |
{props.navigationState.routes.length > 100 ? (
|
|
| 16 |
<HStack> |
|
| 17 |
{props.navigationState.routes.map((route, i) => {
|
|
| 18 |
return ( |
|
| 19 |
<Button |
|
| 20 |
size="lg" |
|
| 21 |
key={i}
|
|
| 22 |
variant={index == i ? "subtle" : "outline"}
|
|
| 23 |
rightIcon={
|
|
| 24 |
<CircleIcon |
|
| 25 |
size="2" |
|
| 26 |
color={CertaintyWithColors[concordances[i].cert].color}
|
|
| 27 |
/> |
|
| 28 |
} |
|
| 29 |
onPress={() => onIndexChange(i)}
|
|
| 30 |
> |
|
| 31 |
{concordances[i].id}
|
|
| 32 |
</Button> |
|
| 33 |
); |
|
| 34 |
})} |
|
| 35 |
</HStack> |
|
| 36 |
) : ( |
|
| 37 |
// One item only |
|
| 38 |
<Pressable size="96" variant="outline" |
|
| 39 |
onPress={() => onIndexChange(0)}
|
|
| 40 |
> |
|
| 41 |
<Box width="100%" background="red.100"> |
|
| 42 |
<Text>{concordances[0].id}</Text>
|
|
| 43 |
<CircleIcon |
|
| 44 |
size="2" |
|
| 45 |
color={CertaintyWithColors[concordances[0].cert].color}
|
|
| 46 |
/> |
|
| 47 |
</Box > |
|
| 48 |
</Pressable> |
|
| 49 |
)} |
|
| 28 | 50 |
</ScrollView> |
| 29 | 51 |
</View> |
| 30 |
) |
|
| 52 |
); |
|
| 53 |
} |
|
| 31 | 54 |
else {
|
| 32 | 55 |
return <LoadingBox text={`Loading concordances...`}></LoadingBox>
|
| 33 | 56 |
} |
| src/stores/actions/itemThunks.ts | ||
|---|---|---|
| 68 | 68 |
} |
| 69 | 69 |
) |
| 70 | 70 |
|
| 71 |
export const setSelectedConcordance = (selectedConcordance: number) => {
|
|
| 72 |
return {
|
|
| 73 |
type: "item/setSelectedConcordance", |
|
| 74 |
payload: {
|
|
| 75 |
selectedConcordance, |
|
| 76 |
}, |
|
| 77 |
}; |
|
| 78 |
}; |
|
| 79 |
|
|
| 80 | 71 |
export const setConcordances = (concordances: Concordance[]) => {
|
| 81 | 72 |
return {
|
| 82 | 73 |
type: "item/setConcordances", |
| src/types/item.ts | ||
|---|---|---|
| 1 | 1 |
import { Note } from "./note"
|
| 2 | 2 |
|
| 3 |
|
|
| 3 | 4 |
export type Item = {
|
| 4 | 5 |
id: string |
| 5 | 6 |
|
Také k dispozici: Unified diff
re #10454: ItemView: TabBar one / more concordances