From 9543177db6f987386af6d72dc5f97d6917285547 Mon Sep 17 00:00:00 2001
From: Emmy D'Anello <emmy@luemy.eu>
Date: Thu, 12 Dec 2024 18:43:56 +0100
Subject: [PATCH] =?UTF-8?q?Ajout=20banni=C3=A8re=20affichant=20le=20temps?=
 =?UTF-8?q?=20de=20p=C3=A9nalit=C3=A9=20restant?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/app/(tabs)/challenges.tsx   |  4 +++-
 client/app/(tabs)/train.tsx        |  2 ++
 client/components/PenalyBanner.tsx | 20 ++++++++++++++++++++
 3 files changed, 25 insertions(+), 1 deletion(-)
 create mode 100644 client/components/PenalyBanner.tsx

diff --git a/client/app/(tabs)/challenges.tsx b/client/app/(tabs)/challenges.tsx
index e85670d..c1c3ed8 100644
--- a/client/app/(tabs)/challenges.tsx
+++ b/client/app/(tabs)/challenges.tsx
@@ -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>
diff --git a/client/app/(tabs)/train.tsx b/client/app/(tabs)/train.tsx
index d3339e5..9371871 100644
--- a/client/app/(tabs)/train.tsx
+++ b/client/app/(tabs)/train.tsx
@@ -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}
diff --git a/client/components/PenalyBanner.tsx b/client/components/PenalyBanner.tsx
new file mode 100644
index 0000000..28d97ff
--- /dev/null
+++ b/client/components/PenalyBanner.tsx
@@ -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>
+  )
+}
\ No newline at end of file