Topcoder Connect - Update Invite Endpoints

Update client-side code to use updated invite endpoints.

Project Background

Topcode Connect is a client-facing application of Topcoder. We have the functionality to invite members to the projects. Projects have two kinds of members: "Customer Team" members which can be invited by "handle" or "email" and "Topcoder Team" members which can be only invited by "handle", see screenshot. 

In a recent challenge, we updated invite related API endpoints to follow RESTfull standards so the format of endpoints has changed. Additionally, to protect user data we implemented masking emails in user invitations for non-admin users which affects some functionality.

Technology Stack

• React

• Redux

• CSS Modules

Code access

The work for this challenge has to be done in one repository:

- Connect App repo https://github.com/appirio-tech/connect-app branch `feature/restful-invites-and-masked-email` commit `6e1000c14c64121ea3e88c5b225ef35b05a8f5ac` or later.

- Demo users are provided on the forum.

- To work on this challenge you would have to set up locally Topcoder Project Service - the main backend service of the Connect App as we don't have a new implementation of invite API deployed online. Use repository https://github.com/topcoder-platform/tc-project-service branch "feature/restful-invites". Follow the "Local Development" guide using "Full" docker-compose file, after that "Import sample metadata projects" and follow steps to "Run Connect App with Project Service locally".

- Note, that the local setup of Topcoder Project Service is supported on macOS and Linux at the moment, but Windows is not supported.

- When your local setup is finished, create a new project locally for testing using the next link. Don't use projects created during importing data, as they might have broken data.

Individual requirements

The main task is to update invite API endpoints and all related code to use updated invite endpoints as described in server-side challenge (please refer to this server-side challenge spec for details). Also, you may use a swagger file before the changes and after changes. The main things that changed:

• All the invite endpoints changed their URL base to "/v5/projects/:projectId(\\d+)/invites".

• At the moment, when we invite a user by "handle" the client-side is calling Member Service to get "userId" by "handle" to call the CREATE invite endpoint using "userId". New CREATE invite endpoint accepts "handles" instead of "userIds" so we shouldn't call Member Service anymore, and should send the request to CREATE invite directly with "handles".
  - when we are sending invite we validate that entered "handle" is not yet invited or already a member, make sure that this logic works correctly after we are using handles instead of userIds for invites
  - also note, that new CREATE endpoint returns failed invites with "handle" instead of "userId", so make sure that error messages from the server are displayed correctly

• At the moment to "remove" invite, we are calling UPDATE invite endpoint and change the status to "canceled", see screenshot. Instead of this to "remove" invite, we should call a new DELETE invite endpoint "DELETE /v5/projects/:projectId/invites/:inviteId" (this endpoint has been implemented in another server-side challenge).

• Updated, please ignore this: For the members of the "Topcoder Team", we can change the role of the members, see screenshot. This uses UPDATE invite endpoint which format has been changed: to find an invite to update instead of using `userId` or `email` from the body now it uses invite id from the URL "PATCH /v5/projects/:projectId/invites/:inviteId". Also, now we use "PACH" instead of "PUT".

• When we load any project details page, we are sending a request to check if the user has been invited to the project or no, and if so, we are showing invite confirm dialog, see screenshot. Before we use the endpoint to get a single invite for the current user. As this endpoint now requires to specify "inviteId" in the URL which we don't know in this situation, we should use another endpoint to get the list of invites for the project: "GET /v5/projects/:projectId/invites/". This endpoint would return all invites which the user is allowed to see. We should check if this endpoint returns an invitation in 'pending' status for the current user or no. If so, we are showing this invitation confirmation dialog as we do now.

• We have several places where user can accept or decline invite:
  - project listing page, see grid view screenshot and card view screenshot
  - project details page confirmation dialog, see screenshot
  - using special URLs for automatic invite accept/decline: `https://connect.topcoder-dev.com/projects/8868?invitation=accept` and `https://connect.topcoder-dev.com/projects/8868?invitation=decline`
  In all these cases we should update code to use the new format of the UPDATE invite endpoint to accept or decline the invitation (the endpoint is already described above, see "PATCH /v5/projects/:projectId/invites/:inviteId")

If there are some other places where invite endpoints are being used, they also have to be updated with relative code accordingly.

Deployment guide and validation document

Create a validation document that would show:
- how to setup the project locally (we provide some short guide above, but make sure it's enough or add any details)
- how to validate that invite functionality which might be affected by the changes works well after the changes in this challenge

In particular, include the next validation scenarios but also add other scenarios that are missing here but are necessary to validate the invitation functionality.
In "Customer Team":
- invite several users by emails or mixing emails and handles or by handles (all failed, all succeeded, some failed and some succeeded)
Show that possible errors are shown correctly:
- error inviting already invited users of Customer Team or Topcoder Team (by email and by the handle)
- error inviting users who are already members of Customer Team or Topcoder Team (by email and by the handle)

In "Topcoder Team":
- inviting several users as Manager (all failed, all succeeded, some failed and some succeeded)
- using Manage user invite a Copilot user and after login with Copilot Manager user and accept or decline copilot invitation request
Show that possible errors are shown correctly:
- error inviting already invited users of Customer Team or Topcoder Team
- error inviting users who are already members of Customer Team or Topcoder Team
- error inviting non-Manager user as a Manager

Note, that users who have been invited successfully are removed from the input, but users who are failed to be invited stay in the input field.

A comprehensive validation document is a major requirement in this challenge.

General requirements

• You might be asked to fix small existent issues server-side or client-side if such appear, in case they block implementing or validating the requirements in this challenge.

• User React and Redux best practices.

• Avoid using multilevel nesting in SCSS. As we use CSS Modules we don’t have to add prefixes or nest class selectors.

• Don’t use `:global` in CSS Modules unless you have to change some global styles. New styles shouldn’t use `:global`.

• Lint should pass

• Existent unit tests should pass

If you have any questions or concerns, feel free to raise a question on the forum.

Final Submission Guidelines

Submit a zip file which would include:

• Git patch with changes you’ve made to the code in our repository.

• Validation document in any common textual format.

Additionally, the winner would be required to raise a pull request to the repository after the challenge is completed.