Merge pull request #1087 from topcoder-platform/pm-580_1

fix(PM-580): dont show action button when invite is inprogress

Author: hentrymartin

src/apps/copilots/src/pages/copilot-opportunity-details/tabs/copilot-applications/CopilotApplicationAction.tsx

@@ -1,16 +1,23 @@
 import { useParams } from 'react-router-dom'
 import { toast } from 'react-toastify'
 import { mutate } from 'swr'
-import { useCallback } from 'react'
+import { useCallback, useMemo } from 'react'
 
 import { assignCopilotOpportunity, copilotBaseUrl } from '~/apps/copilots/src/services/copilot-opportunities'
 import { CopilotApplication, CopilotApplicationStatus } from '~/apps/copilots/src/models/CopilotApplication'
 import { IconSolid, Tooltip } from '~/libs/ui'
 
 import styles from './styles.module.scss'
 
-const CopilotApplicationAction = (copilotApplication: CopilotApplication): JSX.Element => {
+const CopilotApplicationAction = (
+    copilotApplication: CopilotApplication,
+    allCopilotApplications: CopilotApplication[],
+): JSX.Element => {
     const { opportunityId }: {opportunityId?: string} = useParams<{ opportunityId?: string }>()
+    const isInvited = useMemo(
+        () => allCopilotApplications.findIndex(item => item.status === CopilotApplicationStatus.INVITED) > -1,
+        [allCopilotApplications],
+    )
     const onClick = useCallback(async () => {
         if (copilotApplication.status !== CopilotApplicationStatus.PENDING) {
             return
@@ -39,7 +46,7 @@ const CopilotApplicationAction = (copilotApplication: CopilotApplication): JSX.E
             }
 
             {
-                copilotApplication.status === CopilotApplicationStatus.PENDING && (
+                !isInvited && copilotApplication.status === CopilotApplicationStatus.PENDING && (
                     <IconSolid.UserAddIcon />
                 )
             }

src/libs/ui/lib/components/table/Table.tsx

@@ -177,6 +177,7 @@ const Table: <T extends { [propertyName: string]: any }>(props: TableProps<T>) =
                 <TableRow
                     key={getKey(index)}
                     data={sorted}
+                    allRows={sortedData}
                     onRowClick={props.onRowClick}
                     columns={props.columns}
                     index={index}

src/libs/ui/lib/components/table/table-cell/TableCell.tsx

@@ -16,13 +16,14 @@ interface TableCellProps<T> {
     readonly index: number
     readonly propertyName?: string
     readonly className?: string
-    readonly renderer?: (data: T) => JSX.Element | undefined
+    readonly renderer?: (data: T, allRows?: ReadonlyArray<T>) => JSX.Element | undefined
     readonly type: TableCellType
     readonly onExpand?: () => void
     readonly as?: ElementType
     readonly showExpandIndicator?: boolean
     readonly isExpanded?: boolean
     readonly colSpan?: number
+    allRows?: ReadonlyArray<T>
 }
 
 const TableCell: <T extends { [propertyName: string]: any }>(
@@ -40,7 +41,7 @@ const TableCell: <T extends { [propertyName: string]: any }>(
         case 'action':
         case 'element':
         case 'numberElement':
-            data = props.renderer?.(props.data)
+            data = props.renderer?.(props.data, props.allRows)
             break
         case 'money':
             data = textFormatMoneyLocaleString(

src/libs/ui/lib/components/table/table-row/TableRow.tsx

@@ -22,6 +22,7 @@ interface Props<T> {
     index: number
     readonly showExpand?: boolean
     readonly preventDefault?: boolean
+    allRows?: ReadonlyArray<T>
 }
 
 export const TableRow: <T extends { [propertyName: string]: any }>(
@@ -50,6 +51,7 @@ export const TableRow: <T extends { [propertyName: string]: any }>(
             {...col}
             data={props.data}
             index={props.index}
+            allRows={props.allRows}
             key={getKey(`${props.index}${colIndex}`)}
             showExpandIndicator={colIndex === 0 && props.showExpand}
             isExpanded={isExpanded && colIndex === 0}