Building Large Lists

[MatthewThornton]

What is the Fluent UI design pattern for building large lists?

We currently use a combination of a multi-select and dual-listbox.
https://jakezatecky.github.io/react-dual-listbox/

Dual List Box

Multi-Select
This doesn't work very well with large lists.

``

An example use case.
The user wants to select every county in Texas except Travis County. There are 255 counties in Texas. Using a combox becomes difficult because There are so many selected items. Currently we solve that problem using a 'dual-listbox' which is type of list builder.

How would Fluent UI solve this problem? What's the correct design pattern?

[logicaloud]

Maybe the DataGrid with selection would work on the right (https://react.fluentui.dev/?path=/docs/components-datagrid--default) and you could keep the list on the left to show the selected items more concisely.

[MatthewThornton]

I wasn't necessarily asking if Fluent had a component similar to what I showed. I was more curious about how Fluent solves this type of problem. How would I construct large lists in Fluent? Would I use the DataGrid? Is it common practice to use the DataGrid as part of a form?