66 lines
2.5 KiB
TypeScript
66 lines
2.5 KiB
TypeScript
import { useAddTrainMutation } from '@/hooks/mutations/useTrainMutation'
|
|
import { useAuth } from '@/hooks/useAuth'
|
|
import { useMemo, useState } from 'react'
|
|
import { StyleSheet } from 'react-native'
|
|
import { Button, Dialog, FAB, HelperText, Portal, Surface, Text, TextInput } from 'react-native-paper'
|
|
|
|
export default function TrainScreen() {
|
|
const [addTrainVisible, setAddTrainVisible] = useState(false)
|
|
const [addTrainUrl, setAddTrainUrl] = useState("")
|
|
const trainId = useMemo(() => /[0-9A-F]{8}-[0-9A-F]{4}-[0-9A-F]{4}-[0-9A-F]{4}-[0-9A-F]{12}/.exec(addTrainUrl)?.[0], [addTrainUrl])
|
|
|
|
const auth = useAuth()
|
|
const addTrainMutation = useAddTrainMutation({
|
|
auth,
|
|
onPostSuccess: () => setAddTrainVisible(false)
|
|
})
|
|
|
|
return (
|
|
<Surface style={{ flex: 1 }}>
|
|
<Text variant='bodyMedium'>Ici on aura la page pour ajouter un trajet en train depuis Rail Planner</Text>
|
|
<FAB
|
|
icon='plus'
|
|
style={styles.addTrainButton}
|
|
onPress={() => setAddTrainVisible(true)} />
|
|
<Portal>
|
|
<Dialog visible={addTrainVisible} onDismiss={() => setAddTrainVisible(false)}>
|
|
<Dialog.Title>Ajout d'un train</Dialog.Title>
|
|
<Dialog.Content>
|
|
<TextInput
|
|
label="URL de partage RailPlanner"
|
|
autoComplete='url'
|
|
inputMode='url'
|
|
defaultValue={addTrainUrl}
|
|
multiline={true}
|
|
onChangeText={setAddTrainUrl}
|
|
error={!trainId}
|
|
onEndEditing={() => {
|
|
if (trainId !== undefined)
|
|
addTrainMutation.mutate(trainId)
|
|
}}
|
|
placeholder="https://eurailapp.com/share/journey?id=XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX&type=list&brand=interrail" />
|
|
<HelperText type='error' visible={!trainId && addTrainVisible}>
|
|
Le champ doit contenir l'identifiant d'un voyage au format UUID. {trainId}
|
|
</HelperText>
|
|
</Dialog.Content>
|
|
<Dialog.Actions>
|
|
<Button onPress={() => setAddTrainVisible(false)}>Annuler</Button>
|
|
<Button onPress={() => {
|
|
if (trainId !== undefined)
|
|
addTrainMutation.mutate(trainId)
|
|
}} disabled={trainId === undefined || addTrainMutation.isPending}>Ajouter</Button>
|
|
</Dialog.Actions>
|
|
</Dialog>
|
|
</Portal>
|
|
</Surface>
|
|
)
|
|
}
|
|
|
|
const styles = StyleSheet.create({
|
|
addTrainButton: {
|
|
position: 'absolute',
|
|
right: 25,
|
|
bottom: 25,
|
|
}
|
|
})
|