ux: re-design commit message input box (#1169)

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

src/Resources/Locales/en_US.axaml

@@ -132,6 +132,7 @@
   <x:String x:Key="Text.CommitDetail.Info.SHA" xml:space="preserve">SHA</x:String>
   <x:String x:Key="Text.CommitDetail.Info.WebLinks" xml:space="preserve">Open in Browser</x:String>
   <x:String x:Key="Text.CommitMessageTextBox.MessagePlaceholder" xml:space="preserve">Description</x:String>
+  <x:String x:Key="Text.CommitMessageTextBox.SubjectCount" xml:space="preserve">SUBJECT</x:String>
   <x:String x:Key="Text.CommitMessageTextBox.SubjectPlaceholder" xml:space="preserve">Enter commit subject</x:String>
   <x:String x:Key="Text.Configure" xml:space="preserve">Repository Configure</x:String>
   <x:String x:Key="Text.Configure.CommitMessageTemplate" xml:space="preserve">COMMIT TEMPLATE</x:String>

src/Resources/Locales/zh_CN.axaml

@@ -136,6 +136,7 @@
   <x:String x:Key="Text.CommitDetail.Info.SHA" xml:space="preserve">提交指纹</x:String>
   <x:String x:Key="Text.CommitDetail.Info.WebLinks" xml:space="preserve">浏览器中查看</x:String>
   <x:String x:Key="Text.CommitMessageTextBox.MessagePlaceholder" xml:space="preserve">详细描述</x:String>
+  <x:String x:Key="Text.CommitMessageTextBox.SubjectCount" xml:space="preserve">主题</x:String>
   <x:String x:Key="Text.CommitMessageTextBox.SubjectPlaceholder" xml:space="preserve">填写提交信息主题</x:String>
   <x:String x:Key="Text.Configure" xml:space="preserve">仓库配置</x:String>
   <x:String x:Key="Text.Configure.CommitMessageTemplate" xml:space="preserve">提交信息模板</x:String>
@@ -756,4 +757,4 @@
   <x:String x:Key="Text.Worktree.Lock" xml:space="preserve">锁定工作树</x:String>
   <x:String x:Key="Text.Worktree.Remove" xml:space="preserve">移除工作树</x:String>
   <x:String x:Key="Text.Worktree.Unlock" xml:space="preserve">解除工作树锁定</x:String>
-</ResourceDictionary>
+</ResourceDictionary>

src/Resources/Locales/zh_TW.axaml

@@ -136,6 +136,7 @@
   <x:String x:Key="Text.CommitDetail.Info.SHA" xml:space="preserve">提交編號</x:String>
   <x:String x:Key="Text.CommitDetail.Info.WebLinks" xml:space="preserve">在瀏覽器中檢視</x:String>
   <x:String x:Key="Text.CommitMessageTextBox.MessagePlaceholder" xml:space="preserve">詳細描述</x:String>
+  <x:String x:Key="Text.CommitMessageTextBox.SubjectCount" xml:space="preserve">標題</x:String>
   <x:String x:Key="Text.CommitMessageTextBox.SubjectPlaceholder" xml:space="preserve">填寫提交訊息標題</x:String>
   <x:String x:Key="Text.Configure" xml:space="preserve">存放庫設定</x:String>
   <x:String x:Key="Text.Configure.CommitMessageTemplate" xml:space="preserve">提交訊息範本</x:String>
@@ -756,4 +757,4 @@
   <x:String x:Key="Text.Worktree.Lock" xml:space="preserve">鎖定工作區</x:String>
   <x:String x:Key="Text.Worktree.Remove" xml:space="preserve">移除工作區</x:String>
   <x:String x:Key="Text.Worktree.Unlock" xml:space="preserve">解除鎖定工作區</x:String>
-</ResourceDictionary>
+</ResourceDictionary>

src/ViewModels/ConventionalCommitMessageBuilder.cs

@@ -1,4 +1,5 @@
-using System.ComponentModel.DataAnnotations;
+using System;
+using System.ComponentModel.DataAnnotations;
 using System.Diagnostics.CodeAnalysis;
 using System.Text;
 
@@ -46,9 +47,9 @@ namespace SourceGit.ViewModels
             set => SetProperty(ref _closedIssue, value);
         }
 
-        public ConventionalCommitMessageBuilder(WorkingCopy wc)
+        public ConventionalCommitMessageBuilder(Action<string> onApply)
         {
-            _wc = wc;
+            _onApply = onApply;
         }
 
         [UnconditionalSuppressMessage("AssemblyLoadTrimming", "IL2026:RequiresUnreferencedCode")]
@@ -98,11 +99,11 @@ namespace SourceGit.ViewModels
                 builder.Append(_closedIssue);
             }
 
-            _wc.CommitMessage = builder.ToString();
+            _onApply?.Invoke(builder.ToString());
             return true;
         }
 
