ynerant/traintrape-moi
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Ajout bannière affichant le temps de pénalité restant

Browse Source
This commit is contained in:
Emmy D'Anello 2024-12-12 18:43:56 +01:00
parent 9c7a447e4e
commit 9543177db6
Signed by: ynerant
GPG Key ID: 3A75C55819C8CF85
3 changed files with 25 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
client/app/(tabs)/challenges.tsx
View File

@ -1,6 +1,7 @@
import PenaltyBanner from '@/components/PenalyBanner'
import { FontAwesome6 } from '@expo/vector-icons'
import { View } from 'react-native'
import { Appbar, Button, Card, Surface, Text } from 'react-native-paper'
import { Appbar, Button, Surface, Text } from 'react-native-paper'
export default function ChallengesScreen() {
return (
@ -9,6 +10,7 @@ export default function ChallengesScreen() {
<Appbar.Content title={"Défis"} />
<Appbar.Action icon='format-list-bulleted' />
</Appbar.Header>
<PenaltyBanner />
<Surface elevation={2} style={{ flex: 1, margin: 20, borderRadius: 20 }}>
<View style={{ padding: 10 }}>
<Text variant='headlineMedium' style={{ textAlign: 'center' }}>Titre</Text>

2
client/app/(tabs)/train.tsx
View File

@ -1,3 +1,4 @@
import PenaltyBanner from '@/components/PenalyBanner'
import { useAddTrainMutation } from '@/hooks/mutations/useTrainMutation'
import { useAuth } from '@/hooks/useAuth'
import { useTrain } from '@/hooks/useTrain'
@ -22,6 +23,7 @@ export default function TrainScreen() {
return (
<Surface style={{ flex: 1 }}>
<PenaltyBanner />
<FlatList
data={trains.trains}
keyExtractor={(train) => train.id}

20
client/components/PenalyBanner.tsx Normal file
View File

@ -0,0 +1,20 @@
import { FontAwesome6 } from "@expo/vector-icons";
import { View } from "react-native";
import { Banner, MD3Colors, ProgressBar, Text } from "react-native-paper";
export default function PenaltyBanner() {
return (
<View>
<Banner
visible={true}
icon={({ size }) => <FontAwesome6 name='hourglass-half' size={size} color={MD3Colors.tertiary80} />}
style={{ backgroundColor: MD3Colors.primary30 }}>
<View>
<Text variant='titleMedium'>Vous avez actuellement une pénalité jusqu'à 18h45.</Text>
<Text variant='titleSmall'>Temps restant : 14:43</Text>
</View>
</Banner>
<ProgressBar animatedValue={0.67} color={MD3Colors.error40} style={{ height: 6 }} />
</View>
)
}