<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="GMCabsDriverAssistantSolution.Views.NotificationsPage"
             xmlns:vm="clr-namespace:GMCabsDriverAssistantSolution.ViewModels"
             Title="{Binding Title}">
    <ContentPage.BindingContext>
        <vm:NotificationsViewModel />
    </ContentPage.BindingContext>
    <ContentPage.Resources>
        <ResourceDictionary>
            <Color x:Key="Accent">#96d1ff</Color>
        </ResourceDictionary>
    </ContentPage.Resources>
    <ContentPage.Content>
        <StackLayout Orientation="Vertical"
                     BackgroundColor="#DCDCDC">
            <Frame Margin="16" 
                   CornerRadius="8" 
                   VerticalOptions="FillAndExpand"
                   Padding="8">
                <StackLayout Orientation="Vertical">
                    <StackLayout Orientation="Horizontal"
                                 HorizontalOptions="StartAndExpand"
                                 Margin="8">
                        <StackLayout Orientation="Vertical" >
                            <Image Source="message.png" HeightRequest="50"/>
                            <Image Source="ImportantIconSmall.png" 
                                    HeightRequest="40"
                                    VerticalOptions="CenterAndExpand"/>
                        </StackLayout>
                        <StackLayout Orientation="Vertical" 
                                     HorizontalOptions="FillAndExpand">
                            <Label Text="{Binding SelectedNotification.Subject}"
                                   TextColor="Black"
                                   FontSize="28"/>
                            <Grid HorizontalOptions="StartAndExpand">
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="*" />
                                    <RowDefinition Height="*" />
                                    <RowDefinition Height="*" />
                                </Grid.RowDefinitions>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="Auto" />
                                    <ColumnDefinition Width="1*" />
                                </Grid.ColumnDefinitions>
                                <Label Text="FROM"
                                       FontSize="15"
                                       Grid.Row="0" 
                                       Grid.Column="0"/>
                                <Label Text="{Binding SelectedNotification.FromName}"
                                       TextColor="Black"
                                       FontSize="16"
                                       Grid.Row="0" 
                                       Grid.Column="1"/>
                                <Label Text="SENT"
                                        FontSize="15"
                                       Grid.Row="1" 
                                       Grid.Column="0"/>
                                <Label Text="{Binding SelectedNotification.SentDate, StringFormat='{0:dd/MM/yyyy hh:mm tt}'}"
                                        FontSize="15"
                                       Grid.Row="1" 
                                       Grid.Column="1"/>
                            </Grid>
                        </StackLayout>
                    </StackLayout>
                    <ScrollView VerticalOptions="StartAndExpand" Padding="16, 0">
                        <Label Text="{Binding SelectedNotification.Body}"
                            FontSize="20"
                            TextColor="Black" />
                    </ScrollView>
                    <Button Margin="8,0,8,0"                            
                            FontSize="20"
                            Text="Ok"
                            Command="{Binding MarkNotificationAsViewedCommand}"/>
                </StackLayout>
            </Frame>
        </StackLayout>
    </ContentPage.Content>
</ContentPage>