[Bug]: TransferList

[Valerio81]

Blazorise Version

1.5.0

What Blazorise provider are you running on?

None

Link to minimal reproduction or a simple code snippet

`
<TransferList TItem="Models.Users.Group"
Items="@_groups"
SelectionMode="ListGroupSelectionMode.Single"
Mode="ListGroupMode.Selectable"
Scrollable=false
ShowMoveAll=false
TextField="item => item.Name"
ValueField="item => item.Id"
@bind-ItemsStart="@_startList"
@bind-ItemsEnd="@_user.Groups">

@code {
private Models.Users.User? _user;
private List<Models.Users.Group> _groups;
private List<Models.Users.Group> _startList = new List<Models.Users.Group>();

protected override async Task OnInitializedAsync()
{
    _groups = await UserService.GetGroups();
    await base.OnInitializedAsync();
}

protected override async Task OnParametersSetAsync()
{
    await Load();
    await base.OnParametersSetAsync();
}

private async Task Load()
{
    if (string.IsNullOrWhiteSpace(this.Id) == false)
    {
        _user = await UserService.GetUserDetails(this.Id);

        if (_user?.Groups != null)
        {
            _startList = _groups.Where(x => (_user.Groups.Select(y => y.Id)).Contains(x.Id) == false).ToList();
        }
    }
}

}
`

Steps to reproduce

If I open the page, the problem appears.
If i modify the page and use the "hot reload", the problem disappears.

What is expected?

Expected is: 0 elements on _startList, 2 elements on _user.groups and 2 elements in _groups with the left column empty on TransferList

What is actually happening?

Actually if I have 2 elements in _user.groups list with _startList empty, left column of TransferList have all elements

What browsers do you see the problem on?

Chrome, Microsoft Edge

Any additional comments?

No response

[David-Moreira]

Hello @Valerio81
Sorry, but it's hard to folllow your example since we cannot see what the actual data is, could you provide the example with static data and what you would expect to happen to both the Start and End Lists? Thanks!

It is of note that the TransferList should try to allocate all the items provided.
So for example if you have:
A set of 10 Items, and only set 2 items to the start list.
The TransferList will allocate the remaining 8 items to the end list.

[Valerio81]

Hi,
this is the code with static data.

page.razor.txt

The expected is

Left Column | | Right Column

                |  >  | Group 1
                |  <  | Group 2

At the moment the result is

Left Column | | Right Column

Group 1 | > | Group 1
Group 2 | < | Group 2

[Valerio81]

I have just found a temporary workaround:

if(_startList.Count == 0) { _startList.Add(new Models.Users.Group { Id = "", Name = "" }); }

Is not the best solution (i add an empty item) but at the moment the UI give me the expected solution.

[David-Moreira]

Hello @Valerio81

There's two problems here:

• A problem with Blazorise where we incorrectly call ItemsStartChanged with the ItemsEnd.
• You provide different object references for the User Groups and the Groups that are bound to the Items collection, this means that the TransferList will think that these are all different objects (even though the data is the same)

We'll be fixing the issue on our side.