[Deps]Upgrading to CommunityToolkit.WinUI v8.0 (#28205)

* Adding new package references * Updating namespaces and controls * Fixing GridSplitter * Bump up version numbers * Fix namespaces for Settings * Fixing FontIcon extensions * Use Toolkit converters * Update notice * Remove unused reference * Namespace fixes * Update MainPage.xaml * Upgrading packages to latest * Resolve CI issues * Fix Hosts merge
2026-04-03 17:56:44 +02:00 · 2023-09-14 18:41:31 +02:00
parent 43549eba77
commit 6af6f4f43f
72 changed files with 1767 additions and 2492 deletions
--- a/src/modules/FileLocksmith/FileLocksmithUI/Converters/PidToIconConverter.cs
+++ b/src/modules/FileLocksmith/FileLocksmithUI/Converters/PidToIconConverter.cs
@@ -5,7 +5,6 @@
 using System;
 using System.Drawing;
 using System.IO;
-using CommunityToolkit.WinUI.UI;
 using Microsoft.UI.Xaml.Data;
 using Microsoft.UI.Xaml.Media.Imaging;
 using Windows.Storage;
--- a/src/modules/FileLocksmith/FileLocksmithUI/FileLocksmithUI.csproj
+++ b/src/modules/FileLocksmith/FileLocksmithUI/FileLocksmithUI.csproj
@@ -71,9 +71,10 @@

  <ItemGroup>
    <PackageReference Include="Microsoft.Windows.CsWinRT" />
-    <PackageReference Include="CommunityToolkit.Labs.WinUI.SettingsControls" />
+    <PackageReference Include="CommunityToolkit.WinUI.Controls.SettingsControls" />
+    <PackageReference Include="CommunityToolkit.WinUI.Converters" />
+    <PackageReference Include="CommunityToolkit.WinUI.Extensions" />
    <PackageReference Include="CommunityToolkit.Mvvm" />
-    <PackageReference Include="CommunityToolkit.WinUI.UI" />
    <PackageReference Include="Microsoft.WindowsAppSDK" />
    <PackageReference Include="Microsoft.Xaml.Behaviors.WinUI.Managed" />
    <PackageReference Include="Microsoft.Windows.SDK.BuildTools" />
--- a/src/modules/FileLocksmith/FileLocksmithUI/FileLocksmithXAML/Views/MainPage.xaml
+++ b/src/modules/FileLocksmith/FileLocksmithUI/FileLocksmithXAML/Views/MainPage.xaml
@@ -7,17 +7,18 @@
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:interactivity="using:Microsoft.Xaml.Interactivity"
    xmlns:interop="using:FileLocksmith.Interop"
-    xmlns:labs="using:CommunityToolkit.Labs.WinUI"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
-    xmlns:toolkitConverters="using:CommunityToolkit.WinUI.UI.Converters"
+    xmlns:tkControls="using:CommunityToolkit.WinUI.Controls"
+    xmlns:tkConverters="using:CommunityToolkit.WinUI.Converters"
+    xmlns:ui="using:CommunityToolkit.WinUI"
    mc:Ignorable="d">
    <Page.Resources>
-        <toolkitConverters:BoolToVisibilityConverter
+        <tkConverters:BoolToVisibilityConverter
            x:Key="boolToVisibilityConverter"
            FalseValue="Visible"
            TrueValue="Collapsed" />

-        <toolkitConverters:DoubleToVisibilityConverter
+        <tkConverters:DoubleToVisibilityConverter
            x:Key="doubleToVisibilityConverter"
            FalseValue="Visible"
            GreaterThan="0"
@@ -36,14 +37,12 @@

    <Grid RowSpacing="8">
        <Grid.RowDefinitions>
-            <RowDefinition Height="Auto" x:Name="ButtonsRow" />
+            <RowDefinition x:Name="ButtonsRow" Height="Auto" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>

        <Grid Margin="16,0">
-            <Button
-                Click="ShowSelectedPathsButton_Click"
-                Content="{x:Bind ViewModel.Paths, Converter={StaticResource fileListToDescriptionConverter}}">
+            <Button Click="ShowSelectedPathsButton_Click" Content="{x:Bind ViewModel.Paths, Converter={StaticResource fileListToDescriptionConverter}}">
                <Button.Template>
                    <ControlTemplate TargetType="Button">
                        <TextBlock
@@ -53,9 +52,7 @@
                    </ControlTemplate>
                </Button.Template>
                <ToolTipService.ToolTip>
-                    <TextBlock
-                    x:Uid="PathsTooltipDescription"
-                    TextWrapping="WrapWholeWords" />
+                    <TextBlock x:Uid="PathsTooltipDescription" TextWrapping="WrapWholeWords" />
                </ToolTipService.ToolTip>
            </Button>

@@ -65,10 +62,9 @@
                Spacing="8">
                <Button
                    Command="{Binding LoadProcessesCommand}"
+                    Content="{ui:FontIcon Glyph=&#xe72c;,
+                                          FontSize=16}"
                    Style="{StaticResource SubtleButtonStyle}">
-                    <FontIcon
-                        FontSize="16"
-                        Glyph="&#xe72c;" />
                    <ToolTipService.ToolTip>
                        <TextBlock x:Uid="Reload" />
                    </ToolTipService.ToolTip>
@@ -76,11 +72,10 @@
                <Button
                    x:Name="RestartAsAdminBtn"
                    Command="{Binding RestartElevatedCommand}"
