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>
  )
}