<controls:PageBase
    x:Class="JumpPoint.Uwp.Views.CloudDrivesPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:JumpPoint.Uwp.Views"
    xmlns:nguwp="using:NittyGritty.Uwp"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:controls="using:JumpPoint.Uwp.Controls"
    xmlns:grouper="using:JumpPoint.Platform.Items.Arrangers.Groupers"
    xmlns:i="using:Microsoft.Xaml.Interactivity"
    xmlns:icore="using:Microsoft.Xaml.Interactions.Core"
    xmlns:actions="using:NittyGritty.Uwp.Interactivity.Actions"
                   xmlns:converters="using:JumpPoint.Uwp.Converters"
                   xmlns:platform="using:JumpPoint.Platform"
                   xmlns:cloud="using:JumpPoint.Platform.Items.CloudStorage"
                   mc:Ignorable="d">

    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>
        <controls:JumpPointViewer Grid.Row="1"
                                  Context="{x:Bind ViewModel, Mode=OneWay}"
                                  SortBy="{x:Bind ViewModel.Settings.SortBy, Mode=OneWay}"
                                  IsSortAscending="{x:Bind ViewModel.Settings.IsSortAscending, Mode=OneWay}"
                                  GroupBy="Custom"
                                  IsGroupAscending="{x:Bind ViewModel.Settings.IsGroupAscending, Mode=OneWay}"
                                  CustomGrouper="{x:Bind grouper:Grouper.CloudDrive}"
                                  IsLoading="{x:Bind ViewModel.IsLoading, Mode=OneWay}"
                                  SelectedItems="{x:Bind ViewModel.SelectedItems, Mode=OneWay}"
                                  ItemsSource="{x:Bind ViewModel.Items, Mode=OneWay}">
            <controls:JumpPointViewer.QuickActions>
                <StackPanel Orientation="Horizontal"
                            Spacing="8"
                            Height="48"
                            Margin="0,8,0,0"
                            Padding="8"
                            CornerRadius="6"
                            Background="{ThemeResource ExpanderHeaderBackground}">
                    <controls:IconButton IconSource="{x:Bind converters:IconConverter.GetPathTypeIconSource(platform:AppPath.CloudDrives, x:Null)}"
                                         Content="Add Cloud Account">
                        <controls:IconButton.Flyout>
                            <MenuFlyout Placement="Bottom">
                                <MenuFlyoutItem Icon="{x:Bind converters:IconConverter.GetPathTypeIconElement(platform:AppPath.Cloud, cloud:CloudStorageProvider.OneDrive)}"
                                                Text="OneDrive"
                                                CommandParameter="{x:Bind cloud:CloudStorageProvider.OneDrive}"
                                                Command="{x:Bind ViewModel.AddAccountCommand}"/>
                                <MenuFlyoutItem Icon="{x:Bind converters:IconConverter.GetPathTypeIconElement(platform:AppPath.Cloud, cloud:CloudStorageProvider.Storj)}"
                                                Text="Storj"
                                                CommandParameter="{x:Bind cloud:CloudStorageProvider.Storj}"
                                                Command="{x:Bind ViewModel.AddAccountCommand}"/>
                                <MenuFlyoutItem Icon="{x:Bind converters:IconConverter.GetPathTypeIconElement(platform:AppPath.Cloud, cloud:CloudStorageProvider.OpenDrive)}"
                                                Text="OpenDrive"
                                                CommandParameter="{x:Bind cloud:CloudStorageProvider.OpenDrive}"
                                                Command="{x:Bind ViewModel.AddAccountCommand}"/>
                            </MenuFlyout>
                        </controls:IconButton.Flyout>
                    </controls:IconButton>
                </StackPanel>
            </controls:JumpPointViewer.QuickActions>
        </controls:JumpPointViewer>
        <Grid Padding="12,8"
              Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"
              x:Load="{x:Bind ViewModel.IsSearching, Mode=OneWay}"
              ColumnSpacing="8"
              x:Name="paneSearch">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*" />
                <ColumnDefinition Width="Auto" />
            </Grid.ColumnDefinitions>
            <TextBox Text="{x:Bind ViewModel.Search, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
                     PlaceholderText="Search..."
                     HorizontalAlignment="Stretch">
                <i:Interaction.Behaviors>
                    <icore:EventTriggerBehavior EventName="Loaded">
                        <actions:FocusAction />
                    </icore:EventTriggerBehavior>
                </i:Interaction.Behaviors>
            </TextBox>
            <Button Grid.Column="1"
                    Padding="4"
                    BorderThickness="0"
                    Background="Transparent"
                    VerticalAlignment="Center"
                    Click="{x:Bind ViewModel.CloseSearch}">
                <IconSourceElement IconSource="{StaticResource CloseTabIcon}" />
            </Button>
        </Grid>
    </Grid>
</controls:PageBase>