+                    Content="{ui:FontIcon Glyph=&#xe7ef;,
+                                          FontSize=16}"
                    Style="{StaticResource SubtleButtonStyle}"
                    Visibility="{x:Bind ViewModel.IsElevated, Converter={StaticResource boolToVisibilityConverter}}">
-                    <FontIcon
-                        FontSize="16"
-                        Glyph="&#xe7ef;" />
                    <ToolTipService.ToolTip>
                        <TextBlock x:Uid="RestartAsAdmin" />
                    </ToolTipService.ToolTip>
@@ -92,80 +87,68 @@
            <Grid Visibility="{x:Bind ViewModel.IsLoading, Converter={StaticResource boolToVisibilityConverter}, Mode=OneWay}">
                <ListView
                    x:Name="ProcessesListView"
+                    Padding="0,0,0,12"
                    IncrementalLoadingThreshold="10"
                    ItemsSource="{x:Bind ViewModel.Processes}"
-                    SelectionMode="None"
-                    Padding="0,0,0,12">
+                    SelectionMode="None">
                    <ListView.ItemTemplate>
                        <DataTemplate x:DataType="interop:ProcessResult">
-                            <labs:SettingsExpander Margin="0,0,0,4">
-                                <labs:SettingsExpander.Resources>
+                            <tkControls:SettingsExpander Margin="0,0,0,4">
+                                <tkControls:SettingsExpander.Resources>
                                    <x:Double x:Key="SettingsCardWrapThreshold">0</x:Double>
-                                </labs:SettingsExpander.Resources>
-                                <labs:SettingsExpander.Header>
+                                </tkControls:SettingsExpander.Resources>
+                                <tkControls:SettingsExpander.Header>
                                    <!--  We can't use the HeaderIcon because it only support a BitmapIcon, which only supports UriSource - not a direct BitmapImage  -->
                                    <StackPanel Orientation="Horizontal" Spacing="8">
                                        <Image
                                            Width="16"
                                            Height="16"
                                            Source="{x:Bind pid, Converter={StaticResource pidToIconConverter}}" />
-                                        <TextBlock
-                                            IsTextSelectionEnabled="True"
-                                            Text="{x:Bind name}" />
+                                        <TextBlock IsTextSelectionEnabled="True" Text="{x:Bind name}" />
                                    </StackPanel>
-                                </labs:SettingsExpander.Header>
-                                <labs:SettingsExpander.Content>
-                                    <StackPanel
-                                        Orientation="Horizontal"
-                                        Spacing="8">
+                                </tkControls:SettingsExpander.Header>
+                                <tkControls:SettingsExpander.Content>
+                                    <StackPanel Orientation="Horizontal" Spacing="8">
                                        <FontIcon
                                            Foreground="{ThemeResource InfoBarWarningSeverityIconBackground}"
                                            Glyph="&#xE7BA;"
                                            Visibility="{x:Bind user, Mode=OneTime, Converter={StaticResource userToSystemWarningVisibilityConverter}}">
                                            <ToolTipService.ToolTip>
-                                                <TextBlock
-                                                    x:Uid="ProcessIsSystemUserWarning"
-                                                    TextWrapping="Wrap" />
+                                                <TextBlock x:Uid="ProcessIsSystemUserWarning" TextWrapping="Wrap" />
                                            </ToolTipService.ToolTip>
                                        </FontIcon>
                                        <Button
                                            MinWidth="128"
                                            Command="{Binding Path=DataContext.EndTaskCommand, ElementName=ProcessesListView}"
                                            CommandParameter="{Binding}">
-                                            <StackPanel
-                                                Orientation="Horizontal"
-                                                Spacing="8">
-                                                <FontIcon
-                                                    FontSize="16"
-                                                    Glyph="&#xf140;" />
-                                                <TextBlock
-                                                    x:Uid="EndTask"/>
+                                            <StackPanel Orientation="Horizontal" Spacing="8">
+                                                <FontIcon FontSize="16" Glyph="&#xf140;" />
+                                                <TextBlock x:Uid="EndTask" />
                                            </StackPanel>
                                        </Button>
                                    </StackPanel>
-                                </labs:SettingsExpander.Content>
-                                <labs:SettingsExpander.Items>
-                                    <labs:SettingsCard x:Uid="ProcessID">
+                                </tkControls:SettingsExpander.Content>
+                                <tkControls:SettingsExpander.Items>
+                                    <tkControls:SettingsCard x:Uid="ProcessID">
                                        <TextBlock
                                            Foreground="{ThemeResource TextFillColorSecondaryBrush}"
                                            IsTextSelectionEnabled="True"
                                            Text="{x:Bind pid}" />
-                                    </labs:SettingsCard>
-                                    <labs:SettingsCard x:Uid="User">
+                                    </tkControls:SettingsCard>
+                                    <tkControls:SettingsCard x:Uid="User">
                                        <TextBlock
                                            Foreground="{ThemeResource TextFillColorSecondaryBrush}"
                                            IsTextSelectionEnabled="True"
                                            Text="{x:Bind user}" />
-                                    </labs:SettingsCard>
-                                    <labs:SettingsCard ContentAlignment="Vertical">
-                                        <labs:SettingsCard.Header>
+                                    </tkControls:SettingsCard>
+                                    <tkControls:SettingsCard ContentAlignment="Vertical">
+                                        <tkControls:SettingsCard.Header>
                                            <TextBlock>
                                                <Run x:Uid="Files" />
                                                <Run Text="(" /><Run Text="{x:Bind files, Converter={StaticResource fileCountConverter}}" /><Run Text=")" />
                                            </TextBlock>
