Merge pull request #6708 from topcoder-platform/PROD-2993

Prod 2993

Author: luizrrodrigues

__tests__/shared/components/challenge-listing/Filters/__snapshots__/FiltersPanel.jsx.snap

@@ -66,7 +66,10 @@ exports[`Matches shallow shapshot 2`] = `
           disabled={false}
           expanding={false}
           isAuth={false}
+          isReviewer={false}
+          loading={true}
           past={false}
+          reviewCount={0}
         />
       </div>
     </div>

__tests__/shared/components/challenge-listing/Sidebar/__snapshots__/index.jsx.snap

@@ -13,7 +13,9 @@ exports[`Matches shallow shapshot 1`] = `
       disabled={false}
       expanding={false}
       isAuth={false}
+      loading={true}
       past={false}
+      reviewCount={0}
       selectBucket={[MockFunction]}
     />
   </div>
@@ -36,7 +38,9 @@ exports[`Matches shallow shapshot 2`] = `
       disabled={false}
       expanding={false}
       isAuth={false}
+      loading={true}
       past={false}
+      reviewCount={0}
       selectBucket={[MockFunction]}
     />
   </div>

__tests__/shared/components/challenge-listing/__snapshots__/index.jsx.snap

@@ -29,6 +29,7 @@ exports[`Matches shallow shapshot 1 shapshot 1 1`] = `
     >
       <Connect(SidebarContainer)
         expanding={false}
+        reviewCount={0}
         setFilterState={[MockFunction]}
       />
       <Connect(Container)
