ux: re-design merge option style

Signed-off-by: leo <[email protected]>

Author: love-linger

src/Models/MergeMode.cs

@@ -6,7 +6,7 @@ public class MergeMode
         [
             new MergeMode("Default", "Fast-forward if possible", ""),
             new MergeMode("No Fast-forward", "Always create a merge commit", "--no-ff"),
-            new MergeMode("Squash", "Use '--squash'", "--squash"),
+            new MergeMode("Squash", "Squash merge", "--squash"),
             new MergeMode("Don't commit", "Merge without commit", "--no-ff --no-commit"),
         ];
 

src/ViewModels/Merge.cs

@@ -15,7 +15,7 @@ public string Into
             get;
         }
 
-        public Models.MergeMode SelectedMode
+        public Models.MergeMode Mode
         {
             get;
             set;
@@ -28,7 +28,7 @@ public Merge(Repository repo, Models.Branch source, string into)
 
             Source = source;
             Into = into;
-            SelectedMode = AutoSelectMergeMode();
+            Mode = AutoSelectMergeMode();
             View = new Views.Merge() { DataContext = this };
         }
 
@@ -39,7 +39,7 @@ public Merge(Repository repo, Models.Commit source, string into)
 
             Source = source;
             Into = into;
-            SelectedMode = AutoSelectMergeMode();
+            Mode = AutoSelectMergeMode();
             View = new Views.Merge() { DataContext = this };
         }
 
@@ -50,7 +50,7 @@ public Merge(Repository repo, Models.Tag source, string into)
 
             Source = source;
             Into = into;
-            SelectedMode = AutoSelectMergeMode();
+            Mode = AutoSelectMergeMode();
             View = new Views.Merge() { DataContext = this };
         }
 
@@ -61,7 +61,7 @@ public override Task<bool> Sure()
 
             return Task.Run(() =>
             {
-                new Commands.Merge(_repo.FullPath, _sourceName, SelectedMode.Arg, SetProgressDescription).Exec();
+                new Commands.Merge(_repo.FullPath, _sourceName, Mode.Arg, SetProgressDescription).Exec();
                 CallUIThread(() => _repo.SetWatcherEnabled(true));
                 return true;
             });

src/Views/Merge.axaml

@@ -60,15 +60,32 @@
                 Height="28" Padding="8,0"
                 VerticalAlignment="Center" HorizontalAlignment="Stretch"
                 ItemsSource="{Binding Source={x:Static m:MergeMode.Supported}}"
-                SelectedItem="{Binding SelectedMode, Mode=TwoWay}">
+                SelectedItem="{Binding Mode, Mode=TwoWay}"
+                Grid.IsSharedSizeScope="True">
         <ComboBox.ItemTemplate>
           <DataTemplate DataType="m:MergeMode">
-            <StackPanel Orientation="Horizontal" Height="20" VerticalAlignment="Center">
-              <TextBlock Text="{Binding Name}"/>
-              <TextBlock Text="{Binding Desc}" Margin="8,0,0,0" FontSize="11" Foreground="{DynamicResource Brush.FG2}"/>
-            </StackPanel>
+            <Grid Height="20">
+              <Grid.ColumnDefinitions>
+                <ColumnDefinition Width="Auto" SharedSizeGroup="MergeModeNameColumn"/>
+                <ColumnDefinition Width="Auto" SharedSizeGroup="MergeModeDescriptionColumn"/>
+                <ColumnDefinition Width="Auto" SharedSizeGroup="MergeModeOptionColumn"/>
+              </Grid.ColumnDefinitions>
+              
+              <TextBlock Grid.Column="0" Text="{Binding Name}"/>
+              <TextBlock Grid.Column="1" Text="{Binding Desc}" Margin="8,0" FontSize="11" Foreground="{DynamicResource Brush.FG2}"/>
+              <TextBlock Grid.Column="2" Text="{Binding Arg}" HorizontalAlignment="Right" FontSize="11" Foreground="{DynamicResource Brush.FG2}"/>
+            </Grid>
           </DataTemplate>
         </ComboBox.ItemTemplate>
+
+        <ComboBox.SelectionBoxItemTemplate>
+          <DataTemplate DataType="m:MergeMode">
+            <Grid ColumnDefinitions="Auto,*">
+              <TextBlock Grid.Column="0" Text="{Binding Name}" Margin="0,0,8,0"/>
+              <TextBlock Grid.Column="1" Text="{Binding Desc}" HorizontalAlignment="Right" FontSize="11" Foreground="{DynamicResource Brush.FG2}"/>
+            </Grid>
+          </DataTemplate>
+        </ComboBox.SelectionBoxItemTemplate>
       </ComboBox>
     </Grid>
   </StackPanel>