-                                        </labs:SettingsCard.Header>
-                                        <ItemsRepeater
-                                            ItemsSource="{x:Bind files}">
+                                        </tkControls:SettingsCard.Header>
+                                        <ItemsRepeater ItemsSource="{x:Bind files}">
                                            <ItemsRepeater.ItemTemplate>
                                                <DataTemplate x:DataType="x:String">
                                                    <TextBlock
@@ -179,36 +162,30 @@
                                                </DataTemplate>
                                            </ItemsRepeater.ItemTemplate>
                                        </ItemsRepeater>
-                                    </labs:SettingsCard>
-                                </labs:SettingsExpander.Items>
-                            </labs:SettingsExpander>
+                                    </tkControls:SettingsCard>
+                                </tkControls:SettingsExpander.Items>
+                            </tkControls:SettingsExpander>
                        </DataTemplate>
                    </ListView.ItemTemplate>
                </ListView>
-                
+
                <StackPanel
                    HorizontalAlignment="Center"
                    VerticalAlignment="Center"
                    Orientation="Vertical"
                    Spacing="8"
                    Visibility="{x:Bind ViewModel.Processes.Count, Mode=OneWay, Converter={StaticResource doubleToVisibilityConverter}}">
-                    <Button
-                        HorizontalAlignment="Center"
-                        Command="{Binding LoadProcessesCommand}">
+                    <Button HorizontalAlignment="Center" Command="{Binding LoadProcessesCommand}">
                        <Button.Template>
                            <ControlTemplate TargetType="Button">
-                                <FontIcon
-                                    FontSize="32"
-                                    Glyph="&#xE9F3;" />
+                                <FontIcon FontSize="32" Glyph="&#xE9F3;" />
                            </ControlTemplate>
                        </Button.Template>
                        <ToolTipService.ToolTip>
                            <TextBlock x:Uid="Reload" />
                        </ToolTipService.ToolTip>
                    </Button>
-                    <TextBlock
-                        x:Uid="EmptyListDescription"
-                        Foreground="{ThemeResource TextFillColorSecondaryBrush}" />
+                    <TextBlock x:Uid="EmptyListDescription" Foreground="{ThemeResource TextFillColorSecondaryBrush}" />
                </StackPanel>
            </Grid>
            <ProgressRing
@@ -217,14 +194,9 @@
                IsActive="{x:Bind ViewModel.IsLoading, Mode=OneWay}" />
        </Grid>

-        <ContentDialog
-            x:Name="SelectedFilesListDialog"
-            x:Uid="SelectedFilesListDialog">
-            <ScrollViewer
-                Padding="0,0,16,0">
-                <TextBlock
-                    IsTextSelectionEnabled="True"
-                    Text="{x:Bind ViewModel.PathsToString, Mode=OneWay}" />
+        <ContentDialog x:Name="SelectedFilesListDialog" x:Uid="SelectedFilesListDialog">
+            <ScrollViewer Padding="0,0,16,0">
+                <TextBlock IsTextSelectionEnabled="True" Text="{x:Bind ViewModel.PathsToString, Mode=OneWay}" />
            </ScrollViewer>
        </ContentDialog>
    </Grid>
--- a/src/modules/Hosts/Hosts/Hosts.csproj
+++ b/src/modules/Hosts/Hosts/Hosts.csproj
@@ -57,7 +57,9 @@
  <ItemGroup>
    <PackageReference Include="Microsoft.Windows.CsWinRT" />
    <PackageReference Include="CommunityToolkit.Mvvm" />
-    <PackageReference Include="CommunityToolkit.WinUI.UI.Controls" />
+    <PackageReference Include="CommunityToolkit.WinUI.Converters" />
+    <PackageReference Include="CommunityToolkit.WinUI.Extensions" />
+    <PackageReference Include="CommunityToolkit.WinUI.Collections" />
    <PackageReference Include="Microsoft.Extensions.Hosting" />
    <PackageReference Include="Microsoft.WindowsAppSDK" />
    <PackageReference Include="Microsoft.Windows.SDK.BuildTools" />
--- a/src/modules/Hosts/Hosts/HostsXAML/Views/MainPage.xaml
+++ b/src/modules/Hosts/Hosts/HostsXAML/Views/MainPage.xaml
@@ -2,7 +2,7 @@
    x:Class="Hosts.Views.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-    xmlns:converters="using:CommunityToolkit.WinUI.UI.Converters"
+    xmlns:converters="using:CommunityToolkit.WinUI.Converters"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:helpers="using:Hosts.Helpers"
    xmlns:i="using:Microsoft.Xaml.Interactivity"
@@ -10,6 +10,7 @@
    xmlns:local="using:Hosts.Views"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:models="using:Hosts.Models"
+    xmlns:ui="using:CommunityToolkit.WinUI"
    x:Name="Page"
    Loaded="Page_Loaded"
    mc:Ignorable="d">
@@ -28,8 +29,8 @@
        <converters:BoolToVisibilityConverter x:Key="BoolToVisibilityConverter" />
        <converters:BoolToVisibilityConverter
            x:Key="BoolToInvertedVisibilityConverter"
-            TrueValue="Collapsed"
-            FalseValue="Visible" />
+            FalseValue="Visible"
+            TrueValue="Collapsed" />
        <converters:DoubleToVisibilityConverter
            x:Key="DoubleToVisibilityConverter"
            FalseValue="Visible"
