Replace multi.js

[KarenKonou]

Describe the problem

multi.js is one of the last remaining jQuery based dependencies. Additionally, it has been unmaintained since 2020. Replacing it with a suitable alternative is therefore important both for security and maintainability reasons, and is also a required step in gradually moving away from jQuery.

However, I wasn't able to find a replacement library that would support the current multi-pane UI. Therefore, we will either have to reimplement the current UX ourselves, or the UX will have to be changed.

Solution brainstorm

One replacement options could be tom-select with the checkbox options plugin, enabling a searchable tag style UX. This could also be used for other things, such as license select or flags.

Describe alternatives you have considered

The alternative solution could be a lightweight in-house implementation of the current UX, similarly as we did for the date picker. Since we only need to implement the features that we need for Weblate, it might be relatively code-light.

Screenshots

No response

Additional context

Sub issue of #16042
Feedback and ideas welcome!

[nijel]

I don't think we necessarily need two panes here.

Checkbox options looks suitable. The only thing to verify is how it will work with many options (the project selection on Hosted Weblate will have 2000 entries) and many selected options.

Oh, and it has to work well in RTL. This has proven to be a pain point for many libraries before.

[KarenKonou]

Tom-select claims support for large datasets (their example shows 15000 entries) so that should be okay. I'll verify RTL.

[nijel]

The remove button plugin should be, IMHO, used as well as that avoids need to find entry to remove in the possibly huge list.