gm_cabs_driver_maui/GMCabsDriverAssistantSolution/Views/AcceptedFutureBookingsPage.xaml

<?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.AcceptedFutureBookingsPage"
             xmlns:vm="clr-namespace:GMCabsDriverAssistantSolution.ViewModels" 
             xmlns:models="clr-namespace:GMCabsDriverAssistant.Models"
             x:DataType="vm:AcceptedFutureBookingsViewModel"
             Title="{Binding Title}"
             Shell.FlyoutBehavior="Disabled">
    <ContentPage.Resources>
        <ResourceDictionary>
            <Color x:Key="Accent">#96d1ff</Color>
        </ResourceDictionary>
    </ContentPage.Resources>
    <ContentPage.Content>
        <StackLayout Orientation="Vertical"
                     BackgroundColor="#DCDCDC"
                     x:DataType="vm:AcceptedFutureBookingsViewModel">
            <Frame Margin="10,40,10,10"
                   CornerRadius="10"
                   BackgroundColor="#E8E8E8">
                <CollectionView ItemsSource="{Binding FutureBookings}"
                                EmptyView="{Binding EmptyViewMessage}">
                    <CollectionView.ItemsLayout>
                        <LinearItemsLayout
                            Orientation="Vertical"
                            ItemSpacing="10"/>
                    </CollectionView.ItemsLayout>
                    <CollectionView.ItemTemplate>
                        <DataTemplate>
                            <Frame x:DataType="models:BookingDto"
                                   CornerRadius="10"
                                   BackgroundColor="{StaticResource Primary}"
                                   Padding="8">
                                <StackLayout Orientation="Vertical">
                                    <Grid>
                                        <Grid.ColumnDefinitions>
                                            <ColumnDefinition Width="Auto"/>
                                            <ColumnDefinition Width="1*"/>
                                        </Grid.ColumnDefinitions>
                                        <Label Grid.Row="0"
                                               Grid.Column="0"
                                               Text="{Binding StartSuburb}"
                                               TextColor="White"
                                               FontFamily="Bold"
                                               HorizontalOptions="StartAndExpand"
                                               FontSize="17"/>
                                        <Label 
                                            Grid.Row="0"
                                            Grid.Column="1"
                                            VerticalTextAlignment="Center"
                                            HorizontalOptions="EndAndExpand"
                                            FontSize="17"
                                            TextColor="White">
                                            <Label.Triggers>
                                                <DataTrigger TargetType="Label" Binding="{Binding FutureBooking}" Value="True">
                                                    <Setter Property="Text" Value="{Binding FormattedPickUpTimeDateOnly}"/>
                                                </DataTrigger>
                                                <DataTrigger TargetType="Label" Binding="{Binding FutureBooking}" Value="False">
                                                    <Setter Property="Text" Value="{Binding FormattedDistance}" />
                                                </DataTrigger>
                                            </Label.Triggers>
                                        </Label>

                                        <Label Grid.Row="1"
                                               Grid.Column="0"
                                               Text="{Binding EndSuburb}" 
                                                TextColor="White"
                                                FontFamily="Bold"
                                                HorizontalOptions="StartAndExpand"
                                                FontSize="17"/>
                                        <Label 
                                            Grid.Row="1"
                                               Grid.Column="1"
                                            VerticalTextAlignment="Center"
                                                HorizontalOptions="EndAndExpand"
                                                FontSize="17"
                                                TextColor="White">
                                            <Label.Triggers>
                                                <DataTrigger TargetType="Label" Binding="{Binding FutureBooking}" Value="True">
                                                    <Setter Property="Text" Value="{Binding FormattedPickUpTimeTimeOnly}" />
                                                </DataTrigger>
                                                <DataTrigger TargetType="Label" Binding="{Binding FutureBooking}" Value="False">
                                                    <Setter Property="Text" Value="ASAP" />
                                                </DataTrigger>
                                            </Label.Triggers>
                                        </Label>
                                    </Grid>
                                </StackLayout>
                                <Frame.GestureRecognizers>
                                    <TapGestureRecognizer 
                                        NumberOfTapsRequired="1"
                                        Command="{Binding Source={RelativeSource AncestorType={x:Type vm:AcceptedFutureBookingsViewModel}}, Path=BookingTapped}"		
                                        CommandParameter="{Binding .}">
                                    </TapGestureRecognizer>
                                    <!--<TapGestureRecognizer Tapped="OnBookingViewClicked"/>-->
                                </Frame.GestureRecognizers>
                            </Frame>
                        </DataTemplate>
                    </CollectionView.ItemTemplate>
                </CollectionView>
            </Frame>
            <Button VerticalOptions="EndAndExpand"
                    Margin="40,0,40,15"
                    Text="Refresh"
                    FontSize="20"
                    TextColor="White"
                    Command="{Binding OnRefreshClicked}"/>
        </StackLayout>
    </ContentPage.Content>
</ContentPage>