@@ -37,21 +38,17 @@
            TrueValue="Collapsed" />
    </Page.Resources>

-    <Grid
-        Margin="16"
-        RowSpacing="8">
+    <Grid Margin="16" RowSpacing="8">
        <Grid.RowDefinitions>
-            <RowDefinition Height="Auto" /> <!-- Buttons -->
-            <RowDefinition Height="*" /> <!-- Content -->
+            <RowDefinition Height="Auto" />
+            <!--  Buttons  -->
+            <RowDefinition Height="*" />
+            <!--  Content  -->
        </Grid.RowDefinitions>
-
-        <Grid> <!-- Buttons -->
-            <Button
-                x:Uid="AddEntryBtn"
-                Command="{x:Bind NewDialogCommand}">
-                <StackPanel
-                    Orientation="Horizontal"
-                    Spacing="8">
+        <Grid>
+            <!--  Buttons  -->
+            <Button x:Uid="AddEntryBtn" Command="{x:Bind NewDialogCommand}">
+                <StackPanel Orientation="Horizontal" Spacing="8">
                    <FontIcon
                        x:Name="Icon"
                        FontSize="16"
@@ -60,9 +57,7 @@
                    <TextBlock x:Uid="AddEntry" />
                </StackPanel>
                <Button.KeyboardAccelerators>
-                    <KeyboardAccelerator
-                        Modifiers="Control"
-                        Key="N" />
+                    <KeyboardAccelerator Key="N" Modifiers="Control" />
                </Button.KeyboardAccelerators>
            </Button>

@@ -74,19 +69,16 @@
                    x:Uid="AdditionalLinesBtn"
                    Height="32"
                    Command="{x:Bind AdditionalLinesDialogCommand}"
-                    Style="{StaticResource SubtleButtonStyle}">
-                    <FontIcon
-                        FontSize="16"
-                        Glyph="&#xe8a5;" />
-                </Button>
+                    Content="{ui:FontIcon Glyph=&#xe8a5;,
+                                          FontSize=16}"
+                    Style="{StaticResource SubtleButtonStyle}" />

                <Button
                    x:Uid="FilterBtn"
                    Height="32"
+                    Content="{ui:FontIcon Glyph=&#xe71c;,
+                                          FontSize=16}"
                    Style="{StaticResource SubtleButtonStyle}">
-                    <FontIcon
-                        FontSize="16"
-                        Glyph="&#xe71c;" />
                    <Button.Flyout>
                        <Flyout>
                            <StackPanel
@@ -124,15 +116,13 @@
                                        </ic:EventTriggerBehavior>
                                    </i:Interaction.Behaviors>
                                </AutoSuggestBox>
-                                <ToggleSwitch
-                                    x:Uid="ShowOnlyDuplicates"
-                                    IsOn="{x:Bind ViewModel.ShowOnlyDuplicates, Mode=TwoWay}" />
+                                <ToggleSwitch x:Uid="ShowOnlyDuplicates" IsOn="{x:Bind ViewModel.ShowOnlyDuplicates, Mode=TwoWay}" />
                                <Button
                                    x:Uid="ClearFiltersBtn"
                                    HorizontalAlignment="Right"
                                    Command="{x:Bind ViewModel.ClearFiltersCommand}"
-                                    Style="{StaticResource AccentButtonStyle}"
-                                    IsEnabled="{x:Bind ViewModel.Filtered, Mode=OneWay}"/>
+                                    IsEnabled="{x:Bind ViewModel.Filtered, Mode=OneWay}"
+                                    Style="{StaticResource AccentButtonStyle}" />
                            </StackPanel>
                        </Flyout>
                    </Button.Flyout>
@@ -142,21 +132,18 @@
                    x:Uid="OpenHostsFileBtn"
                    Height="32"
                    Command="{x:Bind ViewModel.OpenHostsFileCommand}"
-                    Style="{StaticResource SubtleButtonStyle}">
-                    <FontIcon
-                        FontSize="16"
-                        Glyph="&#xe8a7;" />
-                </Button>
+                    Content="{ui:FontIcon Glyph=&#xe8a7;,
+                                          FontSize=16}"
+                    Style="{StaticResource SubtleButtonStyle}" />
+

                <Button
                    x:Uid="SettingsBtn"
                    Height="32"
                    Command="{x:Bind ViewModel.OpenSettingsCommand}"
-                    Style="{StaticResource SubtleButtonStyle}">
-                    <FontIcon
-                        FontSize="16"
-                        Glyph="&#xe713;" />
-                </Button>
+                    Content="{ui:FontIcon Glyph=&#xe713;,
+                                          FontSize=16}"
+                    Style="{StaticResource SubtleButtonStyle}" />
            </StackPanel>
        </Grid>

@@ -166,9 +153,7 @@
            CanDragItems="{x:Bind ViewModel.Filtered, Mode=OneWay, Converter={StaticResource BoolNegationConverter}}"
            CanReorderItems="{x:Bind ViewModel.Filtered, Mode=OneWay, Converter={StaticResource BoolNegationConverter}}"
        -->
-        <Grid
-            Grid.Row="1"
-            Visibility="{x:Bind ViewModel.IsLoading, Converter={StaticResource BoolToInvertedVisibilityConverter}, Mode=OneWay}">
+        <Grid Grid.Row="1" Visibility="{x:Bind ViewModel.IsLoading, Converter={StaticResource BoolToInvertedVisibilityConverter}, Mode=OneWay}">
            <Grid.RowDefinitions>
                <RowDefinition Height="*" />
                <RowDefinition Height="Auto" />
