From bc4bde8ceefefe394a8ee9f1611e084ff273d3cf Mon Sep 17 00:00:00 2001
From: Davide Giacometti <davide.giacometti@outlook.it>
Date: Mon, 13 Feb 2023 19:46:06 +0100
Subject: [PATCH] [Settings][Flyout] Fix missing borders on Windows 10 (#23825)

* fix missing borders on windows 10

* use correct color brush
---
 src/settings-ui/Settings.UI/FlyoutWindow.xaml | 21 +++++++++++++--
 .../ViewModels/Flyout/FlyoutViewModel.cs      | 27 ++++++++++++++++++-
 2 files changed, 45 insertions(+), 3 deletions(-)

diff --git a/src/settings-ui/Settings.UI/FlyoutWindow.xaml b/src/settings-ui/Settings.UI/FlyoutWindow.xaml
index d3c5524d47..8ecffb7013 100644
--- a/src/settings-ui/Settings.UI/FlyoutWindow.xaml
+++ b/src/settings-ui/Settings.UI/FlyoutWindow.xaml
@@ -1,4 +1,4 @@
-<winuiex:WindowEx
+<winuiex:WindowEx
     x:Class="Microsoft.PowerToys.Settings.UI.FlyoutWindow"
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
@@ -7,6 +7,8 @@
     xmlns:local="using:Microsoft.PowerToys.Settings.UI"
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
     xmlns:winuiex="using:WinUIEx"
+    xmlns:i="using:Microsoft.Xaml.Interactivity"
+    xmlns:ic="using:Microsoft.Xaml.Interactions.Core"
     Title="PowerToys Settings"
     IsAlwaysOnTop="True"
     IsMaximizable="False"
@@ -27,6 +29,21 @@
             LightTintOpacity="0" />
     </winuiex:WindowEx.Backdrop>
     <Grid>
-        <flyout:ShellPage x:Name="FlyoutShellPage"/>
+        <!-- HACK: https://github.com/microsoft/microsoft-ui-xaml/issues/7629 -->
+        <!-- W11 grey border, W10: no border  -->
+        <i:Interaction.Behaviors>
+            <ic:DataTriggerBehavior
+                Binding="{x:Bind ViewModel.Windows10}"
+                ComparisonCondition="Equal"
+                Value="True">
+                <ic:ChangePropertyAction
+                    PropertyName="BorderThickness"
+                    Value="1" />
+                <ic:ChangePropertyAction
+                    PropertyName="BorderBrush"
+                    Value="{ThemeResource SurfaceStrokeColorDefaultBrush}" />
+            </ic:DataTriggerBehavior>
+        </i:Interaction.Behaviors>
+        <flyout:ShellPage x:Name="FlyoutShellPage" />
     </Grid>
 </winuiex:WindowEx>
diff --git a/src/settings-ui/Settings.UI/ViewModels/Flyout/FlyoutViewModel.cs b/src/settings-ui/Settings.UI/ViewModels/Flyout/FlyoutViewModel.cs
index c781535afb..1d45053b2e 100644
--- a/src/settings-ui/Settings.UI/ViewModels/Flyout/FlyoutViewModel.cs
+++ b/src/settings-ui/Settings.UI/ViewModels/Flyout/FlyoutViewModel.cs
@@ -2,8 +2,10 @@
 // The Microsoft Corporation licenses this file to you under the MIT license.
 // See the LICENSE file in the project root for more information.
 
-using System;
+using System.ComponentModel;
+using System.Runtime.CompilerServices;
 using System.Timers;
+using Microsoft.PowerToys.Settings.UI.Library.Utilities;
 
 namespace Microsoft.PowerToys.Settings.UI.ViewModels.Flyout
 {
@@ -11,6 +13,21 @@ namespace Microsoft.PowerToys.Settings.UI.ViewModels.Flyout
     {
         public bool CanHide { get; set; }
 
+        private bool _windows10;
+
+        public bool Windows10
+        {
+            get => _windows10;
+            set
+            {
+                if (_windows10 != value)
+                {
+                    _windows10 = value;
+                    OnPropertyChanged();
+                }
+            }
+        }
+
         private Timer hideTimer;
 
         public FlyoutViewModel()
@@ -20,6 +37,7 @@ namespace Microsoft.PowerToys.Settings.UI.ViewModels.Flyout
             hideTimer.Elapsed += HideTimer_Elapsed;
             hideTimer.Interval = 1000;
             hideTimer.Enabled = false;
+            _windows10 = !Helper.Windows11();
         }
 
         private void HideTimer_Elapsed(object sender, ElapsedEventArgs e)
@@ -34,5 +52,12 @@ namespace Microsoft.PowerToys.Settings.UI.ViewModels.Flyout
             hideTimer.Stop();
             hideTimer.Start();
         }
+
+        public event PropertyChangedEventHandler PropertyChanged;
+
+        private void OnPropertyChanged([CallerMemberName] string propertyName = null)
+        {
+            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
+        }
     }
 }