Make best view select consistent with SettingsPage

This commit is contained in:
Brandon Presley 2022-12-01 15:51:39 +13:00
parent c1b6659058
commit 567e885e76
2 changed files with 6 additions and 15 deletions

View File

@ -1,6 +1,7 @@
import {useCallback, useMemo, useState} from 'react'
import {StyleProp, View, ViewStyle} from 'react-native'
import {View} from 'react-native'
import {Button, Menu, Subheading, useTheme} from 'react-native-paper'
import {ITEM_PADDING} from './constants'
export interface Item {
value: string
@ -13,13 +14,11 @@ export default function Select({
onChange,
items,
label,
style,
}: {
value: string
onChange: (value: string) => void
items: Item[]
label?: string
style?: StyleProp<ViewStyle>
}) {
const [show, setShow] = useState(false)
const {colors} = useTheme()
@ -42,8 +41,9 @@ export default function Select({
style={{
flexDirection: 'row',
alignItems: 'center',
paddingLeft: ITEM_PADDING,
}}>
{label && <Subheading style={style}>{label}</Subheading>}
{label && <Subheading style={{width: 100}}>{label}</Subheading>}
<Menu
visible={show}
onDismiss={() => setShow(false)}

View File

@ -232,7 +232,6 @@ export default function SettingsPage() {
value={item.value}
onChange={item.onChange}
label={item.name}
style={styles.select}
items={item.items}
/>
),
@ -248,11 +247,7 @@ export default function SettingsPage() {
data={switches}
renderItem={renderSwitch}
/>
<FlatList
style={{paddingLeft: ITEM_PADDING}}
data={selects}
renderItem={renderSelect}
/>
<FlatList data={selects} renderItem={renderSelect} />
{'alarm sound'.includes(term.toLowerCase()) && (
<View
style={{
@ -260,7 +255,7 @@ export default function SettingsPage() {
alignItems: 'center',
paddingLeft: ITEM_PADDING,
}}>
<Subheading style={styles.select}>Alarm sound</Subheading>
<Subheading style={{width: 100}}>Alarm sound</Subheading>
<Button onPress={changeSound}>{soundString || 'Default'}</Button>
</View>
)}
@ -268,7 +263,3 @@ export default function SettingsPage() {
</>
)
}
const styles = StyleSheet.create({
select: {width: 100},
})