@@ -181,9 +166,9 @@
                BorderBrush="{ThemeResource CardStrokeColorDefaultBrush}"
                BorderThickness="1"
                CornerRadius="{StaticResource OverlayCornerRadius}"
+                GotFocus="Entries_GotFocus"
                IsItemClickEnabled="True"
                ItemClick="Entries_ItemClick"
-                GotFocus="Entries_GotFocus"
                RightTapped="Entries_RightTapped"
                ItemsSource="{x:Bind ViewModel.Entries, Mode=TwoWay}"
                SelectedItem="{x:Bind ViewModel.Selected, Mode=TwoWay}">
@@ -271,8 +256,8 @@
                                Height="20"
                                IsActive="{x:Bind Pinging, Mode=OneWay}" />
                            <FontIcon
-                                x:Uid="PingIcon"
                                x:Name="PingIcon"
+                                x:Uid="PingIcon"
                                Grid.Column="2"
                                FontSize="16"
                                Visibility="Collapsed">
@@ -325,8 +310,8 @@
                            <FontIcon
                                x:Uid="DuplicateEntryIcon"
                                Grid.Column="3"
-                                Foreground="{StaticResource SystemControlErrorTextForegroundBrush}"
                                FontSize="16"
+                                Foreground="{StaticResource SystemControlErrorTextForegroundBrush}"
                                Glyph="&#xe7BA;"
                                Visibility="{x:Bind Duplicate, Mode=OneWay, Converter={StaticResource BoolToVisibilityConverter}}" />
                            <ToggleSwitch
@@ -352,14 +337,12 @@
                    VerticalAlignment="Center"
                    Spacing="8"
                    Visibility="{x:Bind ViewModel.Filtered, Mode=OneWay, Converter={StaticResource BoolToInvertedVisibilityConverter}}">
-                    <FontIcon
-                        FontSize="32"
-                        Glyph="&#xe774;" />
+                    <FontIcon FontSize="32" Glyph="&#xe774;" />
                    <TextBlock
                        x:Uid="EmptyHosts"
                        HorizontalAlignment="Center"
-                        TextWrapping="Wrap"
-                        Foreground="{ThemeResource TextFillColorSecondaryBrush}" />
+                        Foreground="{ThemeResource TextFillColorSecondaryBrush}"
+                        TextWrapping="Wrap" />
                    <HyperlinkButton
                        x:Uid="AddEntryLink"
                        HorizontalAlignment="Center"
@@ -371,14 +354,12 @@
                    VerticalAlignment="Center"
                    Spacing="8"
                    Visibility="{x:Bind ViewModel.Filtered, Mode=OneWay, Converter={StaticResource BoolToVisibilityConverter}}">
-                    <FontIcon
-                        FontSize="32"
-                        Glyph="&#xf78b;" />
+                    <FontIcon FontSize="32" Glyph="&#xf78b;" />
                    <TextBlock
                        x:Uid="EmptyFilterResults"
                        HorizontalAlignment="Center"
-                        TextWrapping="Wrap"
-                        Foreground="{ThemeResource TextFillColorSecondaryBrush}" />
+                        Foreground="{ThemeResource TextFillColorSecondaryBrush}"
+                        TextWrapping="Wrap" />
                    <HyperlinkButton
                        x:Uid="ClearFiltersLink"
                        HorizontalAlignment="Center"
@@ -386,8 +367,7 @@
                </StackPanel>
            </StackPanel>

-            <StackPanel
-                Grid.Row="1">
+            <StackPanel Grid.Row="1">
                <InfoBar
                    x:Uid="FileSaveError"
                    Margin="0,8,0,0"
@@ -395,26 +375,23 @@
                    Message="{x:Bind ViewModel.ErrorMessage, Mode=TwoWay}"
                    IsOpen="{x:Bind ViewModel.Error, Mode=TwoWay}"
                    Visibility="{x:Bind ViewModel.Error, Mode=TwoWay, Converter={StaticResource BoolToVisibilityConverter}}" />
-
                <InfoBar
                    x:Uid="FileChanged"
                    Margin="0,8,0,0"
-                    Severity="Informational"
                    IsOpen="{x:Bind ViewModel.FileChanged, Mode=TwoWay}"
+                    Severity="Informational"
                    Visibility="{x:Bind ViewModel.FileChanged, Mode=TwoWay, Converter={StaticResource BoolToVisibilityConverter}}">
                    <InfoBar.ActionButton>
-                        <Button
-                            x:Uid="Reload"
-                            Command="{x:Bind ViewModel.ReadHostsCommand}" />
+                        <Button x:Uid="Reload" Command="{x:Bind ViewModel.ReadHostsCommand}" />
                    </InfoBar.ActionButton>
                </InfoBar>
            </StackPanel>
        </Grid>

        <ProgressRing
+            Grid.Row="1"
            Width="48"
            Height="48"
-            Grid.Row="1"
            IsActive="{x:Bind ViewModel.IsLoading, Mode=OneWay}" />

        <ContentDialog
@@ -436,22 +413,22 @@
                        Text="{Binding Address, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" />
                    <TextBox
                        x:Uid="Hosts"
-                        IsSpellCheckEnabled="False"
                        AcceptsReturn="False"
