<UserControl xmlns="https://github.com/avaloniaui"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:avalonia="clr-namespace:Material.Icons.Avalonia;assembly=Material.Icons.Avalonia"
             xmlns:ui="clr-namespace:FluentAvalonia.UI.Controls;assembly=FluentAvalonia"
             xmlns:sidebar="clr-namespace:Artemis.UI.Screens.Sidebar"
             mc:Ignorable="d" d:DesignWidth="240" d:DesignHeight="450"
             x:Class="Artemis.UI.Screens.Sidebar.SidebarView"
             x:DataType="sidebar:SidebarViewModel">
    <UserControl.Styles>
        <StyleInclude Source="avares://Avalonia.Xaml.Interactions.Draggable/Styles.axaml" />
    </UserControl.Styles>
    <Grid RowDefinitions="60,Auto,Auto,*,Auto,Auto">
        <Grid Grid.Row="0" IsHitTestVisible="False" ColumnDefinitions="Auto,*">
            <Image Grid.Column="0" Margin="12" Source="/Assets/Images/Logo/bow.png" RenderOptions.BitmapInterpolationMode="HighQuality" />
            <TextBlock Grid.Column="1" FontSize="24" VerticalAlignment="Center">
                Artemis 2
            </TextBlock>
        </Grid>

        <!-- Built-in screens -->
        <TreeView Grid.Row="1"
                  Margin="10 2"
                  ItemsSource="{CompiledBinding SidebarScreen.Screens}"
                  SelectedItem="{CompiledBinding SelectedScreen}"
                  ItemContainerTheme="{StaticResource MenuTreeViewItem}"
                  PointerReleased="InputElement_OnPointerReleased">
            <TreeView.Styles>
                <Style Selector="TreeViewItem">
                    <Setter Property="IsExpanded" Value="{CompiledBinding IsExpanded, Mode=TwoWay, DataType=sidebar:SidebarScreenViewModel}" />
                </Style>
            </TreeView.Styles>
            <TreeView.ItemTemplate>
                <TreeDataTemplate ItemsSource="{CompiledBinding Screens}">
                    <ContentControl Content="{CompiledBinding}" />
                </TreeDataTemplate>
            </TreeView.ItemTemplate>
        </TreeView>

        <Border Grid.Row="2" Margin="8" Height="1" Background="{DynamicResource ButtonBorderBrush}"></Border>

        <!-- Categories -->
        <ScrollViewer Grid.Row="3" VerticalScrollBarVisibility="Auto">
            <StackPanel>
                <ItemsControl Margin="10 2" ItemsSource="{CompiledBinding SidebarCategories}" Classes="profile-categories" />
                <Button Content="Add new category"
                        Margin="10"
                        HorizontalAlignment="Stretch"
                        Command="{CompiledBinding AddCategory}" />
            </StackPanel>
        </ScrollViewer>

        <!-- Bottom buttons -->
        <Border Grid.Row="4" Margin="8" Height="1" Background="{DynamicResource ButtonBorderBrush}"></Border>
        <WrapPanel Grid.Row="5" Orientation="Horizontal" HorizontalAlignment="Left" Margin="5 0 5 5">
            <ui:HyperlinkButton Classes="icon-button"
                                Width="44"
                                Height="44"
                                ToolTip.Tip="View website"
                                ToolTip.Placement="Top"
                                ToolTip.VerticalOffset="-5"
                                NavigateUri="https://artemis-rgb.com?mtm_campaign=artemis&amp;mtm_kwd=sidebar">
                <avalonia:MaterialIcon Kind="Web" Width="20" Height="20" />
            </ui:HyperlinkButton>
            <ui:HyperlinkButton Classes="icon-button"
                                Width="44"
                                Height="44"
                                ToolTip.Tip="View GitHub repository"
                                ToolTip.Placement="Top"
                                ToolTip.VerticalOffset="-5"
                                NavigateUri="https://github.com/Artemis-RGB/Artemis">
                <avalonia:MaterialIcon Kind="Github" Width="20" Height="20" />
            </ui:HyperlinkButton>
            <ui:HyperlinkButton Classes="icon-button"
                                Width="44"
                                Height="44"
                                ToolTip.Tip="View Wiki"
                                ToolTip.Placement="Top"
                                ToolTip.VerticalOffset="-5"
                                NavigateUri="https://wiki.artemis-rgb.com?mtm_campaign=artemis&amp;mtm_kwd=sidebar">
                <avalonia:MaterialIcon Kind="BookOpenOutline" Width="20" Height="20" />
            </ui:HyperlinkButton>
            <ui:HyperlinkButton Classes="icon-button"
                                Width="44"
                                Height="44"
                                ToolTip.Tip="Join our Discord"
                                ToolTip.Placement="Top"
                                ToolTip.VerticalOffset="-5"
                                NavigateUri="https://discord.gg/S3MVaC9">
                <avalonia:MaterialIcon Kind="Chat" Width="20" Height="20" />
            </ui:HyperlinkButton>
            <ui:HyperlinkButton Classes="icon-button"
                                Width="44"
                                Height="44"
                                ToolTip.Tip="View donation options"
                                ToolTip.Placement="Top"
                                ToolTip.VerticalOffset="-5"
                                NavigateUri="https://wiki.artemis-rgb.com/en/donating?mtm_campaign=artemis&amp;mtm_kwd=sidebar">
                <avalonia:MaterialIcon Kind="Gift" Width="20" Height="20" />
            </ui:HyperlinkButton>
        </WrapPanel>
    </Grid>
</UserControl>