ux: re-design commit message input box

Signed-off-by: leo <longshuang@msn.cn>

src/Views/CommitMessageTextBox.axaml

@@ -64,25 +64,57 @@
               Background="{DynamicResource Brush.Window}"
               BorderThickness="1,0,0,0"
               CornerRadius="0,0,4,4">
-        <Grid ColumnDefinitions="*,Auto,Auto" Margin="0,4">
+        <Grid ColumnDefinitions="Auto,Auto,Auto,Auto,*" Margin="0,4">
-          <StackPanel Grid.Column="0"
+          <Button Grid.Column="0"
+                  Classes="icon_button"
+                  Width="24" 
+                  Margin="0,0,4,0" Padding="0"
+                  Click="OnOpenCommitMessagePicker"
+                  IsVisible="{Binding #ThisControl.ShowAdvancedOptions}"
+                  ToolTip.Tip="{DynamicResource Text.WorkingCopy.CommitMessageHelper}">
+            <Path Width="12" Height="12" Data="{StaticResource Icons.Menu}"/>
+          </Button>
+
+          <Button Grid.Column="1"
+                  Classes="icon_button"
+                  Width="24"
+                  Margin="0,0,4,0" Padding="0"
+                  Click="OnOpenOpenAIHelper"
+                  IsVisible="{Binding #ThisControl.ShowAdvancedOptions}"
+                  ToolTip.Tip="{DynamicResource Text.AIAssistant.Tip}">
+            <Path Width="13" Height="13" Data="{StaticResource Icons.AIAssist}"/>
+          </Button>
+
+          <Button Grid.Column="2"
+                  Classes="icon_button"
+                  Width="24"
+                  Margin="0,0,4,0" Padding="0"
+                  Click="OnOpenConventionalCommitHelper"
+                  ToolTip.Tip="{DynamicResource Text.ConventionalCommit}">
+            <Path Width="13" Height="13" Margin="0,1,0,0" Data="{StaticResource Icons.CommitMessageGenerator}"/>
+          </Button>
+
+          <Button Grid.Column="3"
+                  Classes="icon_button"
+                  Width="24"
+                  Margin="0,0,4,0" Padding="0"
+                  Click="CopyAllText"
+                  ToolTip.Tip="{DynamicResource Text.CopyAllText}">
+            <Path Width="13" Height="13" Data="{StaticResource Icons.Copy}"/>
+          </Button>
+
+          <StackPanel Grid.Column="4"
+                      Margin="0,0,6,0"
+                      HorizontalAlignment="Right"
                       VerticalAlignment="Center"
                       Orientation="Horizontal">
-            <TextBlock Classes="info_label" FontSize="13" HorizontalAlignment="Left" Margin="4,0,0,0" Text="{DynamicResource Text.CommitMessageTextBox.SubjectCount}"/>
+            <TextBlock Classes="info_label" FontSize="13" HorizontalAlignment="Left" Text="{DynamicResource Text.CommitMessageTextBox.SubjectCount}"/>
             <TextBlock Classes="primary" Margin="8,0,0,0" FontSize="11" Text="{Binding #ThisControl.Subject.Length}" IsVisible="{Binding #ThisControl.Subject.Length, Converter={x:Static c:IntConverters.IsSubjectLengthGood}}" VerticalAlignment="Center"/>
             <TextBlock Classes="primary" Margin="8,0,0,0" FontSize="11" Foreground="DarkGoldenrod" Text="{Binding #ThisControl.Subject.Length}" IsVisible="{Binding #ThisControl.Subject.Length, Converter={x:Static c:IntConverters.IsSubjectLengthBad}}" VerticalAlignment="Center"/>
             <TextBlock Classes="primary" FontSize="11" Text="/" VerticalAlignment="Center"/>
             <TextBlock Classes="primary" FontSize="11" Text="{Binding Source={x:Static vm:Preferences.Instance}, Path=SubjectGuideLength}" VerticalAlignment="Center"/>
             <Path Width="10" Height="10" Margin="4,0,0,0" Data="{StaticResource Icons.Error}" Fill="DarkGoldenrod" IsVisible="{Binding #ThisControl.Subject.Length, Converter={x:Static c:IntConverters.IsSubjectLengthBad}}"/>
           </StackPanel>