-                        TextWrapping="Wrap"
+                        IsSpellCheckEnabled="False"
                        ScrollViewer.IsVerticalRailEnabled="True"
                        ScrollViewer.VerticalScrollBarVisibility="Visible"
                        ScrollViewer.VerticalScrollMode="Enabled"
-                        Text="{Binding Hosts, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" />
+                        Text="{Binding Hosts, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
+                        TextWrapping="Wrap" />
                    <TextBox
                        x:Uid="Comment"
-                        IsSpellCheckEnabled="False" 
                        AcceptsReturn="False"
-                        TextWrapping="Wrap"
+                        IsSpellCheckEnabled="False"
                        ScrollViewer.IsVerticalRailEnabled="True"
                        ScrollViewer.VerticalScrollBarVisibility="Visible"
                        ScrollViewer.VerticalScrollMode="Enabled"
-                        Text="{Binding Comment, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" />
+                        Text="{Binding Comment, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
+                        TextWrapping="Wrap" />
                    <ToggleSwitch
                        x:Uid="Active"
                        IsOn="{Binding Active, Mode=TwoWay}"
@@ -477,9 +454,9 @@

            <TextBox
                x:Name="AdditionalLines"
-                HorizontalAlignment="Stretch"
                MinHeight="40"
                Padding="16,0"
+                HorizontalAlignment="Stretch"
                AcceptsReturn="True"
                ScrollViewer.IsVerticalRailEnabled="True"
                ScrollViewer.VerticalScrollBarVisibility="Visible"
@@ -489,15 +466,12 @@

        <TeachingTip
            x:Uid="TooManyHostsTeachingTip"
+            IconSource="{ui:FontIconSource Glyph=&#xe946;}"
            IsOpen="{x:Bind ViewModel.ShowSplittedEntriesTooltip, Mode=OneWay}"
-	        PreferredPlacement="Top"
-	        PlacementMargin="20">
-            <TeachingTip.IconSource>
-                <FontIconSource Glyph="&#xe946;" />
-            </TeachingTip.IconSource>
+            PlacementMargin="20"
+            PreferredPlacement="Top">
            <TeachingTip.Content>
-                <TextBlock x:Uid="TooManyHostsTeachingTipContent"
-                           TextWrapping="Wrap"/>
+                <TextBlock x:Uid="TooManyHostsTeachingTipContent" TextWrapping="Wrap" />
            </TeachingTip.Content>
        </TeachingTip>
    </Grid>
--- a/src/modules/Hosts/Hosts/ViewModels/MainViewModel.cs
+++ b/src/modules/Hosts/Hosts/ViewModels/MainViewModel.cs
@@ -14,7 +14,7 @@ using Common.UI;
 using CommunityToolkit.Mvvm.ComponentModel;
 using CommunityToolkit.Mvvm.Input;
 using CommunityToolkit.WinUI;
-using CommunityToolkit.WinUI.UI;
+using CommunityToolkit.WinUI.Collections;
 using Hosts.Helpers;
 using Hosts.Models;
 using Hosts.Settings;
--- a/src/modules/registrypreview/RegistryPreviewUI/RegistryPreviewUI.csproj
+++ b/src/modules/registrypreview/RegistryPreviewUI/RegistryPreviewUI.csproj
@@ -62,7 +62,9 @@
 	
 	<ItemGroup>
 		<PackageReference Include="Microsoft.Windows.CsWinRT" />
-		<PackageReference Include="CommunityToolkit.WinUI.UI.Controls" />
+		<PackageReference Include="CommunityToolkit.WinUI.UI.Controls.DataGrid" />
+		<PackageReference Include="CommunityToolkit.WinUI.Controls.Sizers" />
+		<PackageReference Include="CommunityToolkit.WinUI.Extensions" />
 		<PackageReference Include="Microsoft.Windows.SDK.BuildTools" />
 		<PackageReference Include="Microsoft.WindowsAppSDK" />
 		<PackageReference Include="WinUIEx" />
--- a/src/modules/registrypreview/RegistryPreviewUI/RegistryPreviewXAML/MainWindow.xaml
+++ b/src/modules/registrypreview/RegistryPreviewUI/RegistryPreviewXAML/MainWindow.xaml
@@ -5,10 +5,12 @@
    xmlns:controls="using:CommunityToolkit.WinUI.UI.Controls"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+    xmlns:sizers="using:CommunityToolkit.WinUI.Controls"
+    xmlns:ui="using:CommunityToolkit.WinUI"
    xmlns:winuiex="using:WinUIEx"
-    Closed="Window_Closed"
    MinWidth="480"
    MinHeight="320"
+    Closed="Window_Closed"
    mc:Ignorable="d">
    <Window.SystemBackdrop>
        <MicaBackdrop />
@@ -19,25 +21,25 @@
            <RowDefinition Height="Auto" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>
-        <Grid 
+        <Grid
            x:Name="titleBar"
            Grid.Row="0"
            Height="32"
-            ColumnSpacing="16"
            Margin="16,0"
+            ColumnSpacing="16"
            IsHitTestVisible="True">
            <Grid.ColumnDefinitions>
                <!--<ColumnDefinition x:Name="LeftPaddingColumn" Width="0"/>-->
-                <ColumnDefinition x:Name="IconColumn" Width="Auto"/>
-                <ColumnDefinition x:Name="TitleColumn" Width="Auto"/>
+                <ColumnDefinition x:Name="IconColumn" Width="Auto" />
+                <ColumnDefinition x:Name="TitleColumn" Width="Auto" />
                <!--<ColumnDefinition x:Name="RightPaddingColumn" Width="0"/>-->
            </Grid.ColumnDefinitions>
            <Image