-        private WorkingCopy _wc = null;
+        private Action<string> _onApply = null;
         private Models.ConventionalCommitType _type = Models.ConventionalCommitType.Supported[0];
         private string _scope = string.Empty;
         private string _description = string.Empty;

src/Views/CommitMessageTextBox.axaml

@@ -12,42 +12,22 @@
           BorderThickness="1"
           BorderBrush="{DynamicResource Brush.Border2}"
           CornerRadius="4">
-    <Grid RowDefinitions="Auto,1,*">
+    <Grid RowDefinitions="Auto,1,*,1,24">
-      <Grid Grid.Row="0" ColumnDefinitions="*,1,Auto">
+      <v:EnhancedTextBox Grid.Row="0"
-        <v:EnhancedTextBox Grid.Column="0"
+                         x:Name="SubjectEditor"
-                           x:Name="SubjectEditor"
+                         Classes="no_border"
-                           Classes="no_border"
+                         Margin="0"
-                           Margin="0"
+                         Padding="4"
-                           Padding="4"
+                         CornerRadius="4,4,0,0"
-                           CornerRadius="4,4,0,0"
+                         BorderThickness="0"
-                           BorderThickness="0"
+                         Background="Transparent"
-                           Background="Transparent"
+                         AcceptsReturn="False"
-                           AcceptsReturn="False"
+                         TextWrapping="Wrap"
-                           TextWrapping="Wrap"
+                         ScrollViewer.HorizontalScrollBarVisibility="Disabled"
-                           ScrollViewer.HorizontalScrollBarVisibility="Disabled"
+                         ScrollViewer.VerticalScrollBarVisibility="Disabled"
-                           ScrollViewer.VerticalScrollBarVisibility="Disabled"
+                         Text="{Binding #ThisControl.Subject, Mode=TwoWay}"
-                           Text="{Binding #ThisControl.Subject, Mode=TwoWay}"
+                         Watermark="{DynamicResource Text.CommitMessageTextBox.SubjectPlaceholder}"
-                           Watermark="{DynamicResource Text.CommitMessageTextBox.SubjectPlaceholder}"
+                         PreviewKeyDown="OnSubjectTextBoxPreviewKeyDown"/>
-                           PreviewKeyDown="OnSubjectTextBoxPreviewKeyDown"/>
-
-        <Rectangle Grid.Column="1"
-                   Width="1"
-                   HorizontalAlignment="Center"
-                   VerticalAlignment="Stretch"
-                   IsHitTestVisible="False"
-                   Fill="{DynamicResource Brush.Border2}"/>
-
-        <StackPanel Grid.Column="2"
-                    Margin="8,0"
-                    VerticalAlignment="Center"
-                    Orientation="Horizontal">
-          <TextBlock Classes="primary" Margin="2,0,0,0" FontSize="11" Text="{Binding #ThisControl.Subject.Length}" IsVisible="{Binding #ThisControl.Subject.Length, Converter={x:Static c:IntConverters.IsSubjectLengthGood}}"/>
-          <TextBlock Classes="primary" Margin="2,0,0,0" FontSize="11" Foreground="DarkGoldenrod" Text="{Binding #ThisControl.Subject.Length}" IsVisible="{Binding #ThisControl.Subject.Length, Converter={x:Static c:IntConverters.IsSubjectLengthBad}}"/>
-          <TextBlock Classes="primary" FontSize="11" Text="/"/>
-          <TextBlock Classes="primary" FontSize="11" Text="{Binding Source={x:Static vm:Preferences.Instance}, Path=SubjectGuideLength}"/>
-          <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>
-      </Grid>
 
       <Rectangle Grid.Row="1"
                  Height="1"
@@ -61,7 +41,6 @@
                          Classes="no_border"
                          Margin="0"
                          Padding="4"
-                         CornerRadius="0,0,4,4"
                          BorderThickness="0"
                          Background="Transparent"
                          VerticalContentAlignment="Top"
@@ -73,6 +52,40 @@
                          Text="{Binding #ThisControl.Description, Mode=TwoWay}"
                          Watermark="{DynamicResource Text.CommitMessageTextBox.MessagePlaceholder}"
                          PreviewKeyDown="OnDescriptionTextBoxPreviewKeyDown"/>
+
+      <Rectangle Grid.Row="3"
+                 Height="1"
+                 HorizontalAlignment="Stretch"
+                 VerticalAlignment="Center"
+                 IsHitTestVisible="False"
+                 Fill="{DynamicResource Brush.Border2}"/>
+
+      <Border Grid.Row="4"
+              Background="{DynamicResource Brush.Window}"
+              BorderThickness="1,0,0,0"
+              CornerRadius="0,0,4,4">
+        <Grid ColumnDefinitions="*,Auto,Auto" Margin="0,4">
+          <StackPanel Grid.Column="0"
+                      Margin="8,0"
+                      VerticalAlignment="Center"
+                      Orientation="Horizontal">
+            <TextBlock Classes="info_label" FontSize="13" 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>
   </Border>
 </UserControl>

