<ui:UiPage x:Class="Bloxstrap.UI.Elements.Menu.Pages.FastFlagEditorPage"
      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
      xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
      xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
      xmlns:ui="http://schemas.lepo.co/wpfui/2022/xaml"
      xmlns:local="clr-namespace:Bloxstrap.UI.Elements.Menu.Pages"
      mc:Ignorable="d" 
      d:DesignHeight="450" d:DesignWidth="800"
      Title="FastFlagEditorPage"
      Loaded="Page_Loaded">
    <Grid Margin="0,0,14,14">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>
        
        <TextBlock Grid.Row="0" Margin="0,0,0,16" Text="Manage your own FastFlags. Double click a column to edit." FontSize="14" Foreground="{DynamicResource TextFillColorSecondaryBrush}" />

        <StackPanel Grid.Row="1" Margin="0,0,0,16" Orientation="Horizontal">
            <ui:Button Icon="ArrowLeft48" Content="Back" Click="BackButton_Click" />
            <ui:Button Icon="Add28" Content="Add new" Click="AddButton_Click" Margin="12,0,0,0" />
            <ui:Button Icon="Delete48" Content="Delete selected" Click="DeleteButton_Click" Appearance="Danger" Margin="12,0,0,0">
                <ui:Button.Style>
                    <Style TargetType="ui:Button" BasedOn="{StaticResource {x:Type ui:Button}}">
                        <Style.Triggers>
                            <DataTrigger Binding="{Binding ElementName=DataGrid, Path=SelectedItems.Count}" Value="0">
                                <Setter Property="IsEnabled" Value="False" />
                            </DataTrigger>
                        </Style.Triggers>
                    </Style>
                </ui:Button.Style>
            </ui:Button>
            <ToggleButton x:Name="TogglePresetsButton" Content="Show preset flags" Click="ToggleButton_Click" Margin="12,0,0,0" />
            <ui:Button Icon="ArrowImport24" Content="Import JSON" Margin="12,0,0,0" Click="ImportJSONButton_Click" />
        </StackPanel>

        <ui:TextBox x:Name="SearchTextBox" Grid.Row="2" Margin="0,0,0,16" Icon="Search32" PlaceholderText="Search" TextChanged="SearchTextBox_TextChanged" />

        <DataGrid Name="DataGrid" Grid.Row="3" HeadersVisibility="Column" GridLinesVisibility="Horizontal" AutoGenerateColumns="False" CanUserAddRows="False" CanUserDeleteRows="False" CellEditEnding="DataGrid_CellEditEnding">
            <DataGrid.Style>
                <Style TargetType="DataGrid" BasedOn="{StaticResource {x:Type DataGrid}}">
                    <Setter Property="Background" Value="Transparent" />
                    <Setter Property="BorderThickness" Value="0" />
                </Style>
            </DataGrid.Style>
            
            <DataGrid.ColumnHeaderStyle>
                <Style TargetType="DataGridColumnHeader">
                    <Setter Property="Background" Value="{DynamicResource ControlFillColorTertiaryBrush}" />
                    <Setter Property="Height" Value="32" />
                    <Setter Property="Padding" Value="8,0,8,0" />
                    <Setter Property="BorderBrush" Value="{DynamicResource ControlElevationBorderBrush}" />
                    <Setter Property="BorderThickness" Value="1" />
                </Style>
            </DataGrid.ColumnHeaderStyle>

            <DataGrid.CellStyle>
                <Style TargetType="DataGridCell">
                    <Style.Triggers>
                        <Trigger Property="IsSelected" Value="True">
                            <Setter Property="Foreground">
                                <Setter.Value>
                                    <SolidColorBrush Color="{DynamicResource TextOnAccentFillColorPrimary}" />
                                </Setter.Value>
                            </Setter>
                            <Setter Property="Background">
                                <Setter.Value>
                                    <SolidColorBrush Color="{DynamicResource SystemAccentColorSecondary}" />
                                </Setter.Value>
                            </Setter>
                        </Trigger>
                    </Style.Triggers>
                    <Setter Property="Height" Value="32" />
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="DataGridCell">
                                <Border Background="{TemplateBinding Background}" Padding="6,0,6,0">
                                    <ContentPresenter VerticalAlignment="Center" />
                                </Border>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                </Style>
            </DataGrid.CellStyle>
            
            <DataGrid.Columns>
                <DataGridTextColumn Header="Name" Binding="{Binding Name}" />
                <DataGridTextColumn Header="Value" Binding="{Binding Value}" Width="*" />
            </DataGrid.Columns>
        </DataGrid>
    </Grid>
</ui:UiPage>