@@ -99,6 +100,7 @@ exports[`Matches shallow shapshot 2 shapshot 2 1`] = `
     >
       <Connect(SidebarContainer)
         expanding={false}
+        reviewCount={0}
         setFilterState={[MockFunction]}
       />
       <Connect(Container)

automated-smoke-test/page-objects/pages/topcoder/challenge-listing/challenge-listing.helper.ts

@@ -724,7 +724,7 @@ export class ChallengeListingPageHelper {
   static async verifyOpenForReviewChallengesOnly() {
     await this.waitForSubCommunity();
     const openForReviewLink = await ChallengeListingPageObject.filterChallengesBy(
-      'Open for review'
+      'Review Opportunities'
     );
     await openForReviewLink.click();
     await this.waitForLoadingNewChallengeList();
@@ -799,11 +799,11 @@ export class ChallengeListingPageHelper {
     expect(headers.length).toBe(0);
 
     const openForReviewLink = await ChallengeListingPageObject.filterChallengesBy(
-      'Open for review'
+      'Review Opportunities'
     );
     await openForReviewLink.click();
 
-    await this.waitTillOnlyOneHeaderPresentWithText('Open for review');
+    await this.waitTillOnlyOneHeaderPresentWithText('Review Opportunities');
     await CommonHelper.waitUntilVisibilityOf(
       () =>
         CommonHelper.findElementByText(

src/shared/components/challenge-listing/Filters/FiltersPanel/index.jsx

@@ -31,6 +31,7 @@ import Tooltip from 'components/Tooltip';
 import { config, Link } from 'topcoder-react-utils';
 import { COMPOSE, PRIORITY } from 'react-css-super-themr';
 import { REVIEW_OPPORTUNITY_TYPES } from 'utils/tc';
+import { isReviewerOrAdmin } from 'utils/challenge-listing/helper';
 import { isFilterEmpty, isPastBucket, BUCKETS } from 'utils/challenge-listing/buckets';
 import SwitchWithLabel from 'components/SwitchWithLabel';
 import ChallengeSearchBar from 'containers/challenge-listing/ChallengeSearchBar';
@@ -71,6 +72,7 @@ export default function FiltersPanel({
   setExpanded,
   setSort,
   selectBucket,
+  reviewCount,
 }) {
   if (hidden && !expanded) {
     return (
@@ -382,8 +384,10 @@ export default function FiltersPanel({
               disabled={disabled}
               expanding={expanding}
               isAuth={isAuth}
+              isReviewer={isReviewerOrAdmin(auth)}
               selectBucket={selectBucket}
               past={past}
+              reviewCount={reviewCount}
             />
           </div>
         </div>
@@ -757,6 +761,7 @@ FiltersPanel.defaultProps = {
   onClose: _.noop,
   expanding: false,
   disabled: false,
+  reviewCount: 0,
 };
 
 FiltersPanel.propTypes = {
@@ -787,4 +792,5 @@ FiltersPanel.propTypes = {
   selectBucket: PT.func.isRequired,
   expanding: PT.bool,
   disabled: PT.bool,
+  reviewCount: PT.number,
 };

src/shared/components/challenge-listing/Listing/ReviewOpportunityBucket/index.jsx

@@ -84,7 +84,7 @@ export default function ReviewOpportunityBucket({
         filteredOpportunities
           ? filteredOpportunities.length > 0 && (
             <SortingSelectBar
-              title="Open for review"
+              title="Review Opportunities"
               options={
                 BUCKET_DATA[bucket].sorts.map(item => ({
                   label: Sort[item].name,
@@ -100,7 +100,7 @@ export default function ReviewOpportunityBucket({
           )
           : (
             <SortingSelectBar
-              title="Open for review"
+              title="Review Opportunities"
               onSelect={setSort}
               options={
                 BUCKET_DATA[bucket].sorts.map(item => ({

src/shared/components/challenge-listing/Listing/index.jsx

@@ -15,6 +15,7 @@ import Bucket from './Bucket';
 import ReviewOpportunityBucket from './ReviewOpportunityBucket';
 import CardPlaceholder from '../placeholders/ChallengeCard';
 import './style.scss';
+import { isReviewerOrAdmin } from '../../../utils/challenge-listing/helper';
 
 // const Filter = challengeUtils.filter;
 const LOADING_MESSAGE = 'Loading Challenges';
@@ -146,25 +147,33 @@ function Listing({
        * and are only shown when explicitly chosen from the sidebar */
       isReviewOpportunitiesBucket(bucket)
         ? (
-          <ReviewOpportunityBucket
-            // bucket={buckets[bucket]}
-            bucket={bucket}
-            challengesUrl={challengesUrl}
-            expandedTags={expandedTags}
-            expandTag={expandTag}
-            filterState={filterState}
-            keepPlaceholders={keepPastPlaceholders}
-            needLoad={needLoad}
-            loading={loadingReviewOpportunities}
-            loadMore={loadMoreReviewOpportunities}
-            opportunities={reviewOpportunities}
-            setFilterState={setFilterState}
-            setSort={sort => setSort(bucket, sort)}
-            sort={sorts[bucket]}
-            challengeTypes={challengeTypes}
-            isLoggedIn={isLoggedIn}
-            setSearchText={setSearchText}
-          />
+          <React.Fragment>
+            {
+              isReviewerOrAdmin(auth) ? (
+                <ReviewOpportunityBucket
+                  // bucket={buckets[bucket]}
+                  bucket={bucket}
+                  challengesUrl={challengesUrl}
+                  expandedTags={expandedTags}
+                  expandTag={expandTag}
+                  filterState={filterState}
+                  keepPlaceholders={keepPastPlaceholders}
+                  needLoad={needLoad}
+                  loading={loadingReviewOpportunities}
+                  loadMore={loadMoreReviewOpportunities}
+                  opportunities={reviewOpportunities}
+                  setFilterState={setFilterState}
+                  setSort={sort => setSort(bucket, sort)}
+                  sort={sorts[bucket]}
+                  challengeTypes={challengeTypes}
+                  isLoggedIn={isLoggedIn}
+                  setSearchText={setSearchText}
+                />
+              ) : (
+                <div styleName="no-results">You have no access to review page.</div>
+              )
+            }
+          </React.Fragment>
         )
         : (
           <Bucket

src/shared/components/challenge-listing/Sidebar/BucketSelector/Bucket/index.jsx

@@ -18,8 +18,10 @@ function Bucket({
   // challenges,
   disabled,
   onClick,
+  reviewCount,
   // allActiveChallengesLoaded,
   meta,
+  loading,
 }) {
   // let countEl;
   // if (!disabled) { // !bucket.hideCount &&
@@ -51,6 +53,9 @@ function Bucket({
     case BUCKETS.MY_PAST:
       count = meta.myPastChallengesCount;
       break;
+    case BUCKETS.REVIEW_OPPORTUNITIES:
+      count = reviewCount;
+      break;
     default:
   }
   // }
@@ -90,7 +95,8 @@ function Bucket({
         }}
       />
       <span styleName="bucketName">{BUCKET_DATA[bucket].name}</span>
-      {(bucket !== BUCKETS.ALL && count > 0) ? <span styleName="count">{count}</span> : null}
+      {(bucket !== BUCKETS.ALL && bucket !== BUCKETS.REVIEW_OPPORTUNITIES && count > 0 && !loading) ? <span styleName="count">{count}</span> : null}
+      {(bucket === BUCKETS.REVIEW_OPPORTUNITIES && count > 0) ? <span styleName="count">{count}</span> : null}
     </div>
   );
 }
@@ -100,6 +106,8 @@ Bucket.defaultProps = {
   disabled: false,
   onClick: _.noop,
   meta: {},
+  reviewCount: 0,
+  loading: true,
 };
 
 Bucket.propTypes = {
@@ -116,6 +124,8 @@ Bucket.propTypes = {
   onClick: PT.func,
   meta: PT.shape(),
   // allActiveChallengesLoaded: PT.bool.isRequired,
+  loading: PT.bool,
+  reviewCount: PT.number,
 };
 
 const mapStateToProps = (state) => {

src/shared/components/challenge-listing/Sidebar/BucketSelector/Bucket/style.scss

@@ -52,7 +52,7 @@
 
     font-weight: 400;
     font-size: 16px;
-    line-height: 24px;
+    line-height: 26px;
     color: $tco-black;
     margin-left: 5px;
   }
@@ -74,7 +74,7 @@
     text-align: center;
     padding: 0 8px;
     margin-left: 8px;
-    margin-bottom: 5px;
+    margin-bottom: 8px;
   }
 }
 

src/shared/components/challenge-listing/Sidebar/BucketSelector/index.jsx

@@ -7,6 +7,7 @@
 import PT from 'prop-types';
 import React from 'react';
 import { BUCKETS } from 'utils/challenge-listing/buckets';
+import { isReviewerOrAdmin } from 'utils/challenge-listing/helper';
 // import { challenge as challengeUtils } from 'topcoder-react-lib';
 
 import Bucket from './Bucket';
@@ -29,11 +30,15 @@ export default function BucketSelector({
   // extraBucket,
   // filterState,
   isAuth,
+  // isReviewer,
   // savedFilters,
   selectBucket,
   // selectSavedFilter,
   // setEditSavedFiltersMode,
   past,
+  auth,
+  reviewCount,
+  loading,
 }) {
   // let filteredChallenges = challenges.filter(Filter.getFilterFunction(filterState));
 
@@ -49,6 +54,7 @@ export default function BucketSelector({
       <Bucket
         active={!disabled && isActive}
         bucket={bucket}
+        reviewCount={reviewCount}
         // challenges={challenges}
         disabled={disabled}
         onClick={() => {
@@ -57,6 +63,7 @@ export default function BucketSelector({
           document.body.scrollTop = 0;
           document.documentElement.scrollTop = 0;
         }}
+        loading={loading}
       />
     );
   };
@@ -89,7 +96,7 @@ export default function BucketSelector({
         {getBucket(BUCKETS.OPEN_FOR_REGISTRATION)}
         {/* DISABLED: Until api receive fix community-app#5073 */}
         {/* {getBucket(BUCKETS.ONGOING)} */}
-        {getBucket(BUCKETS.REVIEW_OPPORTUNITIES)}
+        {isReviewerOrAdmin(auth) ? getBucket(BUCKETS.REVIEW_OPPORTUNITIES) : null}
         {/* {getBucket(BUCKETS.PAST)} */}
         {/* NOTE: We do not show upcoming challenges for now, for various reasons,
           * more political than technical ;)
@@ -140,11 +147,19 @@ BucketSelector.defaultProps = {
   disabled: false,
   // extraBucket: null,
   isAuth: false,
+  // isReviewer: false,
   expanding: false,
   past: false,
+  reviewCount: 0,
+  loading: true,
 };
 
 BucketSelector.propTypes = {
+  auth: PT.shape({
+    profile: PT.shape(),
+    tokenV3: PT.string,
+    user: PT.shape(),
+  }).isRequired,
   activeBucket: PT.string.isRequired,
   expanding: PT.bool,
   // activeSavedFilter: PT.number.isRequired,
@@ -156,9 +171,12 @@ BucketSelector.propTypes = {
   // extraBucket: PT.string,
   // filterState: PT.shape().isRequired,
   isAuth: PT.bool,
+  // isReviewer: PT.bool,
   // savedFilters: PT.arrayOf(PT.shape()).isRequired,
   selectBucket: PT.func.isRequired,
+  reviewCount: PT.number,
   // selectSavedFilter: PT.func.isRequired,
   // setEditSavedFiltersMode: PT.func.isRequired,
   past: PT.bool,
+  loading: PT.bool,
 };