Challenge Objectives

• As part of this challenge, you need to fix a bunch of issues in the settings page. See the Individual requirements for more details.

Project Background

We are in the process of migrating many of the legacy pages of our platform to the new Community App repo based on a newer technology stack and improve the overall user experience.

In this series of challenges, we are targeting to the public profile page and the profile settings page based on our new design (attached on the challenge forum, available on registration).

Technology Stack

• Node.js

• JavaScript

• React.js

Code Access

The work is to be done in the Community App repo, out of the latest commit in develop branch.

Individual requirements

1. Fix issue with saving the profile traits

Many users encounter issues while saving their basic info.

Some possible causes may be:

1. Sometimes the API returns 401/403 which may be due to an expired JWT. You need to investigate the current implementation, check if the JWT is not getting refreshed after expiration and fix it.

2. The basic_info trait object works as a “proxy” to the user’s basic information and the API creates an object on the fly even if there’s no basic_info trait in the database (example http://take.ms/7v09L). The issue is that the frontend is not properly identifying if the basic_info trait is a trait that exists in the database or if it was created “on the fly” thus it’s picking the wrong method (POST/PUT) to create/update the actual basic_info trait. You need to identify the root of this issue and fix it. You can experiment by deleting your basic_info trait using POSTMAN (DELETE https://api.topcoder-dev.com/v3/members/{handle}/traits?traitIds=basic_info)

If you find any other issue that may cause issues saving/updating the user traits, it needs to be fixed. Your submission must ensure that updating the user information through the settings page is robust and it’s not throwing any errors.

2. Track selection

The track selection toggles are not working. Clicking a track does nothing. This must be fixed.

3. Fix issue with missing styleName

At times, when a user goes to the settings page (/settings/profile), the page does not load and the error “Error: Could not resolve the styleName ‘hide’” is shown in the console log. You need to check all pages under the settings page and make sure this styleName is not missing anywhere.

4. Fix the following issue from Github

https://github.com/topcoder-platform/community-app/issues/1744

Important Notes

• You should follow the best practices established in the repository:

• We use this stand alone library: https://github.com/topcoder-platform/topcoder-react-lib for any actions/reducers/services of current ReactJS based app.

• As part of this challenge submission you also might need improve https://github.com/topcoder-platform/topcoder-react-lib for any actions/reducers/services updates

• Properly use Redux. Properly split code into reusable, self-contained React components, conveniently grouped inside folder structure;

• Do not violate ESLint rules for JS code, nor StyleLint rules for SCSS;

• Properly use babel-plugin-react-css-modules and / or react-css-themr for styling;

• Use SCSS variables and mixins from the global stylesheets (/src/styles/_tc-styles.scss). Especially, when it relates to colors, fonts, etc;

• Do not break existing unit tests.

• Etc.;

 

Should you have any doubts, do not hesitate to ask for clarifications in the challenge forum!

Submission deliverables

- Submit a git patch for the latest commit in the develop branch.

- Make sure to mention the exact commit so we can apply your patch file.

- The winner must create a PR against our repo.

Final Submission Guidelines

Please see above