The admin dashboard for SUSI.AI is implemented in the susi accounts to access various admin features like list all users registered on SUSI and change user roles of other users. In this post we will discuss about the client side implementation of listing registered users and changing their user roles.
Show admin services
The admin dashboard of SUSI.AI should be accessible only to users with admin access therefore whenever a user tries to open the admin page, a request is send to the susi server at endpoint:
This api call is send to server with one parameter i.e the access_token on the user. This is used to verify whether the user has the permission to view the admin services or not. If the user fails to get access to admin services then they are redirected to the Error 404 page with the message ‘page not found’. If the response from the server is positive then user is redirected to the admin page.
List All registered Users
The users tab on the admin dashboard has a table which consists of information regarding the registered users. The tab contains eight columns:
- Serial Number – Displays the serial number of the user
- Email Id – Displays the email Id of the user
- Activation status – Displays the status whether user is activated or not
- Signup – Displays the time when the user signed up for susi
- Last login – Displays when the user last loggedIn
- IP of last login – Displays the IP address used for last login
- User Role – This displays the current user role of the user
- Action – This column was the option to edit user role of the corresponding user
When the user with admin access opens the users tab, another api call is made to showAdminService.json to re-authenticate the user and if the response is positive then a call is made to list all users at the endpoint
to get the total number of users registered to SUSI this call is made with two parameters, access_token and getUserCount . The getUserCount parameter is a boolean type and we set its value true to get the total number of registered users. This is used to set the pagination parameters in the users table. If this call is successful then we call the this.fetch() function which makes the final call to fetch the user data from the server using
This call differs with the previous call with a parameter which is the page parameter. This parameter gives us the data of 50 users on the current page number.
Change User Role
SUSI admin dashboard provides us an option to change the user roles of its users. Users with admin or higher roles can change roles of other users. Currently SUSI has seven user roles. These are
To change user roles of any user, admins needs to click on the edit option in the actions column corresponding to the user. After that they receive a dialog box with the id of the user and a drop-down menu to select new user role.
When they click on the change button an api call is made to the endpoint
This request takes in three parameters:
The user parameter takes in the email of the user an its input and role parameter takes the value to the new role which we want to assign to this user. It also requires the acces token to verify the admin status again as a safety parameter. When the request is successful and the server gives us a positive response then a success message as shown below appears.
- Ajax and APIs – https://reactjs.org/docs/faq-ajax.html
- prop types – https://www.npmjs.com/package/prop-types
- showAdminService – https://github.com/fossasia/susi_server/blob/ed5c209b2600340b726f6e0a1f2e62c56c37c281/src/ai/susi/server/api/aaa/ChangeUserRoles.java
- getUsers – https://github.com/fossasia/susi_server/blob/6d6be528da7f3aa3859c99e272a64dd5a8e01400/src/ai/susi/server/api/aaa/GetUsers.java