Merge pull request #1301 from topcoder-platform/dev

Topgear Iterative Reviewer visibility fix

Author: jmgasper

package.json

@@ -109,7 +109,7 @@
     "sass": "^1.79.0",
     "styled-components": "^5.3.6",
     "swr": "^1.3.0",
-    "tc-auth-lib": "topcoder-platform/tc-auth-lib#1.0.27",
+    "tc-auth-lib": "topcoder-platform/tc-auth-lib#master",
     "tinymce": "^7.9.1",
     "typescript": "^4.8.4",
     "universal-navigation": "https://github.com/topcoder-platform/universal-navigation#9fc50d938be7182",

src/apps/admin/src/permission-management/PermissionGroupsPage/PermissionGroupsPage.module.scss

@@ -19,10 +19,29 @@
     text-align: center;
 }
 
-.btnNewGroup {
-    margin: $sp-8 $sp-8 $sp-4 $sp-8;
+.actions {
+    display: flex;
+    align-items: flex-end;
+    gap: $sp-4;
+    margin: $sp-8 $sp-8 $sp-4;
 
     @include ltelg {
+        flex-direction: column;
+        align-items: stretch;
         margin: $sp-4;
+        gap: $sp-3;
+    }
+}
+
+.searchField {
+    flex: 1;
+}
+
+.btnNewGroup {
+    margin: 0;
+    min-width: max-content;
+
+    @include ltelg {
+        width: 100%;
     }
 }

src/apps/admin/src/permission-management/PermissionGroupsPage/PermissionGroupsPage.tsx

@@ -1,10 +1,10 @@
 /**
  * Permission groups page.
  */
-import { FC, useContext, useState } from 'react'
+import { ChangeEvent, FC, useContext, useMemo, useState } from 'react'
 import classNames from 'classnames'
 
-import { Button, LoadingSpinner, PageTitle } from '~/libs/ui'
+import { Button, InputText, LoadingSpinner, PageTitle } from '~/libs/ui'
 import { PlusIcon } from '@heroicons/react/solid'
 
 import { DialogAddGroup } from '../../lib/components/DialogAddGroup'
@@ -24,6 +24,7 @@ const pageTitle = 'Groups'
 
 export const PermissionGroupsPage: FC<Props> = (props: Props) => {
     const [openDialogAddGroup, setOpenDialogAddGroup] = useState(false)
+    const [searchTerm, setSearchTerm] = useState('')
     const { loadUser, cancelLoadUser, usersMapping }: AdminAppContextType
         = useContext(AdminAppContext)
     const {
@@ -37,6 +38,26 @@ export const PermissionGroupsPage: FC<Props> = (props: Props) => {
         usersMapping,
     )
 
+    const filteredGroups = useMemo(() => {
+        const normalized = searchTerm
+            .trim()
+            .toLowerCase()
+        if (!normalized) {
+            return groups
+        }
+
+        return groups.filter(group => {
+            const id = group.id ? group.id.toLowerCase() : ''
+            const name = group.name ? group.name.toLowerCase() : ''
+
+            return id.includes(normalized) || name.includes(normalized)
+        })
+    }, [groups, searchTerm])
+    const hasSearchTerm = useMemo(
+        () => searchTerm.trim().length > 0,
+        [searchTerm],
+    )
+
     return (
         <div className={classNames(styles.container, props.className)}>
             <PageTitle>{pageTitle}</PageTitle>
@@ -51,24 +72,40 @@ export const PermissionGroupsPage: FC<Props> = (props: Props) => {
                     </div>
                 ) : (
                     <>
-                        <Button
-                            primary
-                            size='lg'
-                            icon={PlusIcon}
-                            iconToLeft
-                            label='new group'
-                            onClick={function onClick() {
-                                setOpenDialogAddGroup(true)
-                            }}
-                            className={styles.btnNewGroup}
-                        />
-                        {groups.length === 0 ? (
+                        <div className={styles.actions}>
+                            <InputText
+                                name='groupSearch'
+                                type='text'
+                                label='Search groups'
+                                placeholder='Search by name or ID'
+                                value={searchTerm}
+                                onChange={function onChange(event: ChangeEvent<HTMLInputElement>) {
+                                    setSearchTerm(event.target.value)
+                                }}
+                                forceUpdateValue
+                                classNameWrapper={styles.searchField}
+                            />
+                            <Button
+                                primary
+                                size='lg'
+                                icon={PlusIcon}
+                                iconToLeft
+                                label='new group'
+                                onClick={function onClick() {
+                                    setOpenDialogAddGroup(true)
+                                }}
+                                className={styles.btnNewGroup}
+                            />
+                        </div>
+                        {filteredGroups.length === 0 ? (
                             <p className={styles.noRecordFound}>
-                                {MSG_NO_RECORD_FOUND}
+                                {hasSearchTerm
+                                    ? 'No groups match your search.'
+                                    : MSG_NO_RECORD_FOUND}
                             </p>
                         ) : (
                             <GroupsTable
-                                datas={groups}
+                                datas={filteredGroups}
                                 usersMapping={usersMapping}
                             />
                         )}

src/apps/review/src/lib/components/ChallengeDetailsContent/ChallengeDetailsContent.tsx

@@ -9,7 +9,7 @@ import { ActionLoading } from '~/apps/admin/src/lib'
 import { ChallengeDetailContext } from '../../contexts'
 import {
     BackendSubmission,
-    ChallengeInfo,
+    ChallengeDetailContextModel,
     MappingReviewAppeal,
     Screening,
     SubmissionInfo,
@@ -120,6 +120,7 @@ const buildScreeningRows = ({
 
 interface SubmissionTabParams {
     selectedTabNormalized: string
+    allowTopgearSubmissionList: boolean
     submissions: BackendSubmission[]
     screeningRows: Screening[]
     screeningMinimumPassingScore: number | null | undefined
@@ -131,6 +132,7 @@ interface SubmissionTabParams {
 
 const renderSubmissionTab = ({
     selectedTabNormalized,
+    allowTopgearSubmissionList,
     submissions,
     screeningRows,
     screeningMinimumPassingScore,
@@ -149,7 +151,7 @@ const renderSubmissionTab = ({
             submission => normalizeType(submission.type) === 'contestsubmission',
         )
         : submissions
-    const canShowSubmissionList = !isTopgearSubmissionTab
+    const canShowSubmissionList = (allowTopgearSubmissionList || !isTopgearSubmissionTab)
         && selectedTabNormalized !== 'screening'
         && visibleSubmissions.length > 0
 
@@ -178,8 +180,23 @@ const renderSubmissionTab = ({
 }
 
 export const ChallengeDetailsContent: FC<Props> = (props: Props) => {
-    const { challengeInfo }: { challengeInfo?: ChallengeInfo } = useContext(ChallengeDetailContext)
+    const {
+        challengeInfo,
+        myResources,
+    }: ChallengeDetailContextModel = useContext(ChallengeDetailContext)
     const { actionChallengeRole }: useRoleProps = useRole()
+    const hasIterativeReviewerRole = useMemo(
+        () => myResources.some(
+            resource => resource.roleName
+                ?.toLowerCase()
+                .includes('iterative reviewer'),
+        ),
+        [myResources],
+    )
+    const allowTopgearSubmissionList = useMemo(
+        () => actionChallengeRole !== SUBMITTER || hasIterativeReviewerRole,
+        [actionChallengeRole, hasIterativeReviewerRole],
+    )
     const { currentMemberId }: UseSubmissionDownloadAccessResult = useSubmissionDownloadAccess()
     const {
         isLoading: isDownloadingSubmission,
@@ -364,6 +381,7 @@ export const ChallengeDetailsContent: FC<Props> = (props: Props) => {
 
         if (SUBMISSION_TAB_KEYS.has(selectedTabNormalized)) {
             return renderSubmissionTab({
+                allowTopgearSubmissionList,
                 downloadSubmission: handleSubmissionDownload,
                 isActiveChallenge: props.isActiveChallenge,
                 isDownloadingSubmission,