fix: review opp only for reviewers

Author: dedywahyudi

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

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

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

@@ -13,6 +13,7 @@ exports[`Matches shallow shapshot 1`] = `
       disabled={false}
       expanding={false}
       isAuth={false}
+      isReviewer={false}
       past={false}
       selectBucket={[MockFunction]}
     />
@@ -36,6 +37,7 @@ exports[`Matches shallow shapshot 2`] = `
       disabled={false}
       expanding={false}
       isAuth={false}
+      isReviewer={false}
       past={false}
       selectBucket={[MockFunction]}
     />

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';
@@ -382,6 +383,7 @@ export default function FiltersPanel({
               disabled={disabled}
               expanding={expanding}
               isAuth={isAuth}
+              isReviewer={isReviewerOrAdmin(auth)}
               selectBucket={selectBucket}
               past={past}
             />

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/index.jsx

@@ -29,6 +29,7 @@ export default function BucketSelector({
   // extraBucket,
   // filterState,
   isAuth,
+  isReviewer,
   // savedFilters,
   selectBucket,
   // selectSavedFilter,
@@ -89,7 +90,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)}
+        {isReviewer ? 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,6 +141,7 @@ BucketSelector.defaultProps = {
   disabled: false,
   // extraBucket: null,
   isAuth: false,
+  isReviewer: false,
   expanding: false,
   past: false,
 };
@@ -156,6 +158,7 @@ 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,
   // selectSavedFilter: PT.func.isRequired,

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

@@ -17,6 +17,7 @@
 
 import React from 'react';
 import PT from 'prop-types';
+import { isReviewerOrAdmin } from 'utils/challenge-listing/helper';
 // import _ from 'lodash';
 import { isPastBucket } from 'utils/challenge-listing/buckets';
 import ChallengeSearchBar from 'containers/challenge-listing/ChallengeSearchBar';
@@ -42,6 +43,7 @@ export default function SideBarFilters({
   // extraBucket,
   // filterState,
   // hideTcLinksInFooter,
+  auth,
   isAuth,
   // resetFilterName,
   // savedFilters,
@@ -113,6 +115,7 @@ export default function SideBarFilters({
           // extraBucket={extraBucket}
           // filterState={filterState}
           isAuth={isAuth}
+          isReviewer={isReviewerOrAdmin(auth)}
           // savedFilters={savedFilters}
           selectBucket={selectBucket}
           // selectSavedFilter={selectSavedFilter}
@@ -155,6 +158,7 @@ SideBarFilters.propTypes = {
   // extraBucket: PT.string,
   // filterState: PT.shape().isRequired,
   // hideTcLinksInFooter: PT.bool,
+  auth: PT.shape().isRequired,
   isAuth: PT.bool,
   // resetFilterName: PT.func.isRequired,
   // savedFilters: PT.arrayOf(PT.shape()).isRequired,

src/shared/utils/challenge-listing/helper.js

@@ -1,3 +1,4 @@
+import _ from 'lodash';
 import moment from 'moment';
 
 /**
@@ -62,3 +63,19 @@ export const formatOrdinals = (n) => {
 
   return ord;
 };
+
+/**
+ * Check if user's role is reviewer or admin
+ * @param {Object || null} auth
+ *
+ * @returns {Boolean}
+ */
+export const isReviewerOrAdmin = (auth) => {
+  const roles = _.get(auth, 'user.roles');
+
+  if (!roles || !_.isArray(roles)) {
+    return false;
+  }
+
+  return _.intersection(roles, ['administrator', 'Reviewer']).length;
+};