How do I pre-populate the chips on a BitDropdown?

[artinzamani]

Hi everyone.

I have a created a component based on BitDropdown.

It is basically an input for assigning users to a role. The input is Virtualized and is set to show the items as Chips. The user can search the user repository using an ItemsProvider, and optionally add users to this input.

It works perfect when I'm creating a new role, which is to say when starting from an empty user list. The new items get added (or removed) without any problem.

However, when I try to open an existing role with existing users, the chips for the existing items doesn't show up in the input, even though they exist in the Values collection.

I took a look at the source code, and I'm guessing the problem is that the existing Values are not in the _selectedItems, but I found no way of externally adding existing items to that collection.

Here's the partial snippet of my component:

<BitDropdown @bind-Values="Users"
             Virtualize MultiSelect Chips Combo
             ShowSearchBox ShowClearButton
             ItemsProvider="SearchAsync"
             OnValuesChange="async() => await UsersChanged.InvokeAsync(Users)"
             TItem="BitDropdownItem<BiLdapUser>" TValue="BiLdapUser" />

@code {
    [Parameter]
    public IEnumerable<BiLdapUser> Users { get; set; } = [];
    [Parameter]
    public EventCallback<IEnumerable<BiLdapUser>> UsersChanged { get; set; }

    private bool IsValidQuery(string? queryTerm) =>
        !(string.IsNullOrWhiteSpace(queryTerm) || queryTerm.Trim().Length < 3);

    private async ValueTask<BitDropdownItemsProviderResult<BitDropdownItem<BiLdapUser>>> SearchAsync(
        BitDropdownItemsProviderRequest<BitDropdownItem<BiLdapUser>> request)
    {
        try
        {
            if (!IsValidQuery(request.Search))
            {
                return BitDropdownItemsProviderResult.From(new List<BitDropdownItem<BiLdapUser>>(), 0);
            }
            
            var people = await Ldap.QueryUserAsync(request.Search, searchBase: LdapBase.DkUsers);
            var items = 
                from p in people
                select new BitDropdownItem<BiLdapUser>
                    {
                        Text = $"{p.Name} | {p.Title}",
                        Value = p
                    };
            var itemList = items.ToList().AsReadOnly();
            return BitDropdownItemsProviderResult.From(itemList, itemList.Count);
        }
        catch
        {
            return BitDropdownItemsProviderResult.From(new List<BitDropdownItem<BiLdapUser>>(), 0);
        }
    }

Any ideas what I can do to fix this?

Any help would be greatly appreciated.

[msynk]

@artinzamani Thanks for contacting us.

I've reviewed the source code you provided and couldn't find anything wrong with it. Could you please create a working sample so I can review it further? A GitHub repo is the best format for these types of reviews.

[artinzamani]

@msynk Thanks to you for responding.

I have created a minimal repository showcasing the issue that I'm having.

I've initialized a BitDropdown with two sample values, but their chips don't appear in the list. The chips that are added interactively are ok though.

Here's the repo:
https://github.com/artinzamani/bitchips