-                Source="../Assets/RegistryPreview/app.ico"
                Grid.Column="0"
-                VerticalAlignment="Center"
                Width="16"
-                Height="16"/>
+                Height="16"
+                VerticalAlignment="Center"
+                Source="../Assets/RegistryPreview/app.ico" />
            <TextBlock
                x:Name="titleBarText"
                Grid.Column="1"
@@ -51,17 +53,17 @@
            Grid.Row="1"
            Width="Auto"
            Height="Auto"
+            Margin="12"
            x:FieldModifier="public"
            Loaded="GridPreview_Loaded"
-            TabFocusNavigation="Cycle"
-            Margin="12">
+            TabFocusNavigation="Cycle">
            <Grid.Resources>
                <Style x:Key="GridCardStyle" TargetType="Border">
                    <Style.Setters>
                        <Setter Property="Background" Value="{ThemeResource CardBackgroundFillColorDefaultBrush}" />
                        <Setter Property="BorderThickness" Value="1" />
                        <Setter Property="BorderBrush" Value="{ThemeResource CardStrokeColorDefaultBrush}" />
-                        <Setter Property="CornerRadius" Value="{StaticResource OverlayCornerRadius}"/>
+                        <Setter Property="CornerRadius" Value="{StaticResource OverlayCornerRadius}" />
                    </Style.Setters>
                </Style>
            </Grid.Resources>
@@ -79,11 +81,12 @@
                <RowDefinition Height="*" />
            </Grid.RowDefinitions>

-            <Border Style="{StaticResource GridCardStyle}"
+            <Border
                Grid.Row="0"
                Grid.Column="0"
                Grid.ColumnSpan="3"
-                Margin="0,0,0,12">
+                Margin="0,0,0,12"
+                Style="{StaticResource GridCardStyle}">

                <CommandBar
                    Name="commandBar"
@@ -91,60 +94,50 @@
                    DefaultLabelPosition="Right">

                    <AppBarButton
-                    x:Name="openButton"
-                    x:Uid="OpenButton"
-                    Click="OpenButton_Click">
-                        <AppBarButton.Icon>
-                            <FontIcon FontFamily="{StaticResource SymbolThemeFontFamily}" Glyph="&#xe8e5;"/>
-                        </AppBarButton.Icon>
+                        x:Name="openButton"
+                        x:Uid="OpenButton"
+                        Click="OpenButton_Click"
+                        Icon="{ui:FontIcon Glyph=&#xe8e5;}">
                        <AppBarButton.KeyboardAccelerators>
                            <KeyboardAccelerator Key="O" Modifiers="Control" />
                        </AppBarButton.KeyboardAccelerators>
                    </AppBarButton>
                    <AppBarButton
-                    x:Name="refreshButton"
-                    x:Uid="RefreshButton"
-                    Click="RefreshButton_Click">
-                        <AppBarButton.Icon>
-                            <FontIcon FontFamily="{StaticResource SymbolThemeFontFamily}" Glyph="&#xe72c;"/>
-                        </AppBarButton.Icon>
+                        x:Name="refreshButton"
+                        x:Uid="RefreshButton"
+                        Click="RefreshButton_Click"
+                        Icon="{ui:FontIcon Glyph=&#xe72c;}">
                        <AppBarButton.KeyboardAccelerators>
                            <KeyboardAccelerator Key="F5" />
                        </AppBarButton.KeyboardAccelerators>
                    </AppBarButton>
                    <AppBarSeparator />
                    <AppBarButton
-                    x:Name="saveButton"
-                    x:Uid="SaveButton"
-                    Click="SaveButton_Click"
-                    IsEnabled="False">
-                        <AppBarButton.Icon>
-                            <FontIcon FontFamily="{StaticResource SymbolThemeFontFamily}" Glyph="&#xe74e;"/>
-                        </AppBarButton.Icon>
+                        x:Name="saveButton"
+                        x:Uid="SaveButton"
+                        Click="SaveButton_Click"
+                        Icon="{ui:FontIcon Glyph=&#xe74e;}"
+                        IsEnabled="False">
                        <AppBarButton.KeyboardAccelerators>
                            <KeyboardAccelerator Key="S" Modifiers="Control" />
                        </AppBarButton.KeyboardAccelerators>
                    </AppBarButton>
                    <AppBarButton
-                    x:Name="saveAsButton"
-                    x:Uid="SaveAsButton"
-                    Click="SaveAsButton_Click"
-                    IsEnabled="True">
-                        <AppBarButton.Icon>
-                            <FontIcon FontFamily="{StaticResource SymbolThemeFontFamily}" Glyph="&#xe792;"/>
-                        </AppBarButton.Icon>
+                        x:Name="saveAsButton"
+                        x:Uid="SaveAsButton"
+                        Click="SaveAsButton_Click"
+                        Icon="{ui:FontIcon Glyph=&#xe792;}"
+                        IsEnabled="True">
                        <AppBarButton.KeyboardAccelerators>
                            <KeyboardAccelerator Key="S" Modifiers="Control,Shift" />
                        </AppBarButton.KeyboardAccelerators>
                    </AppBarButton>
                    <AppBarSeparator />
                    <AppBarButton
