Make EditSet scroll

This commit is contained in:
Brandon Presley 2022-07-09 17:13:13 +12:00
parent 978fe98393
commit 027dd88574

View File

@ -1,5 +1,5 @@
import React, {useState} from 'react'; import React, {useState} from 'react';
import {StyleSheet} from 'react-native'; import {ScrollView, StyleSheet} from 'react-native';
import DateTimePickerModal from 'react-native-modal-datetime-picker'; import DateTimePickerModal from 'react-native-modal-datetime-picker';
import {Button, Dialog, Portal, TextInput} from 'react-native-paper'; import {Button, Dialog, Portal, TextInput} from 'react-native-paper';
import Set from './set'; import Set from './set';
@ -29,52 +29,54 @@ export default function EditSet({
<Portal> <Portal>
<Dialog visible={set ? true : false} onDismiss={() => setSet(undefined)}> <Dialog visible={set ? true : false} onDismiss={() => setSet(undefined)}>
<Dialog.Title>{title}</Dialog.Title> <Dialog.Title>{title}</Dialog.Title>
<Dialog.Content> <Dialog.ScrollArea>
<TextInput <ScrollView>
style={styles.text} <TextInput
autoFocus style={styles.text}
label="Name *" autoFocus
value={set?.name} label="Name *"
onChangeText={name => setSet({...set, name})} value={set?.name}
autoCorrect={false} onChangeText={name => setSet({...set, name})}
/> autoCorrect={false}
<TextInput />
style={styles.text} <TextInput
label="Reps *" style={styles.text}
keyboardType="numeric" label="Reps *"
value={set?.reps?.toString() || ''} keyboardType="numeric"
onChangeText={reps => setSet({...set, reps})} value={set?.reps?.toString() || ''}
/> onChangeText={reps => setSet({...set, reps})}
<TextInput />
style={styles.text} <TextInput
label="Weight *" style={styles.text}
keyboardType="numeric" label="Weight *"
value={set?.weight?.toString() || ''} keyboardType="numeric"
onChangeText={weight => setSet({...set, weight})} value={set?.weight?.toString() || ''}
onSubmitEditing={onSave} onChangeText={weight => setSet({...set, weight})}
/> onSubmitEditing={onSave}
<TextInput />
style={styles.text} <TextInput
label="Unit (kg)" style={styles.text}
value={set?.unit} label="Unit (kg)"
onChangeText={unit => setSet({...set, unit})} value={set?.unit}
onSubmitEditing={onSave} onChangeText={unit => setSet({...set, unit})}
/> onSubmitEditing={onSave}
{set?.created && ( />
<> {set?.created && (
<Button icon="calendar-outline" onPress={() => setShow(true)}> <>
{format(set.created)} <Button icon="calendar-outline" onPress={() => setShow(true)}>
</Button> {format(set.created)}
<DateTimePickerModal </Button>
isVisible={show} <DateTimePickerModal
mode="datetime" isVisible={show}
onConfirm={onConfirm} mode="datetime"
onCancel={() => setShow(false)} onConfirm={onConfirm}
date={new Date(set.created)} onCancel={() => setShow(false)}
/> date={new Date(set.created)}
</> />
)} </>
</Dialog.Content> )}
</ScrollView>
</Dialog.ScrollArea>
<Dialog.Actions> <Dialog.Actions>
<Button icon="close" onPress={() => setSet(undefined)}> <Button icon="close" onPress={() => setSet(undefined)}>
Cancel Cancel