StabilityMatrix/StabilityMatrix.Avalonia/Views/Dialogs/OneClickInstallDialog.axaml

<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:controls="clr-namespace:StabilityMatrix.Avalonia.Controls"
             xmlns:dialogs="clr-namespace:StabilityMatrix.Avalonia.ViewModels.Dialogs"
             xmlns:designData="clr-namespace:StabilityMatrix.Avalonia.DesignData"
             xmlns:packages="clr-namespace:StabilityMatrix.Core.Models.Packages;assembly=StabilityMatrix.Core"
             xmlns:lang="clr-namespace:StabilityMatrix.Avalonia.Languages"
             xmlns:ui="clr-namespace:FluentAvalonia.UI.Controls;assembly=FluentAvalonia"
             mc:Ignorable="d" d:DesignWidth="700" d:DesignHeight="700"
             x:DataType="dialogs:OneClickInstallViewModel"
             d:DataContext="{x:Static designData:DesignData.OneClickInstallViewModel}"
             x:Class="StabilityMatrix.Avalonia.Views.Dialogs.OneClickInstallDialog">
    
    <Grid MaxHeight="900" 
          RowDefinitions="Auto,Auto,Auto,Auto,Auto" 
          ColumnDefinitions="*,Auto">

        <Grid.Transitions>
            <Transitions>
                <DoubleTransition Property="Width"
                                  Duration="00:00:00.25"
                                  Easing="0,0 0,1" />
                <DoubleTransition Property="Height"
                                  Duration="00:00:00.25"
                                  Easing="0,0 0,1" />
            </Transitions>
        </Grid.Transitions>
        
        <ui:TeachingTip
            Grid.Row="0"
            Grid.Column="0"
            Grid.ColumnSpan="2"
            Name="InferenceTeachingTip"
            MinWidth="100"
            Title="Use ComfyUI with Inference"
            Subtitle="A new built-in native Stable Diffusion experience, powered by ComfyUI"
            ActionButtonContent="{x:Static lang:Resources.Action_Install}"
            ActionButtonCommand="{Binding InstallComfyForInferenceCommand}"
            CloseButtonContent="{x:Static lang:Resources.Action_Close}"
            PreferredPlacement="RightTop"
            Margin="8,0,0,0"
            PlacementMargin="0,0,0,0"
            TailVisibility="Auto">
            <ui:TeachingTip.HeroContent>
                <controls:BetterAdvancedImage
                    RenderOptions.BitmapInterpolationMode="HighQuality"
                    Source="https://cdn.lykos.ai/static/sc-inference-drag-load.gif"/>
            </ui:TeachingTip.HeroContent>
        </ui:TeachingTip>
        
        <StackPanel Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="2">
            <TextBlock Text="{Binding HeaderText, FallbackValue=Installing Stable Diffusion WebUI...}"
                       TextWrapping="Wrap"
                       Margin="8,0,8,0"
                       VerticalAlignment="Center" HorizontalAlignment="Center"
                       FontSize="36" FontWeight="Light" />
            <TextBlock Text="{Binding SubHeaderText, FallbackValue=Installing git...}"
                       TextWrapping="Wrap" TextAlignment="Center"
                       VerticalAlignment="Top" HorizontalAlignment="Center"
                       FontSize="16" FontWeight="Light" Margin="8"/>
            <Separator Margin="16, 4" Background="#AAAAAA"
                       IsVisible="{Binding ShowInstallButton}"/>
        </StackPanel>
        
        <StackPanel Grid.Row="1" Grid.Column="0"
                    IsVisible="{Binding ShowInstallButton}">
            <TextBlock Text="{Binding SelectedPackage.DisplayName}"
                       FontSize="24"
                       Margin="16, 16, 0, 4"/>
            <TextBlock Text="{Binding SelectedPackage.Blurb}"
                       TextWrapping="Wrap"
                       Margin="16, 0, 0, 8"/>
            <TextBlock Text="{Binding SelectedPackage.Disclaimer}"
                       Padding="4"
                       Margin="16, 0, 0, 0"
                       TextWrapping="Wrap"
                       Foreground="OrangeRed"
                       IsVisible="{Binding SelectedPackage.Disclaimer, Converter={x:Static StringConverters.IsNotNullOrEmpty}}"/>
            <controls:BetterAdvancedImage Source="{Binding SelectedPackage.PreviewImageUri}"
                                          HorizontalAlignment="Left"
                                          MaxHeight="300"
                                          Margin="16, 8"/>
        </StackPanel>
        
        <TextBlock Grid.Row="2" Grid.Column="0"
                   Text="{Binding SubSubHeaderText, FallbackValue=Installing git...}"
                   TextWrapping="Wrap" TextAlignment="Center"
                   VerticalAlignment="Top" HorizontalAlignment="Center"
                   FontSize="10" Margin="8"/>

        <ProgressBar Maximum="100" 
                     Grid.Row="3" Grid.Column="0" VerticalAlignment="Center"
                     Value="{Binding OneClickInstallProgress}"
                     IsVisible="{Binding IsProgressBarVisible}"
                     IsIndeterminate="{Binding IsIndeterminate}"
                     Margin="16" >
            <ProgressBar.Transitions>
                <Transitions>
                    <DoubleTransition Property="Value" Duration="00:00:00.150">
                        <DoubleTransition.Easing>
                            <SineEaseInOut/>
                        </DoubleTransition.Easing>
                    </DoubleTransition>
                </Transitions>
            </ProgressBar.Transitions>
        </ProgressBar>
        
        <StackPanel Grid.Row="4" Grid.Column="0" Grid.ColumnSpan="2" 
                    Orientation="Vertical"
                    IsVisible="{Binding ShowInstallButton}"
                    HorizontalAlignment="Center">
            <Button 
                    Content="{x:Static lang:Resources.Action_Install}"
                    Command="{Binding InstallCommand}"
                    FontSize="32"
                    HorizontalAlignment="Center"
                    Classes="success"
                    Margin="16"
                    Padding="16, 8, 16, 8" />
            <Button Command="{Binding ToggleAdvancedModeCommand}"
                    Content="{x:Static lang:Resources.Label_SkipSetup}"
                    FontSize="16"
                    HorizontalAlignment="Center"
                    Padding="16, 8, 16, 8"/>
        </StackPanel>

        
        <ScrollViewer Grid.Column="1" Grid.Row="1"
                      MaxHeight="400"
                      VerticalScrollBarVisibility="Visible"
                      Margin="0, 16">
            <ListBox 
                Name="PackagesListBox"
                Margin="8,0"
                IsVisible="{Binding ShowInstallButton}"
                ItemsSource="{Binding AllPackages}"
                SelectedItem="{Binding SelectedPackage}">
                <ListBox.Template>
                    <ControlTemplate>
                        <ItemsPresenter/>
                    </ControlTemplate>
                </ListBox.Template>
                <ListBox.ItemTemplate>
                    <DataTemplate DataType="{x:Type packages:BasePackage}">
                        <Grid ColumnDefinitions="*,Auto">
                            <StackPanel Margin="8">
                                <TextBlock Text="{Binding DisplayName}"/>
                                <TextBlock Text="{Binding ByAuthor}"/>
                            </StackPanel>
                            <ui:InfoBadge
                                IsVisible="{Binding IsInferenceCompatible}"
                                Grid.Column="1"
                                Margin="8,0,0,0"
                                Classes="Success Dot" 
                                VerticalAlignment="Center" />
                        </Grid>
                    </DataTemplate>
                </ListBox.ItemTemplate>
            </ListBox>
        </ScrollViewer>
    </Grid>
    
</UserControl>