<?xml version="1.0" encoding="utf-8" ?>
<local:AppSearchBoxBase
    x:Class="BiliCopilot.UI.Controls.Components.AppSearchBox"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:base="using:Richasy.WinUIKernel.Share.Base"
    xmlns:converters="using:BiliCopilot.UI.Converters"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:ext="using:BiliCopilot.UI.Extensions"
    xmlns:ic="using:FluentIcons.WinUI"
    xmlns:items="using:BiliCopilot.UI.ViewModels.Items"
    xmlns:local="using:BiliCopilot.UI.Controls.Components"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:search="using:Richasy.BiliKernel.Models.Search"
    mc:Ignorable="d">

    <UserControl.Resources>
        <converters:SearchSuggestRegionIconConverter x:Key="IconConverter" />
        <DataTemplate x:Key="BasicSearchItemTemplate" x:DataType="items:SearchSuggestItemViewModel">
            <base:TrimTextBlock Text="{x:Bind SearchContent}" />
        </DataTemplate>
        <DataTemplate x:Key="RegionSearchItemTemplate" x:DataType="items:SearchSuggestItemViewModel">
            <Grid ColumnSpacing="8">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition />
                    <ColumnDefinition Width="Auto" />
                </Grid.ColumnDefinitions>
                <ic:SymbolIcon
                    VerticalAlignment="Center"
                    FontSize="14"
                    Foreground="{ThemeResource TextFillColorTertiaryBrush}"
                    Symbol="{x:Bind RegionId, Converter={StaticResource IconConverter}}" />
                <TextBlock
                    Grid.Column="1"
                    VerticalAlignment="Center"
                    Foreground="{ThemeResource TextFillColorSecondaryBrush}"
                    Text="{ext:Locale Name=Search}" />
                <base:TrimTextBlock
                    Grid.Column="2"
                    VerticalAlignment="Center"
                    MaxLines="1"
                    Text="{x:Bind SearchContent, Mode=OneWay}" />
                <Border
                    Grid.Column="3"
                    Padding="4,2"
                    VerticalAlignment="Center"
                    Background="{ThemeResource CardBackgroundFillColorDefaultBrush}"
                    CornerRadius="{StaticResource ControlCornerRadius}">
                    <TextBlock
                        VerticalAlignment="Center"
                        Foreground="{ThemeResource TextFillColorDisabledBrush}"
                        Style="{StaticResource CaptionTextBlockStyle}"
                        Text="{x:Bind RegionName, Mode=OneWay}" />
                </Border>
            </Grid>
        </DataTemplate>
        <ext:SearchSuggestTemplateSelector
            x:Key="SuggestSelector"
            BasicTemplate="{StaticResource BasicSearchItemTemplate}"
            RegionTemplate="{StaticResource RegionSearchItemTemplate}" />
    </UserControl.Resources>

    <Grid>
        <AutoSuggestBox
            x:Name="Box"
            HorizontalAlignment="Stretch"
            GettingFocus="OnBoxGettingFocus"
            IsTabStop="True"
            ItemTemplateSelector="{StaticResource SuggestSelector}"
            ItemsSource="{x:Bind ViewModel.Suggestion}"
            PlaceholderText="{ext:Locale Name=SearchTip}"
            QueryIcon="Find"
            QuerySubmitted="OnQuerySubmitted"
            Text="{x:Bind ViewModel.Keyword, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
            TextChanged="OnKeywordChanged"
            UpdateTextOnSelect="False">
            <AutoSuggestBox.TextBoxStyle>
                <Style BasedOn="{StaticResource AutoSuggestBoxTextBoxStyle}" TargetType="TextBox">
                    <Setter Property="Padding" Value="36,6,8,6" />
                </Style>
            </AutoSuggestBox.TextBoxStyle>
        </AutoSuggestBox>
        <Button
            x:Name="HotSearchButton"
            Width="32"
            Height="32"
            Margin="2,0,0,0"
            VerticalAlignment="Center"
            Style="{StaticResource SmallIconButtonStyle}"
            ToolTipService.ToolTip="{ext:Locale Name=HotSearch}">
            <Button.KeyboardAccelerators>
                <KeyboardAccelerator
                    Key="H"
                    IsEnabled="True"
                    Modifiers="Control" />
            </Button.KeyboardAccelerators>
            <ic:SymbolIcon FontSize="12" Symbol="Reward" />
            <Button.Flyout>
                <Flyout
                    x:Name="HotSearchFlyout"
                    Opened="OnHotSearchFlyoutOpened"
                    Placement="BottomEdgeAlignedLeft"
                    ShouldConstrainToRootBounds="False">
                    <Flyout.FlyoutPresenterStyle>
                        <Style BasedOn="{StaticResource DefaultFlyoutPresenterStyle}" TargetType="FlyoutPresenter">
                            <Setter Property="Padding" Value="0" />
                            <Setter Property="MaxHeight" Value="480" />
                        </Style>
                    </Flyout.FlyoutPresenterStyle>
                    <Grid Width="300" MinHeight="150">
                        <ItemsView
                            x:Name="HotSearchView"
                            Padding="4"
                            IsItemInvokedEnabled="True"
                            ItemInvoked="OnHotSearchItemInvoked"
                            ItemsSource="{x:Bind ViewModel.HotSearchItems}"
                            SelectionMode="None">
                            <ItemsView.ItemTemplate>
                                <DataTemplate x:DataType="search:HotSearchItem">
                                    <ItemContainer Height="44" AutomationProperties.Name="{x:Bind Text}">
                                        <Grid Margin="12,0">
                                            <Grid.ColumnDefinitions>
                                                <ColumnDefinition Width="28" />
                                                <ColumnDefinition Width="Auto" />
                                                <ColumnDefinition Width="*" />
                                            </Grid.ColumnDefinitions>
                                            <TextBlock
                                                VerticalAlignment="Center"
                                                FontSize="12"
                                                Foreground="{ThemeResource TextFillColorSecondaryBrush}"
                                                Text="{x:Bind Index}" />
                                            <Image
                                                Grid.Column="1"
                                                Width="16"
                                                Margin="0,0,12,0"
                                                VerticalAlignment="Center"
                                                Source="{x:Bind Icon.Uri, Converter={StaticResource BitmapConverter}}"
                                                Stretch="Uniform"
                                                Visibility="{x:Bind Icon, Converter={StaticResource ObjectToVisibilityConverter}}" />
                                            <TextBlock
                                                Grid.Column="2"
                                                VerticalAlignment="Center"
                                                MaxLines="1"
                                                Style="{StaticResource BodyTextBlockStyle}"
                                                Text="{x:Bind Text}"
                                                TextLineBounds="Tight"
                                                TextTrimming="CharacterEllipsis" />
                                        </Grid>
                                    </ItemContainer>
                                </DataTemplate>
                            </ItemsView.ItemTemplate>
                        </ItemsView>
                        <ProgressRing IsActive="{x:Bind ViewModel.IsHotSearchLoading, Mode=OneWay}" Style="{StaticResource PageProgressRingStyle}" />
                    </Grid>
                </Flyout>
            </Button.Flyout>
        </Button>
    </Grid>
</local:AppSearchBoxBase>