-
-          <Button Grid.Column="1" Width="20" Margin="0,0,4,0" Padding="0" Classes="icon_button" Click="OnOpenConventionalCommitHelper" ToolTip.Tip="{DynamicResource Text.ConventionalCommit}">
-            <Path Width="13" Height="13" Margin="0,1,0,0" Data="{StaticResource Icons.CommitMessageGenerator}"/>
-          </Button>
-
-          <Button Grid.Column="2" Width="20" Margin="0,0,4,0" Padding="0" Classes="icon_button" Click="CopyAllText" ToolTip.Tip="{DynamicResource Text.CopyAllText}">
-            <Path Width="13" Height="13" Data="{StaticResource Icons.Copy}"/>
-          </Button>
         </Grid>
       </Border>
     </Grid>

src/Views/CommitMessageTextBox.axaml.cs

@@ -56,6 +56,9 @@ namespace SourceGit.Views
             FromEditor,
         }
 
+        public static readonly StyledProperty<bool> ShowAdvancedOptionsProperty =
+            AvaloniaProperty.Register<CommitMessageTextBox, bool>(nameof(ShowAdvancedOptions), false);
+
         public static readonly StyledProperty<string> TextProperty =
             AvaloniaProperty.Register<CommitMessageTextBox, string>(nameof(Text), string.Empty);
 
@@ -65,6 +68,12 @@ namespace SourceGit.Views
         public static readonly StyledProperty<string> DescriptionProperty =
             AvaloniaProperty.Register<CommitMessageTextBox, string>(nameof(Description), string.Empty);
 
+        public bool ShowAdvancedOptions
+        {
+            get => GetValue(ShowAdvancedOptionsProperty);
+            set => SetValue(ShowAdvancedOptionsProperty, value);
+        }
+
         public string Text
         {
             get => GetValue(TextProperty);
@@ -167,6 +176,29 @@ namespace SourceGit.Views
             }
         }
 
