[BUM] Add filters side panel

[AlexVelezLl]

Summary

• Implements new users filters side panel.
• Creates a new useUsersFilters composable to encapsulate the app, route query and backend representations of the users filters.
• Adds backend support to filter by multiple user types, classes, and birth year ranges.
• Moves SelectableList component to be in the facility/.../common folder.

Screencast

Screencast.from.31-07-25.14.18.27.webm

References

Closes #13522.

Reviewer guidance

• Go to facility > users page and/or to the facility > users > new users page.
• Open the filter side panel by clicking on the filters button.
• Play applying, changing, removing filters, and check that the users table is correcly updated.

[github-actions]

Build Artifacts

Asset type	Download link
PEX file	kolibri-0.19.0a0.dev0_git.179.g78944bf3.pex
Windows Installer (EXE)	kolibri-0.19.0a0.dev0+git.179.g78944bf3-windows-setup-unsigned.exe
Debian Package	kolibri_0.19.0a0.dev0+git.179.g78944bf3-0ubuntu1_all.deb
Mac Installer (DMG)	kolibri-0.19.0a0.dev0+git.179.g78944bf3.dmg
Android Package (APK)	kolibri-0.19.0a0.dev0+git.179.g78944bf3-0.1.5-debug.apk
Raspberry Pi Image	kolibri-pi-image-0.19.0a0.dev0+git.179.g78944bf3.zip
TAR file	kolibri-0.19.0a0.dev0+git.179.g78944bf3.tar.gz
WHL file	kolibri-0.19.0a0.dev0+git.179.g78944bf3-py2.py3-none-any.whl

[AlexVelezLl]

Im proposing adding a new filter related_to to check not just the membership of the user to a collection, but also if the user is assigned to that collection via user role. So when we filter by a class, we dont only get the students, but also the assigned coaches

[AlexVelezLl]

I am not sure if there is a better way to exclude the users that have these values in the filter

[pcenov]

Hi @AlexVelezLl here's a list with minor issues observed while testing (as always these can be filed as follow-ups if out of scope for this PR):

1. The classes in the 'Class' filter are not sorted alphabetically:

2. Perhaps it should be further discussed what should happen when the filters by 'All users' and 'All classes' are selected, as currently when I reopen the filter these are no longer selected which can be confusing in some scenarios:

all.filters.selected.mp4

3. If I have applied the filter by 'Birth year' and I clear the filters, then I should be seeing all available users (the filters should be reset) while currently this is not working properly and I have to manually refresh the page:

filter.by.b.mp4

4. If I have copied and pasted the following link in a new browser window http://127.0.0.1:8080/en/facility/#/users/filter then when I close the filter or click outside of the filter panel I am seeing a blank page instead of being at http://127.0.0.1:8080/en/facility/#/users/

navigation.to.the.users.page.mp4

[AlexVelezLl]

Thanks @pcenov! I've just pushed some changes that should fix all your comments! :)

@nucleogenesis @LianaHarris360 I am introducing the usePreviousRoute composable in this commit as its the more robust way I found to manage the go back actions in these side panels that can have multiple back routes (e.g. the index users page, the new users, the trash page) 2e5f031. If this looks fine, we can replicate this back behavior on other side panels to to prevent the point 4 of Peter's comment.

[pcenov]

Great @AlexVelezLl - all comments are addressed, LGTM!

[nucleogenesis]

@AlexVelezLl great call commonizing the usePreviousRoute composable - should be good to merge then