Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Migrate the checkbox in users-list-code #3561

Angamanga opened this issue Jun 12, 2019 · 1 comment


3 participants
Copy link

commented Jun 12, 2019

In the userlist, there is a checkbox that has quite complex functionality. In order to migrate tis, we need to look into what happens in when the checkbox is marked. When one or many users are checked, a toolbar appears above the list. Here you can select actions like changing role and delete users as well as select and deselect the users.

The code for the html of this box is found in users.html, line 81 - 106. In this issue, we will only move the appearance of the toolbar, not the functionality or visibility.


  • Add a new component for the "listing-toolbar" in the react-folder
  • Add the html with the same classes as in the angular-code
  • Use the new component to the UserListContainer, but add it above the rest of the list this time, to get the correct structure of the html (the code-structure follows the UI-structure)
  • Commit regularly and create a pr when finished!


  • "selected-set" on row 81 is part of the functionality and you don't need to care about that in this step, just skip it in the html
  • Same goes for the attributes that are called something with dropdown and data-toggle, just leave them out for now
  • on line 92 there is a ng-repeat, this parts loops through the roles that are fetched from the backend. Instead of ng-repeat, you can use the map function in the jsx. Also, for now, you can hardcode a few roles as a prop when using the component, so you don't need to fetch them from the backend (we'll do that in the next issue).

Good luck 🎉 !!

@Angamanga Angamanga created this issue from a note in JS-migration (Current week) Jun 12, 2019


This comment has been minimized.

Copy link

commented Jun 13, 2019

@Angamanga Please review my pull request that I submitted for this issue :)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.