Wino-Mail/Wino.Mail.WinUI/ShellWindow.xaml

<?xml version="1.0" encoding="utf-8" ?>
<winuiex:WindowEx
    x:Class="Wino.Mail.WinUI.ShellWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:coreControls="using:Wino.Mail.WinUI.Controls"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:domain="using:Wino.Core.Domain"
    xmlns:helpers="using:Wino.Helpers"
    xmlns:local="using:Wino.Mail.WinUI"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:syncModels="using:Wino.Core.Domain.Models.Synchronization"
    xmlns:winuiex="using:WinUIEx"
    Title="ShellWindow"
    mc:Ignorable="d">

    <!--  SystemBackdrop will be set by NewThemeService  -->

    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>

        <Grid Grid.RowSpan="2" Background="{ThemeResource WinoApplicationBackgroundColor}" />
        <TitleBar
            x:Name="ShellTitleBar"
            Title="{x:Bind StatePersistanceService.AppModeTitle, Mode=OneWay}"
            Margin="-2"
            HorizontalContentAlignment="Stretch"
            VerticalContentAlignment="Stretch"
            BackRequested="BackButtonClicked"
            Background="Transparent"
            IsBackButtonVisible="{x:Bind StatePersistanceService.IsBackButtonVisible, Mode=OneWay}"
            IsPaneToggleButtonVisible="True"
            PaneToggleRequested="PaneButtonClicked"
            Subtitle="{x:Bind StatePersistanceService.CoreWindowTitle, Mode=OneWay}">
            <TitleBar.RightHeader>
                <StackPanel Orientation="Horizontal" Spacing="8">
                    <Button
                        x:Name="SyncStatusButton"
                        Padding="8,4"
                        VerticalAlignment="Center"
                        Background="Transparent"
                        BorderThickness="0"
                        Visibility="Collapsed">
                        <StackPanel Orientation="Horizontal" Spacing="6">
                            <ProgressRing
                                Width="16"
                                Height="16"
                                IsActive="True" />
                            <TextBlock
                                x:Name="SyncStatusText"
                                VerticalAlignment="Center"
                                Style="{StaticResource CaptionTextBlockStyle}" />
                        </StackPanel>
                        <Button.Flyout>
                            <Flyout x:Name="SyncStatusFlyout" Placement="Bottom">
                                <ItemsRepeater x:Name="SyncActionsRepeater" ItemsSource="{x:Bind SyncActionItems}">
                                    <ItemsRepeater.ItemTemplate>
                                        <DataTemplate x:DataType="syncModels:SynchronizationActionItem">
                                            <Grid
                                                MinWidth="280"
                                                MaxWidth="400"
                                                Padding="0,6"
                                                ColumnSpacing="8">
                                                <Grid.ColumnDefinitions>
                                                    <ColumnDefinition Width="Auto" />
                                                    <ColumnDefinition Width="*" />
                                                </Grid.ColumnDefinitions>
                                                <ProgressRing
                                                    Width="16"
                                                    Height="16"
                                                    IsActive="True" />
                                                <StackPanel Grid.Column="1">
                                                    <TextBlock
                                                        Foreground="{ThemeResource TextFillColorSecondaryBrush}"
                                                        Style="{StaticResource CaptionTextBlockStyle}"
                                                        Text="{x:Bind AccountName}" />
                                                    <TextBlock Text="{x:Bind Description}" TextWrapping="Wrap" />
                                                </StackPanel>
                                            </Grid>
                                        </DataTemplate>
                                    </ItemsRepeater.ItemTemplate>
                                </ItemsRepeater>
                            </Flyout>
                        </Button.Flyout>
                    </Button>
                    <Button
                        x:Name="WinoAccountButton"
                        Background="Transparent"
                        BorderBrush="Transparent"
                        Visibility="{x:Bind helpers:XamlHelpers.ReverseBoolToVisibilityConverter(PreferencesService.IsWinoAccountButtonHidden), Mode=OneWay}">
                        <Button.Flyout>
                            <Flyout
                                x:Name="WinoAccountFlyout"
                                Placement="Bottom">
                                <Grid MinWidth="320" MaxWidth="360">
                                    <StackPanel
                                        x:Name="WinoAccountSignedOutView"
                                        Spacing="12">
                                        <TextBlock
                                            Style="{StaticResource BodyStrongTextBlockStyle}"
                                            Text="{x:Bind domain:Translator.WinoAccount_Titlebar_SignedOutTitle}" />
                                        <TextBlock
                                            Foreground="{ThemeResource TextFillColorSecondaryBrush}"
                                            Text="{x:Bind domain:Translator.WinoAccount_Titlebar_SignedOutDescription}"
                                            TextWrapping="WrapWholeWords" />
                                        <StackPanel Orientation="Horizontal" Spacing="8">
                                            <Button
                                                Click="RegisterWinoAccountClicked"
                                                Content="{x:Bind domain:Translator.WinoAccount_RegisterButton_Action}" />
                                            <Button
                                                Click="LoginWinoAccountClicked"
                                                Content="{x:Bind domain:Translator.WinoAccount_LoginButton_Action}" />
                                        </StackPanel>
                                    </StackPanel>

                                    <StackPanel
                                        x:Name="WinoAccountSignedInView"
                                        Spacing="12"
                                        Visibility="Collapsed">
                                        <StackPanel Orientation="Horizontal" Spacing="12">
                                            <PersonPicture
                                                x:Name="WinoAccountFlyoutPicture"
                                                Width="40"
                                                Height="40"
                                                Initials="W" />
                                            <StackPanel Spacing="2">
                                                <TextBlock
                                                    x:Name="WinoAccountFlyoutEmailText"
                                                    Style="{StaticResource BodyStrongTextBlockStyle}"
                                                    TextWrapping="WrapWholeWords" />
                                                <TextBlock
                                                    x:Name="WinoAccountFlyoutStatusText"
                                                    Foreground="{ThemeResource TextFillColorSecondaryBrush}"
                                                    TextWrapping="WrapWholeWords" />
                                            </StackPanel>
                                        </StackPanel>
                                        <Button
                                            HorizontalAlignment="Left"
                                            Click="SignOutWinoAccountClicked"
                                            Content="{x:Bind domain:Translator.WinoAccount_SignOutButton_Action}" />
                                    </StackPanel>
                                </Grid>
                            </Flyout>
                        </Button.Flyout>
                        <Grid>
                            <PersonPicture
                                x:Name="WinoAccountButtonPicture"
                                Width="30"
                                Height="30"
                                Initials="W"
                                Visibility="Collapsed" />
                            <Border
                                x:Name="WinoAccountSignedOutIcon"
                                Width="30"
                                Height="30"
                                Background="{ThemeResource AccentFillColorDefaultBrush}"
                                CornerRadius="15">
                                <FontIcon
                                    FontSize="16"
                                    Foreground="White"
                                    Glyph="&#xE77B;" />
                            </Border>
                        </Grid>
                    </Button>
                </StackPanel>
            </TitleBar.RightHeader>
        </TitleBar>

        <Frame
            x:Name="MainShellFrame"
            Grid.Row="1"
            CacheSize="0"
            Navigated="MainFrameNavigated" />

        <coreControls:WinoInfoBar
            x:Name="ShellInfoBar"
            Grid.RowSpan="2"
            MaxWidth="700"
            Margin="0,60,25,0"
            HorizontalAlignment="Right"
            VerticalAlignment="Top"
            IsClosable="False"
            IsOpen="False" />
    </Grid>
</winuiex:WindowEx>