From 4a92b046ccf7c57bfb1631f00d5f2568132c471c Mon Sep 17 00:00:00 2001
From: Yair <39923744+yaira2@users.noreply.github.com>
Date: Wed, 10 May 2023 17:35:21 -0400
Subject: [PATCH] Branches flyout

---
 src/Files.App/Strings/en-US/Resources.resw    |  5 +-
 .../UserControls/StatusBarControl.xaml        | 57 +++++++++++++------
 .../UserControls/StatusBarControl.xaml.cs     |  4 +-
 3 files changed, 47 insertions(+), 19 deletions(-)

diff --git a/src/Files.App/Strings/en-US/Resources.resw b/src/Files.App/Strings/en-US/Resources.resw
index b62f86a4a18f5..7b1e785ebea21 100644
--- a/src/Files.App/Strings/en-US/Resources.resw
+++ b/src/Files.App/Strings/en-US/Resources.resw
@@ -3278,9 +3278,12 @@
      <value>Switch Branch</value>
   </data>
   <data name="Branches" xml:space="preserve">
-    <value>Branches:</value>
+    <value>Branches</value>
   </data>
   <data name="Switch" xml:space="preserve">
     <value>Switch</value>
   </data>
+  <data name="NewBranch" xml:space="preserve">
+    <value>New branch</value>
+  </data>
 </root>
\ No newline at end of file
diff --git a/src/Files.App/UserControls/StatusBarControl.xaml b/src/Files.App/UserControls/StatusBarControl.xaml
index cfa2430ea88a2..96193846ec348 100644
--- a/src/Files.App/UserControls/StatusBarControl.xaml
+++ b/src/Files.App/UserControls/StatusBarControl.xaml
@@ -62,26 +62,51 @@
 				Content="{x:Bind DirectoryPropertiesViewModel.GitBranchDisplayName, Mode=OneWay}">
 				<Button.Flyout>
 					<Flyout Opening="Flyout_Opening">
-						<Flyout.FlyoutPresenterStyle>
-							<Style TargetType="FlyoutPresenter">
-								<Setter Property="Padding" Value="8" />
-								<Setter Property="CornerRadius" Value="{StaticResource OverlayCornerRadius}" />
-							</Style>
-						</Flyout.FlyoutPresenterStyle>
-						<StackPanel
-							Width="200"
-							Height="200"
-							LostFocus="StackPanel_LostFocus"
-							Spacing="8">
-							<TextBlock
-								Margin="16,0,0,0"
-								FontWeight="Bold"
-								Text="{helpers:ResourceString Name=Branches}" />
+						<Grid
+							x:Name="BranchesGrid"
+							Width="300"
+							Height="340"
+							Margin="-16"
+							LostFocus="BranchesGrid_LostFocus">
+							<Grid.RowDefinitions>
+								<RowDefinition Height="Auto" />
+								<RowDefinition Height="*" />
+							</Grid.RowDefinitions>
+
+							<!--  Header  -->
+							<Grid
+								Grid.Row="0"
+								Padding="12"
+								Background="{ThemeResource AcrylicBackgroundFillColorDefaultBrush}"
+								BorderBrush="{ThemeResource CardStrokeColorDefaultBrush}"
+								BorderThickness="0,0,0,1">
+								<!--  Title  -->
+								<TextBlock
+									VerticalAlignment="Center"
+									FontSize="14"
+									Text="{helpers:ResourceString Name=Branches}" />
+
+								<!--  New Branch Button  -->
+								<Button
+									x:Name="NewBranchButton"
+									Height="24"
+									Padding="8,0"
+									HorizontalAlignment="Right"
+									x:Load="False"
+									Content="{helpers:ResourceString Name=NewBranch}"
+									FontSize="12"
+									ToolTipService.ToolTip="{helpers:ResourceString Name=NewBranch}" />
+							</Grid>
+
+							<!--  Branches List  -->
 							<ListView
+								Grid.Row="1"
+								Padding="4"
+								Background="{ThemeResource CardBackgroundFillColorDefaultBrush}"
 								ItemsSource="{x:Bind DirectoryPropertiesViewModel.BranchesNames, Mode=OneWay}"
 								SelectedIndex="{x:Bind DirectoryPropertiesViewModel.SelectedBranchIndex, Mode=TwoWay}"
 								SelectionMode="Single" />
-						</StackPanel>
+						</Grid>
 					</Flyout>
 				</Button.Flyout>
 			</Button>
diff --git a/src/Files.App/UserControls/StatusBarControl.xaml.cs b/src/Files.App/UserControls/StatusBarControl.xaml.cs
index 28b05dcfa85ff..7b668bb79274e 100644
--- a/src/Files.App/UserControls/StatusBarControl.xaml.cs
+++ b/src/Files.App/UserControls/StatusBarControl.xaml.cs
@@ -49,9 +49,9 @@ private void Flyout_Opening(object sender, object e)
 			DirectoryPropertiesViewModel.SelectedBranchIndex = DirectoryPropertiesViewModel.ActiveBranchIndex;
 		}
 
-		private void StackPanel_LostFocus(object sender, RoutedEventArgs e)
+		private void BranchesGrid_LostFocus(object sender, RoutedEventArgs e)
 		{
-			((Popup)((FlyoutPresenter)((StackPanel)sender).Parent).Parent).IsOpen = false;
+			((Popup)((FlyoutPresenter)((Grid)sender).Parent).Parent).IsOpen = false;
 		}
 	}
 }