Migrate away from select2 in Import project > Namespace selector
The Import project feature leverages a couple select2 instances to let users select the namespace they want to import projects in:
| Import type | header |
|---|---|
| GitLab export | ![]() |
| Manifest file import | ![]() |
Those selectors support client-side filtering when there are 10 or more namespaces to show. They also support grouping (Groups and Users).
As part of this issue, we'd like to migrate away from select2 in favor of a better integrated, Pajamas-compliant component. The filtering and grouping capabilities should probably be preserved. We should also consider supporting server-side filtering as client-side filtering doesn't scale well, but that could be deferred to a follow-up.
The MVC iteration could be to leverage GlDropdown or GlListbox (the latter was recently updated to support groups and will soon support filtering). It would be great to consolidate this into a reusable component.
Implementation plan
-
Create a wrapper around GlDropdownorGlListboxto initialize the namespace selector on.js-select-namespace. -
app/views/import/shared/_new_project_form.html.haml-
Remove .select2class.
-
-
app/views/import/manifest/_form.html.haml-
Remove .select2class.
-
-
app/assets/javascripts/projects/project_visibility.js-
This script seems to have something to do with the select2namespace selectors we are dealing with here, but it's only called from the New project, which doesn't useselect2anymore. As part of this issue, let's confirm whether or not this is still needed.-
If it is, we'll want to backport the functionality (consider creating a follow-up for this). -
If it's not, delete the file and cleanup app/assets/javascripts/pages/projects/new/index.js.
-
-

