StabilityMatrix/StabilityMatrix.Avalonia/Views/PackageManager/PackageExtensionBrowserView.axaml

<controls:UserControlBase 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:vm="clr-namespace:StabilityMatrix.Avalonia.ViewModels"
                          xmlns:ui="using:FluentAvalonia.UI.Controls"
                          xmlns:mocks="clr-namespace:StabilityMatrix.Avalonia.DesignData"
                          xmlns:controls="clr-namespace:StabilityMatrix.Avalonia.Controls"
                          xmlns:system="clr-namespace:System;assembly=System.Runtime"
                          xmlns:packageManager="clr-namespace:StabilityMatrix.Avalonia.ViewModels.PackageManager"
                          xmlns:extensions="clr-namespace:StabilityMatrix.Core.Models.Packages.Extensions;assembly=StabilityMatrix.Core"
                          xmlns:input="clr-namespace:FluentAvalonia.UI.Input;assembly=FluentAvalonia"
                          xmlns:lang="clr-namespace:StabilityMatrix.Avalonia.Languages"
                          xmlns:fluentIcons="clr-namespace:FluentIcons.FluentAvalonia;assembly=FluentIcons.FluentAvalonia"
                          xmlns:sg="clr-namespace:SpacedGridControl.Avalonia;assembly=SpacedGridControl.Avalonia"
                          xmlns:models="clr-namespace:StabilityMatrix.Core.Models;assembly=StabilityMatrix.Core"
                          xmlns:converters="clr-namespace:StabilityMatrix.Avalonia.Converters"
                          d:DataContext="{x:Static mocks:DesignData.PackageExtensionBrowserViewModel}"
                          x:DataType="packageManager:PackageExtensionBrowserViewModel"
                          mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450"
                          x:Class="StabilityMatrix.Avalonia.Views.PackageManager.PackageExtensionBrowserView">
    <controls:UserControlBase.Resources>
        <!--<input:StandardUICommand x:Key="InstallExtensionCommand"
                                 Command="{Binding InstallExtensionCommand}" />-->
        <converters:FileUriConverter x:Key="FileUriConverter"/>
        
        <DataTemplate x:Key="PackageExtensionTemplate">
            <DataTemplate.DataType>
                <x:Type TypeName="models:SelectableItem" x:TypeArguments="extensions:PackageExtension"/>
            </DataTemplate.DataType>
            <controls:Card 
                Padding="12,12"
                Margin="4"
                Classes="transparent-full"
                CornerRadius="8">

                <sg:SpacedGrid ColumnDefinitions="Auto,*,Auto">
                    <!--<controls:BetterAdvancedImage
                        Grid.Column="0"
                        MaxHeight="128"
                        MaxWidth="128"
                        Stretch="UniformToFill"
                        CornerRadius="4"
                        Source="{Binding PreviewImageUri}" />-->
                    <StackPanel Grid.Column="1" Orientation="Vertical" Spacing="4">
                        <TextBlock Text="{Binding Item.Title}"
                                   FontWeight="Light"
                                   FontSize="16" />
                        
                        <TextBlock Text="{Binding Item.Author}"
                                   FontWeight="Light"
                                   FontSize="13" />

                        <TextBlock TextWrapping="Wrap"
                                   Text="{Binding Item.Description}"
                                   Foreground="{DynamicResource TextFillColorSecondary}"
                                   FontWeight="Light"
                                   FontSize="13" />
                        
                        <controls:HyperlinkIconButton
                            Margin="0"
                            Padding="0,2"
                            NavigateUri="{Binding Item.Reference}"
                            Content="GitHub"
                            />
                    </StackPanel>
                    
                    <CheckBox 
                        IsChecked="{Binding IsSelected}"
                        Margin="0,0,16,0"
                        Grid.Column="2"/>
                    
                </sg:SpacedGrid>
            </controls:Card>
        </DataTemplate>
        
        <DataTemplate x:Key="InstalledPackageExtensionTemplate">
            <DataTemplate.DataType>
                <x:Type TypeName="models:SelectableItem" x:TypeArguments="extensions:InstalledPackageExtension"/>
            </DataTemplate.DataType>
            <controls:Card 
                Padding="12,12"
                Margin="4"
                Classes="transparent-full"
                CornerRadius="8">

                <sg:SpacedGrid ColumnDefinitions="*,Auto">
                    <StackPanel 
                        DataContext="{Binding Item}"
                        Orientation="Vertical" Spacing="4">
                        <TextBlock
                            Text="{Binding Title}"
                            FontWeight="Light"
                            FontSize="16"/>
                        <TextBlock Text="{Binding Version, FallbackValue=''}"
                                   Foreground="{DynamicResource TextFillColorTertiaryBrush}"
                                   FontSize="13" />
                        <TextBlock TextWrapping="Wrap"
                                   Text="{Binding Definition.Description, FallbackValue=''}"
                                   Foreground="{DynamicResource TextFillColorSecondary}"
                                   FontWeight="Light"
                                   FontSize="13" />
                        <StackPanel Orientation="Horizontal" Spacing="2">
                            <controls:HyperlinkIconButton
                                IsEnabled="{Binding Definition, Converter={x:Static ObjectConverters.IsNotNull}}"
                                Margin="0"
                                Padding="0,2"
                                NavigateUri="{Binding Definition.Reference, FallbackValue=''}"
                                Content="GitHub"/>
                            
                            <Ellipse
                                Width="3"
                                Height="3"
                                Opacity="0.8"
                                VerticalAlignment="Center"
                                Fill="{DynamicResource TextFillColorTertiaryBrush}" />
                            
                            <controls:HyperlinkIconButton
                                IsEnabled="{Binding Definition, Converter={x:Static ObjectConverters.IsNotNull}}"
                                Margin="0"
                                Padding="0,2"
                                NavigateUri="{Binding PrimaryPath.FullPath, Converter={StaticResource FileUriConverter}}"
                                Content="{Binding DisplayPath}"/>
                        </StackPanel>
                    </StackPanel>
                    <CheckBox 
                        Grid.Column="1"
                        HorizontalAlignment="Right"
                        IsChecked="{Binding IsSelected}"
                        Margin="0,0,16,0"/>
                </sg:SpacedGrid>
            </controls:Card>
        </DataTemplate>
    </controls:UserControlBase.Resources>

    <TabControl TabStripPlacement="Top" SelectionChanged="TabControl_OnSelectionChanged">
        <TabControl.Items>
            <TabItem FontSize="18" Header="Available Extensions" Margin="8,0,0,0">
                <sg:SpacedGrid 
                    RowDefinitions="Auto,*,Auto"
                    RowSpacing="12"
                    Margin="8">
                    <sg:SpacedGrid 
                        ColumnDefinitions="*,Auto,Auto" 
                        ColumnSpacing="8">
                        <TextBox 
                            Classes="search"
                            Margin="4, 0,0,0"
                                 Watermark="{x:Static lang:Resources.Action_Search}"
                                 HorizontalAlignment="Stretch"
                                 VerticalAlignment="Center"
                                 Text="{Binding AvailableItemsSearchCollection.Query, Mode=TwoWay}"/>
                        
                        <!-- Refresh Button -->
                        <Button
                            Grid.Row="0"
                            Grid.Column="1"
                            Padding="16,6"
                            HorizontalAlignment="Left"
                            VerticalAlignment="Stretch"
                            Command="{Binding RefreshCommand}">
                            <ui:SymbolIcon FontSize="16" Symbol="Refresh" />
                        </Button>
                        
                        <!-- Settings / Edit Manifests Button -->
                        <Button
                            Grid.Row="0"
                            Grid.Column="2"
                            Command="{Binding OpenExtensionsSettingsDialogCommand}"
                            Padding="16,6"
                            HorizontalAlignment="Left"
                            VerticalAlignment="Stretch">
                            <ui:SymbolIcon FontSize="16" Symbol="Settings" />
                        </Button>
                    </sg:SpacedGrid>
                    
                    <ScrollViewer 
                        IsVisible="{Binding !IsLoading}"
                        Grid.Row="1">
                        <ItemsRepeater 
                            DataContext="{Binding AvailableItemsSearchCollection}"
                            ItemTemplate="{StaticResource PackageExtensionTemplate}"
                            ItemsSource="{Binding FilteredItems}">
                            <ItemsRepeater.Layout>
                                <StackLayout Orientation="Vertical" />
                            </ItemsRepeater.Layout>
                        </ItemsRepeater>
                    </ScrollViewer>
                    
                    <Panel
                        IsVisible="{Binding IsLoading}"
                        Grid.Row="1">
                        <ProgressBar
                            Margin="32,16"
                            IsIndeterminate="True"
                            IsEnabled="{Binding IsLoading}"
                            IsVisible="{Binding IsLoading}"/>
                    </Panel>
                    
                    <ui:InfoBar
                        Grid.Row="2"
                        IsOpen="{Binding !!SelectedAvailableItems.Count}" 
                        HorizontalContentAlignment="Right"
                        HorizontalAlignment="Right"
                        CloseButtonCommand="{Binding ClearSelection}"
                        IsIconVisible="False">
                        <ui:InfoBar.Title>
                            <MultiBinding StringFormat="{}{0} Selected">
                                <Binding Path="SelectedAvailableItems.Count"/>
                            </MultiBinding>
                        </ui:InfoBar.Title>
                        <ui:InfoBar.ActionButton>
                            <Button
                                Classes="accent"
                                Command="{Binding InstallSelectedExtensionsCommand}"
                                Content="{x:Static lang:Resources.Action_Install}"/>
                        </ui:InfoBar.ActionButton>
                    </ui:InfoBar>

                </sg:SpacedGrid>
            </TabItem>
            
            <TabItem FontSize="18" Header="Installed Extensions" Margin="0,0,0,0">
                
                <sg:SpacedGrid 
                    RowDefinitions="Auto,*,Auto"
                    RowSpacing="12"
                    Margin="8">
                    <sg:SpacedGrid 
                        ColumnDefinitions="*,Auto" 
                        ColumnSpacing="8">
                        <TextBox 
                            Classes="search"
                            Margin="4, 0,0,0"
                                 DataContext="{Binding InstalledItemsSearchCollection}"
                                 Watermark="{x:Static lang:Resources.Action_Search}"
                                 HorizontalAlignment="Stretch"
                                 VerticalAlignment="Center"
                                 Text="{Binding Query, Mode=TwoWay}"/>

                        <!-- Refresh Button -->
                        <Button
                            Grid.Row="0"
                            Grid.Column="1"
                            Padding="16,6"
                            HorizontalAlignment="Left"
                            VerticalAlignment="Stretch"
                            Command="{Binding RefreshCommand}">
                            <ui:SymbolIcon FontSize="16" Symbol="Refresh" />
                        </Button>
                        
                        <!-- Settings / Edit Manifests Button -->
                        <!--<Button
                            Grid.Row="0"
                            Grid.Column="2"
                            Padding="16,6"
                            HorizontalAlignment="Left"
                            VerticalAlignment="Stretch">
                            <ui:SymbolIcon FontSize="16" Symbol="Settings" />
                        </Button>-->
                    </sg:SpacedGrid>
                    
                    <ScrollViewer 
                        IsVisible="{Binding !IsLoading}"
                        Grid.Row="1">
                        <ItemsRepeater
                            DataContext="{Binding InstalledItemsSearchCollection}"
                            ItemTemplate="{StaticResource InstalledPackageExtensionTemplate}"
                            ItemsSource="{Binding FilteredItems}">
                            <ItemsRepeater.Layout>
                                <StackLayout Orientation="Vertical" />
                            </ItemsRepeater.Layout>
                        </ItemsRepeater>
                    </ScrollViewer>
                    
                    <Panel
                        IsVisible="{Binding IsLoading}"
                        Grid.Row="1"
                           >
                        <ProgressBar
                            Margin="32,16"
                            IsIndeterminate="True"
                            IsEnabled="{Binding IsLoading}"
                            IsVisible="{Binding IsLoading}"/>
                    </Panel>
                    
                    <ui:InfoBar
                        Grid.Row="2"
                        IsOpen="{Binding !!SelectedInstalledItems.Count}" 
                        HorizontalContentAlignment="Right"
                        HorizontalAlignment="Right"
                        CloseButtonCommand="{Binding ClearSelection}"
                        IsIconVisible="False">
                        <ui:InfoBar.Title>
                            <MultiBinding StringFormat="{}{0} Selected">
                                <Binding Path="SelectedInstalledItems.Count"/>
                            </MultiBinding>
                        </ui:InfoBar.Title>
                        <ui:InfoBar.ActionButton>
                            <StackPanel Orientation="Horizontal" Spacing="6">
                                <Button
                                    Classes="accent"
                                    Command="{Binding UpdateSelectedExtensionsCommand}"
                                    Content="{x:Static lang:Resources.Action_Update}"/>
                                <Button
                                    Command="{Binding UninstallSelectedExtensionsCommand}"
                                    Content="{x:Static lang:Resources.Action_Uninstall}"/>
                            </StackPanel>

                        </ui:InfoBar.ActionButton>
                    </ui:InfoBar>

                </sg:SpacedGrid>
                
            </TabItem>
        </TabControl.Items>
    </TabControl>
</controls:UserControlBase>