src/Views/CommitMessageTextBox.axaml.cs

@@ -167,6 +167,23 @@ namespace SourceGit.Views
             }
         }
 
+        private void OnOpenConventionalCommitHelper(object _, RoutedEventArgs e)
+        {
+            var dialog = new ConventionalCommitMessageBuilder()
+            {
+                DataContext = new ViewModels.ConventionalCommitMessageBuilder(text => Text = text)
+            };
+
+            App.OpenDialog(dialog);
+            e.Handled = true;
+        }
+
+        private void CopyAllText(object sender, RoutedEventArgs e)
+        {
+            App.CopyText(Text);
+            e.Handled = true;
+        }
+
         private TextChangeWay _changingWay = TextChangeWay.None;
     }
 }

src/Views/WorkingCopy.axaml

@@ -233,7 +233,7 @@
       <v:CommitMessageTextBox Grid.Row="2" Text="{Binding CommitMessage, Mode=TwoWay}"/>
 
       <!-- Commit Options -->
-      <Grid Grid.Row="3" Margin="0,6,0,0" ColumnDefinitions="Auto,Auto,Auto,Auto,Auto,*,Auto,Auto,Auto">
+      <Grid Grid.Row="3" Margin="0,6,0,0" ColumnDefinitions="Auto,Auto,Auto,Auto,*,Auto,Auto,Auto">
         <Button Grid.Column="0"
                 Classes="icon_button"
                 Margin="4,0,0,0" Padding="0"
@@ -254,17 +254,7 @@
           <Path Width="15" Height="15" Data="{StaticResource Icons.AIAssist}"/>
         </Button>
 
-        <Button Grid.Column="2"
+        <CheckBox Grid.Column="2"
-                Classes="icon_button"
-                Margin="0,2,0,0"
-                Click="OnOpenConventionalCommitHelper"
-                ToolTip.Tip="{DynamicResource Text.ConventionalCommit}"
-                ToolTip.Placement="Top"
-                ToolTip.VerticalOffset="0">
-          <Path Width="15" Height="15" Data="{StaticResource Icons.CommitMessageGenerator}"/>
-        </Button>
-
-        <CheckBox Grid.Column="3"
                   Height="24"
                   Margin="8,0,0,0"
                   HorizontalAlignment="Left"
@@ -274,7 +264,7 @@
                   ToolTip.Placement="Top"
                   ToolTip.VerticalOffset="0"/>
 
-        <CheckBox Grid.Column="4"
+        <CheckBox Grid.Column="3"
                   Height="24"
                   Margin="12,0,0,0"
                   HorizontalAlignment="Left"
@@ -284,12 +274,12 @@
                   ToolTip.Placement="Top"
                   ToolTip.VerticalOffset="0"/>
 
-        <v:LoadingIcon Grid.Column="5"
+        <v:LoadingIcon Grid.Column="4"
                        Width="18" Height="18"
                        HorizontalAlignment="Right"
                        IsVisible="{Binding IsCommitting}"/>
 
-        <SplitButton Grid.Column="6"
+        <SplitButton Grid.Column="5"
                      Content="{DynamicResource Text.Repository.Continue}"
                      Height="28"
                      Margin="8,0,0,0"
@@ -311,7 +301,7 @@
           </SplitButton.Flyout>
         </SplitButton>
 
-        <Button Grid.Column="6"
+        <Button Grid.Column="5"
                 Classes="flat primary"
                 Content="{DynamicResource Text.WorkingCopy.Commit}"
                 Height="28"
@@ -344,7 +334,7 @@
         </Button>
 
         <!-- Invisible button just to add another hotkey `Ctrl+Shift+Enter` to commit with auto-stage -->
-        <Button Grid.Column="7"
+        <Button Grid.Column="6"
                 Width="0" Height="0"
                 Background="Transparent"
                 Command="{Binding CommitWithAutoStage}"
@@ -357,7 +347,7 @@
           </Button.IsEnabled>
         </Button>
 
-        <Button Grid.Column="8"
+        <Button Grid.Column="7"
                 Classes="flat"
                 Content="{DynamicResource Text.WorkingCopy.CommitAndPush}"
                 Height="28"

src/Views/WorkingCopy.axaml.cs

@@ -144,20 +144,5 @@ namespace SourceGit.Views
 
             e.Handled = true;
         }
-
-        private void OnOpenConventionalCommitHelper(object _, RoutedEventArgs e)
-        {
-            if (DataContext is ViewModels.WorkingCopy vm)
-            {
-                var dialog = new ConventionalCommitMessageBuilder()
-                {
-                    DataContext = new ViewModels.ConventionalCommitMessageBuilder(vm)
-                };
-
-                App.OpenDialog(dialog);
-            }
-
-            e.Handled = true;
-        }
     }
 }