Merge branch 'master' of gitea.presley.nz:brandon.presley/Massive
This commit is contained in:
commit
6012747643
38
Select.tsx
38
Select.tsx
|
@ -1,7 +1,12 @@
|
|||
import {useState} from 'react'
|
||||
import {useCallback, useMemo, useState} from 'react'
|
||||
import {Button, Menu, useTheme} from 'react-native-paper'
|
||||
import RNPickerSelect from 'react-native-picker-select'
|
||||
import {Item} from 'react-native-picker-select'
|
||||
import {MARGIN} from './constants'
|
||||
|
||||
export interface Item {
|
||||
value: string
|
||||
label: string
|
||||
color?: string
|
||||
}
|
||||
|
||||
export default function Select({
|
||||
value,
|
||||
|
@ -12,20 +17,39 @@ export default function Select({
|
|||
onChange: (value: string) => void
|
||||
items: Item[]
|
||||
}) {
|
||||
const {colors} = useTheme()
|
||||
const [show, setShow] = useState(false)
|
||||
const {colors} = useTheme()
|
||||
|
||||
const selected = useMemo(
|
||||
() => items.find(item => item.value === value),
|
||||
[items, value],
|
||||
)
|
||||
|
||||
const handlePress = useCallback(
|
||||
(newValue: string) => {
|
||||
onChange(newValue)
|
||||
setShow(false)
|
||||
},
|
||||
[onChange],
|
||||
)
|
||||
|
||||
return (
|
||||
<Menu
|
||||
style={{alignSelf: 'flex-start', justifyContent: 'flex-start'}}
|
||||
visible={show}
|
||||
onDismiss={() => setShow(false)}
|
||||
anchor={<Button style={{alignSelf: 'flex-start'}}>{value}</Button>}>
|
||||
anchor={
|
||||
<Button
|
||||
onPress={() => setShow(true)}
|
||||
style={{alignSelf: 'flex-start', marginTop: MARGIN}}>
|
||||
{selected.label}
|
||||
</Button>
|
||||
}>
|
||||
{items.map(item => (
|
||||
<Menu.Item
|
||||
key={item.value}
|
||||
titleStyle={{color: item.color || colors.text}}
|
||||
title={item.label}
|
||||
onPress={() => onChange(item.value)}
|
||||
onPress={() => handlePress(item.value)}
|
||||
/>
|
||||
))}
|
||||
</Menu>
|
||||
|
|
|
@ -238,7 +238,7 @@ export default function SettingsPage() {
|
|||
value={date}
|
||||
onChange={changeDate}
|
||||
items={formatOptions.map(option => ({
|
||||
label: format(today, option),
|
||||
label: `Date format: ${format(today, option)}`,
|
||||
value: option,
|
||||
}))}
|
||||
/>
|
||||
|
|
|
@ -39,7 +39,6 @@
|
|||
"react-native-linear-gradient": "^2.6.2",
|
||||
"react-native-pager-view": "^6.0.1",
|
||||
"react-native-paper": "^4.12.5",
|
||||
"react-native-picker-select": "^8.0.4",
|
||||
"react-native-reanimated": "^2.12.0",
|
||||
"react-native-safe-area-context": "^4.4.1",
|
||||
"react-native-screens": "^3.18.2",
|
||||
|
|
21
yarn.lock
21
yarn.lock
|
@ -2200,16 +2200,6 @@ __metadata:
|
|||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"@react-native-picker/picker@npm:^1.8.3":
|
||||
version: 1.16.8
|
||||
resolution: "@react-native-picker/picker@npm:1.16.8"
|
||||
peerDependencies:
|
||||
react: 16 || 17
|
||||
react-native: ">=0.57"
|
||||
checksum: c0176e41ba7486bf0a27ab5471315848cb166330313bd12e29ee65b7d2e1dfde22383de6a89be15770d132b33bca1764e64feee3acf22c67c3733fd877d3e91f
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"@react-native-picker/picker@npm:^2.4.4":
|
||||
version: 2.4.8
|
||||
resolution: "@react-native-picker/picker@npm:2.4.8"
|
||||
|
@ -7324,7 +7314,6 @@ __metadata:
|
|||
react-native-linear-gradient: ^2.6.2
|
||||
react-native-pager-view: ^6.0.1
|
||||
react-native-paper: ^4.12.5
|
||||
react-native-picker-select: ^8.0.4
|
||||
react-native-reanimated: ^2.12.0
|
||||
react-native-safe-area-context: ^4.4.1
|
||||
react-native-screens: ^3.18.2
|
||||
|
@ -8907,16 +8896,6 @@ __metadata:
|
|||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"react-native-picker-select@npm:^8.0.4":
|
||||
version: 8.0.4
|
||||
resolution: "react-native-picker-select@npm:8.0.4"
|
||||
dependencies:
|
||||
"@react-native-picker/picker": ^1.8.3
|
||||
lodash.isequal: ^4.5.0
|
||||
checksum: 9656a2f7b330a9e5a8b6b90393140fc5370762d2a14de4c5d31ce43de8abc677870c7f2ee8a493f48535157ddcbc3311cf3f41dac262bd84e50e913f0d4a24ff
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"react-native-reanimated@npm:^2.12.0":
|
||||
version: 2.12.0
|
||||
resolution: "react-native-reanimated@npm:2.12.0"
|
||||
|
|
Loading…
Reference in New Issue
Block a user