TransferList Fix Transfer After Transfer All and Other Enhancements

Author: mckaragoz

CodeBeam.MudBlazor.Extensions.Docs/Pages/Components/TransferList/Examples/TransferListExample1.razor

@@ -6,7 +6,7 @@
         <MudTransferList @ref="_transferList" T="string" @bind-StartCollection="_startCollection" @bind-EndCollection="_endCollection" Vertical="_vertical" Color="_color"
             StyleListCommon="background-color: var(--mud-palette-background-gray); width: 200px" MultiSelection="_multiSelection" MaxItems="_maxItems" SelectAllType="_selectAllType"
             PreventTransfer="@(new Func<bool, bool>(CheckTransfer))" OrderFunc="@(_orderOnTransfer == false ? null : new Func<ICollection<string>, ICollection<string>>(OrderMethod))" ButtonVariant="_buttonVariant"
-            AllowDoubleClick="_allowDoubleClick" SearchBoxStart="_searchboxStart" SearchBoxEnd="_searchboxEnd"
+                         AllowDoubleClick="_allowDoubleClick" SearchBoxStart="_searchboxStart" SearchBoxEnd="_searchboxEnd" Dense="_dense"
             StartTitle="@_startTitle" EndTitle="@_endTitle" />
     </MudItem>
 
@@ -21,6 +21,7 @@
             <MudSwitchM3 @bind-Value="_allowDoubleClick" Label="Allow Double Click" Color="Color.Secondary" />
             <MudSwitchM3 @bind-Value="_searchboxStart" Label="SearchBox Start" Color="Color.Secondary" />
             <MudSwitchM3 @bind-Value="_searchboxEnd" Label="SearchBox End" Color="Color.Secondary" />
+            <MudSwitchM3 @bind-Value="_dense" Label="Dense" Color="Color.Secondary" />
             <MudNumericField @bind-Value="_maxItems" Clearable="true" Label="MaxItems" Variant="Variant.Outlined" Margin="Margin.Dense" />
             <MudSelectExtended @bind-Value="_selectAllType" ItemCollection="@(Enum.GetValues<SelectAllType>())" Label="SelectAll Type" Variant="Variant.Outlined" Margin="Margin.Dense" Dense="true" />
             <MudSelectExtended @bind-Value="_color" ItemCollection="@(Enum.GetValues<Color>())" Label="Color" Variant="Variant.Outlined" Margin="Margin.Dense" Dense="true" />
@@ -36,19 +37,20 @@
     ICollection<string> _startCollection = new List<string>() { "Sweden", "Hungary", "Turkey", "England", "Egypt" };
     ICollection<string> _endCollection = new List<string>() { "Brazil", "China", "Germany", "USA", "South Africa" };
 
-    bool _vertical;
-    bool _multiSelection;
-    bool _preventTurkeyTransfer;
-    bool _orderOnTransfer;
-    bool _allowDoubleClick;
-    bool _searchboxStart;
-    bool _searchboxEnd;
-    int? _maxItems;
-    SelectAllType _selectAllType = SelectAllType.Buttons;
-    Color _color = Color.Primary;
-    Variant _buttonVariant = Variant.Text;
-    string _startTitle = "Country Group 1";
-    string _endTitle = "Country Group 2";
+    private bool _vertical;
+    private bool _multiSelection;
+    private bool _preventTurkeyTransfer;
+    private bool _orderOnTransfer;
+    private bool _allowDoubleClick;
+    private bool _searchboxStart;
+    private bool _searchboxEnd;
+    private bool _dense;
+    private int? _maxItems;
+    private SelectAllType _selectAllType = SelectAllType.Buttons;
+    private Color _color = Color.Primary;
+    private Variant _buttonVariant = Variant.Text;
+    private string _startTitle = "Country Group 1";
+    private string _endTitle = "Country Group 2";
 
     private bool CheckTransfer(bool startToEnd)
     {

CodeBeam.MudBlazor.Extensions.UnitTests/Components/TransferListTests.cs

@@ -14,12 +14,16 @@ public async Task TransferListTransferAllTest()
             var transferList = comp.FindComponent<MudTransferList<string>>();
             transferList.Instance.StartCollection.Should().Contain("Turkey");
             transferList.Instance.StartCollection.Should().NotContain("China");
+            transferList?.Instance?.StartCollection?.Count.Should().Be(5);
+            transferList?.Instance?.EndCollection?.Count.Should().Be(5);
             await comp.InvokeAsync(() => transferList.Instance.TransferAll(true));
             transferList.Instance.StartCollection.Should().NotContain("Turkey");
             transferList.Instance.EndCollection.Should().Contain("Turkey");
             await comp.InvokeAsync(() => transferList.Instance.TransferAll(false));
             transferList.Instance.StartCollection.Should().Contain("Turkey");
             transferList.Instance.EndCollection.Should().NotContain("Turkey");
+            transferList?.Instance?.StartCollection?.Count.Should().Be(10);
+            transferList?.Instance?.EndCollection?.Count.Should().Be(0);
         }
 
     }