-                    x:Name="editButton"
-                    x:Uid="EditButton"
-                    Click="EditButton_Click">
-                        <AppBarButton.Icon>
-                            <FontIcon FontFamily="{StaticResource SymbolThemeFontFamily}" Glyph="&#xe8a7;"/>
-                        </AppBarButton.Icon>
+                        x:Name="editButton"
+                        x:Uid="EditButton"
+                        Click="EditButton_Click"
+                        Icon="{ui:FontIcon Glyph=&#xe8a7;}">
                        <AppBarButton.KeyboardAccelerators>
                            <KeyboardAccelerator Key="E" Modifiers="Control" />
                        </AppBarButton.KeyboardAccelerators>
@@ -152,10 +145,8 @@
                    <AppBarButton
                        x:Name="writeButton"
                        x:Uid="WriteButton"
-                        Click="WriteButton_Click">
-                        <AppBarButton.Icon>
-                            <FontIcon FontFamily="{StaticResource SymbolThemeFontFamily}" Glyph="&#xe72d;"/>
-                        </AppBarButton.Icon>
+                        Click="WriteButton_Click"
+                        Icon="{ui:FontIcon Glyph=&#xe72d;}">
                        <AppBarButton.KeyboardAccelerators>
                            <KeyboardAccelerator Key="W" Modifiers="Control" />
                        </AppBarButton.KeyboardAccelerators>
@@ -163,10 +154,8 @@
                    <AppBarButton
                        x:Name="registryButton"
                        x:Uid="RegistryButton"
-                        Click="RegistryButton_Click">
-                        <AppBarButton.Icon>
-                            <FontIcon FontFamily="{StaticResource SymbolThemeFontFamily}" Glyph="&#xe8ad;"/>
-                        </AppBarButton.Icon>
+                        Click="RegistryButton_Click"
+                        Icon="{ui:FontIcon Glyph=&#xe8ad;}">
                        <AppBarButton.KeyboardAccelerators>
                            <KeyboardAccelerator Key="R" Modifiers="Control" />
                        </AppBarButton.KeyboardAccelerators>
@@ -193,6 +182,7 @@
                VerticalAlignment="Stretch"
                AcceptsReturn="True"
                CanBeScrollAnchor="False"
+                CornerRadius="{StaticResource OverlayCornerRadius}"
                FontFamily="Cascadia Mono, Consolas, Courier New"
                IsSpellCheckEnabled="False"
                IsTabStop="True"
@@ -203,13 +193,12 @@
                ScrollViewer.IsVerticalRailEnabled="True"
                ScrollViewer.VerticalScrollBarVisibility="Visible"
                TabIndex="0"
-                TextWrapping="NoWrap"
-                CornerRadius="{StaticResource OverlayCornerRadius}"
-                />
+                TextWrapping="NoWrap" />

-            <Border Style="{StaticResource GridCardStyle}"
+            <Border
+                Grid.Row="1"
                Grid.Column="2"
-                Grid.Row="1">
+                Style="{StaticResource GridCardStyle}">
                <TreeView
                    x:Name="treeView"
                    AllowDrop="False"
@@ -244,9 +233,10 @@
                </TreeView>
            </Border>

-            <Border Style="{StaticResource GridCardStyle}"
+            <Border
                Grid.Row="3"
-                Grid.Column="2">
+                Grid.Column="2"
+                Style="{StaticResource GridCardStyle}">
                <controls:DataGrid
                    x:Name="dataGrid"
                    AllowDrop="False"
@@ -267,8 +257,11 @@
                            IsReadOnly="True">
                            <controls:DataGridTemplateColumn.CellTemplate>
                                <DataTemplate>
-                                    <StackPanel VerticalAlignment="Center" Orientation="Horizontal"
-                                                Margin="4" Spacing="8">
+                                    <StackPanel
+                                        Margin="4"
+                                        VerticalAlignment="Center"
+                                        Orientation="Horizontal"
+                                        Spacing="8">
                                        <Image
                                            MaxWidth="16"
                                            MaxHeight="16"
@@ -277,8 +270,8 @@
                                            ToolTipService.ToolTip="{Binding ToolTipText}" />
                                        <TextBlock
                                            IsTabStop="False"
-                                            Text="{Binding Name}"
-                                            Style="{StaticResource CaptionTextBlockStyle}"/>
+                                            Style="{StaticResource CaptionTextBlockStyle}"
+                                            Text="{Binding Name}" />
                                    </StackPanel>
                                </DataTemplate>
                            </controls:DataGridTemplateColumn.CellTemplate>
@@ -297,26 +290,20 @@
                </controls:DataGrid>
            </Border>

-            <controls:GridSplitter
+            <sizers:GridSplitter
                x:Name="verticalSplitter"
                Grid.Row="1"
                Grid.RowSpan="3"
                Grid.Column="1"
                HorizontalAlignment="Center"
                VerticalAlignment="Stretch"
-                Background="Transparent"
-                CursorBehavior="ChangeOnSplitterHover"
-                GripperCursor="SizeWestEast"
                IsTabStop="False" />
-            <controls:GridSplitter
+            <sizers:GridSplitter
                x:Name="horizontalSplitter"
                Grid.Row="2"
                Grid.Column="2"
                HorizontalAlignment="Stretch"
                VerticalAlignment="Center"
-                Background="Transparent"
-                CursorBehavior="ChangeOnSplitterHover"
-                GripperCursor="SizeNorthSouth"
                IsTabStop="False" />
        </Grid>
    </Grid>