+        private void OnOpenCommitMessagePicker(object sender, RoutedEventArgs e)
+        {
+            if (sender is Button button && DataContext is ViewModels.WorkingCopy vm)
+            {
+                var menu = vm.CreateContextMenuForCommitMessages();
+                menu.Placement = PlacementMode.TopEdgeAlignedLeft;
+                menu?.Open(button);
+            }
+
+            e.Handled = true;
+        }
+
+        private void OnOpenOpenAIHelper(object sender, RoutedEventArgs e)
+        {
+            if (DataContext is ViewModels.WorkingCopy vm && sender is Control control)
+            {
+                var menu = vm.CreateContextForOpenAI();
+                menu?.Open(control);
+            }
+
+            e.Handled = true;
+        }
+
         private void OnOpenConventionalCommitHelper(object _, RoutedEventArgs e)
         {
             var dialog = new ConventionalCommitMessageBuilder()

src/Views/WorkingCopy.axaml

@@ -230,33 +230,13 @@
                     Background="Transparent"/>
 
       <!-- Commit Message -->
-      <v:CommitMessageTextBox Grid.Row="2" Text="{Binding CommitMessage, Mode=TwoWay}"/>
+      <v:CommitMessageTextBox Grid.Row="2" ShowAdvancedOptions="True" Text="{Binding CommitMessage, Mode=TwoWay}"/>
 
       <!-- Commit Options -->
-      <Grid Grid.Row="3" Margin="0,6,0,0" ColumnDefinitions="Auto,Auto,Auto,Auto,*,Auto,Auto,Auto">
+      <Grid Grid.Row="3" Margin="0,6,0,0" ColumnDefinitions="Auto,Auto,*,Auto,Auto,Auto">
-        <Button Grid.Column="0"
+        <CheckBox Grid.Column="0"
-                Classes="icon_button"
-                Margin="4,0,0,0" Padding="0"
-                Click="OnOpenCommitMessagePicker"
-                ToolTip.Tip="{DynamicResource Text.WorkingCopy.CommitMessageHelper}"
-                ToolTip.Placement="Top"
-                ToolTip.VerticalOffset="0">
-          <Path Width="12" Height="12" Data="{StaticResource Icons.Menu}"/>
-        </Button>
-
-        <Button Grid.Column="1"
-                Classes="icon_button"
-                Margin="4,2,0,0"
-                Click="OnOpenOpenAIHelper"
-                ToolTip.Tip="{DynamicResource Text.AIAssistant.Tip}"
-                ToolTip.Placement="Top"
-                ToolTip.VerticalOffset="0">
-          <Path Width="15" Height="15" Data="{StaticResource Icons.AIAssist}"/>
-        </Button>
-
-        <CheckBox Grid.Column="2"
                   Height="24"
-                  Margin="8,0,0,0"
+                  Margin="1,0,0,0"
                   HorizontalAlignment="Left"
                   IsChecked="{Binding EnableSignOff, Mode=TwoWay}"
                   Content="{DynamicResource Text.WorkingCopy.SignOff}"
@@ -264,7 +244,7 @@
                   ToolTip.Placement="Top"
                   ToolTip.VerticalOffset="0"/>
 
-        <CheckBox Grid.Column="3"
+        <CheckBox Grid.Column="1"
                   Height="24"
                   Margin="12,0,0,0"
                   HorizontalAlignment="Left"
@@ -274,12 +254,12 @@
                   ToolTip.Placement="Top"
                   ToolTip.VerticalOffset="0"/>
 
-        <v:LoadingIcon Grid.Column="4"
+        <v:LoadingIcon Grid.Column="2"
                        Width="18" Height="18"
                        HorizontalAlignment="Right"
                        IsVisible="{Binding IsCommitting}"/>
 
-        <SplitButton Grid.Column="5"
+        <SplitButton Grid.Column="3"
                      Content="{DynamicResource Text.Repository.Continue}"
                      Height="28"
                      Margin="8,0,0,0"
@@ -301,7 +281,7 @@
           </SplitButton.Flyout>
         </SplitButton>
 
-        <Button Grid.Column="5"
+        <Button Grid.Column="3"
                 Classes="flat primary"
                 Content="{DynamicResource Text.WorkingCopy.Commit}"
                 Height="28"
@@ -334,7 +314,7 @@
         </Button>
 
         <!-- Invisible button just to add another hotkey `Ctrl+Shift+Enter` to commit with auto-stage -->
-        <Button Grid.Column="6"
+        <Button Grid.Column="4"
                 Width="0" Height="0"
                 Background="Transparent"
                 Command="{Binding CommitWithAutoStage}"
@@ -347,7 +327,7 @@
           </Button.IsEnabled>
         </Button>
 
-        <Button Grid.Column="7"
+        <Button Grid.Column="5"
                 Classes="flat"
                 Content="{DynamicResource Text.WorkingCopy.CommitAndPush}"
                 Height="28"

src/Views/WorkingCopy.axaml.cs

@@ -25,17 +25,6 @@ namespace SourceGit.Views
                 layout.WorkingCopyLeftWidth = new GridLength(maxLeft, GridUnitType.Pixel);
         }
 
-        private void OnOpenCommitMessagePicker(object sender, RoutedEventArgs e)
-        {
-            if (sender is Button button && DataContext is ViewModels.WorkingCopy vm)
-            {
-                var menu = vm.CreateContextMenuForCommitMessages();
-                menu.Placement = PlacementMode.TopEdgeAlignedLeft;
-                menu?.Open(button);
-                e.Handled = true;
-            }
-        }
-
         private void OnUnstagedContextRequested(object sender, ContextRequestedEventArgs e)
         {
             if (DataContext is ViewModels.WorkingCopy vm && sender is Control control)
@@ -133,16 +122,5 @@ namespace SourceGit.Views
 
             e.Handled = true;
         }
-
-        private void OnOpenOpenAIHelper(object sender, RoutedEventArgs e)
-        {
-            if (DataContext is ViewModels.WorkingCopy vm && sender is Control control)
-            {
-                var menu = vm.CreateContextForOpenAI();
-                menu?.Open(control);
-            }
-
-            e.Handled = true;
-        }
     }
 }