Ava UI: `TitleUpdateWindow` Refactor (#4276)

* Start Refactor

* Dialogue opens

* Changes

* Switch to ListBox

* Fix bugs and stuff

* Fix spacing

* Implement OpenLocation

* Change icon

* Color

* Color

* Remove background

* Make no update the same height

* Fix height and smooth scroll

* Height

* Fix update selection

* Make window smaller

* Add back remove all button

* Make selection more obvious

* Hide selection bar on SaveManager

* Fix autoscroll

* Fix no update not staying selected

* Better file opener

* Fix

* Revert that

* Update Ryujinx.Ava/UI/ViewModels/TitleUpdateViewModel.cs

Co-authored-by: Ac_K <Acoustik666@gmail.com>

* Update Ryujinx.Ava/UI/ViewModels/MainWindowViewModel.cs

Co-authored-by: Ac_K <Acoustik666@gmail.com>

* Update Ryujinx.Ava/UI/ViewModels/MainWindowViewModel.cs

Co-authored-by: Ac_K <Acoustik666@gmail.com>

* Log warning

* Update Ryujinx.Ava/UI/ViewModels/TitleUpdateViewModel.cs

Co-authored-by: Ac_K <Acoustik666@gmail.com>

Co-authored-by: Ac_K <Acoustik666@gmail.com>

1 files changed, 96 insertions, 76 deletions

diff --git a/Ryujinx.Ava/UI/Windows/TitleUpdateWindow.axaml b/Ryujinx.Ava/UI/Windows/TitleUpdateWindow.axaml
index 5a69be9b..e9858038 100644
--- a/Ryujinx.Ava/UI/Windows/TitleUpdateWindow.axaml
+++ b/Ryujinx.Ava/UI/Windows/TitleUpdateWindow.axaml
@@ -1,115 +1,135 @@
-<window:StyleableWindow
+<UserControl
     x:Class="Ryujinx.Ava.UI.Windows.TitleUpdateWindow"
     xmlns="https://github.com/avaloniaui"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
     xmlns:locale="clr-namespace:Ryujinx.Ava.Common.Locale"
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
-    xmlns:window="clr-namespace:Ryujinx.Ava.UI.Windows"
-    Width="600"
-    Height="400"
-    MinWidth="600"
-    MinHeight="400"
-    MaxWidth="600"
-    MaxHeight="400"
-    SizeToContent="Height"
-    WindowStartupLocation="CenterOwner"
+    xmlns:viewModels="clr-namespace:Ryujinx.Ava.UI.ViewModels"
+    xmlns:models="clr-namespace:Ryujinx.Ava.UI.Models"
+    xmlns:ui="clr-namespace:FluentAvalonia.UI.Controls;assembly=FluentAvalonia"
+    Width="500"
+    Height="300"
     mc:Ignorable="d"
+    x:CompileBindings="True"
+    x:DataType="viewModels:TitleUpdateViewModel"
     Focusable="True">
-    <Grid Margin="15">
+    <Grid>
         <Grid.RowDefinitions>
-            <RowDefinition Height="Auto" />
-            <RowDefinition Height="Auto" />
             <RowDefinition Height="*" />
             <RowDefinition Height="Auto" />
         </Grid.RowDefinitions>
-        <TextBlock
-            Name="Heading"
-            Grid.Row="1"
-            MaxWidth="500"
-            Margin="20,15,20,20"
-            HorizontalAlignment="Center"
-            VerticalAlignment="Center"
-            LineHeight="18"
-            TextAlignment="Center"
-            TextWrapping="Wrap" />
         <Border
-            Grid.Row="2"
-            Margin="5"
+            Grid.Row="0"
+            Margin="0 0 0 24"
             HorizontalAlignment="Stretch"
             VerticalAlignment="Stretch"
-            BorderBrush="Gray"
-            BorderThickness="1">
-            <ScrollViewer
-                VerticalAlignment="Stretch"
-                HorizontalScrollBarVisibility="Auto"
-                VerticalScrollBarVisibility="Auto">
-                <ItemsControl
-                    Margin="10"
-                    HorizontalAlignment="Stretch"
-                    VerticalAlignment="Stretch"
-                    Items="{Binding _titleUpdates}">
-                    <ItemsControl.ItemTemplate>
-                        <DataTemplate>
-                            <RadioButton
-                                Padding="8,0"
-                                VerticalContentAlignment="Center"
-                                GroupName="Update"
-                                IsChecked="{Binding IsEnabled, Mode=TwoWay}">
-                                <Label
-                                    Margin="0"
+            BorderBrush="{DynamicResource AppListHoverBackgroundColor}"
+            BorderThickness="1"
+            CornerRadius="5"
+            Padding="2.5">
+            <ListBox
+                VirtualizationMode="None"
+                Background="Transparent"
+                SelectedItem="{Binding SelectedUpdate, Mode=TwoWay}"
+                Items="{Binding Views}">
+                <ListBox.DataTemplates>
+                    <DataTemplate
+                        DataType="models:TitleUpdateModel">
+                        <Panel Margin="10">
+                            <TextBlock
+                                HorizontalAlignment="Left"
+                                VerticalAlignment="Center"
+                                TextWrapping="Wrap"
+                                Text="{Binding Label}" />
+                            <StackPanel
+                                Spacing="10"
+                                Orientation="Horizontal"
+                                HorizontalAlignment="Right">
+                                <Button
+                                    VerticalAlignment="Center"
+                                    HorizontalAlignment="Right"
+                                    Padding="10"
+                                    MinWidth="0"
+                                    MinHeight="0"
+                                    Click="OpenLocation">
+                                    <ui:SymbolIcon
+                                        Symbol="OpenFolder"
+                                        HorizontalAlignment="Center"
+                                        VerticalAlignment="Center" />
+                                </Button>
+                                <Button
                                     VerticalAlignment="Center"
-                                    Content="{Binding Label}"
-                                    FontSize="12" />
-                            </RadioButton>
-                        </DataTemplate>
-                    </ItemsControl.ItemTemplate>
-                </ItemsControl>
-            </ScrollViewer>
+                                    HorizontalAlignment="Right"
+                                    Padding="10"
+                                    MinWidth="0"
+                                    MinHeight="0"
+                                    Click="RemoveUpdate">
+                                    <ui:SymbolIcon
+                                        Symbol="Cancel"
+                                        HorizontalAlignment="Center"
+                                        VerticalAlignment="Center" />
+                                </Button>
+                            </StackPanel>
+                        </Panel>
+                    </DataTemplate>
+                    <DataTemplate
+                        DataType="viewModels:BaseModel">
+                        <Panel
+                            Height="33"
+                            Margin="10">
+                            <TextBlock
+                                HorizontalAlignment="Left"
+                                VerticalAlignment="Center"
+                                TextWrapping="Wrap"
+                                Text="{locale:Locale NoUpdate}" />
+                        </Panel>
+                    </DataTemplate>
+                </ListBox.DataTemplates>
+                <ListBox.Styles>
+                    <Style Selector="ListBoxItem">
+                        <Setter Property="Background" Value="Transparent" />
+                    </Style>
+                </ListBox.Styles>
+            </ListBox>
         </Border>
-        <DockPanel
-            Grid.Row="3"
-            Margin="0"
+        <Panel
+            Grid.Row="1"
             HorizontalAlignment="Stretch">
-            <DockPanel Margin="0" HorizontalAlignment="Left">
+            <StackPanel
+                Orientation="Horizontal"
+                Spacing="10"
+                HorizontalAlignment="Left">
                 <Button
                     Name="AddButton"
                     MinWidth="90"
-                    Margin="5"
-                    Command="{Binding Add}">
+                    Command="{ReflectionBinding Add}">
                     <TextBlock Text="{locale:Locale SettingsTabGeneralAdd}" />
                 </Button>
                 <Button
-                    Name="RemoveButton"
-                    MinWidth="90"
-                    Margin="5"
-                    Command="{Binding RemoveSelected}">
-                    <TextBlock Text="{locale:Locale SettingsTabGeneralRemove}" />
-                </Button>
-                <Button
                     Name="RemoveAllButton"
                     MinWidth="90"
-                    Margin="5"
-                    Command="{Binding RemoveAll}">
+                    Click="RemoveAll">
                     <TextBlock Text="{locale:Locale DlcManagerRemoveAllButton}" />
                 </Button>
-            </DockPanel>
-            <DockPanel Margin="0" HorizontalAlignment="Right">
+            </StackPanel>
+            <StackPanel
+                Orientation="Horizontal"
+                Spacing="10"
+                HorizontalAlignment="Right">
                 <Button
                     Name="SaveButton"
                     MinWidth="90"
-                    Margin="5"
-                    Command="{Binding Save}">
+                    Click="Save">
                     <TextBlock Text="{locale:Locale SettingsButtonSave}" />
                 </Button>
                 <Button
                     Name="CancelButton"
                     MinWidth="90"
-                    Margin="5"
-                    Command="{Binding Close}">
+                    Click="Close">
                     <TextBlock Text="{locale:Locale InputDialogCancel}" />
                 </Button>
-            </DockPanel>
-        </DockPanel>
+            </StackPanel>
+        </Panel>
     </Grid>
-</window:StyleableWindow>
\ No newline at end of file
+</UserControl>
\ No newline at end of file