Redesign change user experience modal (#3077)

* created copy of current experience changing modal; still needs to be adjusted

* changed modal's title

* just started editing the layout

* added modal used only to modify the experience of a single user

* removed custom input component

* fixed rerender/update issues; added update method; moved main style into a less sheet

* added new less sheet used by experience changing modals

* added compontent to select a experience domain

* fixed linter setStatus errors; added entering new experiences functionality

* moved onClick methods out of the render method

* now a domain cant be entered more than once; the input for new domains is now fully clearable; added button next to input to clear it

* fixed flow errors; removed pagination and made table scrollable

* added check to not enter a domain with less than 3 chars; entries are now ordered but case-sensitive

* Added a new modal to modify experiences of multiple users; update functionality is still missing; fixed table displaying errors

* at reopening the entered changes will be cleared

* select_experience_domain now adapts to changes of alreadyUsedDomains;
added submit functionality to modal that changes the experience of multiple users and enabled negative input to add possibility of shared decrease in exp domains

* fixed flow errors

* completely replaced the old experience_modal_view

* updated snapshots

* added message displayed when selecting a not shared domain while editing mutiple users

* removed manually puls and minus buttons

* made the table in which the changes are entered a stateless functional component; added remove feature of entries to the multiple users edit table

* reworked update functionallity of multiple users modal

* after updating the user_list_view does not fetch again, instead it uses the returned promises

* added renamed files

* now using localeCompare to sort and case-insensitiv sort; removed scrollbar when unnecessary

* clicking on the experiences of a single user in the table also opens the single user experience editing modal

* updated snapshots

* changed height of tables in the modals

* updated changelog

* merged single_user_modal and experience_modal into the experience_modal

* deleted single_user_modal

* fixed flow errors

* tweak some styles, indicate icon clickability, hide scrollbars if there is no scroll

* moved ExperienceEditingTable into ExperienceModal

* integrated the ExperienceEditingTable -> still got errors

* small fixes, sending users works, adding does not

* renaming of state variables and fixed adding error when one users is selected

* modal now works for mulitples selected users

* deleted ExperienceEditingTable

* fixed flow errors

* fixed lint errors

* fixed visual errors

* fixed visual bug

* auto changes in yarn.lock made by server

* updated snapshots

* selecting 'only shared' changes just the shared entries

* fixed flow error

* refactored + requested changes; now saves deleted domains to really delete domains, they are also displayed to the user

* fixed typo

* sorting domains before sending to backend

* fixed revert changes issue

* fixed flow error

* enabled 0 as possible exp value; added row to display if domain is shared

* made sort before sending changes case-insensitive

* renaming

* slight refectoring

* added comments for clarification

* reworked comments and simplified expression

* replaced isShared with a number that represents the number of users that had this domain in beforehand

* column renaming and width adjustment

* removed option to only show shared domains and resolved a bug by doing so

* resolved flow and linter errors

* rename shared column to user-count and render counts as colorful tags with explaining tooltips

* fix typo

CHANGELOG.md

@@ -22,6 +22,7 @@ For upgrade instructions, please check the [migration guide](MIGRATIONS.md).
 
 ### Changed
 
+- The modal used to change the experience of users by admins got a rework. [#3077](https://github.com/scalableminds/webknossos/pull/3077) 
 - Renamed "Soma Clicking" to "Single-Node-Tree Mode". [#3141](https://github.com/scalableminds/webknossos/pull/3141/files)
 - The fallback segmentation layer attribute of volume tracings is now persisted to NML/ZIP files. Upon re-upload, only volume tracings with this attribute will show a fallback layer. Use `tools/volumeAddFallbackLayer.py` to add this attribute to existing volume tracings. [#3088](https://github.com/scalableminds/webknossos/pull/3088)
 - When splitting a tree, the split part that contains the initial node will now keep the original tree name and id. [#3145](https://github.com/scalableminds/webknossos/pull/3145)

app/assets/javascripts/admin/admin_rest_api.js

@@ -42,6 +42,7 @@ import type {
   ServerSkeletonTracingType,
   ServerVolumeTracingType,
   APIAnnotationTypeCompact,
+  ExperienceDomainListType,
 } from "admin/api_flow_types";
 import { APITracingTypeEnum } from "admin/api_flow_types";
 import type { QueryObjectType } from "admin/task/task_search_form";
@@ -814,3 +815,8 @@ export function getFeatureToggles(): Promise<APIFeatureToggles> {
 export function getOperatorData(): Promise<string> {
   return Request.receiveJSON("/api/operatorData");
 }
+
+// ## Experience Domains
+export function getExistingExperienceDomains(): Promise<ExperienceDomainListType> {
+  return Request.receiveJSON("/api/tasks/experienceDomains");
+}

app/assets/javascripts/admin/api_flow_types.js

@@ -109,6 +109,8 @@ export type APITeamMembershipType = {
 
 export type ExperienceMapType = { +[string]: number };
 
+export type ExperienceDomainListType = Array<string>;
+
 export type APIUserBaseType = {
   +email: string,
   +firstName: string,