Wino-Mail/Wino.Mail.WinUI/Views/Settings/MailCategoryManagementPage.xaml

<abstract:MailCategoryManagementPageAbstract
    x:Class="Wino.Views.Settings.MailCategoryManagementPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:abstract="using:Wino.Views.Abstract"
    xmlns:controls="using:Wino.Controls"
    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:mail="using:Wino.Core.Domain.Entities.Mail"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    x:Name="root"
    mc:Ignorable="d">

    <Page.Resources>
        <DataTemplate x:Key="MailCategoryTemplate" x:DataType="mail:MailCategory">
            <Grid
                Margin="0,0,0,12"
                Padding="0,0,0,12"
                ColumnSpacing="16">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*" />
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="Auto" />
                </Grid.ColumnDefinitions>

                <Grid
                    VerticalAlignment="Center"
                    ColumnSpacing="12">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="Auto" />
                        <ColumnDefinition Width="*" />
                    </Grid.ColumnDefinitions>

                    <Border
                        Width="28"
                        Height="28"
                        VerticalAlignment="Top"
                        Background="{x:Bind helpers:XamlHelpers.GetSolidColorBrushFromHex(BackgroundColorHex), Mode=OneWay}"
                        BorderBrush="{x:Bind helpers:XamlHelpers.GetSolidColorBrushFromHex(TextColorHex), Mode=OneWay}"
                        BorderThickness="1"
                        CornerRadius="8" />

                    <StackPanel
                        Grid.Column="1"
                        VerticalAlignment="Center"
                        Spacing="2">
                        <TextBlock
                            FontWeight="SemiBold"
                            Foreground="{x:Bind helpers:XamlHelpers.GetSolidColorBrushFromHex(TextColorHex), Mode=OneWay}"
                            Style="{StaticResource BodyTextBlockStyle}"
                            Text="{x:Bind Name}"
                            TextTrimming="CharacterEllipsis" />
                        <TextBlock
                            Foreground="{ThemeResource TextFillColorSecondaryBrush}"
                            Style="{StaticResource CaptionTextBlockStyle}">
                            <Run Text="{x:Bind BackgroundColorHex}" />
                            <Run Text=" / " />
                            <Run Text="{x:Bind TextColorHex}" />
                        </TextBlock>
                    </StackPanel>
                </Grid>

                <ToggleButton
                    Grid.Column="1"
                    Checked="FavoriteCategoryChecked"
                    IsChecked="{x:Bind IsFavorite, Mode=OneWay}"
                    Tag="{x:Bind}"
                    Unchecked="FavoriteCategoryUnchecked">
                    <FontIcon FontFamily="{StaticResource SymbolThemeFontFamily}" Glyph="&#xE208;" />
                </ToggleButton>

                <Button
                    Grid.Column="2"
                    Click="EditCategoryClicked"
                    Tag="{x:Bind}">
                    <FontIcon FontFamily="{StaticResource SymbolThemeFontFamily}" Glyph="&#xE70F;" />
                </Button>

                <Button
                    Grid.Column="3"
                    Click="DeleteCategoryClicked"
                    Tag="{x:Bind}">
                    <FontIcon FontFamily="{StaticResource SymbolThemeFontFamily}" Glyph="&#xE74D;" />
                </Button>

                <Rectangle
                    Grid.ColumnSpan="5"
                    Height="1"
                    Margin="0,12,0,0"
                    VerticalAlignment="Bottom"
                    Fill="{ThemeResource CardStrokeColorDefaultBrush}" />
            </Grid>
        </DataTemplate>
    </Page.Resources>

    <ListView
        ItemTemplate="{StaticResource MailCategoryTemplate}"
        ItemsSource="{x:Bind ViewModel.Categories, Mode=OneWay}"
        SelectionMode="None">
        <ListView.ItemContainerTransitions>
            <TransitionCollection>
                <NavigationThemeTransition />
            </TransitionCollection>
        </ListView.ItemContainerTransitions>
        <ListView.Header>
            <Grid
                Padding="16,0,24,20"
                ColumnSpacing="16">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*" />
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="Auto" />
                </Grid.ColumnDefinitions>

                <Grid Style="{StaticResource InformationAreaGridStyle}">
                    <TextBlock HorizontalTextAlignment="Center" TextWrapping="WrapWholeWords">
                        <Run FontWeight="SemiBold" Text="{x:Bind domain:Translator.MailCategoryManagementPage_Title, Mode=OneTime}" />
                        <LineBreak />
                        <Run Text="{x:Bind domain:Translator.MailCategoryManagementPage_Description, Mode=OneTime}" />
                    </TextBlock>
                </Grid>

                <Button
                    Grid.Column="1"
                    HorizontalAlignment="Stretch"
                    VerticalAlignment="Stretch"
                    Command="{x:Bind ViewModel.RefreshCategoriesCommand}"
                    Visibility="{x:Bind ViewModel.CanRefresh, Mode=OneWay}">
                    <StackPanel Spacing="6">
                        <FontIcon
                            HorizontalAlignment="Center"
                            Glyph="&#xE72C;" />
                        <TextBlock
                            HorizontalAlignment="Center"
                            Text="{x:Bind domain:Translator.Buttons_Refresh, Mode=OneTime}" />
                    </StackPanel>
                </Button>

                <Button
                    Grid.Column="2"
                    HorizontalAlignment="Stretch"
                    VerticalAlignment="Stretch"
                    Command="{x:Bind ViewModel.AddCategoryCommand}">
                    <StackPanel Spacing="6">
                        <FontIcon
                            HorizontalAlignment="Center"
                            Glyph="&#xE710;" />
                        <TextBlock
                            HorizontalAlignment="Center"
                            Text="{x:Bind domain:Translator.Buttons_Add, Mode=OneTime}" />
                    </StackPanel>
                </Button>
            </Grid>
        </ListView.Header>
        <ListView.Footer>
            <TextBlock
                Margin="0,12,0,0"
                HorizontalAlignment="Center"
                Foreground="{ThemeResource TextFillColorSecondaryBrush}"
                Style="{StaticResource BodyTextBlockStyle}"
                Text="{x:Bind domain:Translator.MailCategoryManagementPage_Empty, Mode=OneTime}"
                Visibility="{x:Bind helpers:XamlHelpers.ReverseBoolToVisibilityConverter(ViewModel.HasCategories), Mode=OneWay}" />
        </ListView.Footer>
    </ListView>
</abstract:MailCategoryManagementPageAbstract>