CodeBeam.MudBlazor.Extensions/Components/TransferList/MudTransferList.razor

@@ -12,7 +12,7 @@
         {
             <MudListItemExtended T="string"><MudText>@StartTitle</MudText></MudListItemExtended>
         }
-        <MudListExtended @ref="_startList" Class="@StartClassname" Style="@StartStylename" SearchBox="SearchBoxStart" OnDoubleClick="DoubleClick" T="T" ItemCollection="@StartCollection" Disabled="Disabled" Clickable="true" MultiSelection="@MultiSelection" SelectAll="@MultiSelection" MultiSelectionComponent="@MultiSelectionComponent" MaxItems="@MaxItems" Color="@Color" ToStringFunc="ToStringFunc">
+        <MudListExtended @ref="_startList" Padding="@Padding" Class="@StartClassname" Style="@StartStylename" SearchBox="SearchBoxStart" OnDoubleClick="DoubleClick" T="T" ItemCollection="@StartCollection" Disabled="Disabled" Clickable="true" MultiSelection="@MultiSelection" SelectAll="@MultiSelection" MultiSelectionComponent="@MultiSelectionComponent" MaxItems="@MaxItems" Color="@Color" ToStringFunc="ToStringFunc" Dense="@Dense">
             <SelectAllTemplate>
                 @if (SelectAllType == SelectAllType.SelectAllItem)
                 {
@@ -43,7 +43,7 @@
         {
             <MudListItemExtended T="string"><MudText>@EndTitle</MudText></MudListItemExtended>
         }
-        <MudListExtended @ref="_endList" Class="@EndClassname" Style="@EndStylename" SearchBox="SearchBoxEnd" OnDoubleClick="DoubleClick" T="T" ItemCollection="@EndCollection" Disabled="Disabled" Clickable="true" MultiSelection="@MultiSelection" SelectAll="@MultiSelection" MultiSelectionComponent="@MultiSelectionComponent" MaxItems="@MaxItems" Color="@Color" ToStringFunc="ToStringFunc">
+        <MudListExtended @ref="_endList" Padding="@Padding" Class="@EndClassname" Style="@EndStylename" SearchBox="SearchBoxEnd" OnDoubleClick="DoubleClick" T="T" ItemCollection="@EndCollection" Disabled="Disabled" Clickable="true" MultiSelection="@MultiSelection" SelectAll="@MultiSelection" MultiSelectionComponent="@MultiSelectionComponent" MaxItems="@MaxItems" Color="@Color" ToStringFunc="ToStringFunc" Dense="@Dense">
             <SelectAllTemplate>
                 @if (SelectAllType == SelectAllType.SelectAllItem)
                 {

CodeBeam.MudBlazor.Extensions/Components/TransferList/MudTransferList.razor.cs

@@ -119,11 +119,23 @@ public partial class MudTransferList<T> : MudComponentBase
         public string? EndTitle { get; set; }
 
         /// <summary>
-        /// 
+        /// If true, the transfer list will be displayed vertically. Useful for narrow spaces or mobile devices.
         /// </summary>
         [Parameter]
         public bool Vertical { get; set; }
 
+        /// <summary>
+        /// If true, adds top and bottom padding to the lists. Default is false.
+        /// </summary>
+        [Parameter]
+        public bool Padding { get; set; }
+
+        /// <summary>
+        ///
+        /// </summary>
+        [Parameter]
+        public bool Dense { get; set; }
+
         /// <summary>
         /// 
         /// </summary>
@@ -357,6 +369,7 @@ protected internal async Task TransferAll(bool startToEnd = true)
                 OrderItems();
                 await EndCollectionChanged.InvokeAsync(EndCollection);
                 await StartCollectionChanged.InvokeAsync(StartCollection);
+                _startList.SelectedValues = null;
             }
             else if (startToEnd == false)
             {
@@ -377,6 +390,7 @@ protected internal async Task TransferAll(bool startToEnd = true)
                 OrderItems();
                 await StartCollectionChanged.InvokeAsync(StartCollection);
                 await EndCollectionChanged.InvokeAsync(EndCollection);
+                _endList.SelectedValues = null;
             }
         }