CmdPal: Styling critical context items using the SystemFillColorCriticalBrush (#39645)

Styles context items based on the IsCritical property.


![image](https://github.com/user-attachments/assets/aa1ee0b0-de09-45af-8f5e-74dff666fbb4)


![image](https://github.com/user-attachments/assets/90a7f750-c949-4f76-b699-db2e29251414)

Closes #38307

src/modules/cmdpal/Microsoft.CmdPal.UI/App.xaml

@@ -11,6 +11,7 @@
                 <!--  Other merged dictionaries here  -->
                 <ResourceDictionary Source="Styles/Button.xaml" />
                 <ResourceDictionary Source="Styles/Colors.xaml" />
+                <ResourceDictionary Source="Styles/TextBlock.xaml" />
                 <ResourceDictionary Source="Styles/TextBox.xaml" />
                 <ResourceDictionary Source="Styles/Settings.xaml" />
                 <ResourceDictionary Source="Controls/Tag.xaml" />

src/modules/cmdpal/Microsoft.CmdPal.UI/Controls/CommandBar.xaml

@@ -34,8 +34,13 @@
                 Orientation="Vertical"
                 Spacing="4" />
 
-            <!--  Template for actions in the mode actions dropdown button  -->
+            <cmdpalUI:ContextItemTemplateSelector
-            <DataTemplate x:Key="ContextMenuViewModelTemplate" x:DataType="viewmodels:CommandContextItemViewModel">
+                x:Key="ContextItemTemplateSelector"
+                Critical="{StaticResource CriticalContextMenuViewModelTemplate}"
+                Default="{StaticResource DefaultContextMenuViewModelTemplate}" />
+
+            <!--  Template for context items in the context item menu  -->
+            <DataTemplate x:Key="DefaultContextMenuViewModelTemplate" x:DataType="viewmodels:CommandContextItemViewModel">
                 <Grid AutomationProperties.Name="{x:Bind Title, Mode=OneWay}">
                     <Grid.ColumnDefinitions>
                         <ColumnDefinition Width="32" />
@@ -63,6 +68,38 @@
                         Text="{x:Bind RequestedShortcut, Mode=OneWay, Converter={StaticResource KeyChordToStringConverter}}" />
                 </Grid>
             </DataTemplate>
+
+            <!--  Template for context items flagged as critical  -->
+            <DataTemplate x:Key="CriticalContextMenuViewModelTemplate" x:DataType="viewmodels:CommandContextItemViewModel">
+                <Grid AutomationProperties.Name="{x:Bind Title, Mode=OneWay}">
+                    <Grid.ColumnDefinitions>
+                        <ColumnDefinition Width="32" />
+                        <ColumnDefinition Width="*" />
+                        <ColumnDefinition Width="Auto" />
+                    </Grid.ColumnDefinitions>
+                    <cpcontrols:IconBox
+                        Width="16"
+                        Height="16"
+                        Margin="4,0,0,0"
+                        HorizontalAlignment="Left"
+                        Foreground="{ThemeResource SystemFillColorCriticalBrush}"
+                        SourceKey="{x:Bind Icon, Mode=OneWay}"
+                        SourceRequested="{x:Bind help:IconCacheProvider.SourceRequested}" />
+                    <TextBlock
+                        Grid.Column="1"
+                        VerticalAlignment="Center"
+                        Style="{StaticResource ContextItemTitleTextBlockCriticalStyle}"
+                        Text="{x:Bind Title, Mode=OneWay}" />
+                    <TextBlock
+                        Grid.Column="2"
+                        Margin="16,0,0,0"
+                        HorizontalAlignment="Right"
+                        VerticalAlignment="Center"
+                        Style="{StaticResource ContextItemCaptionTextBlockCriticalStyle}"
+                        Text="{x:Bind RequestedShortcut, Mode=OneWay, Converter={StaticResource KeyChordToStringConverter}}" />
+                </Grid>
+            </DataTemplate>
+
         </ResourceDictionary>
     </UserControl.Resources>
 
@@ -237,7 +274,7 @@
                                 Margin="-16,-12,-16,-12"
                                 IsItemClickEnabled="True"
                                 ItemClick="CommandsDropdown_ItemClick"
-                                ItemTemplate="{StaticResource ContextMenuViewModelTemplate}"
+                                ItemTemplateSelector="{StaticResource ContextItemTemplateSelector}"
                                 ItemsSource="{x:Bind ViewModel.ContextMenu.FilteredItems, Mode=OneWay}"
                                 KeyDown="CommandsDropdown_KeyDown"
                                 SelectionMode="Single">

src/modules/cmdpal/Microsoft.CmdPal.UI/Converters/ContextItemTemplateSelector.cs

@@ -0,0 +1,21 @@
+// Copyright (c) Microsoft Corporation
+// The Microsoft Corporation licenses this file to you under the MIT license.
+// See the LICENSE file in the project root for more information.
+
+using Microsoft.CmdPal.UI.ViewModels;
+using Microsoft.UI.Xaml;
+using Microsoft.UI.Xaml.Controls;
+
+namespace Microsoft.CmdPal.UI;
+
+internal sealed partial class ContextItemTemplateSelector : DataTemplateSelector
+{
+    public DataTemplate? Default { get; set; }
+
+    public DataTemplate? Critical { get; set; }
+
+    protected override DataTemplate? SelectTemplateCore(object item)
+    {
+        return ((CommandContextItemViewModel)item).IsCritical ? Critical : Default;
+    }
+}

src/modules/cmdpal/Microsoft.CmdPal.UI/Microsoft.CmdPal.UI.csproj

@@ -39,9 +39,7 @@
   </PropertyGroup>
 
   <!-- BODGY: XES Versioning and WinAppSDK get into a fight about the app manifest, which breaks WinAppSDK. -->
-  <Target Name="RearrangeXefVersioningAndWinAppSDKResourceGeneration"
+  <Target Name="RearrangeXefVersioningAndWinAppSDKResourceGeneration" DependsOnTargets="GetNewAppManifestValues;CreateWinRTRegistration" BeforeTargets="XesWriteVersionInfoResourceFile">
-          DependsOnTargets="GetNewAppManifestValues;CreateWinRTRegistration"
-          BeforeTargets="XesWriteVersionInfoResourceFile">
     <PropertyGroup>
       <!-- XES uses this property to store the "final" location of the app manifest, before it erases it.
            We have to update it to the value WinAppSDK set it to. -->

src/modules/cmdpal/Microsoft.CmdPal.UI/Styles/TextBlock.xaml

@@ -0,0 +1,27 @@
+<?xml version="1.0" encoding="utf-8" ?>
+<ResourceDictionary
+    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:converters="using:CommunityToolkit.WinUI.Converters">
+
+    <ResourceDictionary.MergedDictionaries>
+        <XamlControlsResources xmlns="using:Microsoft.UI.Xaml.Controls" />
+        <!--  Other merged dictionaries here  -->
+    </ResourceDictionary.MergedDictionaries>
+
+    <Style
+        x:Key="ContextItemTitleTextBlockCriticalStyle"
+        BasedOn="{StaticResource BaseTextBlockStyle}"
+        TargetType="TextBlock">
+        <Setter Property="Foreground" Value="{ThemeResource SystemFillColorCriticalBrush}" />
+        <Setter Property="FontWeight" Value="Normal" />
+    </Style>
+
+    <Style
+        x:Key="ContextItemCaptionTextBlockCriticalStyle"
+        BasedOn="{StaticResource CaptionTextBlockStyle}"
+        TargetType="TextBlock">
+        <Setter Property="Foreground" Value="{ThemeResource SystemFillColorCriticalBrush}" />
+    </Style>
+
+</ResourceDictionary>

src/modules/cmdpal/ext/Microsoft.CmdPal.Ext.WindowWalker/Components/ContextMenuHelper.cs

@@ -36,6 +36,7 @@ internal sealed class ContextMenuHelper
             contextMenu.Add(new CommandContextItem(new KillProcessCommand(windowData))
             {
                 RequestedShortcut = KeyChordHelpers.FromModifiers(true, false, false, false, (int)VirtualKey.Delete, 0),
+                IsCritical = true,
             });
         }