Design for search in dialogue window to select Project
The "picking" control currently supports Projects, Shared with me, Public Favorites, and My Favorites, which are browsed in an expandable tree. As the number of projects becomes large, this has a few problems:
- Apparently it doesn't do paging, so if you have more than N projects (some number between 100 and 1000) it only shows the first N and the rest don't show up
- Project contents are probably sorted by last modified time on the project record, which doesn't really reflect recent activity
- "Shared with me" is unsorted / has an non-obvious sort order
- The control only shows about 10 lines of text at a time
The workaround reported by users is to "favorite" a project, so that it is possible to find, but this is awkward and requires additional steps.
Proposed solution: incorporate the top Search / Advanced Search into the picking control. This should be available for the dialog boxes used for picking projects, collections, and files or directories within collections.
When search is in effect, the content is limited to projects (and/or collections, when picking Files or Directories) that match the search. Projects and collections that are matched can be further expanded to navigate inside them.
For this this ticket, search/filtering should not extend to navigating/searching collections. Navigating collections should continue to use the existing expandable tree behavior.
#6 Updated by Peter Amstutz 4 months ago
From discussion Feb 9
- Existing dialog is unsuitable for browsing large projects and large collections
- Want to redesign the dialog around searching
- Use the two-panel concept from the collection file browser
- When search is active, search results go on the left panel, users can browse into projects or collections that were found by the search
Next step is to make some visual mockups of the new dialog
#7 Updated by Lucas Di Pentima 4 months ago
- File 02 Picker without search with selected project.png 02 Picker without search with selected project.png added
- File 01 Picker without search with selected category.png 01 Picker without search with selected category.png added
The picker would have 2 main modes: with or without an active search.
The attached mockups show how it would work without an active search: On the left hand side it would show the main categories, in a similar fashion as the wb2's left hand side panel tree. If the user selects something, the category may be added as part of the breadcrumbs.
Selectable items in both sides may need to have a "select" or "pick" button for the user to be able pick an item instead of navigating into it.
#8 Updated by Lucas Di Pentima 4 months ago
- File 04 Picker with search results and selected project.png 04 Picker with search results and selected project.png added
- File 03 Picker with search results.png 03 Picker with search results.png added
When the user submits a search term, the left hand side is populated with the search results.
The breadcrumbs "root element" could change to something like "Results >".
The way we show every item should be consistent on how we show them on the main advanced search, that is to say: if we're going to show full paths (#18549), we should show full paths here too (although it may not be convenient to do so in the breadcrumbs)
#9 Updated by Lucas Di Pentima 4 months ago
- File 06 Picker with search results and seamless collection browsing.png 06 Picker with search results and seamless collection browsing.png added
- File 05 Picker with search results and selected collection.png 05 Picker with search results and selected collection.png added
The picker dialog should allow seamless collection navigation: from a list of projects/collections, allowing the user to select a collection and see the files on the right hand side. Also, navigating deeper into the directory structure if needed.
Our file browser also implements a "Search" filtering feature on both sides, this may be needed here too.
#10 Updated by Lucas Di Pentima 4 months ago
The dialog could also be configurable in at least 2 dimensions:
- Number of selectable items (1 / multiple)
- The mockups were assuming the user needs to select 1 item, in the case of multiple selections, the "select/pick" button on every item could be changed to an "Add" button, and a list of selected items could be populated by the "Close" button with chips or similar graphical elements.
- Type of selectable items (project / collection+path / any)
- This would limit (or not) the types of elements to be listed in the dialog, the title could also reflect the configuration by indicating something like "Select a collection" for example.