From ec539ec85c207cb5d8d30da57108a83db4b1cd42 Mon Sep 17 00:00:00 2001
From: himaniraghav3 <himaniraghav0311@gmail.com>
Date: Thu, 19 Feb 2026 11:49:16 +0530
Subject: [PATCH 01/17] PM-3731 Show roles for design ch in resources tab

---
 .../ChallengeEditor/Resources/index.js        | 59 +++++++++----------
 1 file changed, 28 insertions(+), 31 deletions(-)

diff --git a/src/components/ChallengeEditor/Resources/index.js b/src/components/ChallengeEditor/Resources/index.js
index 8e1f44f9..f6385283 100644
--- a/src/components/ChallengeEditor/Resources/index.js
+++ b/src/components/ChallengeEditor/Resources/index.js
@@ -352,34 +352,33 @@ export default class Resources extends React.Component {
           >
             <thead className={styles.headTable} role='row'>
               <tr>
-                {!isDesign && (
-                  <th>
-                    <button
+                <th>
+                  <button
+                    type='button'
+                    onClick={() => {
+                      this.onSortChange({
+                        field: 'Role',
+                        sort: field === 'Role' ? revertSort : 'desc'
+                      })
+                    }}
+                    className={cn(styles['col-2Table'], styles['table-header'])}
+                  >
+                    <span role='columnheader'>Role</span>
+                    <div
+                      className={cn(styles['col-arrow'], {
+                        [styles['col-arrow-sort-asc']]:
+                            field === 'Role' && sort === 'asc',
+                        [styles['col-arrow-is-sorting']]: field === 'Role'
+                      })}
                       type='button'
-                      onClick={() => {
-                        this.onSortChange({
-                          field: 'Role',
-                          sort: field === 'Role' ? revertSort : 'desc'
-                        })
-                      }}
-                      className={cn(styles['col-2Table'], styles['table-header'])}
                     >
-                      <span role='columnheader'>Role</span>
-                      <div
-                        className={cn(styles['col-arrow'], {
-                          [styles['col-arrow-sort-asc']]:
-                            field === 'Role' && sort === 'asc',
-                          [styles['col-arrow-is-sorting']]: field === 'Role'
-                        })}
-                        type='button'
-                      >
-                        <ReactSVG
-                          path={assets(`${ArrowDown}`)}
-                        />
-                      </div>
-                    </button>
-                  </th>
-                )}
+                      <ReactSVG
+                        path={assets(`${ArrowDown}`)}
+                      />
+                    </div>
+                  </button>
+                </th>
+
                 <th>
                   <button
                     onClick={() => {
@@ -461,11 +460,9 @@ export default class Resources extends React.Component {
               {sortedResources.map(r => {
                 return (
                   <tr className={styles.rowTable} key={r.id} role='row'>
-                    {!isDesign && (
-                      <td className={styles['col-2Table']}>
-                        <span role='cell'>{r.role}</span>
-                      </td>
-                    )}
+                    <td className={styles['col-2Table']}>
+                      <span role='cell'>{r.role}</span>
+                    </td>
                     <td className={styles['col-3Table']}>
                       <span role='cell'>
                         <a

From 1bd68aa3e4c85f5b44f869b0ff527d1b7e87996e Mon Sep 17 00:00:00 2001
From: Justin Gasper <jmgasper@gmail.com>
Date: Sun, 22 Feb 2026 19:15:51 +1100
Subject: [PATCH 02/17] PM-2593: restore reviewer field for V6 tasks

What was broken

- The Reviewer control was missing in the challenge editor, so V6 task reviewers could not be selected in WM.

- Internal review submissions no longer enforced selecting a reviewer.

Root cause

- The ReviewType field component was reduced to a null stub, and related wiring/validation in ChallengeEditor was removed.

What was changed

- Restored the ReviewType field UI with reviewer radio/select behavior and required inline error state.

- Reconnected reviewer options and selection callback wiring from ChallengeEditor to ReviewTypeField.

- Restored validation that blocks saving when internal review has no selected reviewer.

Any added/updated tests

- Added ReviewTypeField tests to verify task reviewer control rendering and required validation messaging.
---
 .../ChallengeEditor/ReviewType-Field/index.js | 113 ++++++++++++++-
 .../ReviewType-Field/index.test.js            | 129 ++++++++++++++++++
 src/components/ChallengeEditor/index.js       |   8 ++
 3 files changed, 248 insertions(+), 2 deletions(-)
 create mode 100644 src/components/ChallengeEditor/ReviewType-Field/index.test.js

diff --git a/src/components/ChallengeEditor/ReviewType-Field/index.js b/src/components/ChallengeEditor/ReviewType-Field/index.js
index 20cba011..d3ab19ab 100644
--- a/src/components/ChallengeEditor/ReviewType-Field/index.js
+++ b/src/components/ChallengeEditor/ReviewType-Field/index.js
@@ -1,10 +1,119 @@
+import _ from 'lodash'
+import React from 'react'
 import PropTypes from 'prop-types'
+import Select from '../../Select'
+import cn from 'classnames'
+import styles from './ReviewType-Field.module.scss'
+import Tooltip from '../../Tooltip'
+import { DES_TRACK_ID, REVIEW_TYPES, MESSAGE, QA_TRACK_ID } from '../../../config/constants'
 
-const ReviewTypeField = () => null
+const ReviewTypeField = ({ reviewers, challenge, onUpdateOthers, onUpdateSelect }) => {
+  const isDesignChallenge = challenge.trackId === DES_TRACK_ID
+  const isQAChallenge = challenge.trackId === QA_TRACK_ID
+  const isTask = _.get(challenge, 'task.isTask', false)
+  const defaultReviewType = isDesignChallenge ? REVIEW_TYPES.INTERNAL : REVIEW_TYPES.COMMUNITY
+  const reviewType = challenge.reviewType ? challenge.reviewType.toUpperCase() : defaultReviewType
+  const isCommunity = reviewType === REVIEW_TYPES.COMMUNITY
+  const isInternal = reviewType === REVIEW_TYPES.INTERNAL || isTask
+  const communityOption = (disabled) => (
+    <div className={styles.tcRadioButton}>
+      <input
+        name='community'
+        type='radio'
+        id='community'
+        checked={isCommunity}
+        disabled={disabled}
+        onChange={e => e.target.checked && onUpdateOthers({
+          field: 'reviewType',
+          value: REVIEW_TYPES.COMMUNITY
+        })}
+      />
+      <label htmlFor='community'>
+        <div className={styles.radioButtonLabel}>
+          Community
+        </div>
+        <input type='hidden' />
+      </label>
+    </div>
+  )
+  const internalOption = (disabled) => (
+    <div className={styles.tcRadioButton}>
+      <input
+        name='internal'
+        type='radio'
+        id='internal'
+        disabled={disabled}
+        checked={isInternal}
+        onChange={e => e.target.checked && onUpdateOthers({
+          field: 'reviewType',
+          value: REVIEW_TYPES.INTERNAL
+        })}
+      />
+      <label htmlFor='internal'>
+        <div className={styles.radioButtonLabel}>
+          Internal
+        </div>
+        <input type='hidden' />
+      </label>
+    </div>
+  )
+
+  return (
+    <div>
+      <div className={styles.row}>
+        <div className={cn(styles.field, styles.col1)}>
+          <label htmlFor='reviewType'>Reviewer <span>*</span> :</label>
+        </div>
+        <div className={cn(styles.field, styles.col2)}>
+          <div className={styles.subGroup}>
+            <div className={styles.subRow}>
+              {isDesignChallenge && (
+                <Tooltip content={MESSAGE.COMMUNITY_REVIEW_DISABLED}>
+                  {communityOption(true)}
+                </Tooltip>
+              )}
+              {!isDesignChallenge && !isTask && communityOption()}
+            </div>
+            <div className={styles.subRow}>
+              {isQAChallenge && (
+                <Tooltip content={MESSAGE.INTERNAL_REVIEW_DISABLED}>
+                  {internalOption(true)}
+                </Tooltip>
+              )}
+              {!isQAChallenge && internalOption()}
+              {isInternal && (
+                <Select
+                  name='reviewer'
+                  options={reviewers.map(({ handle }) => ({ label: handle, value: handle }))}
+                  placeholder='Select Reviewer'
+                  value={{ label: challenge.reviewer, value: challenge.reviewer }}
+                  isClearable={false}
+                  onChange={e => onUpdateSelect(e.value, false, 'reviewer')}
+                  isDisabled={false}
+                />
+              )}
+            </div>
+          </div>
+        </div>
+      </div>
+      {challenge.submitTriggered && isInternal && !challenge.reviewer && (
+        <div className={cn(styles.field, styles.row, styles.error)}>
+          Select a reviewer
+        </div>
+      )}
+    </div>
+  )
+}
+
+ReviewTypeField.defaultProps = {
+  reviewers: []
+}
 
 ReviewTypeField.propTypes = {
+  reviewers: PropTypes.arrayOf(PropTypes.shape()).isRequired,
   challenge: PropTypes.shape().isRequired,
-  onUpdateOthers: PropTypes.func.isRequired
+  onUpdateOthers: PropTypes.func.isRequired,
+  onUpdateSelect: PropTypes.func.isRequired
 }
 
 export default ReviewTypeField
diff --git a/src/components/ChallengeEditor/ReviewType-Field/index.test.js b/src/components/ChallengeEditor/ReviewType-Field/index.test.js
new file mode 100644
index 00000000..d14c5a56
--- /dev/null
+++ b/src/components/ChallengeEditor/ReviewType-Field/index.test.js
@@ -0,0 +1,129 @@
+/* global beforeEach, afterEach, describe, it, expect, jest */
+/* eslint-disable react/prop-types */
+
+import React from 'react'
+import ReactDOM from 'react-dom'
+import { act } from 'react-dom/test-utils'
+import { REVIEW_TYPES } from '../../../config/constants'
+import ReviewTypeField from './index'
+
+jest.mock('../../Select', () => {
+  const MockSelect = ({
+    name,
+    onChange,
+    options,
+    value
+  }) => (
+    <select
+      data-testid='reviewer-select'
+      name={name}
+      onChange={event => onChange({ value: event.target.value })}
+      value={(value && value.value) || ''}
+    >
+      <option value=''>Select Reviewer</option>
+      {(options || []).map(option => (
+        <option key={option.value} value={option.value}>
+          {option.label}
+        </option>
+      ))}
+    </select>
+  )
+
+  return MockSelect
+})
+
+jest.mock('../../Tooltip', () => {
+  const ReactLocal = require('react')
+
+  const MockTooltip = ({ children }) => (
+    <ReactLocal.Fragment>{children}</ReactLocal.Fragment>
+  )
+
+  return MockTooltip
+})
+
+describe('ReviewTypeField', () => {
+  let container
+
+  const reviewers = [
+    { handle: 'jcori' },
+    { handle: 'tasintake800' }
+  ]
+
+  const baseChallenge = {
+    reviewType: REVIEW_TYPES.INTERNAL,
+    reviewer: '',
+    submitTriggered: false,
+    task: {
+      isTask: true
+    },
+    trackId: '8b995af6-9f6d-4f98-af1c-9b2d9186ba73'
+  }
+
+  beforeEach(() => {
+    container = document.createElement('div')
+    document.body.appendChild(container)
+  })
+
+  afterEach(() => {
+    ReactDOM.unmountComponentAtNode(container)
+    container.remove()
+    container = null
+  })
+
+  it('renders the mandatory reviewer control for task challenges', () => {
+    const onUpdateOthers = jest.fn()
+    const onUpdateSelect = jest.fn()
+
+    act(() => {
+      ReactDOM.render(
+        <ReviewTypeField
+          challenge={{
+            ...baseChallenge,
+            reviewer: 'jcori'
+          }}
+          onUpdateOthers={onUpdateOthers}
+          onUpdateSelect={onUpdateSelect}
+          reviewers={reviewers}
+        />,
+        container
+      )
+    })
+
+    const internalRadio = container.querySelector('input#internal')
+    const communityRadio = container.querySelector('input#community')
+    const reviewerSelect = container.querySelector('select[data-testid="reviewer-select"]')
+
+    expect(container.textContent).toContain('Reviewer')
+    expect(internalRadio).not.toBeNull()
+    expect(internalRadio.checked).toBe(true)
+    expect(communityRadio).toBeNull()
+    expect(reviewerSelect).not.toBeNull()
+
+    act(() => {
+      reviewerSelect.value = 'tasintake800'
+      reviewerSelect.dispatchEvent(new window.Event('change', { bubbles: true }))
+    })
+
+    expect(onUpdateSelect).toHaveBeenCalledWith('tasintake800', false, 'reviewer')
+  })
+
+  it('shows a validation message when no reviewer is selected for internal review', () => {
+    act(() => {
+      ReactDOM.render(
+        <ReviewTypeField
+          challenge={{
+            ...baseChallenge,
+            submitTriggered: true
+          }}
+          onUpdateOthers={jest.fn()}
+          onUpdateSelect={jest.fn()}
+          reviewers={reviewers}
+        />,
+        container
+      )
+    })
+
+    expect(container.textContent).toContain('Select a reviewer')
+  })
+})
diff --git a/src/components/ChallengeEditor/index.js b/src/components/ChallengeEditor/index.js
index 88297520..650250b1 100644
--- a/src/components/ChallengeEditor/index.js
+++ b/src/components/ChallengeEditor/index.js
@@ -879,6 +879,12 @@ class ChallengeEditor extends Component {
       return !!name && !!trackId && !!typeId
     }
 
+    const reviewType = challenge.reviewType ? challenge.reviewType.toUpperCase() : REVIEW_TYPES.COMMUNITY
+    const isInternal = reviewType === REVIEW_TYPES.INTERNAL
+    if (isInternal && !challenge.reviewer) {
+      return false
+    }
+
     if (!this.isValidChallengePrizes()) {
       return false
     }
@@ -1907,8 +1913,10 @@ class ChallengeEditor extends Component {
             {projectDetail.version === 'v4' && <MilestoneField milestones={activeProjectMilestones} onUpdateSelect={this.onUpdateSelect} projectId={projectDetail.id} selectedMilestoneId={selectedMilestoneId} />}
             <CopilotField challenge={challenge} copilots={copilotResources} onUpdateOthers={this.onUpdateOthers} assignYourselfCopilot={assignYourselfCopilot} loggedInUser={loggedInUser} />
             <ReviewTypeField
+              reviewers={metadata.members}
               challenge={challenge}
               onUpdateOthers={this.onUpdateOthers}
+              onUpdateSelect={this.onUpdateSelect}
             />
             <div className={styles.row}>
               <div className={styles.tcCheckbox}>

From 59ea314683ce9f43f67044c81a9a3203abee3971 Mon Sep 17 00:00:00 2001
From: Kiril Kartunov <kiril.kartunov@gmail.com>
Date: Tue, 24 Feb 2026 18:49:32 +0200
Subject: [PATCH 03/17] Revert "PM-2593: restore reviewer field for V6 tasks"

This reverts commit 1bd68aa3e4c85f5b44f869b0ff527d1b7e87996e.
---
 .../ChallengeEditor/ReviewType-Field/index.js | 113 +--------------
 .../ReviewType-Field/index.test.js            | 129 ------------------
 src/components/ChallengeEditor/index.js       |   8 --
 3 files changed, 2 insertions(+), 248 deletions(-)
 delete mode 100644 src/components/ChallengeEditor/ReviewType-Field/index.test.js

diff --git a/src/components/ChallengeEditor/ReviewType-Field/index.js b/src/components/ChallengeEditor/ReviewType-Field/index.js
index d3ab19ab..20cba011 100644
--- a/src/components/ChallengeEditor/ReviewType-Field/index.js
+++ b/src/components/ChallengeEditor/ReviewType-Field/index.js
@@ -1,119 +1,10 @@
-import _ from 'lodash'
-import React from 'react'
 import PropTypes from 'prop-types'
-import Select from '../../Select'
-import cn from 'classnames'
-import styles from './ReviewType-Field.module.scss'
-import Tooltip from '../../Tooltip'
-import { DES_TRACK_ID, REVIEW_TYPES, MESSAGE, QA_TRACK_ID } from '../../../config/constants'
 
-const ReviewTypeField = ({ reviewers, challenge, onUpdateOthers, onUpdateSelect }) => {
-  const isDesignChallenge = challenge.trackId === DES_TRACK_ID
-  const isQAChallenge = challenge.trackId === QA_TRACK_ID
-  const isTask = _.get(challenge, 'task.isTask', false)
-  const defaultReviewType = isDesignChallenge ? REVIEW_TYPES.INTERNAL : REVIEW_TYPES.COMMUNITY
-  const reviewType = challenge.reviewType ? challenge.reviewType.toUpperCase() : defaultReviewType
-  const isCommunity = reviewType === REVIEW_TYPES.COMMUNITY
-  const isInternal = reviewType === REVIEW_TYPES.INTERNAL || isTask
-  const communityOption = (disabled) => (
-    <div className={styles.tcRadioButton}>
-      <input
-        name='community'
-        type='radio'
-        id='community'
-        checked={isCommunity}
-        disabled={disabled}
-        onChange={e => e.target.checked && onUpdateOthers({
-          field: 'reviewType',
-          value: REVIEW_TYPES.COMMUNITY
-        })}
-      />
-      <label htmlFor='community'>
-        <div className={styles.radioButtonLabel}>
-          Community
-        </div>
-        <input type='hidden' />
-      </label>
-    </div>
-  )
-  const internalOption = (disabled) => (
-    <div className={styles.tcRadioButton}>
-      <input
-        name='internal'
-        type='radio'
-        id='internal'
-        disabled={disabled}
-        checked={isInternal}
-        onChange={e => e.target.checked && onUpdateOthers({
-          field: 'reviewType',
-          value: REVIEW_TYPES.INTERNAL
-        })}
-      />
-      <label htmlFor='internal'>
-        <div className={styles.radioButtonLabel}>
-          Internal
-        </div>
-        <input type='hidden' />
-      </label>
-    </div>
-  )
-
-  return (
-    <div>
-      <div className={styles.row}>
-        <div className={cn(styles.field, styles.col1)}>
-          <label htmlFor='reviewType'>Reviewer <span>*</span> :</label>
-        </div>
-        <div className={cn(styles.field, styles.col2)}>
-          <div className={styles.subGroup}>
-            <div className={styles.subRow}>
-              {isDesignChallenge && (
-                <Tooltip content={MESSAGE.COMMUNITY_REVIEW_DISABLED}>
-                  {communityOption(true)}
-                </Tooltip>
-              )}
-              {!isDesignChallenge && !isTask && communityOption()}
-            </div>
-            <div className={styles.subRow}>
-              {isQAChallenge && (
-                <Tooltip content={MESSAGE.INTERNAL_REVIEW_DISABLED}>
-                  {internalOption(true)}
-                </Tooltip>
-              )}
-              {!isQAChallenge && internalOption()}
-              {isInternal && (
-                <Select
-                  name='reviewer'
-                  options={reviewers.map(({ handle }) => ({ label: handle, value: handle }))}
-                  placeholder='Select Reviewer'
-                  value={{ label: challenge.reviewer, value: challenge.reviewer }}
-                  isClearable={false}
-                  onChange={e => onUpdateSelect(e.value, false, 'reviewer')}
-                  isDisabled={false}
-                />
-              )}
-            </div>
-          </div>
-        </div>
-      </div>
-      {challenge.submitTriggered && isInternal && !challenge.reviewer && (
-        <div className={cn(styles.field, styles.row, styles.error)}>
-          Select a reviewer
-        </div>
-      )}
-    </div>
-  )
-}
-
-ReviewTypeField.defaultProps = {
-  reviewers: []
-}
+const ReviewTypeField = () => null
 
 ReviewTypeField.propTypes = {
-  reviewers: PropTypes.arrayOf(PropTypes.shape()).isRequired,
   challenge: PropTypes.shape().isRequired,
-  onUpdateOthers: PropTypes.func.isRequired,
-  onUpdateSelect: PropTypes.func.isRequired
+  onUpdateOthers: PropTypes.func.isRequired
 }
 
 export default ReviewTypeField
diff --git a/src/components/ChallengeEditor/ReviewType-Field/index.test.js b/src/components/ChallengeEditor/ReviewType-Field/index.test.js
deleted file mode 100644
index d14c5a56..00000000
--- a/src/components/ChallengeEditor/ReviewType-Field/index.test.js
+++ /dev/null
@@ -1,129 +0,0 @@
-/* global beforeEach, afterEach, describe, it, expect, jest */
-/* eslint-disable react/prop-types */
-
-import React from 'react'
-import ReactDOM from 'react-dom'
-import { act } from 'react-dom/test-utils'
-import { REVIEW_TYPES } from '../../../config/constants'
-import ReviewTypeField from './index'
-
-jest.mock('../../Select', () => {
-  const MockSelect = ({
-    name,
-    onChange,
-    options,
-    value
-  }) => (
-    <select
-      data-testid='reviewer-select'
-      name={name}
-      onChange={event => onChange({ value: event.target.value })}
-      value={(value && value.value) || ''}
-    >
-      <option value=''>Select Reviewer</option>
-      {(options || []).map(option => (
-        <option key={option.value} value={option.value}>
-          {option.label}
-        </option>
-      ))}
-    </select>
-  )
-
-  return MockSelect
-})
-
-jest.mock('../../Tooltip', () => {
-  const ReactLocal = require('react')
-
-  const MockTooltip = ({ children }) => (
-    <ReactLocal.Fragment>{children}</ReactLocal.Fragment>
-  )
-
-  return MockTooltip
-})
-
-describe('ReviewTypeField', () => {
-  let container
-
-  const reviewers = [
-    { handle: 'jcori' },
-    { handle: 'tasintake800' }
-  ]
-
-  const baseChallenge = {
-    reviewType: REVIEW_TYPES.INTERNAL,
-    reviewer: '',
-    submitTriggered: false,
-    task: {
-      isTask: true
-    },
-    trackId: '8b995af6-9f6d-4f98-af1c-9b2d9186ba73'
-  }
-
-  beforeEach(() => {
-    container = document.createElement('div')
-    document.body.appendChild(container)
-  })
-
-  afterEach(() => {
-    ReactDOM.unmountComponentAtNode(container)
-    container.remove()
-    container = null
-  })
-
-  it('renders the mandatory reviewer control for task challenges', () => {
-    const onUpdateOthers = jest.fn()
-    const onUpdateSelect = jest.fn()
-
-    act(() => {
-      ReactDOM.render(
-        <ReviewTypeField
-          challenge={{
-            ...baseChallenge,
-            reviewer: 'jcori'
-          }}
-          onUpdateOthers={onUpdateOthers}
-          onUpdateSelect={onUpdateSelect}
-          reviewers={reviewers}
-        />,
-        container
-      )
-    })
-
-    const internalRadio = container.querySelector('input#internal')
-    const communityRadio = container.querySelector('input#community')
-    const reviewerSelect = container.querySelector('select[data-testid="reviewer-select"]')
-
-    expect(container.textContent).toContain('Reviewer')
-    expect(internalRadio).not.toBeNull()
-    expect(internalRadio.checked).toBe(true)
-    expect(communityRadio).toBeNull()
-    expect(reviewerSelect).not.toBeNull()
-
-    act(() => {
-      reviewerSelect.value = 'tasintake800'
-      reviewerSelect.dispatchEvent(new window.Event('change', { bubbles: true }))
-    })
-
-    expect(onUpdateSelect).toHaveBeenCalledWith('tasintake800', false, 'reviewer')
-  })
-
-  it('shows a validation message when no reviewer is selected for internal review', () => {
-    act(() => {
-      ReactDOM.render(
-        <ReviewTypeField
-          challenge={{
-            ...baseChallenge,
-            submitTriggered: true
-          }}
-          onUpdateOthers={jest.fn()}
-          onUpdateSelect={jest.fn()}
-          reviewers={reviewers}
-        />,
-        container
-      )
-    })
-
-    expect(container.textContent).toContain('Select a reviewer')
-  })
-})
diff --git a/src/components/ChallengeEditor/index.js b/src/components/ChallengeEditor/index.js
index 650250b1..88297520 100644
--- a/src/components/ChallengeEditor/index.js
+++ b/src/components/ChallengeEditor/index.js
@@ -879,12 +879,6 @@ class ChallengeEditor extends Component {
       return !!name && !!trackId && !!typeId
     }
 
-    const reviewType = challenge.reviewType ? challenge.reviewType.toUpperCase() : REVIEW_TYPES.COMMUNITY
-    const isInternal = reviewType === REVIEW_TYPES.INTERNAL
-    if (isInternal && !challenge.reviewer) {
-      return false
-    }
-
     if (!this.isValidChallengePrizes()) {
       return false
     }
@@ -1913,10 +1907,8 @@ class ChallengeEditor extends Component {
             {projectDetail.version === 'v4' && <MilestoneField milestones={activeProjectMilestones} onUpdateSelect={this.onUpdateSelect} projectId={projectDetail.id} selectedMilestoneId={selectedMilestoneId} />}
             <CopilotField challenge={challenge} copilots={copilotResources} onUpdateOthers={this.onUpdateOthers} assignYourselfCopilot={assignYourselfCopilot} loggedInUser={loggedInUser} />
             <ReviewTypeField
-              reviewers={metadata.members}
               challenge={challenge}
               onUpdateOthers={this.onUpdateOthers}
-              onUpdateSelect={this.onUpdateSelect}
             />
             <div className={styles.row}>
               <div className={styles.tcCheckbox}>

From ca9a89f88d49ff0d1ed02eea3138b120d88fc9d8 Mon Sep 17 00:00:00 2001
From: Justin Gasper <jmgasper@gmail.com>
Date: Wed, 25 Feb 2026 13:41:49 +1100
Subject: [PATCH 04/17] Fun challenge, v6 projects api, wipro allowed flag, fix
 for reviewer scorecard phase change and selection.

---
 .circleci/config.yml                          |  2 +-
 config/constants/development.js               |  2 +-
 config/constants/local.js                     |  5 +-
 config/constants/production.js                |  2 +-
 .../ChallengeReviewer-Field/index.js          | 91 ++++++++++++++-----
 .../FunChallengeField.module.scss             | 76 ++++++++++++++++
 .../FunChallengeField/index.js                | 47 ++++++++++
 .../WiproAllowedField.module.scss             | 76 ++++++++++++++++
 .../WiproAllowedField/index.js                | 47 ++++++++++
 src/components/ChallengeEditor/index.js       | 70 +++++++++++---
 10 files changed, 376 insertions(+), 42 deletions(-)
 create mode 100644 src/components/ChallengeEditor/FunChallengeField/FunChallengeField.module.scss
 create mode 100644 src/components/ChallengeEditor/FunChallengeField/index.js
 create mode 100644 src/components/ChallengeEditor/WiproAllowedField/WiproAllowedField.module.scss
 create mode 100644 src/components/ChallengeEditor/WiproAllowedField/index.js

diff --git a/.circleci/config.yml b/.circleci/config.yml
index a456a88e..d348291b 100644
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -160,7 +160,7 @@ workflows:
           context: org-global
           filters: &filters-dev
             branches:
-              only: ["develop", "pm-2917", "points", "pm-3270", "engagements"]
+              only: ["develop", "pm-2917", "points", "pm-3270", "projects-api-v6"]
 
       # Production builds are exectuted only on tagged commits to the
       # master branch.
diff --git a/config/constants/development.js b/config/constants/development.js
index af3244d6..67b69f47 100644
--- a/config/constants/development.js
+++ b/config/constants/development.js
@@ -30,7 +30,7 @@ module.exports = {
   CHALLENGE_PHASES_URL: `${DEV_API_HOSTNAME}/v6/challenge-phases`,
   CHALLENGE_TIMELINES_URL: `${DEV_API_HOSTNAME}/v6/challenge-timelines`,
   COPILOTS_URL: 'https://copilots.topcoder-dev.com',
-  PROJECT_API_URL: `${DEV_API_HOSTNAME}/v5/projects`,
+  PROJECT_API_URL: `${DEV_API_HOSTNAME}/v6/projects`,
   GROUPS_API_URL: `${DEV_API_HOSTNAME}/v6/groups`,
   TERMS_API_URL: `${DEV_API_HOSTNAME}/v5/terms`,
   RESOURCES_API_URL: `${DEV_API_HOSTNAME}/v6/resources`,
diff --git a/config/constants/local.js b/config/constants/local.js
index ad2ae1da..c551b163 100644
--- a/config/constants/local.js
+++ b/config/constants/local.js
@@ -12,6 +12,7 @@ const LOCAL_MEMBER_API = 'http://localhost:3003/v6'
 const LOCAL_RESOURCE_API = 'http://localhost:3004/v6'
 const LOCAL_REVIEW_API = 'http://localhost:3005/v6'
 const LOCAL_SKILLS_API_V5 = 'http://localhost:3006/v5/standardized-skills'
+const LOCAL_PROJECTS_API = 'http://localhost:3008/v6/projects'
 // Lookups API available on 3007 if needed in future
 // const LOCAL_LOOKUPS_API = 'http://localhost:3007/v6'
 
@@ -46,8 +47,8 @@ module.exports = {
   // Copilots and other apps remain on dev
   COPILOTS_URL: 'https://copilots.topcoder-dev.com',
 
-  // Projects API: keep dev unless you run projects locally
-  PROJECT_API_URL: `${DEV_API_HOSTNAME}/v5/projects`,
+  // Projects API v6: keep dev default (switch to LOCAL_PROJECTS_API when needed)
+  PROJECT_API_URL: `${DEV_API_HOSTNAME}/v6/projects`,
 
   // Local groups/resources/review services
   GROUPS_API_URL: `${LOCAL_GROUPS_API}/groups`,
diff --git a/config/constants/production.js b/config/constants/production.js
index c4f69daf..94c3e95e 100644
--- a/config/constants/production.js
+++ b/config/constants/production.js
@@ -29,7 +29,7 @@ module.exports = {
   CHALLENGE_PHASES_URL: `${PROD_API_HOSTNAME}/v6/challenge-phases`,
   CHALLENGE_TIMELINES_URL: `${PROD_API_HOSTNAME}/v6/challenge-timelines`,
   COPILOTS_URL: `https://copilots.${DOMAIN}`,
-  PROJECT_API_URL: `${PROD_API_HOSTNAME}/v5/projects`,
+  PROJECT_API_URL: `${PROD_API_HOSTNAME}/v6/projects`,
   GROUPS_API_URL: `${PROD_API_HOSTNAME}/v6/groups`,
   TERMS_API_URL: `${PROD_API_HOSTNAME}/v5/terms`,
   MEMBERS_API_URL: `${PROD_API_HOSTNAME}/v5/members`,
diff --git a/src/components/ChallengeEditor/ChallengeReviewer-Field/index.js b/src/components/ChallengeEditor/ChallengeReviewer-Field/index.js
index 0de3fa0b..d22fd537 100644
--- a/src/components/ChallengeEditor/ChallengeReviewer-Field/index.js
+++ b/src/components/ChallengeEditor/ChallengeReviewer-Field/index.js
@@ -61,6 +61,45 @@ const normalizeTrackForScorecards = (challenge, metadata) => {
   return null
 }
 
+const normalizePhaseToken = (value) => (value || '')
+  .toString()
+  .toLowerCase()
+  .trim()
+  .replace(/\bphase\b$/, '')
+  .replace(/[-_\s]/g, '')
+
+const normalizeIdValue = (value) => (
+  value === undefined || value === null
+    ? ''
+    : value.toString()
+)
+
+const getScorecardsForPhase = (scorecards = [], phases = [], phaseId) => {
+  const normalizedPhaseId = normalizeIdValue(phaseId)
+  if (!normalizedPhaseId) {
+    return []
+  }
+
+  const selectedPhase = phases.find(phase => (
+    normalizeIdValue(phase.phaseId) === normalizedPhaseId ||
+      normalizeIdValue(phase.id) === normalizedPhaseId
+  ))
+
+  if (!selectedPhase || !selectedPhase.name) {
+    return []
+  }
+
+  const normalizedPhaseName = normalizePhaseToken(selectedPhase.name)
+  if (!normalizedPhaseName) {
+    return []
+  }
+
+  return scorecards.filter(scorecard => (
+    scorecard &&
+      normalizePhaseToken(scorecard.type) === normalizedPhaseName
+  ))
+}
+
 class ChallengeReviewerField extends Component {
   constructor (props) {
     super(props)
@@ -602,6 +641,31 @@ class ChallengeReviewerField extends Component {
         baseCoefficient: defaultReviewer.baseCoefficient,
         incrementalCoefficient: defaultReviewer.incrementalCoefficient
       })
+
+      if (updatedReviewers[index] && (updatedReviewers[index].isMemberReview !== false)) {
+        const { metadata = {} } = this.props
+        const scorecardsForPhase = getScorecardsForPhase(
+          metadata.scorecards || [],
+          challenge.phases || [],
+          value
+        )
+        const currentScorecardId = normalizeIdValue(updatedReviewers[index].scorecardId)
+        const hasCurrentScorecard = scorecardsForPhase.some(scorecard => (
+          normalizeIdValue(scorecard.id) === currentScorecardId
+        ))
+
+        if (!hasCurrentScorecard) {
+          const defaultScorecardId = normalizeIdValue(defaultReviewer && defaultReviewer.scorecardId)
+          const hasDefaultScorecard = defaultScorecardId && scorecardsForPhase.some(scorecard => (
+            normalizeIdValue(scorecard.id) === defaultScorecardId
+          ))
+          const fallbackScorecardId = hasDefaultScorecard
+            ? defaultScorecardId
+            : normalizeIdValue(scorecardsForPhase[0] && scorecardsForPhase[0].id)
+
+          fieldUpdate.scorecardId = fallbackScorecardId || ''
+        }
+      }
     }
 
     if (field === 'memberReviewerCount') {
@@ -661,29 +725,12 @@ class ChallengeReviewerField extends Component {
     const { challenge, metadata = {}, readOnly = false } = this.props
     const { scorecards = [], workflows = [] } = metadata
     const validationErrors = challenge.submitTriggered ? this.validateReviewer(reviewer) : {}
-    const selectedPhase = challenge.phases.find(p => p.phaseId === reviewer.phaseId)
+    const filteredScorecards = getScorecardsForPhase(
+      scorecards,
+      challenge.phases || [],
+      reviewer.phaseId
+    )
     const isDesignChallenge = challenge && challenge.trackId === DES_TRACK_ID
-    const normalize = (value) => (value || '')
-      .toString()
-      .toLowerCase()
-      .trim()
-      .replace(/\bphase\b$/, '')
-      .replace(/[-_\s]/g, '')
-
-    const filteredScorecards = scorecards.filter(item => {
-      if (!selectedPhase || !selectedPhase.name || !item || !item.type) {
-        return false
-      }
-
-      const normalizedType = normalize(item.type)
-      const normalizedPhaseName = normalize(selectedPhase.name)
-
-      if (!normalizedType || !normalizedPhaseName) {
-        return false
-      }
-
-      return normalizedType === normalizedPhaseName
-    })
 
     return (
       <div key={`reviewer-${index}`} className={styles.reviewerForm}>
diff --git a/src/components/ChallengeEditor/FunChallengeField/FunChallengeField.module.scss b/src/components/ChallengeEditor/FunChallengeField/FunChallengeField.module.scss
new file mode 100644
index 00000000..422b7433
--- /dev/null
+++ b/src/components/ChallengeEditor/FunChallengeField/FunChallengeField.module.scss
@@ -0,0 +1,76 @@
+@use '../../../styles/includes' as *;
+
+.row {
+  box-sizing: border-box;
+  display: flex;
+  flex-direction: row;
+  margin: 30px 30px 0 30px;
+  align-content: space-between;
+  justify-content: flex-start;
+
+  .tcCheckbox {
+    @include tc-checkbox;
+
+    height: 18px;
+    width: 210px;
+    margin: 0;
+    padding: 0;
+    vertical-align: bottom;
+    position: relative;
+    display: inline-block;
+
+    input[type='checkbox'] {
+      display: none;
+    }
+
+    label {
+      @include roboto-light();
+
+      line-height: 17px;
+      font-weight: 300;
+      cursor: pointer;
+      position: absolute;
+      display: inline-block;
+      width: 14px;
+      height: 14px;
+      top: 0;
+      left: 0;
+      border: none;
+      box-shadow: none;
+      background: $tc-gray-30;
+      transition: all 0.15s ease-in-out;
+
+      &::after {
+        opacity: 0;
+        content: '';
+        position: absolute;
+        width: 9px;
+        height: 5px;
+        background: transparent;
+        top: 2px;
+        left: 2px;
+        border-top: none;
+        border-right: none;
+        transform: rotate(-45deg);
+        transition: all 0.15s ease-in-out;
+      }
+
+      &:hover::after {
+        opacity: 0.3;
+      }
+
+      div {
+        margin-left: 24px;
+        width: 300px;
+      }
+    }
+
+    input[type='checkbox']:checked ~ label {
+      background: $tc-blue-20;
+    }
+
+    input[type='checkbox']:checked + label::after {
+      border-color: $white;
+    }
+  }
+}
diff --git a/src/components/ChallengeEditor/FunChallengeField/index.js b/src/components/ChallengeEditor/FunChallengeField/index.js
new file mode 100644
index 00000000..d826b916
--- /dev/null
+++ b/src/components/ChallengeEditor/FunChallengeField/index.js
@@ -0,0 +1,47 @@
+import React from 'react'
+import PropTypes from 'prop-types'
+import styles from './FunChallengeField.module.scss'
+
+/**
+ * Renders a checkbox to toggle the `funChallenge` flag for Marathon Match challenges.
+ *
+ * @param {Object} props component props
+ * @param {Object} props.challenge challenge data object that may include `funChallenge`
+ * @param {Function} props.onUpdateOthers callback used to update top-level challenge fields
+ * @param {boolean} props.readOnly when true, renders the control as read-only
+ * @returns {import('react').ReactNode} rendered fun challenge checkbox field
+ */
+const FunChallengeField = ({ challenge, onUpdateOthers, readOnly }) => {
+  const isFunChallenge = challenge.funChallenge === true
+
+  return (
+    <div className={styles.row}>
+      <div className={styles.tcCheckbox}>
+        <input
+          name='funChallenge'
+          type='checkbox'
+          id='funChallenge'
+          checked={isFunChallenge}
+          readOnly={readOnly}
+          onChange={() => onUpdateOthers({ field: 'funChallenge', value: !isFunChallenge })}
+        />
+        <label htmlFor='funChallenge'>
+          <div>Fun Challenge</div>
+          <input type='hidden' />
+        </label>
+      </div>
+    </div>
+  )
+}
+
+FunChallengeField.defaultProps = {
+  readOnly: false
+}
+
+FunChallengeField.propTypes = {
+  challenge: PropTypes.shape().isRequired,
+  onUpdateOthers: PropTypes.func.isRequired,
+  readOnly: PropTypes.bool
+}
+
+export default FunChallengeField
diff --git a/src/components/ChallengeEditor/WiproAllowedField/WiproAllowedField.module.scss b/src/components/ChallengeEditor/WiproAllowedField/WiproAllowedField.module.scss
new file mode 100644
index 00000000..422b7433
--- /dev/null
+++ b/src/components/ChallengeEditor/WiproAllowedField/WiproAllowedField.module.scss
@@ -0,0 +1,76 @@
+@use '../../../styles/includes' as *;
+
+.row {
+  box-sizing: border-box;
+  display: flex;
+  flex-direction: row;
+  margin: 30px 30px 0 30px;
+  align-content: space-between;
+  justify-content: flex-start;
+
+  .tcCheckbox {
+    @include tc-checkbox;
+
+    height: 18px;
+    width: 210px;
+    margin: 0;
+    padding: 0;
+    vertical-align: bottom;
+    position: relative;
+    display: inline-block;
+
+    input[type='checkbox'] {
+      display: none;
+    }
+
+    label {
+      @include roboto-light();
+
+      line-height: 17px;
+      font-weight: 300;
+      cursor: pointer;
+      position: absolute;
+      display: inline-block;
+      width: 14px;
+      height: 14px;
+      top: 0;
+      left: 0;
+      border: none;
+      box-shadow: none;
+      background: $tc-gray-30;
+      transition: all 0.15s ease-in-out;
+
+      &::after {
+        opacity: 0;
+        content: '';
+        position: absolute;
+        width: 9px;
+        height: 5px;
+        background: transparent;
+        top: 2px;
+        left: 2px;
+        border-top: none;
+        border-right: none;
+        transform: rotate(-45deg);
+        transition: all 0.15s ease-in-out;
+      }
+
+      &:hover::after {
+        opacity: 0.3;
+      }
+
+      div {
+        margin-left: 24px;
+        width: 300px;
+      }
+    }
+
+    input[type='checkbox']:checked ~ label {
+      background: $tc-blue-20;
+    }
+
+    input[type='checkbox']:checked + label::after {
+      border-color: $white;
+    }
+  }
+}
diff --git a/src/components/ChallengeEditor/WiproAllowedField/index.js b/src/components/ChallengeEditor/WiproAllowedField/index.js
new file mode 100644
index 00000000..303dab55
--- /dev/null
+++ b/src/components/ChallengeEditor/WiproAllowedField/index.js
@@ -0,0 +1,47 @@
+import React from 'react'
+import PropTypes from 'prop-types'
+import styles from './WiproAllowedField.module.scss'
+
+/**
+ * Renders a checkbox to toggle the `wiproAllowed` flag for challenges.
+ *
+ * @param {Object} props component props
+ * @param {Object} props.challenge challenge data object that may include `wiproAllowed`
+ * @param {Function} props.onUpdateOthers callback used to update top-level challenge fields
+ * @param {boolean} props.readOnly when true, renders the control as read-only
+ * @returns {import('react').ReactNode} rendered wipro allowed checkbox field
+ */
+const WiproAllowedField = ({ challenge, onUpdateOthers, readOnly }) => {
+  const isWiproAllowed = challenge.wiproAllowed === true
+
+  return (
+    <div className={styles.row}>
+      <div className={styles.tcCheckbox}>
+        <input
+          name='wiproAllowed'
+          type='checkbox'
+          id='wiproAllowed'
+          checked={isWiproAllowed}
+          readOnly={readOnly}
+          onChange={() => onUpdateOthers({ field: 'wiproAllowed', value: !isWiproAllowed })}
+        />
+        <label htmlFor='wiproAllowed'>
+          <div>Wipro Allowed</div>
+          <input type='hidden' />
+        </label>
+      </div>
+    </div>
+  )
+}
+
+WiproAllowedField.defaultProps = {
+  readOnly: false
+}
+
+WiproAllowedField.propTypes = {
+  challenge: PropTypes.shape().isRequired,
+  onUpdateOthers: PropTypes.func.isRequired,
+  readOnly: PropTypes.bool
+}
+
+export default WiproAllowedField
diff --git a/src/components/ChallengeEditor/index.js b/src/components/ChallengeEditor/index.js
index 88297520..bb941f19 100644
--- a/src/components/ChallengeEditor/index.js
+++ b/src/components/ChallengeEditor/index.js
@@ -67,6 +67,8 @@ import AssignedMemberField from './AssignedMember-Field'
 import Tooltip from '../Tooltip'
 import CancelDropDown from './Cancel-Dropdown'
 import UseSchedulingAPIField from './UseSchedulingAPIField'
+import FunChallengeField from './FunChallengeField'
+import WiproAllowedField from './WiproAllowedField'
 
 import MilestoneField from './Milestone-Field'
 import DiscussionField from './Discussion-Field'
@@ -453,6 +455,9 @@ class ChallengeEditor extends Component {
    * @param isSub The option from sub field
    * @param field The challenge field
    * @param index The index of array
+   *
+   * Side effect: when `field` is `typeId` and the selected type is not Marathon Match,
+   * resets `funChallenge` to `false`.
    */
   onUpdateSelect (option, isSub = false, field = '', index = -1) {
     if (option) {
@@ -460,6 +465,9 @@ class ChallengeEditor extends Component {
       const newChallenge = { ...oldChallenge }
       if (!isSub) {
         newChallenge[field] = option
+        if (field === 'typeId' && option !== MARATHON_TYPE_ID) {
+          newChallenge.funChallenge = false
+        }
       } else {
         if (index < 0) {
           newChallenge[field][option.key] = option.name
@@ -786,8 +794,13 @@ class ChallengeEditor extends Component {
   }
 
   checkValidCopilot () {
-    const copilotFee = _.find(this.state.challenge.prizeSets, p => p.type === PRIZE_SETS_TYPE.COPILOT_PAYMENT, [])
-    if (copilotFee && parseInt(copilotFee.prizes[0].value) > 0 && !this.state.challenge.copilot) {
+    const { challenge } = this.state
+    if (challenge.funChallenge === true) {
+      return true
+    }
+
+    const copilotFee = _.find(challenge.prizeSets, p => p.type === PRIZE_SETS_TYPE.COPILOT_PAYMENT, [])
+    if (copilotFee && parseInt(copilotFee.prizes[0].value) > 0 && !challenge.copilot) {
       return false
     }
     return true
@@ -874,16 +887,17 @@ class ChallengeEditor extends Component {
 
   isValidChallenge () {
     const { challenge } = this.state
+    const isFunChallenge = challenge.funChallenge === true
     if (this.props.isNew) {
       const { name, trackId, typeId } = challenge
       return !!name && !!trackId && !!typeId
     }
 
-    if (!this.isValidChallengePrizes()) {
+    if (!isFunChallenge && !this.isValidChallengePrizes()) {
       return false
     }
 
-    if (!this.checkValidCopilot()) {
+    if (!isFunChallenge && !this.checkValidCopilot()) {
       return false
     }
 
@@ -899,9 +913,11 @@ class ChallengeEditor extends Component {
       'trackId',
       'typeId',
       'name',
-      'description',
-      'prizeSets'
+      'description'
     ]
+    if (!isFunChallenge) {
+      requiredFields.push('prizeSets')
+    }
     if (isSkillsRequired) {
       requiredFields.push('skills')
     }
@@ -1076,6 +1092,15 @@ class ChallengeEditor extends Component {
     }, 500)
   }
 
+  /**
+   * Collects challenge payload for create/update API calls.
+   *
+   * Includes `funChallenge` in picked challenge fields and, when `funChallenge`
+   * is enabled, forces `prizeSets` to an empty array before sending the payload.
+   *
+   * @param {string} status challenge status to set in payload
+   * @returns {Object} cloned challenge payload ready for API submission
+   */
   collectChallengeData (status) {
     const { isPhaseChange } = this.state
     const { attachments, metadata } = this.props
@@ -1098,7 +1123,9 @@ class ChallengeEditor extends Component {
       'discussions',
       'task',
       'skills',
-      'reviewers'
+      'reviewers',
+      'funChallenge',
+      'wiproAllowed'
     ], this.state.challenge)
     const isTask = _.find(metadata.challengeTypes, { id: challenge.typeId, isTask: true })
     challenge.legacy = _.assign(this.state.challenge.legacy, {
@@ -1110,6 +1137,9 @@ class ChallengeEditor extends Component {
       const prizes = p.prizes.map(s => ({ ...s, value: convertDollarToInteger(s.value, '$') }))
       return { ...p, prizes }
     })
+    if (challenge.funChallenge === true) {
+      challenge.prizeSets = []
+    }
     challenge.status = status
     if (status === CHALLENGE_STATUS.ACTIVE && isTask) {
       challenge.startDate = moment().format()
@@ -1810,6 +1840,8 @@ class ChallengeEditor extends Component {
     const copilotResources = metadata.members || challengeResources
     const isDesignChallenge = challenge.trackId === DES_TRACK_ID
     const isChallengeType = challenge.typeId === CHALLENGE_TYPE_ID
+    const isMarathonMatch = challenge.typeId === MARATHON_TYPE_ID
+    const isFunChallenge = challenge.funChallenge === true
     const showRoundType = isDesignChallenge && isChallengeType
     const showCheckpointPrizes = challenge.timelineTemplateId === MULTI_ROUND_CHALLENGE_TEMPLATE_ID
     const useDashboardData = _.find(challenge.metadata, { name: 'show_data_dashboard' })
@@ -1932,6 +1964,7 @@ class ChallengeEditor extends Component {
                 {/* remove terms field and use default term */}
                 {false && (<TermsField terms={metadata.challengeTerms} challenge={challenge} onUpdateMultiSelect={this.onUpdateMultiSelect} />)}
                 <GroupsField onUpdateMultiSelect={this.onUpdateMultiSelect} challenge={challenge} />
+                <WiproAllowedField challenge={challenge} onUpdateOthers={this.onUpdateOthers} />
                 <div className={styles.row}>
                   <div className={styles.col}>
                     <span>
@@ -2025,14 +2058,21 @@ class ChallengeEditor extends Component {
               token={token}
               removeAttachment={removeAttachment}
             />}
-            <ChallengePrizesField challenge={challenge} onUpdateOthers={this.onUpdateOthers} />
-            {
-              showCheckpointPrizes && (
-                <CheckpointPrizesField onUpdateOthers={this.onUpdateOthers} challenge={challenge} />
-              )
-            }
-            <CopilotFeeField challenge={challenge} onUpdateOthers={this.onUpdateOthers} />
-            <ChallengeTotalField challenge={challenge} />
+            {isMarathonMatch && (
+              <FunChallengeField challenge={challenge} onUpdateOthers={this.onUpdateOthers} />
+            )}
+            {!isFunChallenge && (
+              <>
+                <ChallengePrizesField challenge={challenge} onUpdateOthers={this.onUpdateOthers} />
+                {
+                  showCheckpointPrizes && (
+                    <CheckpointPrizesField onUpdateOthers={this.onUpdateOthers} challenge={challenge} />
+                  )
+                }
+                <CopilotFeeField challenge={challenge} onUpdateOthers={this.onUpdateOthers} />
+                <ChallengeTotalField challenge={challenge} />
+              </>
+            )}
           </div>
           {errorContainer}
           {actionButtons}

From 6f51c862e398a7c3aff866226cdea5a88e7a8adf Mon Sep 17 00:00:00 2001
From: Justin Gasper <jmgasper@gmail.com>
Date: Wed, 25 Feb 2026 16:00:03 +1100
Subject: [PATCH 05/17] Fix for project ID parsing issue that caused the
 projects header to not display

---
 .../ChallengeEditor/ChallengeView/index.js    | 29 ++++++++++++++-----
 src/components/ChallengeEditor/index.js       |  6 ++--
 src/containers/ChallengeEditor/index.js       | 18 ++++++++++--
 src/containers/Challenges/index.js            |  7 +++--
 src/services/challenges.js                    |  6 ++--
 5 files changed, 48 insertions(+), 18 deletions(-)

diff --git a/src/components/ChallengeEditor/ChallengeView/index.js b/src/components/ChallengeEditor/ChallengeView/index.js
index ee500aaa..8637bd6a 100644
--- a/src/components/ChallengeEditor/ChallengeView/index.js
+++ b/src/components/ChallengeEditor/ChallengeView/index.js
@@ -31,6 +31,7 @@ import {
 import PhaseInput from '../../PhaseInput'
 import CheckpointPrizesField from '../CheckpointPrizes-Field'
 import { isBetaMode } from '../../../util/localstorage'
+import WiproAllowedField from '../WiproAllowedField'
 
 const ChallengeView = ({
   projectDetail,
@@ -95,6 +96,7 @@ const ChallengeView = ({
   if (isLoading || _.isEmpty(metadata.challengePhases) || challenge.id !== challengeId) return <Loader />
   const showTimeline = false // disables the timeline for time being https://github.com/topcoder-platform/challenge-engine-ui/issues/706
   const isTask = _.get(challenge, 'task.isTask', false)
+  const isFunChallenge = challenge.funChallenge === true
   const phases = _.get(challenge, 'phases', [])
   const showCheckpointPrizes = _.get(challenge, 'timelineTemplateId') === MULTI_ROUND_CHALLENGE_TEMPLATE_ID
   const useDashboardData = _.find(challenge.metadata, { name: 'show_data_dashboard' })
@@ -195,6 +197,7 @@ const ChallengeView = ({
               <>
                 {dashboardToggle}
                 <NDAField beta challenge={challenge} readOnly />
+                <WiproAllowedField challenge={challenge} onUpdateOthers={() => {}} readOnly />
                 <div className={cn(styles.row, styles.topRow)}>
                   <div className={styles.col}>
                     <span><span className={styles.fieldTitle}>Groups:</span> {groups}</span>
@@ -262,14 +265,24 @@ const ChallengeView = ({
               token={token}
               readOnly
             />}
-            <ChallengePrizesField challenge={challenge} readOnly />
-            {
-              showCheckpointPrizes && (
-                <CheckpointPrizesField challenge={challenge} readOnly />
-              )
-            }
-            <CopilotFeeField challenge={challenge} readOnly />
-            <ChallengeTotalField challenge={challenge} />
+            {isFunChallenge ? (
+              <div className={cn(styles.row, styles.topRow)}>
+                <div className={styles.col}>
+                  <span><span className={styles.fieldTitle}>Fun Challenge:</span> True</span>
+                </div>
+              </div>
+            ) : (
+              <>
+                <ChallengePrizesField challenge={challenge} readOnly />
+                {
+                  showCheckpointPrizes && (
+                    <CheckpointPrizesField challenge={challenge} readOnly />
+                  )
+                }
+                <CopilotFeeField challenge={challenge} readOnly />
+                <ChallengeTotalField challenge={challenge} />
+              </>
+            )}
           </div>
         </div>
       </div>
diff --git a/src/components/ChallengeEditor/index.js b/src/components/ChallengeEditor/index.js
index bb941f19..de2c2cce 100644
--- a/src/components/ChallengeEditor/index.js
+++ b/src/components/ChallengeEditor/index.js
@@ -1096,7 +1096,7 @@ class ChallengeEditor extends Component {
    * Collects challenge payload for create/update API calls.
    *
    * Includes `funChallenge` in picked challenge fields and, when `funChallenge`
-   * is enabled, forces `prizeSets` to an empty array before sending the payload.
+   * is enabled, omits `prizeSets` from the payload.
    *
    * @param {string} status challenge status to set in payload
    * @returns {Object} cloned challenge payload ready for API submission
@@ -1133,12 +1133,12 @@ class ChallengeEditor extends Component {
     })
     challenge.timelineTemplateId = _.get(this.getCurrentTemplate(), 'id')
     challenge.projectId = this.props.projectId
-    challenge.prizeSets = challenge.prizeSets.map(p => {
+    challenge.prizeSets = (challenge.prizeSets || []).map(p => {
       const prizes = p.prizes.map(s => ({ ...s, value: convertDollarToInteger(s.value, '$') }))
       return { ...p, prizes }
     })
     if (challenge.funChallenge === true) {
-      challenge.prizeSets = []
+      delete challenge.prizeSets
     }
     challenge.status = status
     if (status === CHALLENGE_STATUS.ACTIVE && isTask) {
diff --git a/src/containers/ChallengeEditor/index.js b/src/containers/ChallengeEditor/index.js
index 2147fdc9..5cb3a294 100644
--- a/src/containers/ChallengeEditor/index.js
+++ b/src/containers/ChallengeEditor/index.js
@@ -129,14 +129,28 @@ class ChallengeEditor extends Component {
 
   componentWillReceiveProps (nextProps) {
     const { match } = this.props
-    const { match: newMatch, loadChallengeDetails, loadResources, loadSubmissions, projectDetail, loggedInUser } = nextProps
+    const {
+      match: newMatch,
+      loadChallengeDetails,
+      loadResources,
+      loadSubmissions,
+      projectDetail,
+      loggedInUser,
+      submissionsPerPage
+    } = nextProps
     const projectId = _.get(newMatch.params, 'projectId', null)
     const challengeId = _.get(newMatch.params, 'challengeId', null)
     if (
       _.get(match.params, 'projectId', null) !== projectId ||
       _.get(match.params, 'challengeId', null) !== challengeId
     ) {
-      this.fetchChallengeDetails(newMatch, loadChallengeDetails, loadResources, loadSubmissions)
+      this.fetchChallengeDetails(
+        newMatch,
+        loadChallengeDetails,
+        loadResources,
+        loadSubmissions,
+        submissionsPerPage
+      )
     } else {
       this.setState({ challengeDetails: nextProps.challengeDetails })
     }
diff --git a/src/containers/Challenges/index.js b/src/containers/Challenges/index.js
index f3edb55a..871f078b 100644
--- a/src/containers/Challenges/index.js
+++ b/src/containers/Challenges/index.js
@@ -150,14 +150,15 @@ class Challenges extends Component {
       fetchNextProjects
     } = this.props
     const { challengeTypes = [] } = metadata
+    const isActiveProjectLoaded =
+      reduxProjectInfo && `${reduxProjectInfo.id}` === `${activeProjectId}`
+
     return (
       <Fragment>
         {(dashboard || activeProjectId !== -1 || selfService) && (
           <ChallengesComponent
             activeProject={{
-              ...(reduxProjectInfo && reduxProjectInfo.id === activeProjectId
-                ? reduxProjectInfo
-                : {})
+              ...(isActiveProjectLoaded ? reduxProjectInfo : {})
             }}
             fetchNextProjects={fetchNextProjects}
             warnMessage={warnMessage}
diff --git a/src/services/challenges.js b/src/services/challenges.js
index 1119fe77..6e99dc48 100644
--- a/src/services/challenges.js
+++ b/src/services/challenges.js
@@ -272,10 +272,12 @@ export async function fetchResources (challengeId) {
 /**
 * Api request for fetching submissions
 * @param challengeId Challenge id
+* @param {Object} pageObj pagination options
 * @returns {Promise<*>}
 */
-export async function fetchSubmissions (challengeId, pageObj) {
-  const { page, perPage } = pageObj
+export async function fetchSubmissions (challengeId, pageObj = {}) {
+  const page = _.get(pageObj, 'page', 1)
+  const perPage = _.get(pageObj, 'perPage', 10)
   const response = await axiosInstance.get(`${SUBMISSIONS_API_URL}?challengeId=${challengeId}&perPage=${perPage}&page=${page}`)
   const responseData = _.get(response, 'data', {})
   const meta = _.get(responseData, 'meta', {})

From eee18e734d370db8a8d295d1c2d848b99da56712 Mon Sep 17 00:00:00 2001
From: himaniraghav3 <himaniraghav0311@gmail.com>
Date: Thu, 26 Feb 2026 17:04:56 +0530
Subject: [PATCH 06/17] PM-3879 Fix typo

---
 src/components/ChallengeEditor/Resources/index.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/ChallengeEditor/Resources/index.js b/src/components/ChallengeEditor/Resources/index.js
index f6385283..fef48d22 100644
--- a/src/components/ChallengeEditor/Resources/index.js
+++ b/src/components/ChallengeEditor/Resources/index.js
@@ -480,7 +480,7 @@ export default class Resources extends React.Component {
                       </span>
                     </td>
                     <td className={styles['col-7Table']}>
-                      <span role='cell'>{r.email}</span>
+                      <span role='cell'>{r.memberEmail}</span>
                     </td>
                     <td className={styles['col-4']}>
                       <span role='cell'>{formatDate(r.created)}</span>

From 33fd39c89418c3edf40f55b7e5515bcf3e9bacca Mon Sep 17 00:00:00 2001
From: Justin Gasper <jmgasper@gmail.com>
Date: Fri, 27 Feb 2026 17:19:35 +1100
Subject: [PATCH 07/17] Remove connect admin as a historical administrator role

---
 src/config/constants.js | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/src/config/constants.js b/src/config/constants.js
index ba943753..520df9c4 100644
--- a/src/config/constants.js
+++ b/src/config/constants.js
@@ -420,8 +420,7 @@ export const READ_ONLY_ROLES = [
 ]
 
 export const ADMIN_ROLES = [
-  'administrator',
-  'connect admin'
+  'administrator'
 ]
 
 export const COPILOT_ROLES = [

From 285be20266b02b24b98396cc0e24caeda3bbb9fe Mon Sep 17 00:00:00 2001
From: Justin Gasper <jmgasper@gmail.com>
Date: Tue, 3 Mar 2026 08:47:18 +1100
Subject: [PATCH 08/17] Allow PM / TM access to create projects (PM-4130)

---
 src/components/ChallengesComponent/index.js | 5 +++--
 src/containers/ProjectEditor/index.js       | 7 ++++---
 src/containers/Projects/index.js            | 4 ++--
 src/util/tc.js                              | 8 ++++++++
 4 files changed, 17 insertions(+), 7 deletions(-)

diff --git a/src/components/ChallengesComponent/index.js b/src/components/ChallengesComponent/index.js
index 4fbe77b6..79bcf8d4 100644
--- a/src/components/ChallengesComponent/index.js
+++ b/src/components/ChallengesComponent/index.js
@@ -11,7 +11,7 @@ import { PROJECT_ROLES, PROJECT_STATUS, COPILOTS_URL, CHALLENGE_STATUS } from '.
 import { PrimaryButton, OutlineButton } from '../Buttons'
 import ChallengeList from './ChallengeList'
 import styles from './ChallengesComponent.module.scss'
-import { checkAdmin, checkReadOnlyRoles, checkAdminOrCopilot, checkManager } from '../../util/tc'
+import { checkAdmin, checkReadOnlyRoles, checkAdminOrCopilot, checkAdminOrCopilotOrManager, checkManager } from '../../util/tc'
 
 const ChallengesComponent = ({
   challenges,
@@ -52,6 +52,7 @@ const ChallengesComponent = ({
   const [loginUserRoleInProject, setLoginUserRoleInProject] = useState('')
   const isReadOnly = checkReadOnlyRoles(auth.token) || loginUserRoleInProject === PROJECT_ROLES.READ
   const isAdminOrCopilot = checkAdminOrCopilot(auth.token, activeProject)
+  const canEditProject = checkAdminOrCopilotOrManager(auth.token, activeProject)
 
   const projectStatus = activeProject && activeProject.status
     ? activeProject.status.toUpperCase()
@@ -77,7 +78,7 @@ const ChallengesComponent = ({
             {activeProject ? activeProject.name : ''}
             {activeProject && activeProject.status && <ProjectStatus className={styles.status} status={activeProject.status} />}
           </div>
-          {activeProject && activeProject.id && isAdminOrCopilot && (
+          {activeProject && activeProject.id && canEditProject && (
             <span>
               (
               <Link
diff --git a/src/containers/ProjectEditor/index.js b/src/containers/ProjectEditor/index.js
index 2627e99e..d6e6d116 100644
--- a/src/containers/ProjectEditor/index.js
+++ b/src/containers/ProjectEditor/index.js
@@ -15,7 +15,7 @@ import {
   updateProject
 } from '../../actions/projects'
 import { setActiveProject } from '../../actions/sidebar'
-import { checkAdminOrCopilot, checkAdmin, checkIsUserInvitedToProject } from '../../util/tc'
+import { checkAdminOrCopilotOrManager, checkAdmin, checkIsUserInvitedToProject, checkManager } from '../../util/tc'
 import { PROJECT_ROLES } from '../../config/constants'
 import Loader from '../../components/Loader'
 
@@ -42,7 +42,7 @@ class ProjectEditor extends Component {
       this.props.history.push(`/projects/${this.props.projectDetail.id}/invitation`)
     }
 
-    if (!checkAdminOrCopilot(auth.token, this.props.projectDetail)) {
+    if (!checkAdminOrCopilotOrManager(auth.token, this.props.projectDetail)) {
       this.props.history.push('/projects')
     }
   }
@@ -96,8 +96,9 @@ class ProjectEditor extends Component {
     if (isProjectTypesLoading || (isEdit && isProjectLoading)) return <Loader />
 
     const isAdmin = checkAdmin(this.props.auth.token)
+    const isManager = checkManager(this.props.auth.token)
     const isCopilotOrManager = this.checkIsCopilotOrManager(_.get(projectDetail, 'members', []), _.get(this.props.auth, 'user.userId', null))
-    const canManage = isAdmin || isCopilotOrManager
+    const canManage = isAdmin || isManager || isCopilotOrManager
 
     const projectId = this.getProjectId(match)
     return (
diff --git a/src/containers/Projects/index.js b/src/containers/Projects/index.js
index 893f3f78..0088575a 100644
--- a/src/containers/Projects/index.js
+++ b/src/containers/Projects/index.js
@@ -5,7 +5,7 @@ import { withRouter, Link } from 'react-router-dom'
 import { connect } from 'react-redux'
 import PropTypes from 'prop-types'
 import Loader from '../../components/Loader'
-import { checkAdminOrCopilot, checkIsUserInvitedToProject, checkManager } from '../../util/tc'
+import { checkAdminOrCopilotOrManager, checkIsUserInvitedToProject, checkManager } from '../../util/tc'
 import { PrimaryButton } from '../../components/Buttons'
 import Select from '../../components/Select'
 import ProjectCard from '../../components/ProjectCard'
@@ -49,7 +49,7 @@ const Projects = ({ projects, auth, isLoading, projectsCount, loadProjects, load
     <div className={styles.container}>
       <div className={styles.headerLine}>
         <h2>Projects</h2>
-        {checkAdminOrCopilot(auth.token) && (
+        {checkAdminOrCopilotOrManager(auth.token) && (
           <Link className={styles.buttonNewProject} to={`/projects/new`}>
             <PrimaryButton text={'New Project'} type={'info'} />
           </Link>
diff --git a/src/util/tc.js b/src/util/tc.js
index 80c0350b..11034633 100644
--- a/src/util/tc.js
+++ b/src/util/tc.js
@@ -269,6 +269,14 @@ export const checkAdminOrCopilot = (token, project) => {
   return isAdmin || (isCopilot && canManageProject)
 }
 
+/**
+ * Checks if token has any of the admin, copilot, or manager roles
+ * @param  token
+ */
+export const checkAdminOrCopilotOrManager = (token, project) => {
+  return checkManager(token) || checkAdminOrCopilot(token, project)
+}
+
 export const checkIsUserInvitedToProject = (token, project) => {
   if (!token) {
     return

From 52014c7e734115d47752bb083c227bf719739154 Mon Sep 17 00:00:00 2001
From: Justin Gasper <jmgasper@gmail.com>
Date: Fri, 6 Mar 2026 12:07:49 +1100
Subject: [PATCH 09/17] QA bug fixes

---
 src/actions/engagements.js                    |  15 +-
 src/actions/projects.js                       |  28 +++
 src/components/EngagementEditor/index.js      |  75 ++++++++
 src/components/EngagementPayment/index.js     |  35 +++-
 .../EngagementsList.module.scss               |  11 +-
 src/components/EngagementsList/index.js       | 138 +++++++++++++-
 src/components/EngagementsList/index.test.js  | 153 +++++++++++++++
 src/components/FieldUserAutoComplete/index.js |  23 ++-
 src/components/Tab/index.js                   |   5 +-
 src/components/UserCard/index.js              |  14 +-
 src/config/constants.js                       |   1 +
 src/containers/EngagementEditor/index.js      |  83 +++++++-
 src/containers/EngagementsList/index.js       |  84 ++++++++-
 src/containers/ProjectAssets/index.jsx        |   5 +-
 src/containers/ProjectEditor/index.js         |  24 ++-
 src/containers/Tab/index.js                   |  43 +++--
 src/containers/Users/index.js                 |   9 +
 src/reducers/projects.js                      |   8 +
 src/routes.js                                 | 178 +++++++++++++++---
 src/services/projects.js                      |  34 +++-
 src/util/engagements.js                       |   2 +
 src/util/engagements.test.js                  |  18 ++
 src/util/tc.js                                |  17 ++
 23 files changed, 912 insertions(+), 91 deletions(-)
 create mode 100644 src/components/EngagementsList/index.test.js
 create mode 100644 src/util/engagements.test.js

diff --git a/src/actions/engagements.js b/src/actions/engagements.js
index 34ebbdee..ae72cd24 100644
--- a/src/actions/engagements.js
+++ b/src/actions/engagements.js
@@ -195,9 +195,19 @@ const hydrateEngagementSkills = async (engagements = []) => {
  * @param {String} status
  * @param {String} filterName
  * @param {Boolean} includePrivate
+ * @param {Array<String>} projectIds
  */
-export function loadEngagements (projectId, status = 'all', filterName = '', includePrivate = false) {
+export function loadEngagements (projectId, status = 'all', filterName = '', includePrivate = false, projectIds = []) {
+  const hasProjectIdsArg = arguments.length >= 5
   return async (dispatch) => {
+    if (hasProjectIdsArg && Array.isArray(projectIds) && !projectIds.length) {
+      dispatch({
+        type: LOAD_ENGAGEMENTS_SUCCESS,
+        engagements: []
+      })
+      return
+    }
+
     dispatch({
       type: LOAD_ENGAGEMENTS_PENDING
     })
@@ -215,6 +225,9 @@ export function loadEngagements (projectId, status = 'all', filterName = '', inc
     if (includePrivate) {
       filters.includePrivate = true
     }
+    if (projectIds && projectIds.length) {
+      filters.projectIds = projectIds
+    }
 
     try {
       const engagements = []
diff --git a/src/actions/projects.js b/src/actions/projects.js
index 89b1f6b5..72ffea42 100644
--- a/src/actions/projects.js
+++ b/src/actions/projects.js
@@ -14,6 +14,7 @@ import {
   LOAD_CHALLENGE_MEMBERS,
   LOAD_PROJECT_TYPES,
   CREATE_PROJECT,
+  CLEAR_PROJECT_DETAIL,
   LOAD_PROJECT_BILLING_ACCOUNTS,
   UPDATE_PROJECT_PENDING,
   UPDATE_PROJECT_SUCCESS,
@@ -36,6 +37,18 @@ import {
 } from '../services/projects'
 import { checkAdmin, checkManager } from '../util/tc'
 
+/**
+ * Loads projects with optional filters and enforces membership scoping for
+ * non-admin/non-manager users.
+ *
+ * Backend contract: when `memberOnly` is true, the API must apply
+ * membership/invite visibility constraints so users only receive projects they
+ * can access.
+ *
+ * @param {string} projectNameOrIdFilter Optional id/keyword filter.
+ * @param {Object} paramFilters Additional query filters.
+ * @returns {Function} Redux thunk.
+ */
 function _loadProjects (projectNameOrIdFilter = '', paramFilters = {}) {
   return (dispatch, getState) => {
     dispatch({
@@ -57,6 +70,7 @@ function _loadProjects (projectNameOrIdFilter = '', paramFilters = {}) {
     }
 
     if (!checkAdmin(getState().auth.token) && !checkManager(getState().auth.token)) {
+      // Non-admin users must always be server-scoped to member-visible projects.
       filters['memberOnly'] = true
     }
 
@@ -161,6 +175,20 @@ export function loadProject (projectId, filterMembers = true) {
   }
 }
 
+/**
+ * Clears the currently selected project details from Redux state.
+ * Use this when entering a create-project flow so stale project data is not reused.
+ *
+ * @returns {Function} thunk dispatching the clear action
+ */
+export function clearProjectDetail () {
+  return (dispatch) => {
+    return dispatch({
+      type: CLEAR_PROJECT_DETAIL
+    })
+  }
+}
+
 /**
  * Loads project types
  */
diff --git a/src/components/EngagementEditor/index.js b/src/components/EngagementEditor/index.js
index f175fcb8..0cadd8d0 100644
--- a/src/components/EngagementEditor/index.js
+++ b/src/components/EngagementEditor/index.js
@@ -93,6 +93,16 @@ const formatAssignmentDate = (value) => {
   return moment(value).format('MMM DD, YYYY HH:mm')
 }
 
+/**
+ * Engagement editor form.
+ *
+ * @param {Object} props Component props.
+ * @param {Object} props.engagement Engagement draft values.
+ * @param {Array<Object>} props.projects Available projects for Parent Project selection.
+ * @param {boolean} props.isLoadingProjects Whether parent project options are loading.
+ * @param {boolean} props.canEditParentProject Whether current user can edit Parent Project.
+ * @returns {JSX.Element}
+ */
 const EngagementEditor = ({
   engagement,
   projectId,
@@ -100,6 +110,9 @@ const EngagementEditor = ({
   isLoading,
   isSaving,
   canEdit,
+  projects,
+  isLoadingProjects,
+  canEditParentProject,
   submitTriggered,
   validationErrors,
   showDeleteModal,
@@ -203,6 +216,29 @@ const EngagementEditor = ({
   const selectedCountries = (engagement.countries || []).map(code => {
     return countryOptionsByValue[code] || { label: code, value: code }
   })
+  const projectOptions = useMemo(() => {
+    if (!Array.isArray(projects)) {
+      return []
+    }
+    return projects
+      .filter((project) => project && project.id != null)
+      .map((project) => ({
+        label: project.name || `Project ${project.id}`,
+        value: String(project.id)
+      }))
+  }, [projects])
+  const selectedParentProjectOption = useMemo(() => {
+    const selectedId = engagement.projectId != null
+      ? String(engagement.projectId)
+      : (projectId != null ? String(projectId) : null)
+    if (!selectedId) {
+      return null
+    }
+    return projectOptions.find((option) => option.value === selectedId) || null
+  }, [engagement.projectId, projectId, projectOptions])
+  const parentProjectName = selectedParentProjectOption
+    ? selectedParentProjectOption.label
+    : (engagement.projectName || '-')
   const selectedRoleOption = useMemo(() => {
     if (!engagement.role) {
       return null
@@ -884,6 +920,34 @@ const EngagementEditor = ({
               </div>
             </div>
 
+            {!isNew && (
+              <div className={styles.row}>
+                <div className={cn(styles.field, styles.col1)}>
+                  <label>Parent Project :</label>
+                </div>
+                <div className={cn(styles.field, styles.col2)}>
+                  {canEdit && canEditParentProject ? (
+                    <Select
+                      className={styles.selectInput}
+                      useBottomBorder
+                      options={projectOptions}
+                      value={selectedParentProjectOption}
+                      isLoading={isLoadingProjects}
+                      onChange={(option) => onUpdateInput({
+                        target: {
+                          name: 'projectId',
+                          value: option ? String(option.value) : null
+                        }
+                      })}
+                      isClearable
+                    />
+                  ) : (
+                    <div className={styles.readOnlyValue}>{parentProjectName}</div>
+                  )}
+                </div>
+              </div>
+            )}
+
             <div className={styles.row}>
               <div className={cn(styles.field, styles.col1)}>
                 <label htmlFor={canEdit ? 'requiredMemberCount' : undefined}>Required Members :</label>
@@ -1076,6 +1140,9 @@ EngagementEditor.defaultProps = {
   isLoading: false,
   isSaving: false,
   canEdit: true,
+  projects: [],
+  isLoadingProjects: false,
+  canEditParentProject: false,
   submitTriggered: false,
   validationErrors: {},
   showDeleteModal: false,
@@ -1092,6 +1159,8 @@ EngagementEditor.defaultProps = {
 EngagementEditor.propTypes = {
   engagement: PropTypes.shape({
     id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+    projectId: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+    projectName: PropTypes.string,
     title: PropTypes.string,
     description: PropTypes.string,
     durationWeeks: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
@@ -1141,6 +1210,12 @@ EngagementEditor.propTypes = {
   isLoading: PropTypes.bool,
   isSaving: PropTypes.bool,
   canEdit: PropTypes.bool,
+  projects: PropTypes.arrayOf(PropTypes.shape({
+    id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+    name: PropTypes.string
+  })),
+  isLoadingProjects: PropTypes.bool,
+  canEditParentProject: PropTypes.bool,
   submitTriggered: PropTypes.bool,
   validationErrors: PropTypes.shape({
     title: PropTypes.string,
diff --git a/src/components/EngagementPayment/index.js b/src/components/EngagementPayment/index.js
index 07206baa..db84a26f 100644
--- a/src/components/EngagementPayment/index.js
+++ b/src/components/EngagementPayment/index.js
@@ -175,6 +175,11 @@ const getAssignmentRemarks = (member) => {
   return ''
 }
 
+/**
+ * Displays assignment payment controls and history for engagement members.
+ * Payment history is available for any assignment status as long as an
+ * assignment ID is present.
+ */
 const EngagementPayment = ({
   engagement,
   projectName,
@@ -387,7 +392,8 @@ const EngagementPayment = ({
             const assignmentStatusRaw = getAssignmentStatus(member)
             const normalizedAssignmentStatus = normalizeAssignmentStatus(assignmentStatusRaw)
             const assignmentStatusLabel = normalizedAssignmentStatus || 'Unknown'
-            const isAssignedStatus = normalizedAssignmentStatus.toLowerCase() === 'assigned'
+            const assignmentStatusLower = normalizedAssignmentStatus.toLowerCase()
+            const isAssignedStatus = assignmentStatusLower === 'assigned'
             const isRowTerminating = assignmentKey && terminatingAssignments
               ? Boolean(terminatingAssignments[assignmentKey])
               : false
@@ -440,20 +446,29 @@ const EngagementPayment = ({
                         <span className={styles.memberMetaLabel}>Tentative End</span>
                         <span className={styles.memberMetaValue}>{endDate}</span>
                       </div>
+                      {assignmentStatusLower === 'terminated' && member.terminationReason && (
+                        <div className={styles.memberMetaItem}>
+                          <span className={styles.memberMetaLabel}>Termination Reason</span>
+                          <span className={styles.memberMetaValue}>{member.terminationReason}</span>
+                        </div>
+                      )}
                     </div>
                   </div>
                   <div className={styles.memberActions}>
+                    {/* Payment history is available for any assignment status with an assignment ID. */}
+                    {hasAssignmentId && (
+                      <button
+                        type='button'
+                        className={styles.toggleButton}
+                        onClick={() => openPaymentHistoryModal(member)}
+                        disabled={!assignmentKey}
+                        aria-haspopup='dialog'
+                      >
+                        Show Payment History
+                      </button>
+                    )}
                     {isAssignedStatus && (
                       <>
-                        <button
-                          type='button'
-                          className={styles.toggleButton}
-                          onClick={() => openPaymentHistoryModal(member)}
-                          disabled={!assignmentKey}
-                          aria-haspopup='dialog'
-                        >
-                          Show Payment History
-                        </button>
                         <PrimaryButton
                           text='Pay'
                           type='info'
diff --git a/src/components/EngagementsList/EngagementsList.module.scss b/src/components/EngagementsList/EngagementsList.module.scss
index c8fcea3b..348a86bf 100644
--- a/src/components/EngagementsList/EngagementsList.module.scss
+++ b/src/components/EngagementsList/EngagementsList.module.scss
@@ -121,6 +121,11 @@
   color: $tc-gray-90;
 }
 
+.statusOnHold {
+  background: $tc-gray-40;
+  color: $tc-gray-80;
+}
+
 .statusCancelled {
   background: $tc-red-20;
   color: $tc-gray-90;
@@ -138,9 +143,9 @@
 }
 
 .actionsColumn {
-  width: 300px;
-  min-width: 300px;
-  max-width: 300px;
+  width: 360px;
+  min-width: 360px;
+  max-width: 360px;
 }
 
 .applicationsLink {
diff --git a/src/components/EngagementsList/index.js b/src/components/EngagementsList/index.js
index 84dde97e..6a09d345 100644
--- a/src/components/EngagementsList/index.js
+++ b/src/components/EngagementsList/index.js
@@ -5,6 +5,7 @@ import { PrimaryButton, OutlineButton } from '../Buttons'
 import Tooltip from '../Tooltip'
 import Loader from '../Loader'
 import Select from '../Select'
+import ConfirmationModal from '../Modal/ConfirmationModal'
 import { ENGAGEMENTS_APP_URL } from '../../config/constants'
 import { getCountableAssignments } from '../../util/engagements'
 import styles from './EngagementsList.module.scss'
@@ -13,6 +14,7 @@ const STATUS_OPTIONS = [
   { label: 'All', value: 'all' },
   { label: 'Open', value: 'Open' },
   { label: 'Active', value: 'Active' },
+  { label: 'On Hold', value: 'On Hold' },
   { label: 'Cancelled', value: 'Cancelled' },
   { label: 'Closed', value: 'Closed' }
 ]
@@ -23,7 +25,6 @@ const VISIBILITY_OPTIONS = [
   { label: 'Private', value: 'private' }
 ]
 
-const DEFAULT_STATUS_OPTION = STATUS_OPTIONS.find((option) => option.value === 'Open') || STATUS_OPTIONS[0]
 const ALL_STATUS_OPTION = STATUS_OPTIONS.find((option) => option.value === 'all') || STATUS_OPTIONS[0]
 const DEFAULT_VISIBILITY_OPTION = VISIBILITY_OPTIONS[0]
 
@@ -37,6 +38,9 @@ const getStatusClass = (status) => {
   if (status === 'Active') {
     return styles.statusActive
   }
+  if (status === 'On Hold') {
+    return styles.statusOnHold
+  }
   if (status === 'Cancelled') {
     return styles.statusCancelled
   }
@@ -139,17 +143,117 @@ const getEngagementProjectName = (engagement, fallbackProjectName = null) => {
   return null
 }
 
+/**
+ * Displays a filterable engagement table for a project (or all projects).
+ * Defaults the status filter to All for both project-scoped and all-project views.
+ * Supports status filtering for All, Open, Active, On Hold, Cancelled,
+ * and Closed engagements.
+ * Supports admin-only deletion through a confirmation modal using the
+ * `deleteEngagement` action; member-assignment delete conflicts are surfaced
+ * inline in the modal so the dialog remains open for user correction.
+ */
 const EngagementsList = ({
   engagements,
   projectId,
   projectDetail,
   allEngagements,
   isLoading,
-  canManage
+  canManage,
+  isAdmin,
+  deleteEngagement
 }) => {
   const [searchProjectName, setSearchProjectName] = useState('')
-  const [statusFilter, setStatusFilter] = useState(allEngagements ? ALL_STATUS_OPTION : DEFAULT_STATUS_OPTION)
+  const [statusFilter, setStatusFilter] = useState(ALL_STATUS_OPTION)
   const [visibilityFilter, setVisibilityFilter] = useState(DEFAULT_VISIBILITY_OPTION)
+  const [deleteTarget, setDeleteTarget] = useState(null)
+  const [isDeleting, setIsDeleting] = useState(false)
+  const [deleteError, setDeleteError] = useState('')
+
+  const handleDeleteClick = (engagement) => {
+    setDeleteTarget(engagement)
+    setDeleteError('')
+  }
+
+  const handleDeleteCancel = () => {
+    setDeleteTarget(null)
+    setDeleteError('')
+    setIsDeleting(false)
+  }
+
+  const handleDeleteConfirm = async () => {
+    if (!deleteTarget || !deleteTarget.id) {
+      return
+    }
+
+    setIsDeleting(true)
+    setDeleteError('')
+
+    try {
+      await deleteEngagement(deleteTarget.id, deleteTarget.projectId)
+      handleDeleteCancel()
+    } catch (error) {
+      const fallbackErrorMessage = 'Unable to delete engagement. Please try again.'
+      const apiMessage = error && error.response && error.response.data && error.response.data.message
+      let errorMessage = fallbackErrorMessage
+
+      if (typeof apiMessage === 'string') {
+        const trimmedApiMessage = apiMessage.trim()
+        if (trimmedApiMessage) {
+          errorMessage = trimmedApiMessage
+        }
+      } else if (Array.isArray(apiMessage)) {
+        const joinedApiMessage = apiMessage
+          .map((messagePart) => {
+            if (typeof messagePart === 'string') {
+              return messagePart.trim()
+            }
+            if (messagePart === null || typeof messagePart === 'undefined') {
+              return ''
+            }
+            if (typeof messagePart === 'object') {
+              try {
+                return JSON.stringify(messagePart)
+              } catch (stringifyError) {
+                return ''
+              }
+            }
+            return String(messagePart)
+          })
+          .filter(Boolean)
+          .join(', ')
+
+        if (joinedApiMessage) {
+          errorMessage = joinedApiMessage
+        }
+      } else if (apiMessage && typeof apiMessage === 'object') {
+        try {
+          const serializedApiMessage = JSON.stringify(apiMessage)
+          if (serializedApiMessage && serializedApiMessage !== '{}') {
+            errorMessage = serializedApiMessage
+          }
+        } catch (stringifyError) {
+          // Keep fallback message when serialization fails
+        }
+      } else if (apiMessage !== null && typeof apiMessage !== 'undefined') {
+        const convertedApiMessage = String(apiMessage).trim()
+        if (convertedApiMessage) {
+          errorMessage = convertedApiMessage
+        }
+      } else if (error && typeof error.message === 'string' && error.message.trim()) {
+        errorMessage = error.message.trim()
+      }
+
+      const normalizedMessage = typeof errorMessage === 'string' ? errorMessage.toLowerCase() : ''
+      const hasMembersAssignedError = normalizedMessage.includes('member') && normalizedMessage.includes('assign')
+
+      if (hasMembersAssignedError) {
+        setDeleteError('This engagement has members assigned. Please cancel the engagement instead of deleting it.')
+      } else {
+        setDeleteError(errorMessage)
+      }
+      setIsDeleting(false)
+    }
+  }
 
   const filteredOpportunities = useMemo(() => {
     const fallbackProjectName = !allEngagements && projectDetail && projectDetail.name
@@ -337,6 +441,13 @@ const EngagementsList = ({
                           link={engagementProjectId && engagement.id ? `/projects/${engagementProjectId}/engagements/${engagement.id}` : null}
                           disabled={!engagementProjectId || !engagement.id}
                         />
+                        {canManage && isAdmin && engagement.id && (
+                          <OutlineButton
+                            text='Delete'
+                            type='danger'
+                            onClick={() => handleDeleteClick(engagement)}
+                          />
+                        )}
                       </div>
                     ) : (
                       '-'
@@ -348,6 +459,19 @@ const EngagementsList = ({
           </tbody>
         </table>
       )}
+      {deleteTarget && (
+        <ConfirmationModal
+          title='Confirm Delete'
+          message={`Are you sure you want to delete "${deleteTarget.title || 'this engagement'}"? This action cannot be undone.`}
+          confirmText='Delete'
+          confirmType='danger'
+          cancelType='info'
+          errorMessage={deleteError}
+          isProcessing={isDeleting}
+          onCancel={handleDeleteCancel}
+          onConfirm={handleDeleteConfirm}
+        />
+      )}
     </div>
   )
 }
@@ -358,7 +482,9 @@ EngagementsList.defaultProps = {
   projectDetail: null,
   allEngagements: false,
   isLoading: false,
-  canManage: false
+  canManage: false,
+  isAdmin: false,
+  deleteEngagement: () => {}
 }
 
 EngagementsList.propTypes = {
@@ -369,7 +495,9 @@ EngagementsList.propTypes = {
   }),
   allEngagements: PropTypes.bool,
   isLoading: PropTypes.bool,
-  canManage: PropTypes.bool
+  canManage: PropTypes.bool,
+  isAdmin: PropTypes.bool,
+  deleteEngagement: PropTypes.func
 }
 
 export default EngagementsList
diff --git a/src/components/EngagementsList/index.test.js b/src/components/EngagementsList/index.test.js
new file mode 100644
index 00000000..6fe84b3d
--- /dev/null
+++ b/src/components/EngagementsList/index.test.js
@@ -0,0 +1,153 @@
+/* eslint-disable react/prop-types */
+/* global describe, it, expect, beforeEach, afterEach, jest */
+
+import React from 'react'
+import ReactDOM from 'react-dom'
+import { act } from 'react-dom/test-utils'
+import { MemoryRouter } from 'react-router-dom'
+import EngagementsList from './index'
+
+jest.mock('../Buttons', () => {
+  const React = require('react')
+
+  const renderButton = (text, onClick, disabled) => React.createElement(
+    'button',
+    { type: 'button', onClick, disabled },
+    text
+  )
+
+  return {
+    PrimaryButton: ({ text, onClick, disabled }) => renderButton(text, onClick, disabled),
+    OutlineButton: ({ text, onClick, disabled }) => renderButton(text, onClick, disabled)
+  }
+})
+
+jest.mock('../Tooltip', () => {
+  const React = require('react')
+
+  return ({ children }) => React.createElement('span', null, children)
+})
+
+jest.mock('../Loader', () => {
+  const React = require('react')
+
+  return () => React.createElement('div', null, 'Loading')
+})
+
+jest.mock('../Modal/ConfirmationModal', () => null)
+
+jest.mock('../Select', () => {
+  const React = require('react')
+
+  return function MockSelect ({ inputId, options, value, onChange }) {
+    return React.createElement(
+      'select',
+      {
+        'data-testid': inputId,
+        value: value && value.value ? value.value : '',
+        onChange: (event) => {
+          const selectedOption = options.find((option) => option.value === event.target.value)
+          onChange(selectedOption || null)
+        }
+      },
+      options.map((option) => React.createElement(
+        'option',
+        { key: option.value, value: option.value },
+        option.label
+      ))
+    )
+  }
+})
+
+describe('EngagementsList', () => {
+  let container
+
+  const defaultProps = {
+    engagements: [],
+    projectId: null,
+    projectDetail: null,
+    allEngagements: true,
+    isLoading: false,
+    canManage: false,
+    isAdmin: false,
+    deleteEngagement: () => Promise.resolve()
+  }
+
+  const renderComponent = (props = {}) => {
+    act(() => {
+      ReactDOM.render(
+        <MemoryRouter>
+          <EngagementsList {...defaultProps} {...props} />
+        </MemoryRouter>,
+        container
+      )
+    })
+  }
+
+  beforeEach(() => {
+    container = document.createElement('div')
+    document.body.appendChild(container)
+  })
+
+  afterEach(() => {
+    ReactDOM.unmountComponentAtNode(container)
+    container.remove()
+    container = null
+  })
+
+  it('assigns the On Hold badge class when engagement status is On Hold', () => {
+    renderComponent({
+      engagements: [
+        {
+          id: 'on-hold-id',
+          projectId: 'project-id',
+          projectName: 'Project Alpha',
+          title: 'On Hold Engagement',
+          status: 'On Hold',
+          isPrivate: false
+        }
+      ]
+    })
+
+    const statusBadge = container.querySelector('span.status.statusOnHold')
+
+    expect(statusBadge).not.toBeNull()
+    expect(statusBadge.textContent).toBe('On Hold')
+  })
+
+  it('filters engagement rows when selecting On Hold status', () => {
+    renderComponent({
+      engagements: [
+        {
+          id: 'open-id',
+          projectId: 'project-id',
+          projectName: 'Project Alpha',
+          title: 'Open Engagement',
+          status: 'Open',
+          isPrivate: false
+        },
+        {
+          id: 'on-hold-id',
+          projectId: 'project-id',
+          projectName: 'Project Alpha',
+          title: 'On Hold Engagement',
+          status: 'On Hold',
+          isPrivate: false
+        }
+      ]
+    })
+
+    expect(container.textContent).toContain('Open Engagement')
+    expect(container.textContent).toContain('On Hold Engagement')
+
+    const statusFilterSelect = container.querySelector('select[data-testid="engagement-status-filter"]')
+
+    act(() => {
+      statusFilterSelect.value = 'On Hold'
+      statusFilterSelect.dispatchEvent(new window.Event('change', { bubbles: true }))
+    })
+
+    expect(container.textContent).toContain('On Hold Engagement')
+    expect(container.textContent).not.toContain('Open Engagement')
+  })
+})
diff --git a/src/components/FieldUserAutoComplete/index.js b/src/components/FieldUserAutoComplete/index.js
index 44fbcff0..501aba9a 100644
--- a/src/components/FieldUserAutoComplete/index.js
+++ b/src/components/FieldUserAutoComplete/index.js
@@ -1,4 +1,17 @@
-/* Component to render select user field */
+/**
+ * Multi-select field for project users.
+ *
+ * @param {Object} props Component props.
+ * @param {Array<string|number>} props.value Selected user ids.
+ * @param {Function} props.onChangeValue Callback invoked with selected user ids.
+ * @param {string} props.id Field id.
+ * @param {Array<Object>} props.projectMembers Project member records with `userId` and optional `handle`.
+ * @param {Object} props.loggedInUser Logged in user record.
+ * @returns {JSX.Element} User select component.
+ *
+ * Members without `handle` are excluded from dropdown options. For already
+ * selected users missing a handle, this falls back to `userId` for labels.
+ */
 
 import React, { useMemo } from 'react'
 import _ from 'lodash'
@@ -14,10 +27,10 @@ const FieldUserAutoComplete = ({
 }) => {
   const selectedUsers = useMemo(() => {
     return value.map(item => {
-      const selectedUser = _.find(projectMembers, { userId: item })
+      const selectedUser = _.find(projectMembers, { userId: item }) || {}
       return {
-        label: selectedUser.handle,
-        value: selectedUser.userId
+        label: selectedUser.handle || selectedUser.userId || item,
+        value: selectedUser.userId || item
       }
     })
   }, [value, projectMembers])
@@ -34,7 +47,7 @@ const FieldUserAutoComplete = ({
         onChangeValue((values || []).map(value => value.value))
       }}
       options={(projectMembers || [])
-        .filter(member => member.userId !== loggedInUser.userId)
+        .filter(member => member.userId !== loggedInUser.userId && member.handle)
         .map(member => ({ value: member.userId, label: member.handle }))}
     />
   )
diff --git a/src/components/Tab/index.js b/src/components/Tab/index.js
index f5c94cd2..0b8b3734 100644
--- a/src/components/Tab/index.js
+++ b/src/components/Tab/index.js
@@ -9,7 +9,6 @@ const Tab = ({
   projectId,
   canViewAssets,
   canViewEngagements, // Admin or TM
-  isAdmin, // Only admin
   onBack
 }) => {
   const projectTabs = [
@@ -22,7 +21,7 @@ const Tab = ({
     : [
       { id: 1, label: 'All Work' },
       { id: 2, label: 'Projects' },
-      ...(isAdmin ? [{ id: 3, label: 'Engagements' }] : []),
+      ...(canViewEngagements ? [{ id: 3, label: 'Engagements' }] : []),
       { id: 4, label: 'Users' },
       { id: 5, label: 'Self-Service' },
       { id: 6, label: 'TaaS' },
@@ -89,7 +88,6 @@ Tab.defaultProps = {
   projectId: null,
   canViewAssets: true,
   canViewEngagements: false,
-  isAdmin: false,
   onBack: () => {}
 }
 
@@ -99,7 +97,6 @@ Tab.propTypes = {
   projectId: PT.oneOfType([PT.string, PT.number]),
   canViewAssets: PT.bool,
   canViewEngagements: PT.bool,
-  isAdmin: PT.bool,
   onBack: PT.func
 }
 
diff --git a/src/components/UserCard/index.js b/src/components/UserCard/index.js
index 58b30ab7..0eee55e0 100644
--- a/src/components/UserCard/index.js
+++ b/src/components/UserCard/index.js
@@ -13,6 +13,12 @@ const theme = {
   container: styles.modalContainer
 }
 
+/**
+ * Renders one project member or invite card with role controls.
+ *
+ * `user.handle` may be null/empty for some members; this component falls back
+ * to `user.userId` and then `"(unknown user)"` when rendering labels/messages.
+ */
 class UserCard extends Component {
   constructor (props) {
     super(props)
@@ -61,19 +67,21 @@ class UserCard extends Component {
   render () {
     const { isInvite, user, onRemoveClick, isEditable } = this.props
     const showRadioButtons = _.includes(_.values(PROJECT_ROLES), user.role)
+    const userDisplayName = user.handle || user.userId || '(unknown user)'
+    const inviteDisplayName = user.email || user.handle || user.userId || '(unknown user)'
     return (
       <div>
         {
           this.state.isUpdatingPermission && (
             <AlertModal
-              message={`Updating permission for ${user.handle}...`}
+              message={`Updating permission for ${userDisplayName}...`}
               theme={theme}
             />
           )
         }
         {this.state.showWarningModal && (
           <AlertModal
-            title={`Cannot update permission for ${user.handle}`}
+            title={`Cannot update permission for ${userDisplayName}`}
             message={this.state.permissionUpdateError}
             theme={theme}
             closeText='OK'
@@ -91,7 +99,7 @@ class UserCard extends Component {
         )}
         <div className={styles.item}>
           <div className={cn(styles.col5)}>
-            {isInvite ? (user.email || user.handle) : user.handle}
+            {isInvite ? inviteDisplayName : userDisplayName}
           </div>
           {!isInvite && (
             <>
diff --git a/src/config/constants.js b/src/config/constants.js
index 520df9c4..bf8cf6d8 100644
--- a/src/config/constants.js
+++ b/src/config/constants.js
@@ -189,6 +189,7 @@ export const LOAD_PROJECT_DETAILS = 'LOAD_PROJECT_DETAILS'
 export const LOAD_PROJECT_DETAILS_SUCCESS = 'LOAD_PROJECT_DETAILS_SUCCESS'
 export const LOAD_PROJECT_DETAILS_PENDING = 'LOAD_PROJECT_DETAILS_PENDING'
 export const LOAD_PROJECT_DETAILS_FAILURE = 'LOAD_PROJECT_DETAILS_FAILURE'
+export const CLEAR_PROJECT_DETAIL = 'CLEAR_PROJECT_DETAIL'
 
 export const UPDATE_PROJECT_DETAILS = 'UPDATE_PROJECT_DETAILS'
 export const UPDATE_PROJECT_DETAILS_SUCCESS = 'UPDATE_PROJECT_DETAILS_SUCCESS'
diff --git a/src/containers/EngagementEditor/index.js b/src/containers/EngagementEditor/index.js
index 7d2e87f4..8fc8e1fa 100644
--- a/src/containers/EngagementEditor/index.js
+++ b/src/containers/EngagementEditor/index.js
@@ -13,7 +13,8 @@ import {
   deleteEngagement
 } from '../../actions/engagements'
 import { loadProject } from '../../actions/projects'
-import { checkAdmin, checkManager, checkTaskManager } from '../../util/tc'
+import { fetchMemberProjects } from '../../services/projects'
+import { checkAdmin, checkManager, checkTaskManager, checkTalentManager } from '../../util/tc'
 import { PROJECT_ROLES } from '../../config/constants'
 import { fetchProfile } from '../../services/user'
 import {
@@ -30,6 +31,7 @@ import {
 
 const getEmptyEngagement = () => ({
   id: null,
+  projectId: null,
   title: '',
   description: '',
   durationWeeks: '',
@@ -117,7 +119,9 @@ class EngagementEditorContainer extends Component {
       validationErrors: {},
       showDeleteModal: false,
       isSaving: false,
-      memberIdLookup: {}
+      memberIdLookup: {},
+      projects: [],
+      isLoadingProjects: false
     }
 
     this.onUpdateInput = this.onUpdateInput.bind(this)
@@ -128,9 +132,10 @@ class EngagementEditorContainer extends Component {
     this.onDelete = this.onDelete.bind(this)
     this.onToggleDelete = this.onToggleDelete.bind(this)
     this.resolveMemberIds = this.resolveMemberIds.bind(this)
+    this.loadProjects = this.loadProjects.bind(this)
   }
 
-  componentDidMount () {
+  async componentDidMount () {
     const { match, loadEngagementDetails, loadProject } = this.props
     const projectId = this.getProjectId(match)
     const engagementId = _.get(match.params, 'engagementId', null)
@@ -138,7 +143,46 @@ class EngagementEditorContainer extends Component {
       loadProject(projectId)
     }
     if (engagementId) {
-      loadEngagementDetails(projectId, engagementId)
+      await loadEngagementDetails(projectId, engagementId)
+      await this.loadProjects()
+    }
+  }
+
+  /**
+   * Loads all paged projects available to the current member for Parent Project selection.
+   *
+   * @returns {Promise<void>}
+   */
+  async loadProjects () {
+    this.setState({ isLoadingProjects: true })
+    try {
+      const perPage = 100
+      let page = 1
+      let hasMore = true
+      let projects = []
+
+      while (hasMore) {
+        const response = await fetchMemberProjects({ page, perPage })
+        const pageProjects = _.get(response, 'projects', [])
+        const totalPages = _.get(response, 'pagination.xTotalPages', null)
+        projects = projects.concat(pageProjects)
+        if (totalPages) {
+          hasMore = page < totalPages
+        } else {
+          hasMore = pageProjects.length === perPage
+        }
+        page += 1
+      }
+
+      this.setState({
+        projects: _.uniqBy(projects, 'id'),
+        isLoadingProjects: false
+      })
+    } catch (error) {
+      this.setState({
+        projects: [],
+        isLoadingProjects: false
+      })
     }
   }
 
@@ -245,6 +289,7 @@ class EngagementEditorContainer extends Component {
     return {
       ...getEmptyEngagement(),
       ...normalized,
+      projectId: normalized.projectId || null,
       durationWeeks,
       role: fromEngagementRoleApi(normalized.role),
       workload: fromEngagementWorkloadApi(normalized.workload),
@@ -387,6 +432,7 @@ class EngagementEditorContainer extends Component {
   }
 
   buildPayload (engagement, isDraft) {
+    const currentProjectId = this.getProjectId(this.props.match)
     const status = engagement.status || (isDraft ? 'Open' : '')
     const requiredSkills = (engagement.skills || [])
       .map((skill) => {
@@ -523,6 +569,13 @@ class EngagementEditorContainer extends Component {
       }
     }
 
+    if (
+      engagement.projectId &&
+      `${engagement.projectId}` !== `${currentProjectId}`
+    ) {
+      payload.projectId = String(engagement.projectId)
+    }
+
     return payload
   }
 
@@ -656,6 +709,16 @@ class EngagementEditorContainer extends Component {
     return isAdmin || isManager || isTaskManager || isProjectManager
   }
 
+  /**
+   * Indicates whether current user can change the engagement Parent Project.
+   *
+   * @returns {boolean}
+   */
+  canEditParentProject () {
+    const { auth } = this.props
+    return checkAdmin(auth.token) || checkTalentManager(auth.token)
+  }
+
   render () {
     const { match, isLoading } = this.props
     const engagementId = _.get(match.params, 'engagementId', null)
@@ -670,6 +733,9 @@ class EngagementEditorContainer extends Component {
         isLoading={isLoading}
         isSaving={this.state.isSaving}
         canEdit={this.canEdit()}
+        projects={this.state.projects}
+        isLoadingProjects={this.state.isLoadingProjects}
+        canEditParentProject={this.canEditParentProject()}
         submitTriggered={this.state.submitTriggered}
         validationErrors={this.state.validationErrors}
         showDeleteModal={this.state.showDeleteModal}
@@ -705,6 +771,10 @@ class EngagementEditorContainer extends Component {
   }
 }
 
+/**
+ * Engagement editor container props.
+ * `engagementDetails.projectId` is optional and is used to preselect Parent Project.
+ */
 EngagementEditorContainer.propTypes = {
   match: PropTypes.shape({
     params: PropTypes.shape({
@@ -727,7 +797,10 @@ EngagementEditorContainer.propTypes = {
       role: PropTypes.string
     }))
   }),
-  engagementDetails: PropTypes.shape(),
+  engagementDetails: PropTypes.shape({
+    id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+    projectId: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
+  }),
   isLoading: PropTypes.bool,
   loadEngagementDetails: PropTypes.func.isRequired,
   createEngagement: PropTypes.func.isRequired,
diff --git a/src/containers/EngagementsList/index.js b/src/containers/EngagementsList/index.js
index a1b5f5b8..15ed6c04 100644
--- a/src/containers/EngagementsList/index.js
+++ b/src/containers/EngagementsList/index.js
@@ -4,10 +4,16 @@ import PropTypes from 'prop-types'
 import { connect } from 'react-redux'
 import { withRouter } from 'react-router-dom'
 import EngagementsList from '../../components/EngagementsList'
-import { loadEngagements } from '../../actions/engagements'
+import { loadEngagements, deleteEngagement } from '../../actions/engagements'
 import { loadProject } from '../../actions/projects'
-import { checkAdminOrPmOrTaskManager } from '../../util/tc'
+import { fetchMemberProjects } from '../../services/projects'
+import { checkAdmin, checkAdminOrPmOrTaskManager, checkTalentManager } from '../../util/tc'
 
+/**
+ * Loads and wires engagement list data for the current project context.
+ * Computes permission flags (`canManage`, `isAdmin`) and injects dispatch props,
+ * including `deleteEngagement` for admin-only delete flows in the list UI.
+ */
 class EngagementsListContainer extends Component {
   componentDidMount () {
     this.loadData()
@@ -32,7 +38,7 @@ class EngagementsListContainer extends Component {
     return projectId ? parseInt(projectId, 10) : null
   }
 
-  loadData () {
+  async loadData () {
     const projectId = this.getProjectId()
     const { loadProject, loadEngagements, allEngagements } = this.props
     if (projectId) {
@@ -41,6 +47,13 @@ class EngagementsListContainer extends Component {
     if (!projectId && !allEngagements) {
       return
     }
+
+    if (!projectId && allEngagements && this.isTalentManagerOnly()) {
+      const tmProjectIds = await this.loadTmProjectIds()
+      loadEngagements(null, 'all', '', true, tmProjectIds)
+      return
+    }
+
     loadEngagements(projectId, 'all', '', this.canIncludePrivate())
   }
 
@@ -57,6 +70,63 @@ class EngagementsListContainer extends Component {
     return checkAdminOrPmOrTaskManager(auth.token, null)
   }
 
+  isAdmin () {
+    const { auth } = this.props
+    if (!auth || !auth.token) {
+      return false
+    }
+    return checkAdmin(auth.token)
+  }
+
+  /**
+   * Checks whether the current user is a Talent Manager without Admin role.
+   *
+   * @returns {Boolean} true when user is TM-only.
+   */
+  isTalentManagerOnly () {
+    const { auth } = this.props
+    if (!auth || !auth.token) {
+      return false
+    }
+    return checkTalentManager(auth.token) && !checkAdmin(auth.token)
+  }
+
+  /**
+   * Loads all member projects for the current TM user and returns unique IDs.
+   *
+   * @returns {Promise<Array<string>>} Unique project ids as strings.
+   */
+  async loadTmProjectIds () {
+    try {
+      const perPage = 100
+      let page = 1
+      let hasMore = true
+      let projects = []
+
+      while (hasMore) {
+        const response = await fetchMemberProjects({ memberOnly: true, page, perPage })
+        const pageProjects = _.get(response, 'projects', [])
+        const totalPages = _.get(response, 'pagination.xTotalPages', null)
+        projects = projects.concat(pageProjects)
+        if (totalPages) {
+          hasMore = page < totalPages
+        } else {
+          hasMore = pageProjects.length === perPage
+        }
+        page += 1
+      }
+
+      return _.uniq(
+        projects
+          .map(project => _.get(project, 'id', null))
+          .filter(Boolean)
+          .map(projectId => `${projectId}`)
+      )
+    } catch (error) {
+      return []
+    }
+  }
+
   render () {
     const projectId = this.getProjectId()
     return (
@@ -67,6 +137,8 @@ class EngagementsListContainer extends Component {
         allEngagements={this.props.allEngagements}
         isLoading={this.props.isLoading}
         canManage={this.canManage()}
+        isAdmin={this.isAdmin()}
+        deleteEngagement={this.props.deleteEngagement}
         currentUser={this.props.auth.user}
       />
     )
@@ -94,7 +166,8 @@ EngagementsListContainer.propTypes = {
     })
   }).isRequired,
   loadEngagements: PropTypes.func.isRequired,
-  loadProject: PropTypes.func.isRequired
+  loadProject: PropTypes.func.isRequired,
+  deleteEngagement: PropTypes.func.isRequired
 }
 
 EngagementsListContainer.defaultProps = {
@@ -110,7 +183,8 @@ const mapStateToProps = (state) => ({
 
 const mapDispatchToProps = {
   loadEngagements,
-  loadProject
+  loadProject,
+  deleteEngagement
 }
 
 export default withRouter(
diff --git a/src/containers/ProjectAssets/index.jsx b/src/containers/ProjectAssets/index.jsx
index 002ce66b..0060fbde 100644
--- a/src/containers/ProjectAssets/index.jsx
+++ b/src/containers/ProjectAssets/index.jsx
@@ -46,6 +46,7 @@ const ProjectAssets = ({
   loggedInUser,
   token
 }) => {
+  const projectDetailId = _.get(projectDetail, 'id')
   const [isProcessing, setIsProcessing] = useState(false)
   const [selectedTab, setSelectedTab] = useState(0)
   const [showDeleteFile, setShowDeleteFile] = useState(null)
@@ -158,10 +159,10 @@ const ProjectAssets = ({
   }, [files, links, selectedTab])
 
   useEffect(() => {
-    if (projectId) {
+    if (projectId && `${projectDetailId || ''}` !== `${projectId}`) {
       loadOnlyProjectInfo(projectId)
     }
-  }, [projectId])
+  }, [loadOnlyProjectInfo, projectId, projectDetailId])
 
   if (isLoading) {
     return <Loader />
diff --git a/src/containers/ProjectEditor/index.js b/src/containers/ProjectEditor/index.js
index d6e6d116..e4cf8694 100644
--- a/src/containers/ProjectEditor/index.js
+++ b/src/containers/ProjectEditor/index.js
@@ -12,7 +12,8 @@ import {
   loadProjectTypes,
   loadProject,
   createProject,
-  updateProject
+  updateProject,
+  clearProjectDetail
 } from '../../actions/projects'
 import { setActiveProject } from '../../actions/sidebar'
 import { checkAdminOrCopilotOrManager, checkAdmin, checkIsUserInvitedToProject, checkManager } from '../../util/tc'
@@ -28,22 +29,29 @@ class ProjectEditor extends Component {
   }
   // load the project types
   componentDidMount () {
-    const { match, isEdit, loadProjectTypes } = this.props
+    const { match, isEdit, loadProjectTypes, clearProjectDetail } = this.props
     loadProjectTypes()
     if (isEdit) {
       this.fetchProjectDetails(match)
+    } else {
+      clearProjectDetail()
     }
   }
 
   componentDidUpdate () {
-    const { auth } = this.props
+    const { auth, history, isEdit, projectDetail } = this.props
 
-    if (checkIsUserInvitedToProject(auth.token, this.props.projectDetail)) {
-      this.props.history.push(`/projects/${this.props.projectDetail.id}/invitation`)
+    if (checkIsUserInvitedToProject(auth.token, projectDetail)) {
+      history.push(`/projects/${projectDetail.id}/invitation`)
     }
 
-    if (!checkAdminOrCopilotOrManager(auth.token, this.props.projectDetail)) {
-      this.props.history.push('/projects')
+    // For create flow there is no project context yet, so only evaluate global JWT roles.
+    const canManageProject = isEdit
+      ? checkAdminOrCopilotOrManager(auth.token, projectDetail)
+      : checkAdminOrCopilotOrManager(auth.token)
+
+    if (!canManageProject) {
+      history.push('/projects')
     }
   }
 
@@ -154,6 +162,7 @@ ProjectEditor.propTypes = {
   auth: PropTypes.object,
   history: PropTypes.object,
   setActiveProject: PropTypes.func.isRequired,
+  clearProjectDetail: PropTypes.func.isRequired,
   isEdit: PropTypes.bool,
   loadProject: PropTypes.func,
   isProjectLoading: PropTypes.bool,
@@ -173,6 +182,7 @@ const mapDispatchToProps = {
   loadProject,
   createProject,
   updateProject,
+  clearProjectDetail,
   setActiveProject
 }
 
diff --git a/src/containers/Tab/index.js b/src/containers/Tab/index.js
index e00bf5b2..bd8072ec 100644
--- a/src/containers/Tab/index.js
+++ b/src/containers/Tab/index.js
@@ -9,7 +9,7 @@ import {
   resetSidebarActiveParams,
   unloadProjects
 } from '../../actions/sidebar'
-import { checkAdmin, checkCopilot, checkAdminOrTalentManager } from '../../util/tc'
+import { checkAdmin, checkCopilot, checkAdminOrTalentManager, checkIsProjectMember } from '../../util/tc'
 
 class TabContainer extends Component {
   constructor (props) {
@@ -24,11 +24,17 @@ class TabContainer extends Component {
     this.getTabFromPath = this.getTabFromPath.bind(this)
   }
 
+  // Assets are visible to admins, copilots, and members of the active project.
   getCanViewAssets (props = this.props) {
     const { token: currentToken } = this.props
-    const { token } = props
+    const { token, projectDetail } = props
     const resolvedToken = token || currentToken
-    return !!resolvedToken && (checkAdmin(resolvedToken) || checkCopilot(resolvedToken))
+    const resolvedProjectDetail = projectDetail || this.props.projectDetail
+    return !!resolvedToken && (
+      checkAdmin(resolvedToken) ||
+      checkCopilot(resolvedToken) ||
+      checkIsProjectMember(resolvedToken, resolvedProjectDetail)
+    )
   }
 
   getCanViewEngagements (props = this.props) {
@@ -70,9 +76,8 @@ class TabContainer extends Component {
 
     const canViewAssets = this.getCanViewAssets()
     const canViewEngagements = this.getCanViewEngagements()
-    const isAdmin = this.getIsAdmin()
     this.setState({
-      currentTab: this.getTabFromPath(history.location.pathname, projectId, canViewAssets, canViewEngagements, isAdmin)
+      currentTab: this.getTabFromPath(history.location.pathname, projectId, canViewAssets, canViewEngagements)
     })
   }
 
@@ -85,9 +90,8 @@ class TabContainer extends Component {
 
     const canViewAssets = this.getCanViewAssets(nextProps)
     const canViewEngagements = this.getCanViewEngagements(nextProps)
-    const isAdmin = this.getIsAdmin(nextProps)
     this.setState({
-      currentTab: this.getTabFromPath(nextProps.history.location.pathname, projectId, canViewAssets, canViewEngagements, isAdmin)
+      currentTab: this.getTabFromPath(nextProps.history.location.pathname, projectId, canViewAssets, canViewEngagements)
     })
     if (
       isLoading ||
@@ -139,7 +143,11 @@ class TabContainer extends Component {
     return 0
   }
 
-  getTabFromPath (pathname, projectId, canViewAssets = true, canViewEngagements = false, isAdmin = false) {
+  /**
+   * Resolves the selected tab from the current route.
+   * Global Engagements (id 3) is available to users who can view engagements (admin or TM).
+   */
+  getTabFromPath (pathname, projectId, canViewAssets = true, canViewEngagements = false) {
     if (projectId) {
       return this.getProjectTabFromPath(pathname, projectId, canViewAssets, canViewEngagements)
     }
@@ -150,7 +158,7 @@ class TabContainer extends Component {
       return 2
     }
     if (pathname === '/engagements') {
-      return isAdmin ? 3 : 0
+      return canViewEngagements ? 3 : 0
     }
     if (pathname === '/users') {
       return 4
@@ -184,11 +192,14 @@ class TabContainer extends Component {
     resetSidebarActiveParams()
   }
 
+  /**
+   * Handles tab navigation while applying route-level permission checks.
+   * Global Engagements (id 3) is accessible to admin and talent manager users.
+   */
   onTabChange (tab) {
     const { history, resetSidebarActiveParams, projectId } = this.props
     const canViewAssets = this.getCanViewAssets()
     const canViewEngagements = this.getCanViewEngagements() // admin OR TM
-    const isAdmin = this.getIsAdmin() // admin
     if (projectId) {
       if ((tab === 2 && !canViewEngagements) || (tab === 3 && !canViewAssets)) {
         return
@@ -210,7 +221,7 @@ class TabContainer extends Component {
       history.push('/projects')
       this.props.unloadProjects()
       this.setState({ currentTab: 2 })
-    } else if (tab === 3 && isAdmin) {
+    } else if (tab === 3 && canViewEngagements) {
       history.push('/engagements')
       this.setState({ currentTab: 3 })
     } else if (tab === 4) {
@@ -235,7 +246,6 @@ class TabContainer extends Component {
     const { currentTab } = this.state
     const canViewAssets = this.getCanViewAssets()
     const canViewEngagements = this.getCanViewEngagements()
-    const isAdmin = this.getIsAdmin()
 
     return (
       <Tab
@@ -244,7 +254,6 @@ class TabContainer extends Component {
         projectId={this.props.projectId}
         canViewAssets={canViewAssets}
         canViewEngagements={canViewEngagements}
-        isAdmin={isAdmin}
         onBack={this.onBackToHome}
       />
     )
@@ -264,12 +273,14 @@ TabContainer.propTypes = {
   backPath: PropTypes.string,
   resetSidebarActiveParams: PropTypes.func,
   selfService: PropTypes.bool,
-  token: PropTypes.string
+  token: PropTypes.string,
+  projectDetail: PropTypes.object
 }
 
-const mapStateToProps = ({ sidebar, auth }) => ({
+const mapStateToProps = ({ sidebar, auth, projects }) => ({
   ...sidebar,
-  token: auth.token
+  token: auth.token,
+  projectDetail: projects.projectDetail
 })
 
 const mapDispatchToProps = {
diff --git a/src/containers/Users/index.js b/src/containers/Users/index.js
index 6f1cef67..5ae8281f 100644
--- a/src/containers/Users/index.js
+++ b/src/containers/Users/index.js
@@ -89,6 +89,15 @@ class Users extends Component {
     }
   }
 
+  /**
+   * Loads project details and stores members/invites in local state.
+   *
+   * `projectMembers` comes from `fetchProjectById`, which enriches missing
+   * member handles through `MEMBERS_API_URL` before resolving.
+   *
+   * @param {string|number} projectId Project id to load.
+   * @returns {void}
+   */
   loadProject (projectId) {
     this.setState({ isLoadingProject: true })
     fetchProjectById(projectId).then(async (project) => {
diff --git a/src/reducers/projects.js b/src/reducers/projects.js
index f81713c6..6f1109a4 100644
--- a/src/reducers/projects.js
+++ b/src/reducers/projects.js
@@ -16,6 +16,7 @@ import {
   LOAD_PROJECT_DETAILS_FAILURE,
   LOAD_PROJECT_DETAILS_PENDING,
   LOAD_PROJECT_DETAILS_SUCCESS,
+  CLEAR_PROJECT_DETAIL,
   LOAD_PROJECT_PHASES_FAILURE,
   LOAD_PROJECT_PHASES_PENDING,
   LOAD_PROJECT_PHASES_SUCCESS,
@@ -76,6 +77,7 @@ const initialState = {
   isLoading: false,
   isUpdating: false,
   projectDetail: {},
+  hasProjectAccess: false,
   isBillingAccountsLoading: false,
   billingAccounts: [],
   isBillingAccountExpired: false,
@@ -145,6 +147,12 @@ export default function (state = initialState, action) {
         hasProjectAccess: true,
         isLoading: false
       }
+    case CLEAR_PROJECT_DETAIL:
+      return {
+        ...state,
+        projectDetail: {},
+        hasProjectAccess: initialState.hasProjectAccess
+      }
     case LOAD_PROJECT_BILLING_ACCOUNTS_PENDING:
       return {
         ...state,
diff --git a/src/routes.js b/src/routes.js
index f4b66bb1..ea0f0bfd 100644
--- a/src/routes.js
+++ b/src/routes.js
@@ -25,6 +25,7 @@ import EngagementExperience from './containers/EngagementExperience'
 import { getFreshToken, decodeToken } from 'tc-auth-lib'
 import { saveToken } from './actions/auth'
 import { loadChallengeDetails } from './actions/challenges'
+import { loadOnlyProjectInfo } from './actions/projects'
 import { connect } from 'react-redux'
 import {
   checkAllowedRoles,
@@ -33,7 +34,8 @@ import {
   checkAdmin,
   checkCopilot,
   checkManager,
-  checkAdminOrTalentManager
+  checkAdminOrTalentManager,
+  checkIsProjectMember
 } from './util/tc'
 import Users from './containers/Users'
 import Groups from './containers/Groups'
@@ -86,10 +88,22 @@ RedirectToChallenge.propTypes = {
 const ConnectRedirectToChallenge = connect(mapStateToProps, mapDispatchToProps)(RedirectToChallenge)
 
 class Routes extends React.Component {
+  constructor (props) {
+    super(props)
+
+    this.state = {
+      assetsAccessStatusByProjectId: {}
+    }
+  }
+
   componentWillMount () {
     this.checkAuth()
   }
 
+  componentDidMount () {
+    this.resolveAssetsRouteAccess(this.props)
+  }
+
   checkAuth () {
     // try to get a token and redirect to login page if it fails
     getFreshToken().then((token) => {
@@ -102,7 +116,99 @@ class Routes extends React.Component {
     })
   }
 
-  componentDidUpdate () {
+  /**
+   * Parses the pathname and returns the project id for assets routes.
+   *
+   * @param {String} pathname current location pathname
+   * @returns {String|null} assets route project id
+   */
+  getAssetsProjectIdFromPath (pathname) {
+    const match = (pathname || '').match(/^\/projects\/([^/]+)\/assets\/?$/)
+    return _.get(match, '[1]', null)
+  }
+
+  /**
+   * Stores per-project access resolution status for assets routing.
+   *
+   * @param {String} projectId route project id
+   * @param {String} status resolution status (`loading` or `denied`)
+   */
+  setAssetsAccessStatus (projectId, status) {
+    const normalizedProjectId = `${projectId}`
+    this.setState(prevState => ({
+      assetsAccessStatusByProjectId: {
+        ...prevState.assetsAccessStatusByProjectId,
+        [normalizedProjectId]: status
+      }
+    }))
+  }
+
+  /**
+   * Clears a stored assets access status for the provided project id.
+   *
+   * @param {String} projectId route project id
+   */
+  clearAssetsAccessStatus (projectId) {
+    const normalizedProjectId = `${projectId}`
+    this.setState(prevState => {
+      if (!_.has(prevState.assetsAccessStatusByProjectId, normalizedProjectId)) {
+        return null
+      }
+
+      return {
+        assetsAccessStatusByProjectId: _.omit(prevState.assetsAccessStatusByProjectId, normalizedProjectId)
+      }
+    })
+  }
+
+  /**
+   * Resolves assets access for direct `/projects/:projectId/assets` navigation.
+   * This keeps authorization scoped to the requested route project id.
+   *
+   * @param {Object} props current component props
+   * @param {Object} prevProps previous component props
+   */
+  resolveAssetsRouteAccess (props, prevProps = {}) {
+    const projectId = this.getAssetsProjectIdFromPath(_.get(props, 'location.pathname'))
+    if (!projectId || !props.isLoggedIn || !props.token) {
+      return
+    }
+
+    if (checkAdmin(props.token) || checkCopilot(props.token)) {
+      return
+    }
+
+    const isProjectDetailForRequestedProject = `${_.get(props, 'projectDetail.id', '')}` === `${projectId}`
+    if (isProjectDetailForRequestedProject) {
+      this.clearAssetsAccessStatus(projectId)
+      return
+    }
+
+    const currentPath = _.get(props, 'location.pathname')
+    const previousPath = _.get(prevProps, 'location.pathname')
+    const isNewAssetsNavigation = currentPath !== previousPath
+    const accessStatus = _.get(this.state.assetsAccessStatusByProjectId, `${projectId}`)
+    if (accessStatus === 'loading' || (accessStatus === 'denied' && !isNewAssetsNavigation)) {
+      return
+    }
+
+    this.setAssetsAccessStatus(projectId, 'loading')
+    this.props.loadOnlyProjectInfo(projectId)
+      .then(() => {
+        this.clearAssetsAccessStatus(projectId)
+      })
+      .catch((error) => {
+        const responseStatus = _.get(error, 'payload.response.status', _.get(error, 'response.status'))
+        if (responseStatus === 403) {
+          this.setAssetsAccessStatus(projectId, 'denied')
+          return
+        }
+
+        this.clearAssetsAccessStatus(projectId)
+      })
+  }
+
+  componentDidUpdate (prevProps) {
     const { search } = this.props.location
     const params = new URLSearchParams(search)
     if (!_.isEmpty(params.get('beta'))) {
@@ -113,6 +219,8 @@ class Routes extends React.Component {
       }
       this.props.history.push(this.props.location.pathname)
     }
+
+    this.resolveAssetsRouteAccess(this.props, prevProps)
   }
 
   render () {
@@ -120,11 +228,12 @@ class Routes extends React.Component {
       return null
     }
 
-    const isAllowed = checkAllowedRoles(_.get(decodeToken(this.props.token), 'roles'))
-    const isReadOnly = checkReadOnlyRoles(this.props.token)
-    const isCopilot = checkCopilot(this.props.token)
-    const isAdmin = checkAdmin(this.props.token)
-    const canAccessEngagements = checkAdminOrTalentManager(this.props.token)
+    const { token, projectDetail, hasProjectAccess } = this.props
+    const isAllowed = checkAllowedRoles(_.get(decodeToken(token), 'roles'))
+    const isReadOnly = checkReadOnlyRoles(token)
+    const isCopilot = checkCopilot(token)
+    const isAdmin = checkAdmin(token)
+    const canAccessEngagements = checkAdminOrTalentManager(token)
 
     return (
       <React.Fragment>
@@ -203,20 +312,41 @@ class Routes extends React.Component {
               <FooterContainer />
             )()}
           />
-          {(isCopilot || isAdmin) && (
-            <Route
-              exact
-              path='/projects/:projectId/assets'
-              render={({ match }) =>
-                renderApp(
-                  <ProjectAssets projectId={match.params.projectId} />,
+          <Route
+            exact
+            path='/projects/:projectId/assets'
+            render={({ match }) => {
+              const routeProjectId = _.get(match.params, 'projectId')
+              const isProjectDetailForRequestedProject = `${_.get(projectDetail, 'id', '')}` === `${routeProjectId}`
+              const hasScopedProjectAccess = isProjectDetailForRequestedProject && hasProjectAccess
+              const isProjectMemberForRequestedProject = isProjectDetailForRequestedProject && checkIsProjectMember(token, projectDetail)
+              const canViewRequestedProjectAssets = isCopilot || isAdmin || hasScopedProjectAccess || isProjectMemberForRequestedProject
+              const assetsAccessStatus = _.get(this.state.assetsAccessStatusByProjectId, `${routeProjectId}`)
+              const canResolveRequestedProjectAccess = !isCopilot &&
+                !isAdmin &&
+                !isProjectDetailForRequestedProject &&
+                assetsAccessStatus !== 'denied'
+
+              if (!canViewRequestedProjectAssets && !canResolveRequestedProjectAccess) {
+                return renderApp(
+                  <Challenges
+                    menu='NULL'
+                    warnMessage={'You are not authorized to view this project assets library'}
+                  />,
                   <TopBarContainer />,
-                  <Tab projectId={match.params.projectId} />,
+                  <Tab projectId={routeProjectId} />,
                   <FooterContainer />
                 )()
               }
-            />
-          )}
+
+              return renderApp(
+                <ProjectAssets projectId={routeProjectId} />,
+                <TopBarContainer />,
+                <Tab projectId={routeProjectId} />,
+                <FooterContainer />
+              )()
+            }}
+          />
           {
             !isReadOnly && (
               <Route exact path='/users'
@@ -420,20 +550,26 @@ class Routes extends React.Component {
   }
 }
 
-mapStateToProps = ({ auth }) => ({
-  ...auth
+mapStateToProps = ({ auth, projects }) => ({
+  ...auth,
+  projectDetail: projects.projectDetail,
+  hasProjectAccess: projects.hasProjectAccess
 })
 
 mapDispatchToProps = {
-  saveToken
+  saveToken,
+  loadOnlyProjectInfo
 }
 
 Routes.propTypes = {
   saveToken: PropTypes.func,
+  loadOnlyProjectInfo: PropTypes.func,
   location: PropTypes.object,
   isLoggedIn: PropTypes.bool,
   token: PropTypes.string,
-  history: PropTypes.object
+  history: PropTypes.object,
+  projectDetail: PropTypes.object,
+  hasProjectAccess: PropTypes.bool
 }
 
 export default withRouter(connect(mapStateToProps, mapDispatchToProps)(Routes))
diff --git a/src/services/projects.js b/src/services/projects.js
index 1a03221c..5f8ef155 100644
--- a/src/services/projects.js
+++ b/src/services/projects.js
@@ -60,13 +60,39 @@ export function fetchMemberProjects (filters) {
 }
 
 /**
- * Api request for fetching project by id
- * @param id Project id
- * @returns {Promise<*>}
+ * Api request for fetching a project by id with best-effort member-handle enrichment.
+ *
+ * After loading the project, this resolves any members with missing `handle`
+ * values through `MEMBERS_API_URL` and merges resolved handles back into
+ * `project.members`.
+ *
+ * @param {string|number} id Project id.
+ * @returns {Promise<Object>} Project payload with `members` enriched when possible.
  */
 export async function fetchProjectById (id) {
   const response = await axiosInstance.get(`${PROJECTS_API_URL}/${id}`)
-  return _.get(response, 'data')
+  const project = _.get(response, 'data')
+  const members = _.get(project, 'members', [])
+  const membersWithoutHandle = members.filter(member => !member.handle && member.userId)
+
+  if (!membersWithoutHandle.length) {
+    return project
+  }
+
+  try {
+    const missingUserIds = _.uniq(membersWithoutHandle.map(member => member.userId))
+    const membersByUserId = await fetchInviteMembers(missingUserIds)
+
+    return {
+      ...project,
+      members: members.map(member => ({
+        ...member,
+        handle: member.handle || _.get(membersByUserId, [member.userId, 'handle'], null)
+      }))
+    }
+  } catch (error) {
+    return project
+  }
 }
 
 /**
diff --git a/src/util/engagements.js b/src/util/engagements.js
index b776328c..70b610e5 100644
--- a/src/util/engagements.js
+++ b/src/util/engagements.js
@@ -2,6 +2,7 @@ const STATUS_LABELS = {
   OPEN: 'Open',
   PENDING_ASSIGNMENT: 'Pending Assignment',
   ACTIVE: 'Active',
+  ON_HOLD: 'On Hold',
   CANCELLED: 'Cancelled',
   CLOSED: 'Closed'
 }
@@ -10,6 +11,7 @@ const STATUS_TO_API = {
   Open: 'OPEN',
   'Pending Assignment': 'PENDING_ASSIGNMENT',
   Active: 'ACTIVE',
+  'On Hold': 'ON_HOLD',
   Cancelled: 'CANCELLED',
   Closed: 'CLOSED'
 }
diff --git a/src/util/engagements.test.js b/src/util/engagements.test.js
new file mode 100644
index 00000000..13557af6
--- /dev/null
+++ b/src/util/engagements.test.js
@@ -0,0 +1,18 @@
+/* global describe, it, expect */
+
+import {
+  fromEngagementStatusApi,
+  toEngagementStatusApi
+} from './engagements'
+
+describe('engagement status normalization', () => {
+  it('converts ON_HOLD API values to On Hold labels', () => {
+    expect(fromEngagementStatusApi('ON_HOLD')).toBe('On Hold')
+    expect(fromEngagementStatusApi(' on_hold ')).toBe('On Hold')
+  })
+
+  it('converts On Hold labels to ON_HOLD API values', () => {
+    expect(toEngagementStatusApi('On Hold')).toBe('ON_HOLD')
+    expect(toEngagementStatusApi('on hold')).toBe('ON_HOLD')
+  })
+})
diff --git a/src/util/tc.js b/src/util/tc.js
index 11034633..1c13c6fa 100644
--- a/src/util/tc.js
+++ b/src/util/tc.js
@@ -269,9 +269,26 @@ export const checkAdminOrCopilot = (token, project) => {
   return isAdmin || (isCopilot && canManageProject)
 }
 
+/**
+ * Checks whether the authenticated user is a member of the specified project.
+ * This project-level check grants access regardless of the user's global JWT roles.
+ *
+ * @param {String} token JWT token for the authenticated user.
+ * @param {Object} projectDetail Project detail payload that includes `members`.
+ * @returns {Boolean} `true` when `projectDetail.members` contains the token's `userId`.
+ */
+export const checkIsProjectMember = (token, projectDetail) => {
+  const tokenData = decodeToken(token)
+  const userId = _.get(tokenData, 'userId')
+
+  return !!(projectDetail && projectDetail.members && projectDetail.members.some(member => member.userId === userId))
+}
+
 /**
  * Checks if token has any of the admin, copilot, or manager roles
+ * When `project` is omitted or empty, the check is based solely on the user's global JWT roles.
  * @param  token
+ * @param  project
  */
 export const checkAdminOrCopilotOrManager = (token, project) => {
   return checkManager(token) || checkAdminOrCopilot(token, project)

From ea318b7ccecd14d7e67fb493deb585299ce75ed0 Mon Sep 17 00:00:00 2001
From: Justin Gasper <jmgasper@gmail.com>
Date: Fri, 6 Mar 2026 15:24:38 +1100
Subject: [PATCH 10/17] QA fixes

---
 README.md                                | 62 ++++++++++++++++++++++++
 src/components/ApplicationsList/index.js | 41 ++++++++++++++--
 src/containers/ApplicationsList/index.js |  6 +++
 src/reducers/applications.js             |  7 ++-
 src/util/applicationErrors.js            | 23 +++++++++
 5 files changed, 135 insertions(+), 4 deletions(-)
 create mode 100644 src/util/applicationErrors.js

diff --git a/README.md b/README.md
index 31d5180c..761507b0 100644
--- a/README.md
+++ b/README.md
@@ -29,6 +29,68 @@ This is the frontend application for creating and managing challenges.
 Production configuration is in `config/constants/production.js`
 Development configuration is in `config/constants/development.js`
 
+## Project Invitation Flow
+
+### Route handled
+
+`/projects/:projectId/invitation/:action?`
+
+Handled by `ProjectInvitations` container (`src/containers/ProjectInvitations/index.js`).
+
+### Email link format
+
+When `projects-api-v6` sends an invite email to a **known user** (existing Topcoder account), the email contains two action buttons whose links must use this exact format:
+
+| Button | URL |
+| --- | --- |
+| Join Project | `{WORK_MANAGER_URL}/projects/{projectId}/invitation/accepted?source=email` |
+| Decline Invitation | `{WORK_MANAGER_URL}/projects/{projectId}/invitation/refused?source=email` |
+
+- `{WORK_MANAGER_URL}` is the `WORK_MANAGER_URL` env var configured in `projects-api-v6`.
+- The `?source=email` query parameter is forwarded in the `PATCH /v6/projects/{projectId}/invites/{inviteId}` body as `{ status, source }`.
+
+### Automatic action behaviour
+
+When a user clicks either link and lands on the route with `:action` set, `ProjectInvitations` automatically calls `updateProjectMemberInvite` without showing the confirmation modal. After success it redirects to:
+
+- `accepted` → `/projects/{projectId}/challenges`
+- `refused` → `/projects`
+
+### Manual (modal) flow
+
+When the route is accessed **without** an `:action` segment (e.g., navigating directly to `/projects/{projectId}/invitation`), the container shows a `ConfirmationModal` with **Join project** / **Decline** buttons.
+
+### API call made
+
+Both flows call `PATCH /v6/projects/{projectId}/invites/{inviteId}` via `updateProjectMemberInvite` in `work-manager/src/services/projectMemberInvites.js`, with body `{ status: 'accepted' | 'refused', source?: 'email' }`.
+
+### Env var cross-reference
+
+`WORK_MANAGER_URL` is documented in the `projects-api-v6` README under Environment Variables. Ensure it is set to the deployed work-manager origin (no trailing slash), e.g.:
+
+- Dev: `https://challenges.topcoder-dev.com`
+- Prod: `https://work.topcoder.com`
+
+### Sequence diagram
+
+```mermaid
+sequenceDiagram
+    participant User
+    participant Email
+    participant WorkManager
+    participant ProjectInvitations
+    participant ProjectsAPIv6
+
+    ProjectsAPIv6->>Email: sendInviteEmail (POST /invites)
+    Email-->>User: Join Project button → WORK_MANAGER_URL/projects/{id}/invitation/accepted?source=email
+    Email-->>User: Decline button → WORK_MANAGER_URL/projects/{id}/invitation/refused?source=email
+    User->>WorkManager: GET /projects/{id}/invitation/accepted?source=email
+    WorkManager->>ProjectInvitations: render (automaticAction = 'accepted')
+    ProjectInvitations->>ProjectsAPIv6: PATCH /v6/projects/{id}/invites/{inviteId} {status:'accepted', source:'email'}
+    ProjectsAPIv6-->>ProjectInvitations: 200 OK
+    ProjectInvitations->>WorkManager: redirect /projects/{id}/challenges
+```
+
 ## Local Deployment Instructions
 
 1. First install dependencies
diff --git a/src/components/ApplicationsList/index.js b/src/components/ApplicationsList/index.js
index 15ed98c5..ec64152f 100644
--- a/src/components/ApplicationsList/index.js
+++ b/src/components/ApplicationsList/index.js
@@ -13,6 +13,7 @@ import Handle from '../Handle'
 import styles from './ApplicationsList.module.scss'
 import { PROFILE_URL } from '../../config/constants'
 import { serializeTentativeAssignmentDate } from '../../util/assignmentDates'
+import { isCapacityLimitError } from '../../util/applicationErrors'
 
 const STATUS_OPTIONS = [
   { label: 'All', value: 'all' },
@@ -25,6 +26,7 @@ const STATUS_OPTIONS = [
 const STATUS_UPDATE_OPTIONS = STATUS_OPTIONS.filter(option => option.value !== 'all')
 const INPUT_DATE_FORMAT = 'MM/dd/yyyy'
 const INPUT_TIME_FORMAT = 'HH:mm'
+const CAPACITY_ERROR_MODAL_MESSAGE = 'The required number of members are already assigned to this engagement. If you\'d like to add another member, change the required number of members on the engagement first.'
 
 const ANTICIPATED_START_LABELS = {
   IMMEDIATE: 'Immediate',
@@ -177,6 +179,7 @@ const ApplicationsList = ({
   const [selectedApplication, setSelectedApplication] = useState(null)
   const [acceptApplication, setAcceptApplication] = useState(null)
   const [acceptSuccess, setAcceptSuccess] = useState(null)
+  const [capacityError, setCapacityError] = useState(false)
   const [acceptStartDate, setAcceptStartDate] = useState(null)
   const [acceptEndDate, setAcceptEndDate] = useState(null)
   const [acceptRate, setAcceptRate] = useState('')
@@ -288,6 +291,11 @@ const ApplicationsList = ({
     setIsAccepting(false)
   }
 
+  /**
+   * Submits acceptance details for the selected application.
+   * Propagated API failures are handled locally, and capacity-related failures
+   * are surfaced with a dedicated modal instead of a generic toast.
+   */
   const handleAcceptSubmit = async () => {
     if (!acceptApplication || isAccepting) {
       return
@@ -335,11 +343,21 @@ const ApplicationsList = ({
       setAcceptSuccess({ memberLabel })
       resetAcceptState()
     } catch (error) {
-      setIsAccepting(false)
+      resetAcceptState()
+      const errorMessage = error && error.response && error.response.data
+        ? error.response.data.message
+        : ''
+      const errorStatus = error && error.response ? error.response.status : null
+
+      if (isCapacityLimitError(errorMessage, errorStatus)) {
+        setCapacityError(true)
+      } else {
+        setIsAccepting(false)
+      }
     }
   }
 
-  const handleStatusChange = (application, option) => {
+  const handleStatusChange = async (application, option) => {
     if (!option) {
       return
     }
@@ -350,7 +368,11 @@ const ApplicationsList = ({
       openAcceptModal(application)
       return
     }
-    onUpdateStatus(application.id, option.value)
+    try {
+      await onUpdateStatus(application.id, option.value)
+    } catch (error) {
+      // Failures are already surfaced by reducer toasts where appropriate.
+    }
   }
 
   return (
@@ -480,6 +502,19 @@ const ApplicationsList = ({
           </div>
         </Modal>
       )}
+      {capacityError && (
+        <Modal onCancel={() => setCapacityError(false)}>
+          <div className={styles.acceptModal}>
+            <div className={styles.acceptTitle}>Cannot Select Applicant</div>
+            <div className={styles.acceptSuccessMessage}>
+              {CAPACITY_ERROR_MODAL_MESSAGE}
+            </div>
+            <div className={styles.acceptActions}>
+              <PrimaryButton text='Close' type='info' onClick={() => setCapacityError(false)} />
+            </div>
+          </div>
+        </Modal>
+      )}
       <div className={styles.header}>
         <div>
           <div className={styles.title}>
diff --git a/src/containers/ApplicationsList/index.js b/src/containers/ApplicationsList/index.js
index dbedd953..7d51937e 100644
--- a/src/containers/ApplicationsList/index.js
+++ b/src/containers/ApplicationsList/index.js
@@ -76,6 +76,11 @@ class ApplicationsListContainer extends Component {
     return isAdmin || isManager || isProjectManager
   }
 
+  /**
+   * Updates an application status and refreshes dependent data.
+   * Re-throws failures so the component can render dedicated UI for
+   * capacity-exceeded responses from the API.
+   */
   async handleUpdateStatus (applicationId, newStatus, assignmentDetails) {
     const { engagementId, projectId } = this.getParams()
     try {
@@ -83,6 +88,7 @@ class ApplicationsListContainer extends Component {
       await this.props.loadApplications(engagementId)
       await this.props.loadEngagementDetails(projectId, engagementId)
     } catch (error) {
+      throw error
     }
   }
 
diff --git a/src/reducers/applications.js b/src/reducers/applications.js
index cfd8befd..3480988d 100644
--- a/src/reducers/applications.js
+++ b/src/reducers/applications.js
@@ -3,6 +3,7 @@
  */
 import _ from 'lodash'
 import { toastSuccess, toastFailure } from '../util/toaster'
+import { isCapacityLimitError } from '../util/applicationErrors'
 import {
   LOAD_APPLICATIONS_PENDING,
   LOAD_APPLICATIONS_SUCCESS,
@@ -114,7 +115,11 @@ export default function (state = initialState, action) {
     }
     case UPDATE_APPLICATION_STATUS_FAILURE: {
       const errorMessage = getErrorMessage(action, 'Failed to update application status')
-      toastFailure('Error', errorMessage)
+      const errorStatus = _.get(action, 'error.response.status')
+      const isCapacityError = isCapacityLimitError(errorMessage, errorStatus)
+      if (!isCapacityError) {
+        toastFailure('Error', errorMessage)
+      }
       return {
         ...state,
         isLoading: false,
diff --git a/src/util/applicationErrors.js b/src/util/applicationErrors.js
new file mode 100644
index 00000000..6cfd35f0
--- /dev/null
+++ b/src/util/applicationErrors.js
@@ -0,0 +1,23 @@
+export const CAPACITY_LIMIT_ERROR_MESSAGE = 'Maximum number of members already assigned'
+
+/**
+ * Checks whether an API error matches the known assignment-capacity limit case.
+ *
+ * @param {string} message API error message.
+ * @param {number|string} status HTTP status code when available.
+ * @returns {boolean} True when the error is the capacity-limit message.
+ */
+export const isCapacityLimitError = (message, status) => {
+  if (status !== undefined && status !== null && Number(status) !== 400) {
+    return false
+  }
+
+  if (typeof message !== 'string') {
+    return false
+  }
+
+  const normalizedMessage = message.trim().replace(/\s+/g, ' ').toLowerCase()
+  const normalizedCapacityMessage = CAPACITY_LIMIT_ERROR_MESSAGE.toLowerCase()
+
+  return normalizedMessage === normalizedCapacityMessage
+}

From c9f2941ce2a3b89bac41b294d5b51a7a64546a72 Mon Sep 17 00:00:00 2001
From: Justin Gasper <jmgasper@gmail.com>
Date: Fri, 6 Mar 2026 16:43:20 +1100
Subject: [PATCH 11/17] Further QA fixes

---
 src/actions/engagements.js               | 70 +----------------------
 src/components/ApplicationsList/index.js | 44 +++++++++++++++
 src/components/EngagementEditor/index.js | 71 +++++++++++++-----------
 src/containers/EngagementEditor/index.js | 65 ++++++++++------------
 src/routes.js                            |  6 +-
 src/util/applicationErrors.js            | 53 ++++++++++++++++--
 6 files changed, 163 insertions(+), 146 deletions(-)

diff --git a/src/actions/engagements.js b/src/actions/engagements.js
index ae72cd24..d0a0c55e 100644
--- a/src/actions/engagements.js
+++ b/src/actions/engagements.js
@@ -7,7 +7,6 @@ import {
   patchEngagement,
   deleteEngagement as deleteEngagementAPI
 } from '../services/engagements'
-import { fetchProjectById } from '../services/projects'
 import { fetchSkillsByIds } from '../services/skills'
 import {
   normalizeEngagement,
@@ -34,8 +33,6 @@ import {
   DELETE_ENGAGEMENT_FAILURE
 } from '../config/constants'
 
-const projectNameCache = {}
-
 const getSkillId = (skill) => {
   if (!skill) {
     return null
@@ -96,70 +93,6 @@ const withSkillDetails = (engagement, skillsMap) => {
   }
 }
 
-const getProjectId = (engagement) => {
-  if (!engagement || !engagement.projectId) {
-    return null
-  }
-  return String(engagement.projectId)
-}
-
-const getProjectName = (project) => {
-  if (!project || typeof project !== 'object') {
-    return null
-  }
-  if (typeof project.name === 'string' && project.name.trim()) {
-    return project.name
-  }
-  if (typeof project.projectName === 'string' && project.projectName.trim()) {
-    return project.projectName
-  }
-  return null
-}
-
-const hydrateEngagementProjectNames = async (engagements = []) => {
-  if (!Array.isArray(engagements) || !engagements.length) {
-    return []
-  }
-
-  const projectIds = Array.from(new Set(
-    engagements
-      .map(getProjectId)
-      .filter(Boolean)
-  ))
-
-  if (!projectIds.length) {
-    return engagements
-  }
-
-  const uncachedProjectIds = projectIds.filter((projectId) => !projectNameCache[projectId])
-  if (uncachedProjectIds.length) {
-    const projectNameEntries = await Promise.all(
-      uncachedProjectIds.map(async (projectId) => {
-        try {
-          const project = await fetchProjectById(projectId)
-          return [projectId, getProjectName(project)]
-        } catch (error) {
-          return [projectId, null]
-        }
-      })
-    )
-
-    projectNameEntries.forEach(([projectId, projectName]) => {
-      if (projectName) {
-        projectNameCache[projectId] = projectName
-      }
-    })
-  }
-
-  return engagements.map((engagement) => {
-    const projectId = getProjectId(engagement)
-    return {
-      ...engagement,
-      projectName: (projectId && projectNameCache[projectId]) || engagement.projectName || null
-    }
-  })
-}
-
 const hydrateEngagementSkills = async (engagements = []) => {
   if (!Array.isArray(engagements) || !engagements.length) {
     return []
@@ -286,8 +219,7 @@ export function loadEngagements (projectId, status = 'all', filterName = '', inc
       } while (!totalPages || page <= totalPages)
 
       const hydratedEngagements = await hydrateEngagementSkills(engagements)
-      const engagementsWithProjectNames = await hydrateEngagementProjectNames(hydratedEngagements)
-      const normalizedEngagements = normalizeEngagements(engagementsWithProjectNames)
+      const normalizedEngagements = normalizeEngagements(hydratedEngagements)
       dispatch({
         type: LOAD_ENGAGEMENTS_SUCCESS,
         engagements: normalizedEngagements
diff --git a/src/components/ApplicationsList/index.js b/src/components/ApplicationsList/index.js
index ec64152f..2b1c0b98 100644
--- a/src/components/ApplicationsList/index.js
+++ b/src/components/ApplicationsList/index.js
@@ -14,6 +14,7 @@ import styles from './ApplicationsList.module.scss'
 import { PROFILE_URL } from '../../config/constants'
 import { serializeTentativeAssignmentDate } from '../../util/assignmentDates'
 import { isCapacityLimitError } from '../../util/applicationErrors'
+import { getCountableAssignments } from '../../util/engagements'
 
 const STATUS_OPTIONS = [
   { label: 'All', value: 'all' },
@@ -250,6 +251,37 @@ const ApplicationsList = ({
       .filter(Boolean)
     return new Set(activeAssignmentIds.map((memberId) => String(memberId)))
   }, [engagement])
+  const countableAssignments = useMemo(() => {
+    const assignments = Array.isArray(engagement && engagement.assignments)
+      ? engagement.assignments
+      : []
+    return getCountableAssignments(assignments)
+  }, [engagement])
+  const countableAssignmentMemberIds = useMemo(() => {
+    const memberIds = countableAssignments
+      .map((assignment) => assignment && assignment.memberId)
+      .filter(Boolean)
+    return new Set(memberIds.map((memberId) => String(memberId)))
+  }, [countableAssignments])
+  const assignedMemberCount = useMemo(() => {
+    if (countableAssignments.length) {
+      return countableAssignments.length
+    }
+
+    const assignedMembers = Array.isArray(engagement && engagement.assignedMembers)
+      ? engagement.assignedMembers
+      : []
+    if (assignedMembers.length) {
+      return assignedMembers.length
+    }
+
+    const assignedMemberHandles = Array.isArray(engagement && engagement.assignedMemberHandles)
+      ? engagement.assignedMemberHandles
+      : []
+    return assignedMemberHandles.length
+  }, [countableAssignments, engagement])
+  const requiredMemberCountValue = Number(engagement && engagement.requiredMemberCount)
+  const hasRequiredMemberCount = Number.isInteger(requiredMemberCountValue) && requiredMemberCountValue > 0
 
   const filteredApplications = useMemo(() => {
     let results = applications || []
@@ -365,6 +397,14 @@ const ApplicationsList = ({
       if (application.status === 'SELECTED') {
         return
       }
+      const applicationUserId = application.userId || application.user_id || application.memberId || application.member_id
+      const isExistingAssignedMember = applicationUserId != null && countableAssignmentMemberIds.has(String(applicationUserId))
+      const isAtCapacity = hasRequiredMemberCount && assignedMemberCount >= requiredMemberCountValue
+
+      if (isAtCapacity && !isExistingAssignedMember) {
+        setCapacityError(true)
+        return
+      }
       openAcceptModal(application)
       return
     }
@@ -650,6 +690,10 @@ ApplicationsList.propTypes = {
     assignedMembers: PropTypes.arrayOf(
       PropTypes.oneOfType([PropTypes.string, PropTypes.number])
     ),
+    assignedMemberHandles: PropTypes.arrayOf(
+      PropTypes.string
+    ),
+    requiredMemberCount: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
     assignments: PropTypes.arrayOf(PropTypes.shape({
       memberId: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
       status: PropTypes.string,
diff --git a/src/components/EngagementEditor/index.js b/src/components/EngagementEditor/index.js
index 0cadd8d0..44515c62 100644
--- a/src/components/EngagementEditor/index.js
+++ b/src/components/EngagementEditor/index.js
@@ -98,20 +98,20 @@ const formatAssignmentDate = (value) => {
  *
  * @param {Object} props Component props.
  * @param {Object} props.engagement Engagement draft values.
- * @param {Array<Object>} props.projects Available projects for Parent Project selection.
- * @param {boolean} props.isLoadingProjects Whether parent project options are loading.
+ * @param {string} props.currentProjectName Current project name for selected-label fallback.
+ * @param {Function} props.loadParentProjectOptions Async project search for Parent Project selection.
  * @param {boolean} props.canEditParentProject Whether current user can edit Parent Project.
  * @returns {JSX.Element}
  */
 const EngagementEditor = ({
   engagement,
   projectId,
+  currentProjectName,
   isNew,
   isLoading,
   isSaving,
   canEdit,
-  projects,
-  isLoadingProjects,
+  loadParentProjectOptions,
   canEditParentProject,
   submitTriggered,
   validationErrors,
@@ -216,17 +216,6 @@ const EngagementEditor = ({
   const selectedCountries = (engagement.countries || []).map(code => {
     return countryOptionsByValue[code] || { label: code, value: code }
   })
-  const projectOptions = useMemo(() => {
-    if (!Array.isArray(projects)) {
-      return []
-    }
-    return projects
-      .filter((project) => project && project.id != null)
-      .map((project) => ({
-        label: project.name || `Project ${project.id}`,
-        value: String(project.id)
-      }))
-  }, [projects])
   const selectedParentProjectOption = useMemo(() => {
     const selectedId = engagement.projectId != null
       ? String(engagement.projectId)
@@ -234,8 +223,12 @@ const EngagementEditor = ({
     if (!selectedId) {
       return null
     }
-    return projectOptions.find((option) => option.value === selectedId) || null
-  }, [engagement.projectId, projectId, projectOptions])
+    const selectedName = engagement.projectName || currentProjectName
+    return {
+      label: selectedName || `Project ${selectedId}`,
+      value: selectedId
+    }
+  }, [engagement.projectId, engagement.projectName, currentProjectName, projectId])
   const parentProjectName = selectedParentProjectOption
     ? selectedParentProjectOption.label
     : (engagement.projectName || '-')
@@ -899,7 +892,7 @@ const EngagementEditor = ({
                       label: engagement.status,
                       value: engagement.status
                     } : null}
-                    options={['Open', 'Active', 'Cancelled', 'Closed'].map(status => ({
+                    options={['Open', 'Active', 'On Hold', 'Cancelled', 'Closed'].map(status => ({
                       label: status,
                       value: status
                     }))}
@@ -930,15 +923,30 @@ const EngagementEditor = ({
                     <Select
                       className={styles.selectInput}
                       useBottomBorder
-                      options={projectOptions}
+                      isAsync
+                      cacheOptions
+                      loadOptions={loadParentProjectOptions}
+                      placeholder='Type at least 2 characters to search projects...'
+                      noOptionsMessage={({ inputValue }) => {
+                        return inputValue && inputValue.trim().length >= 2
+                          ? 'No projects found'
+                          : 'Type at least 2 characters to search'
+                      }}
                       value={selectedParentProjectOption}
-                      isLoading={isLoadingProjects}
-                      onChange={(option) => onUpdateInput({
-                        target: {
-                          name: 'projectId',
-                          value: option ? String(option.value) : null
-                        }
-                      })}
+                      onChange={(option) => {
+                        onUpdateInput({
+                          target: {
+                            name: 'projectId',
+                            value: option ? String(option.value) : null
+                          }
+                        })
+                        onUpdateInput({
+                          target: {
+                            name: 'projectName',
+                            value: option ? option.label : null
+                          }
+                        })
+                      }}
                       isClearable
                     />
                   ) : (
@@ -1136,12 +1144,12 @@ const EngagementEditor = ({
 EngagementEditor.defaultProps = {
   engagement: getEmptyEngagement(),
   projectId: null,
+  currentProjectName: null,
   isNew: true,
   isLoading: false,
   isSaving: false,
   canEdit: true,
-  projects: [],
-  isLoadingProjects: false,
+  loadParentProjectOptions: () => Promise.resolve([]),
   canEditParentProject: false,
   submitTriggered: false,
   validationErrors: {},
@@ -1206,15 +1214,12 @@ EngagementEditor.propTypes = {
     status: PropTypes.string
   }),
   projectId: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  currentProjectName: PropTypes.string,
   isNew: PropTypes.bool,
   isLoading: PropTypes.bool,
   isSaving: PropTypes.bool,
   canEdit: PropTypes.bool,
-  projects: PropTypes.arrayOf(PropTypes.shape({
-    id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-    name: PropTypes.string
-  })),
-  isLoadingProjects: PropTypes.bool,
+  loadParentProjectOptions: PropTypes.func,
   canEditParentProject: PropTypes.bool,
   submitTriggered: PropTypes.bool,
   validationErrors: PropTypes.shape({
diff --git a/src/containers/EngagementEditor/index.js b/src/containers/EngagementEditor/index.js
index 8fc8e1fa..d553db9f 100644
--- a/src/containers/EngagementEditor/index.js
+++ b/src/containers/EngagementEditor/index.js
@@ -119,9 +119,7 @@ class EngagementEditorContainer extends Component {
       validationErrors: {},
       showDeleteModal: false,
       isSaving: false,
-      memberIdLookup: {},
-      projects: [],
-      isLoadingProjects: false
+      memberIdLookup: {}
     }
 
     this.onUpdateInput = this.onUpdateInput.bind(this)
@@ -132,7 +130,7 @@ class EngagementEditorContainer extends Component {
     this.onDelete = this.onDelete.bind(this)
     this.onToggleDelete = this.onToggleDelete.bind(this)
     this.resolveMemberIds = this.resolveMemberIds.bind(this)
-    this.loadProjects = this.loadProjects.bind(this)
+    this.loadParentProjectOptions = this.loadParentProjectOptions.bind(this)
   }
 
   async componentDidMount () {
@@ -144,45 +142,40 @@ class EngagementEditorContainer extends Component {
     }
     if (engagementId) {
       await loadEngagementDetails(projectId, engagementId)
-      await this.loadProjects()
     }
   }
 
   /**
-   * Loads all paged projects available to the current member for Parent Project selection.
+   * Loads parent project autocomplete options for the engagement editor.
    *
-   * @returns {Promise<void>}
+   * Performs a name-filtered lookup and returns a small option set so the
+   * editor does not fetch every project before opening the dropdown.
+   *
+   * @param {string} inputValue User-entered search text.
+   * @returns {Promise<Array<{label: string, value: string}>>} Select options.
    */
-  async loadProjects () {
-    this.setState({ isLoadingProjects: true })
-    try {
-      const perPage = 100
-      let page = 1
-      let hasMore = true
-      let projects = []
-
-      while (hasMore) {
-        const response = await fetchMemberProjects({ page, perPage })
-        const pageProjects = _.get(response, 'projects', [])
-        const totalPages = _.get(response, 'pagination.xTotalPages', null)
-        projects = projects.concat(pageProjects)
-        if (totalPages) {
-          hasMore = page < totalPages
-        } else {
-          hasMore = pageProjects.length === perPage
-        }
-        page += 1
-      }
+  async loadParentProjectOptions (inputValue) {
+    const query = typeof inputValue === 'string' ? inputValue.trim() : ''
+    if (query.length < 2) {
+      return []
+    }
 
-      this.setState({
-        projects: _.uniqBy(projects, 'id'),
-        isLoadingProjects: false
+    try {
+      const response = await fetchMemberProjects({
+        name: query,
+        page: 1,
+        perPage: 20,
+        sort: 'name asc'
       })
+      const projects = _.get(response, 'projects', [])
+      return _.uniqBy(projects, 'id')
+        .filter((project) => project && project.id != null)
+        .map((project) => ({
+          label: project.name || `Project ${project.id}`,
+          value: String(project.id)
+        }))
     } catch (error) {
-      this.setState({
-        projects: [],
-        isLoadingProjects: false
-      })
+      return []
     }
   }
 
@@ -733,8 +726,8 @@ class EngagementEditorContainer extends Component {
         isLoading={isLoading}
         isSaving={this.state.isSaving}
         canEdit={this.canEdit()}
-        projects={this.state.projects}
-        isLoadingProjects={this.state.isLoadingProjects}
+        currentProjectName={_.get(this.props.projectDetail, 'name', null)}
+        loadParentProjectOptions={this.loadParentProjectOptions}
         canEditParentProject={this.canEditParentProject()}
         submitTriggered={this.state.submitTriggered}
         validationErrors={this.state.validationErrors}
diff --git a/src/routes.js b/src/routes.js
index ea0f0bfd..ce8a0869 100644
--- a/src/routes.js
+++ b/src/routes.js
@@ -265,7 +265,7 @@ class Routes extends React.Component {
               <FooterContainer />
             )()}
           />
-          {isAdmin && (
+          {canAccessEngagements && (
             <Route exact path='/engagements'
               render={() => renderApp(
                 <EngagementsList allEngagements />,
@@ -275,12 +275,12 @@ class Routes extends React.Component {
               )()}
             />
           )}
-          {!isAdmin && (
+          {!canAccessEngagements && (
             <Route exact path='/engagements'
               render={() => renderApp(
                 <Challenges
                   menu='NULL'
-                  warnMessage={'You need Admin role to view all engagements'}
+                  warnMessage={'You need Admin or Talent Manager role to view engagements'}
                 />,
                 <TopBarContainer />,
                 <Tab />,
diff --git a/src/util/applicationErrors.js b/src/util/applicationErrors.js
index 6cfd35f0..a53513aa 100644
--- a/src/util/applicationErrors.js
+++ b/src/util/applicationErrors.js
@@ -1,9 +1,36 @@
 export const CAPACITY_LIMIT_ERROR_MESSAGE = 'Maximum number of members already assigned'
+const CAPACITY_LIMIT_ERROR_MESSAGE_PATTERNS = [
+  CAPACITY_LIMIT_ERROR_MESSAGE,
+  'Maximum number of members already assigned to this engagement',
+  'Assigned member count exceeds required member count.'
+]
+
+/**
+ * Normalizes API error message payloads into a single string so capacity-limit
+ * checks can support both string and string-array responses.
+ *
+ * @param {string|Array<string>} message API error message payload.
+ * @returns {string} Normalized message text.
+ */
+const normalizeCapacityErrorMessage = (message) => {
+  if (typeof message === 'string') {
+    return message
+  }
+
+  if (Array.isArray(message)) {
+    return message
+      .map((entry) => (entry == null ? '' : String(entry)))
+      .filter(Boolean)
+      .join(' ')
+  }
+
+  return ''
+}
 
 /**
  * Checks whether an API error matches the known assignment-capacity limit case.
  *
- * @param {string} message API error message.
+ * @param {string|Array<string>} message API error message.
  * @param {number|string} status HTTP status code when available.
  * @returns {boolean} True when the error is the capacity-limit message.
  */
@@ -12,12 +39,28 @@ export const isCapacityLimitError = (message, status) => {
     return false
   }
 
-  if (typeof message !== 'string') {
+  const rawMessage = normalizeCapacityErrorMessage(message)
+  if (!rawMessage) {
+    return false
+  }
+
+  const normalizedMessage = rawMessage.trim().replace(/\s+/g, ' ').toLowerCase()
+  if (!normalizedMessage) {
     return false
   }
 
-  const normalizedMessage = message.trim().replace(/\s+/g, ' ').toLowerCase()
-  const normalizedCapacityMessage = CAPACITY_LIMIT_ERROR_MESSAGE.toLowerCase()
+  const normalizedPatterns = CAPACITY_LIMIT_ERROR_MESSAGE_PATTERNS
+    .map(pattern => pattern.toLowerCase())
+
+  if (normalizedPatterns.some(pattern => normalizedMessage === pattern)) {
+    return true
+  }
+
+  if (normalizedMessage.includes('maximum number of members already assigned')) {
+    return true
+  }
 
-  return normalizedMessage === normalizedCapacityMessage
+  return normalizedMessage.includes('required members') &&
+    normalizedMessage.includes('select') &&
+    normalizedMessage.includes('member')
 }

From 05e54687123822bd1623bb31ccb700e358723559 Mon Sep 17 00:00:00 2001
From: Justin Gasper <jmgasper@gmail.com>
Date: Fri, 6 Mar 2026 16:49:53 +1100
Subject: [PATCH 12/17] Fix alignment issue

---
 .../EngagementPayment.module.scss                | 16 ++++++++++++++++
 src/components/EngagementPayment/index.js        | 12 ++++++------
 2 files changed, 22 insertions(+), 6 deletions(-)

diff --git a/src/components/EngagementPayment/EngagementPayment.module.scss b/src/components/EngagementPayment/EngagementPayment.module.scss
index 8c1fd0f7..04924fe8 100644
--- a/src/components/EngagementPayment/EngagementPayment.module.scss
+++ b/src/components/EngagementPayment/EngagementPayment.module.scss
@@ -54,6 +54,7 @@
   align-items: center;
   gap: 8px;
   flex-wrap: wrap;
+  flex: 0 0 auto;
 }
 
 .actionButton {
@@ -70,6 +71,7 @@
   padding: 6px 12px;
   font-size: 12px;
   font-weight: 600;
+  white-space: nowrap;
   cursor: pointer;
   transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
 }
@@ -88,6 +90,8 @@
   display: flex;
   flex-direction: column;
   gap: 4px;
+  flex: 1;
+  min-width: 0;
 }
 
 .memberHeader {
@@ -149,6 +153,18 @@
   font-weight: 600;
 }
 
+.memberTerminationReason {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+  margin-top: 4px;
+
+  .memberMetaValue {
+    line-height: 1.4;
+    word-break: break-word;
+  }
+}
+
 .termsIndicator {
   display: inline-flex;
   align-items: center;
diff --git a/src/components/EngagementPayment/index.js b/src/components/EngagementPayment/index.js
index db84a26f..70117c28 100644
--- a/src/components/EngagementPayment/index.js
+++ b/src/components/EngagementPayment/index.js
@@ -446,13 +446,13 @@ const EngagementPayment = ({
                         <span className={styles.memberMetaLabel}>Tentative End</span>
                         <span className={styles.memberMetaValue}>{endDate}</span>
                       </div>
-                      {assignmentStatusLower === 'terminated' && member.terminationReason && (
-                        <div className={styles.memberMetaItem}>
-                          <span className={styles.memberMetaLabel}>Termination Reason</span>
-                          <span className={styles.memberMetaValue}>{member.terminationReason}</span>
-                        </div>
-                      )}
                     </div>
+                    {assignmentStatusLower === 'terminated' && member.terminationReason && (
+                      <div className={styles.memberTerminationReason}>
+                        <span className={styles.memberMetaLabel}>Termination Reason</span>
+                        <span className={styles.memberMetaValue}>{member.terminationReason}</span>
+                      </div>
+                    )}
                   </div>
                   <div className={styles.memberActions}>
                     {/* Payment history is available for any assignment status with an assignment ID. */}

From adc6f30f931e8cb6cc49074c678f125159e62665 Mon Sep 17 00:00:00 2001
From: Justin Gasper <jmgasper@gmail.com>
Date: Fri, 6 Mar 2026 17:12:08 +1100
Subject: [PATCH 13/17] Updatefor projects filtering

---
 src/services/engagements.js | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/services/engagements.js b/src/services/engagements.js
index 6ebf9eb0..c396b112 100644
--- a/src/services/engagements.js
+++ b/src/services/engagements.js
@@ -14,7 +14,9 @@ export function fetchEngagements (filters = {}, params = {}) {
     ...filters,
     ...params
   }
-  const queryString = qs.stringify(query, { encode: false })
+  // Engagements API expects repeated query params for arrays (e.g. `projectIds=1&projectIds=2`).
+  // Bracket-indexed arrays (`projectIds[0]=1`) are ignored by the backend and can leak unscoped results.
+  const queryString = qs.stringify(query, { encode: false, arrayFormat: 'repeat' })
   const querySuffix = queryString ? `?${queryString}` : ''
   return axiosInstance.get(`${ENGAGEMENTS_API_URL}${querySuffix}`)
 }

From f5464ce4d26aa0c67fea57c8b3bc3e0da353635a Mon Sep 17 00:00:00 2001
From: Justin Gasper <jmgasper@gmail.com>
Date: Mon, 9 Mar 2026 10:50:16 +1100
Subject: [PATCH 14/17] QA fixes

---
 src/components/UserCard/index.js | 19 +++++++++++++--
 src/components/Users/index.js    | 14 ++++++++++-
 src/containers/Users/index.js    | 40 ++++++++++++++++++++------------
 src/services/projects.js         | 19 +++++++++++++++
 4 files changed, 74 insertions(+), 18 deletions(-)

diff --git a/src/components/UserCard/index.js b/src/components/UserCard/index.js
index 0eee55e0..03970d87 100644
--- a/src/components/UserCard/index.js
+++ b/src/components/UserCard/index.js
@@ -13,6 +13,16 @@ const theme = {
   container: styles.modalContainer
 }
 
+function normalizeDisplayValue (value) {
+  if (_.isNil(value)) {
+    return null
+  }
+
+  const normalizedValue = String(value).trim()
+
+  return normalizedValue || null
+}
+
 /**
  * Renders one project member or invite card with role controls.
  *
@@ -67,8 +77,13 @@ class UserCard extends Component {
   render () {
     const { isInvite, user, onRemoveClick, isEditable } = this.props
     const showRadioButtons = _.includes(_.values(PROJECT_ROLES), user.role)
-    const userDisplayName = user.handle || user.userId || '(unknown user)'
-    const inviteDisplayName = user.email || user.handle || user.userId || '(unknown user)'
+    const userDisplayName = normalizeDisplayValue(user.handle) ||
+      normalizeDisplayValue(user.userId) ||
+      '(unknown user)'
+    const inviteDisplayName = normalizeDisplayValue(user.email) ||
+      normalizeDisplayValue(user.handle) ||
+      normalizeDisplayValue(user.userId) ||
+      '(unknown user)'
     return (
       <div>
         {
diff --git a/src/components/Users/index.js b/src/components/Users/index.js
index 90bd4401..38fbf07b 100644
--- a/src/components/Users/index.js
+++ b/src/components/Users/index.js
@@ -19,6 +19,18 @@ const theme = {
   container: styles.modalContainer
 }
 
+function getUserDisplayName (user) {
+  if (!user) {
+    return '(unknown user)'
+  }
+
+  const displayName = [user.handle, user.email, user.userId]
+    .map(value => typeof value === 'undefined' || value === null ? '' : String(value).trim())
+    .find(Boolean)
+
+  return displayName || '(unknown user)'
+}
+
 class Users extends Component {
   constructor (props) {
     super(props)
@@ -263,7 +275,7 @@ class Users extends Component {
           this.state.showRemoveConfirmationModal && (
             <ConfirmationModal
               title='Confirm Removal'
-              message={`Are you sure you want to remove ${this.state.userToRemove.handle || this.state.userToRemove.email} from this project?`}
+              message={`Are you sure you want to remove ${getUserDisplayName(this.state.userToRemove)} from this project?`}
               theme={theme}
               isProcessing={this.state.isRemoving}
               errorMessage={this.state.removeError}
diff --git a/src/containers/Users/index.js b/src/containers/Users/index.js
index 5ae8281f..91faaef4 100644
--- a/src/containers/Users/index.js
+++ b/src/containers/Users/index.js
@@ -5,7 +5,8 @@ import PT from 'prop-types'
 import { withRouter } from 'react-router-dom'
 import UsersComponent from '../../components/Users'
 import { PROJECT_ROLES } from '../../config/constants'
-import { fetchInviteMembers, fetchProjectById } from '../../services/projects'
+import { fetchProjectById, fetchProjectMembers } from '../../services/projects'
+import { getProjectMemberInvites } from '../../services/projectMemberInvites'
 import { checkAdmin, checkManager } from '../../util/tc'
 
 import {
@@ -90,32 +91,41 @@ class Users extends Component {
   }
 
   /**
-   * Loads project details and stores members/invites in local state.
+   * Loads project details plus project-scoped members/invites into local state.
    *
-   * `projectMembers` comes from `fetchProjectById`, which enriches missing
-   * member handles through `MEMBERS_API_URL` before resolving.
+   * Members and invites are loaded from their dedicated project endpoints so
+   * handle resolution follows project permissions instead of a separate member
+   * directory lookup.
    *
    * @param {string|number} projectId Project id to load.
    * @returns {void}
    */
   loadProject (projectId) {
     this.setState({ isLoadingProject: true })
-    fetchProjectById(projectId).then(async (project) => {
-      const projectMembers = _.get(project, 'members')
-      const invitedMembers = _.get(project, 'invites') || []
-      const invitedUserIds = _.filter(_.map(invitedMembers, 'userId'))
-      const invitedUsers = await fetchInviteMembers(invitedUserIds)
+    Promise.all([
+      fetchProjectById(projectId),
+      fetchProjectMembers(projectId),
+      getProjectMemberInvites(projectId)
+    ]).then(([project, projectMembers, invitedMembers]) => {
+      const normalizedProjectMembers = projectMembers || []
+      const normalizedInvitedMembers = invitedMembers || []
+      let resolvedProject = this.state.project
+
+      if (!resolvedProject && project && project.id && project.name) {
+        resolvedProject = {
+          id: project.id,
+          name: project.name
+        }
+      }
 
       this.setState({
-        projectMembers,
-        invitedMembers: invitedMembers.map(m => ({
-          ...m,
-          email: m.email || invitedUsers[m.userId].handle
-        })),
+        projectMembers: normalizedProjectMembers,
+        invitedMembers: normalizedInvitedMembers,
+        project: resolvedProject,
         isLoadingProject: false
       })
       const { loggedInUser } = this.props
-      this.updateLoginUserRoleInProject(projectMembers, loggedInUser)
+      this.updateLoginUserRoleInProject(normalizedProjectMembers, loggedInUser)
     })
   }
 
diff --git a/src/services/projects.js b/src/services/projects.js
index 5f8ef155..b5e3b9ae 100644
--- a/src/services/projects.js
+++ b/src/services/projects.js
@@ -95,6 +95,25 @@ export async function fetchProjectById (id) {
   }
 }
 
+/**
+ * Fetch project members with handle enrichment supplied by the Projects API.
+ *
+ * This avoids depending on a separate member-directory lookup in callers that
+ * only need project membership data for display/edit flows.
+ *
+ * @param {string|number} projectId Project id.
+ * @returns {Promise<Array>} Project members.
+ */
+export async function fetchProjectMembers (projectId) {
+  const response = await axiosInstance.get(`${PROJECTS_API_URL}/${projectId}/members`, {
+    params: {
+      fields: 'handle'
+    }
+  })
+
+  return _.get(response, 'data', [])
+}
+
 /**
  * This fetches the user corresponding to the given userIds
  * @param {*} userIds

From 525848806feb109a607f420d4d4824c1a471ed78 Mon Sep 17 00:00:00 2001
From: Justin Gasper <jmgasper@gmail.com>
Date: Mon, 9 Mar 2026 11:38:50 +1100
Subject: [PATCH 15/17] Better invite handling for accept / decline

---
 src/components/ProjectCard/index.js  |   5 +-
 src/containers/ProjectEntry/index.js | 100 +++++++++++++++++++++++++++
 src/containers/Projects/index.js     |   3 +-
 src/routes.js                        |   9 +++
 src/util/tc.js                       |  14 +++-
 5 files changed, 124 insertions(+), 7 deletions(-)
 create mode 100644 src/containers/ProjectEntry/index.js

diff --git a/src/components/ProjectCard/index.js b/src/components/ProjectCard/index.js
index 97376dc4..e387775d 100644
--- a/src/components/ProjectCard/index.js
+++ b/src/components/ProjectCard/index.js
@@ -8,11 +8,11 @@ import { PROJECT_STATUSES } from '../../config/constants'
 
 import styles from './ProjectCard.module.scss'
 
-const ProjectCard = ({ projectName, projectStatus, projectId, selected, isInvited }) => {
+const ProjectCard = ({ projectName, projectStatus, projectId, selected }) => {
   return (
     <div className={styles.container}>
       <Link
-        to={`/projects/${projectId}/${isInvited ? 'invitation' : 'challenges'}`}
+        to={`/projects/${projectId}`}
         className={cn(styles.projectName, { [styles.selected]: selected })}
       >
         <div className={styles.name}>
@@ -28,7 +28,6 @@ ProjectCard.propTypes = {
   projectStatus: PT.string.isRequired,
   projectId: PT.number.isRequired,
   projectName: PT.string.isRequired,
-  isInvited: PT.bool.isRequired,
   selected: PT.bool
 }
 
diff --git a/src/containers/ProjectEntry/index.js b/src/containers/ProjectEntry/index.js
new file mode 100644
index 00000000..1215b497
--- /dev/null
+++ b/src/containers/ProjectEntry/index.js
@@ -0,0 +1,100 @@
+import PropTypes from 'prop-types'
+import React, { useEffect, useState } from 'react'
+import { connect } from 'react-redux'
+import { withRouter } from 'react-router-dom'
+import _ from 'lodash'
+
+import Loader from '../../components/Loader'
+import { loadOnlyProjectInfo } from '../../actions/projects'
+import { checkIsUserInvitedToProject } from '../../util/tc'
+
+/**
+ * Resolves the correct project landing route for `/projects/:projectId`.
+ *
+ * It loads lightweight project details first so invited users can be sent to
+ * the invitation modal before challenge-specific requests run.
+ */
+const ProjectEntry = ({
+  history,
+  isProjectLoading,
+  loadOnlyProjectInfo,
+  match,
+  projectDetail,
+  token
+}) => {
+  const projectId = _.get(match, 'params.projectId')
+  const [resolvedProjectId, setResolvedProjectId] = useState(null)
+
+  useEffect(() => {
+    let isActive = true
+
+    if (!projectId) {
+      history.replace('/projects')
+      return undefined
+    }
+
+    setResolvedProjectId(null)
+    loadOnlyProjectInfo(projectId)
+      .then(() => {
+        if (isActive) {
+          setResolvedProjectId(projectId)
+        }
+      })
+      .catch(() => {
+        if (isActive) {
+          history.replace('/projects')
+        }
+      })
+
+    return () => {
+      isActive = false
+    }
+  }, [history, loadOnlyProjectInfo, projectId])
+
+  useEffect(() => {
+    if (
+      !resolvedProjectId ||
+      isProjectLoading ||
+      `${_.get(projectDetail, 'id', '')}` !== `${resolvedProjectId}`
+    ) {
+      return
+    }
+
+    const destination = checkIsUserInvitedToProject(token, projectDetail)
+      ? `/projects/${resolvedProjectId}/invitation`
+      : `/projects/${resolvedProjectId}/challenges`
+
+    history.replace(destination)
+  }, [history, isProjectLoading, projectDetail, resolvedProjectId, token])
+
+  return <Loader />
+}
+
+ProjectEntry.propTypes = {
+  history: PropTypes.shape({
+    replace: PropTypes.func.isRequired
+  }).isRequired,
+  isProjectLoading: PropTypes.bool,
+  loadOnlyProjectInfo: PropTypes.func.isRequired,
+  match: PropTypes.shape({
+    params: PropTypes.shape({
+      projectId: PropTypes.string
+    })
+  }).isRequired,
+  projectDetail: PropTypes.object,
+  token: PropTypes.string
+}
+
+const mapStateToProps = ({ auth, projects }) => ({
+  isProjectLoading: projects.isLoading,
+  projectDetail: projects.projectDetail,
+  token: auth.token
+})
+
+const mapDispatchToProps = {
+  loadOnlyProjectInfo
+}
+
+export default withRouter(
+  connect(mapStateToProps, mapDispatchToProps)(ProjectEntry)
+)
diff --git a/src/containers/Projects/index.js b/src/containers/Projects/index.js
index 0088575a..97fcc577 100644
--- a/src/containers/Projects/index.js
+++ b/src/containers/Projects/index.js
@@ -5,7 +5,7 @@ import { withRouter, Link } from 'react-router-dom'
 import { connect } from 'react-redux'
 import PropTypes from 'prop-types'
 import Loader from '../../components/Loader'
-import { checkAdminOrCopilotOrManager, checkIsUserInvitedToProject, checkManager } from '../../util/tc'
+import { checkAdminOrCopilotOrManager, checkManager } from '../../util/tc'
 import { PrimaryButton } from '../../components/Buttons'
 import Select from '../../components/Select'
 import ProjectCard from '../../components/ProjectCard'
@@ -112,7 +112,6 @@ const Projects = ({ projects, auth, isLoading, projectsCount, loadProjects, load
             {projects.map(p => (
               <li key={p.id}>
                 <ProjectCard
-                  isInvited={!!checkIsUserInvitedToProject(auth.token, p)}
                   projectStatus={p.status}
                   projectName={p.name}
                   projectId={p.id}
diff --git a/src/routes.js b/src/routes.js
index ce8a0869..3a160dd7 100644
--- a/src/routes.js
+++ b/src/routes.js
@@ -42,6 +42,7 @@ import Groups from './containers/Groups'
 import { isBetaMode, removeFromLocalStorage, saveToLocalStorage } from './util/localstorage'
 import ProjectEditor from './containers/ProjectEditor'
 import ProjectInvitations from './containers/ProjectInvitations'
+import ProjectEntry from './containers/ProjectEntry'
 
 const { ACCOUNTS_APP_LOGIN_URL } = process.env
 
@@ -535,6 +536,14 @@ class Routes extends React.Component {
               <Tab projectId={match.params.projectId} menu={'New Challenge'} />,
               <FooterContainer />
             )()} />
+          <Route exact path='/projects/:projectId'
+            render={({ match }) => renderApp(
+              <ProjectEntry />,
+              <TopBarContainer projectId={match.params.projectId} />,
+              <Tab projectId={match.params.projectId} />,
+              <FooterContainer />
+            )()}
+          />
           <Route exact path='/projects/:projectId/challenges'
             render={({ match }) => renderApp(
               <Challenges projectId={match.params.projectId} key='challenges' />,
diff --git a/src/util/tc.js b/src/util/tc.js
index 1c13c6fa..d0b6ca03 100644
--- a/src/util/tc.js
+++ b/src/util/tc.js
@@ -13,7 +13,8 @@ import {
   ALLOWED_EDIT_RESOURCE_ROLES,
   MANAGER_ROLES,
   PROJECT_ROLES,
-  TASK_MANAGER_ROLES
+  TASK_MANAGER_ROLES,
+  PROJECT_MEMBER_INVITE_STATUS_PENDING
 } from '../config/constants'
 import _ from 'lodash'
 import { decodeToken } from 'tc-auth-lib'
@@ -294,13 +295,22 @@ export const checkAdminOrCopilotOrManager = (token, project) => {
   return checkManager(token) || checkAdminOrCopilot(token, project)
 }
 
+/**
+ * Returns the authenticated user's pending invite for a project, if one exists.
+ *
+ * Accepted or declined historical invites are intentionally ignored so callers
+ * only trigger the invitation flow for actionable invitations.
+ */
 export const checkIsUserInvitedToProject = (token, project) => {
   if (!token) {
     return
   }
 
   const tokenData = decodeToken(token)
-  return project && !_.isEmpty(project) && (_.find(project.invites, d => d.userId === tokenData.userId || d.email === tokenData.email))
+  return project && !_.isEmpty(project) && (_.find(project.invites, d => (
+    d.status === PROJECT_MEMBER_INVITE_STATUS_PENDING &&
+    (d.userId === tokenData.userId || d.email === tokenData.email)
+  )))
 }
 
 /**

From 7f184becece6fff85dd4526cf472636713ee44bc Mon Sep 17 00:00:00 2001
From: Justin Gasper <jmgasper@gmail.com>
Date: Tue, 10 Mar 2026 07:27:06 +1100
Subject: [PATCH 16/17] Additional QA fixes

---
 .../ModalAttachmentOptions/index.js           |   5 +-
 .../AssetsLibrary/ProjectMembers/index.js     |   7 +-
 .../ProjectMembers/index.test.js              |  60 +++++++
 .../AssetsLibrary/TableAssets/index.js        |   4 +-
 src/components/ChallengesComponent/index.js   |  62 ++++---
 .../ChallengesComponent/index.test.js         | 160 ++++++++++++++++++
 src/components/FieldUserAutoComplete/index.js |  58 +++++--
 .../FieldUserAutoComplete/index.test.js       |  94 ++++++++++
 src/containers/ProjectAssets/index.jsx        |   1 -
 src/containers/Tab/index.js                   |   8 +-
 src/util/tc.js                                |  69 +++++++-
 11 files changed, 463 insertions(+), 65 deletions(-)
 create mode 100644 src/components/AssetsLibrary/ProjectMembers/index.test.js
 create mode 100644 src/components/ChallengesComponent/index.test.js
 create mode 100644 src/components/FieldUserAutoComplete/index.test.js

diff --git a/src/components/AssetsLibrary/ModalAttachmentOptions/index.js b/src/components/AssetsLibrary/ModalAttachmentOptions/index.js
index e879746a..153aa297 100644
--- a/src/components/AssetsLibrary/ModalAttachmentOptions/index.js
+++ b/src/components/AssetsLibrary/ModalAttachmentOptions/index.js
@@ -31,7 +31,6 @@ const ModalAttachmentOptions = ({
   addAttachment,
   updateAttachment,
   projectId,
-  loggedInUser,
   newAttachments
 }) => {
   const [isProcessing, setIsProcessing] = useState(false)
@@ -196,7 +195,6 @@ const ModalAttachmentOptions = ({
                       value={value}
                       onChangeValue={onChange}
                       projectMembers={members}
-                      loggedInUser={loggedInUser}
                     />
                   )}
                   name='allowedUsers'
@@ -265,8 +263,7 @@ ModalAttachmentOptions.propTypes = {
   members: PropTypes.arrayOf(PropTypes.shape()),
   addAttachment: PropTypes.func.isRequired,
   updateAttachment: PropTypes.func.isRequired,
-  projectId: PropTypes.string,
-  loggedInUser: PropTypes.object
+  projectId: PropTypes.string
 }
 
 const mapStateToProps = () => {
diff --git a/src/components/AssetsLibrary/ProjectMembers/index.js b/src/components/AssetsLibrary/ProjectMembers/index.js
index ad9eeb6c..a841d64b 100644
--- a/src/components/AssetsLibrary/ProjectMembers/index.js
+++ b/src/components/AssetsLibrary/ProjectMembers/index.js
@@ -6,12 +6,13 @@ import _ from 'lodash'
 import styles from './styles.module.scss'
 import ProjectMember from '../ProjectMember'
 import cn from 'classnames'
+import { getProjectMemberByUserId } from '../../../util/tc'
 
 const ProjectMembers = ({ classsName, members, allowedUsers, maxShownNum }) => {
   const [showAll, setShowAll] = useState(false)
   const allowedUserInfos = useMemo(() => {
     const results = _.uniqBy(
-      _.compact(allowedUsers.map(userId => _.find(members, { userId }))),
+      _.compact(allowedUsers.map(userId => getProjectMemberByUserId(members, userId))),
       'userId'
     )
     let extra = 0
@@ -53,7 +54,9 @@ ProjectMembers.defaultProps = {
 ProjectMembers.propTypes = {
   classsName: PropTypes.string,
   maxShownNum: PropTypes.number,
-  allowedUsers: PropTypes.arrayOf(PropTypes.number),
+  allowedUsers: PropTypes.arrayOf(
+    PropTypes.oneOfType([PropTypes.string, PropTypes.number])
+  ),
   members: PropTypes.arrayOf(PropTypes.shape())
 }
 
diff --git a/src/components/AssetsLibrary/ProjectMembers/index.test.js b/src/components/AssetsLibrary/ProjectMembers/index.test.js
new file mode 100644
index 00000000..88fcecff
--- /dev/null
+++ b/src/components/AssetsLibrary/ProjectMembers/index.test.js
@@ -0,0 +1,60 @@
+/* eslint-disable react/prop-types */
+/* global describe, it, expect, beforeEach, afterEach, jest */
+
+import React from 'react'
+import ReactDOM from 'react-dom'
+import { act } from 'react-dom/test-utils'
+import ProjectMembers from './index'
+
+jest.mock('../../../util/tc', () => ({
+  getProjectMemberByUserId: (projectMembers, userId) => (
+    (projectMembers || []).find(member => `${member.userId}` === `${userId}`) || null
+  )
+}))
+
+jest.mock('../ProjectMember', () => {
+  const React = require('react')
+
+  return function MockProjectMember ({ memberInfo }) {
+    return React.createElement(
+      'span',
+      { className: 'project-member' },
+      memberInfo.handle || memberInfo.userId
+    )
+  }
+})
+
+describe('ProjectMembers', () => {
+  let container
+
+  const renderComponent = (props = {}) => {
+    act(() => {
+      ReactDOM.render(
+        <ProjectMembers {...props} />,
+        container
+      )
+    })
+  }
+
+  beforeEach(() => {
+    container = document.createElement('div')
+    document.body.appendChild(container)
+  })
+
+  afterEach(() => {
+    ReactDOM.unmountComponentAtNode(container)
+    container.remove()
+    container = null
+  })
+
+  it('matches shared users even when allowed user ids are strings', () => {
+    renderComponent({
+      members: [
+        { userId: 305384, handle: 'bopowfamo' }
+      ],
+      allowedUsers: ['305384']
+    })
+
+    expect(container.textContent).toContain('bopowfamo')
+  })
+})
diff --git a/src/components/AssetsLibrary/TableAssets/index.js b/src/components/AssetsLibrary/TableAssets/index.js
index e5dc40c4..6af8267d 100644
--- a/src/components/AssetsLibrary/TableAssets/index.js
+++ b/src/components/AssetsLibrary/TableAssets/index.js
@@ -2,7 +2,6 @@
 
 import React, { useMemo } from 'react'
 import PropTypes from 'prop-types'
-import _ from 'lodash'
 import moment from 'moment'
 import styles from './styles.module.scss'
 import Table from '../../Table'
@@ -17,6 +16,7 @@ import {
 } from '../../../config/constants'
 import ProjectMembers from '../ProjectMembers'
 import ProjectMember from '../ProjectMember'
+import { getProjectMemberByUserId } from '../../../util/tc'
 
 const TableAssets = ({
   classsName,
@@ -34,7 +34,7 @@ const TableAssets = ({
     () =>
       datas.map(item => {
         const titles = item.title.split('.')
-        const owner = _.find(members, { userId: item.createdBy })
+        const owner = getProjectMemberByUserId(members, item.createdBy)
         const canEdit =
           `${item.createdBy}` === `${loggedInUser.userId}` || isAdmin
         return {
diff --git a/src/components/ChallengesComponent/index.js b/src/components/ChallengesComponent/index.js
index 79bcf8d4..dd85ac1c 100644
--- a/src/components/ChallengesComponent/index.js
+++ b/src/components/ChallengesComponent/index.js
@@ -11,7 +11,14 @@ import { PROJECT_ROLES, PROJECT_STATUS, COPILOTS_URL, CHALLENGE_STATUS } from '.
 import { PrimaryButton, OutlineButton } from '../Buttons'
 import ChallengeList from './ChallengeList'
 import styles from './ChallengesComponent.module.scss'
-import { checkAdmin, checkReadOnlyRoles, checkAdminOrCopilot, checkAdminOrCopilotOrManager, checkManager } from '../../util/tc'
+import {
+  checkAdmin,
+  checkReadOnlyRoles,
+  checkAdminOrCopilotOrManager,
+  checkCanViewProjectAssets,
+  checkManager,
+  getProjectMemberByUserId
+} from '../../util/tc'
 
 const ChallengesComponent = ({
   challenges,
@@ -51,7 +58,7 @@ const ChallengesComponent = ({
 }) => {
   const [loginUserRoleInProject, setLoginUserRoleInProject] = useState('')
   const isReadOnly = checkReadOnlyRoles(auth.token) || loginUserRoleInProject === PROJECT_ROLES.READ
-  const isAdminOrCopilot = checkAdminOrCopilot(auth.token, activeProject)
+  const canViewAssets = checkCanViewProjectAssets(auth.token, activeProject)
   const canEditProject = checkAdminOrCopilotOrManager(auth.token, activeProject)
 
   const projectStatus = activeProject && activeProject.status
@@ -62,12 +69,11 @@ const ChallengesComponent = ({
 
   useEffect(() => {
     const loggedInUser = auth.user
-    const projectMembers = activeProject.members
-    const loginUserProjectInfo = _.find(projectMembers, { userId: loggedInUser.userId })
+    const loginUserProjectInfo = getProjectMemberByUserId(activeProject, _.get(loggedInUser, 'userId'))
     if (loginUserProjectInfo && loginUserRoleInProject !== loginUserProjectInfo.role) {
       setLoginUserRoleInProject(loginUserProjectInfo.role)
     }
-  }, [activeProject, auth])
+  }, [activeProject, auth, loginUserRoleInProject])
 
   return (
     <div>
@@ -90,19 +96,21 @@ const ChallengesComponent = ({
             </span>
           )}
         </div>
-        {activeProject && activeProject.id && !isReadOnly ? (
+        {activeProject && activeProject.id && (!isReadOnly || canViewAssets) ? (
           <div className={styles.projectActionButtonWrapper}>
-            <OutlineButton
-              text={'Users'}
-              type='info'
-              submit
-              link={{
-                pathname: '/users',
-                state: { projectId: activeProjectId, projectName: activeProject.name }
-              }}
-              className={styles.btnOutline}
-            />
-            {isAdminOrCopilot && (
+            {!isReadOnly && (
+              <OutlineButton
+                text={'Users'}
+                type='info'
+                submit
+                link={{
+                  pathname: '/users',
+                  state: { projectId: activeProjectId, projectName: activeProject.name }
+                }}
+                className={styles.btnOutline}
+              />
+            )}
+            {canViewAssets && (
               <OutlineButton
                 text={'Assets Library'}
                 type={'info'}
@@ -111,7 +119,7 @@ const ChallengesComponent = ({
                 className={styles.btnOutline}
               />
             )}
-            {(checkAdmin(auth.token) || checkManager(auth.token)) && !isCompletedOrCancelled && (
+            {!isReadOnly && (checkAdmin(auth.token) || checkManager(auth.token)) && !isCompletedOrCancelled && (
               <OutlineButton
                 text='Request Copilot'
                 type={'info'}
@@ -119,14 +127,16 @@ const ChallengesComponent = ({
                 target={'_blank'}
               />
             )}
-            {activeProject.status === PROJECT_STATUS.ACTIVE ? (
-              <Link
-                to={`/projects/${activeProject.id}/challenges/new`}
-              >
-                <PrimaryButton text={'Launch New'} type={'info'} />
-              </Link>
-            ) : (
-              <PrimaryButton text={'Launch New'} type={'info'} disabled />
+            {!isReadOnly && (
+              activeProject.status === PROJECT_STATUS.ACTIVE ? (
+                <Link
+                  to={`/projects/${activeProject.id}/challenges/new`}
+                >
+                  <PrimaryButton text={'Launch New'} type={'info'} />
+                </Link>
+              ) : (
+                <PrimaryButton text={'Launch New'} type={'info'} disabled />
+              )
             )}
           </div>
         ) : (
diff --git a/src/components/ChallengesComponent/index.test.js b/src/components/ChallengesComponent/index.test.js
new file mode 100644
index 00000000..e3bc6ec1
--- /dev/null
+++ b/src/components/ChallengesComponent/index.test.js
@@ -0,0 +1,160 @@
+/* eslint-disable react/prop-types */
+/* global describe, it, expect, beforeEach, afterEach, jest */
+
+import React from 'react'
+import ReactDOM from 'react-dom'
+import { act } from 'react-dom/test-utils'
+import { MemoryRouter } from 'react-router-dom'
+import { PROJECT_ROLES, PROJECT_STATUS } from '../../config/constants'
+import ChallengesComponent from './index'
+
+jest.mock('../Buttons', () => {
+  const React = require('react')
+
+  const renderButton = (text, disabled) => React.createElement(
+    'button',
+    { type: 'button', disabled },
+    text
+  )
+
+  return {
+    PrimaryButton: ({ text, disabled }) => renderButton(text, disabled),
+    OutlineButton: ({ text, disabled }) => renderButton(text, disabled)
+  }
+})
+
+jest.mock('./ChallengeList', () => () => null)
+jest.mock('./ProjectStatus', () => () => null)
+jest.mock('react-helmet', () => ({
+  Helmet: () => null
+}))
+
+jest.mock('../../util/tc', () => ({
+  checkAdmin: jest.fn(),
+  checkReadOnlyRoles: jest.fn(),
+  checkAdminOrCopilotOrManager: jest.fn(),
+  checkCanViewProjectAssets: jest.fn(),
+  checkManager: jest.fn(),
+  getProjectMemberByUserId: jest.fn((project, userId) => {
+    const members = (project && project.members) || []
+    return members.find(member => `${member.userId}` === `${userId}`) || null
+  })
+}))
+
+const tcUtils = require('../../util/tc')
+
+describe('ChallengesComponent', () => {
+  let container
+
+  const defaultProps = {
+    challenges: [],
+    projects: [],
+    fetchNextProjects: () => {},
+    activeProject: {
+      id: 100537,
+      name: 'Work Manager - Topcoder',
+      status: PROJECT_STATUS.ACTIVE,
+      members: []
+    },
+    isLoading: false,
+    warnMessage: '',
+    filterChallengeName: '',
+    filterChallengeType: null,
+    filterProjectOption: null,
+    filterDate: null,
+    filterSortBy: '',
+    filterSortOrder: '',
+    status: 'all',
+    activeProjectId: 100537,
+    loadChallengesByPage: () => {},
+    page: 1,
+    perPage: 10,
+    totalChallenges: 0,
+    partiallyUpdateChallengeDetails: () => {},
+    deleteChallenge: () => {},
+    setActiveProject: () => {},
+    isBillingAccountExpired: false,
+    dashboard: false,
+    billingStartDate: '',
+    billingEndDate: '',
+    billingAccounts: [],
+    updateProject: () => {},
+    isBillingAccountsLoading: false,
+    currentBillingAccount: null,
+    isBillingAccountLoadingFailed: false,
+    isBillingAccountLoading: false,
+    selfService: false,
+    auth: {
+      token: 'token',
+      user: {
+        userId: '12345',
+        handle: 'member'
+      }
+    },
+    challengeTypes: []
+  }
+
+  const renderComponent = (props = {}) => {
+    act(() => {
+      ReactDOM.render(
+        <MemoryRouter>
+          <ChallengesComponent {...defaultProps} {...props} />
+        </MemoryRouter>,
+        container
+      )
+    })
+  }
+
+  beforeEach(() => {
+    container = document.createElement('div')
+    document.body.appendChild(container)
+
+    tcUtils.checkAdmin.mockReturnValue(false)
+    tcUtils.checkReadOnlyRoles.mockReturnValue(false)
+    tcUtils.checkAdminOrCopilotOrManager.mockReturnValue(false)
+    tcUtils.checkCanViewProjectAssets.mockReturnValue(true)
+    tcUtils.checkManager.mockReturnValue(false)
+  })
+
+  afterEach(() => {
+    ReactDOM.unmountComponentAtNode(container)
+    container.remove()
+    container = null
+    jest.clearAllMocks()
+  })
+
+  it('shows the Asset Library button for non-admin project members', () => {
+    renderComponent({
+      activeProject: {
+        ...defaultProps.activeProject,
+        members: [
+          {
+            userId: '12345',
+            role: PROJECT_ROLES.WRITE
+          }
+        ]
+      }
+    })
+
+    expect(container.textContent).toContain('Users')
+    expect(container.textContent).toContain('Assets Library')
+  })
+
+  it('shows only the Asset Library action for read-only project members', () => {
+    renderComponent({
+      activeProject: {
+        ...defaultProps.activeProject,
+        members: [
+          {
+            userId: '12345',
+            role: PROJECT_ROLES.READ
+          }
+        ]
+      }
+    })
+
+    expect(container.textContent).toContain('Assets Library')
+    expect(container.textContent).not.toContain('Users')
+    expect(container.textContent).not.toContain('Launch New')
+  })
+})
diff --git a/src/components/FieldUserAutoComplete/index.js b/src/components/FieldUserAutoComplete/index.js
index 501aba9a..361ff669 100644
--- a/src/components/FieldUserAutoComplete/index.js
+++ b/src/components/FieldUserAutoComplete/index.js
@@ -5,36 +5,66 @@
  * @param {Array<string|number>} props.value Selected user ids.
  * @param {Function} props.onChangeValue Callback invoked with selected user ids.
  * @param {string} props.id Field id.
- * @param {Array<Object>} props.projectMembers Project member records with `userId` and optional `handle`.
- * @param {Object} props.loggedInUser Logged in user record.
+ * @param {Array<Object>} props.projectMembers Project member records with `userId`
+ *   and optional `handle` / `email`.
  * @returns {JSX.Element} User select component.
  *
- * Members without `handle` are excluded from dropdown options. For already
- * selected users missing a handle, this falls back to `userId` for labels.
+ * Every project member with a `userId` is included in the dropdown. Labels
+ * fall back from `handle` to `email` to `userId`, and selected users are
+ * resolved by normalized `userId` matching so string/number ids both work.
  */
 
 import React, { useMemo } from 'react'
 import _ from 'lodash'
 import PropTypes from 'prop-types'
 import Select from '../Select'
+import { getProjectMemberByUserId } from '../../util/tc'
+
+function getMemberOptionLabel (member, fallbackUserId) {
+  const fallbackValue = _.isNil(fallbackUserId) ? '' : `${fallbackUserId}`.trim()
+
+  return (
+    _.get(member, 'handle') ||
+    _.get(member, 'email') ||
+    (_.isNil(_.get(member, 'userId')) ? '' : `${member.userId}`.trim()) ||
+    fallbackValue
+  )
+}
 
 const FieldUserAutoComplete = ({
   value,
   onChangeValue,
   id,
-  projectMembers,
-  loggedInUser
+  projectMembers
 }) => {
   const selectedUsers = useMemo(() => {
     return value.map(item => {
-      const selectedUser = _.find(projectMembers, { userId: item }) || {}
+      const selectedUser = getProjectMemberByUserId(projectMembers, item) || {}
       return {
-        label: selectedUser.handle || selectedUser.userId || item,
+        label: getMemberOptionLabel(selectedUser, item),
         value: selectedUser.userId || item
       }
     })
   }, [value, projectMembers])
 
+  const memberOptions = useMemo(() => {
+    return _.uniqBy(
+      (projectMembers || [])
+        .map(member => {
+          if (_.isNil(member.userId) || `${member.userId}`.trim().length === 0) {
+            return null
+          }
+
+          return {
+            value: member.userId,
+            label: getMemberOptionLabel(member)
+          }
+        })
+        .filter(Boolean),
+      option => `${option.value}`.trim()
+    )
+  }, [projectMembers])
+
   return (
     <Select
       id={id}
@@ -46,9 +76,7 @@ const FieldUserAutoComplete = ({
       onChange={values => {
         onChangeValue((values || []).map(value => value.value))
       }}
-      options={(projectMembers || [])
-        .filter(member => member.userId !== loggedInUser.userId && member.handle)
-        .map(member => ({ value: member.userId, label: member.handle }))}
+      options={memberOptions}
     />
   )
 }
@@ -57,18 +85,16 @@ FieldUserAutoComplete.defaultProps = {
   onChangeValue: () => {},
   id: 'user-select',
   value: [],
-  projectMembers: [],
-  loggedInUser: {}
+  projectMembers: []
 }
 
 FieldUserAutoComplete.propTypes = {
   value: PropTypes.arrayOf(
-    PropTypes.oneOfType(PropTypes.string, PropTypes.number)
+    PropTypes.oneOfType([PropTypes.string, PropTypes.number])
   ),
   id: PropTypes.string,
   onChangeValue: PropTypes.func,
-  projectMembers: PropTypes.arrayOf(PropTypes.object),
-  loggedInUser: PropTypes.object
+  projectMembers: PropTypes.arrayOf(PropTypes.object)
 }
 
 export default FieldUserAutoComplete
diff --git a/src/components/FieldUserAutoComplete/index.test.js b/src/components/FieldUserAutoComplete/index.test.js
new file mode 100644
index 00000000..a1ddc85b
--- /dev/null
+++ b/src/components/FieldUserAutoComplete/index.test.js
@@ -0,0 +1,94 @@
+/* eslint-disable react/prop-types */
+/* global describe, it, expect, beforeEach, afterEach, jest */
+
+import React from 'react'
+import ReactDOM from 'react-dom'
+import { act } from 'react-dom/test-utils'
+import FieldUserAutoComplete from './index'
+
+jest.mock('../../util/tc', () => ({
+  getProjectMemberByUserId: (projectMembers, userId) => (
+    (projectMembers || []).find(member => `${member.userId}` === `${userId}`) || null
+  )
+}))
+
+jest.mock('../Select', () => {
+  const React = require('react')
+
+  return function MockSelect ({ options, value }) {
+    return React.createElement(
+      'div',
+      null,
+      React.createElement(
+        'div',
+        { className: 'selected-values' },
+        (value || []).map(item => `${item.value}:${item.label}`).join('|')
+      ),
+      React.createElement(
+        'div',
+        { className: 'option-values' },
+        (options || []).map(item => `${item.value}:${item.label}`).join('|')
+      )
+    )
+  }
+})
+
+describe('FieldUserAutoComplete', () => {
+  let container
+
+  const defaultProps = {
+    value: [],
+    onChangeValue: () => {},
+    id: 'user-select',
+    projectMembers: []
+  }
+
+  const renderComponent = (props = {}) => {
+    act(() => {
+      ReactDOM.render(
+        <FieldUserAutoComplete {...defaultProps} {...props} />,
+        container
+      )
+    })
+  }
+
+  beforeEach(() => {
+    container = document.createElement('div')
+    document.body.appendChild(container)
+  })
+
+  afterEach(() => {
+    ReactDOM.unmountComponentAtNode(container)
+    container.remove()
+    container = null
+  })
+
+  it('includes all project members using handle, email, or userId labels', () => {
+    renderComponent({
+      projectMembers: [
+        { userId: 305384, handle: 'bopowfamo' },
+        { userId: 101, email: 'tetal003@example.com' },
+        { userId: '202' }
+      ]
+    })
+
+    const optionValues = container.querySelector('.option-values').textContent
+
+    expect(optionValues).toContain('305384:bopowfamo')
+    expect(optionValues).toContain('101:tetal003@example.com')
+    expect(optionValues).toContain('202:202')
+  })
+
+  it('resolves selected member labels when selected ids and member ids use different types', () => {
+    renderComponent({
+      value: ['305384'],
+      projectMembers: [
+        { userId: 305384, handle: 'bopowfamo' }
+      ]
+    })
+
+    const selectedValues = container.querySelector('.selected-values').textContent
+
+    expect(selectedValues).toContain('305384:bopowfamo')
+  })
+})
diff --git a/src/containers/ProjectAssets/index.jsx b/src/containers/ProjectAssets/index.jsx
index 0060fbde..02c6fa11 100644
--- a/src/containers/ProjectAssets/index.jsx
+++ b/src/containers/ProjectAssets/index.jsx
@@ -249,7 +249,6 @@ const ProjectAssets = ({
           }
           members={projectDetail.members}
           projectId={projectId}
-          loggedInUser={loggedInUser}
           newAttachments={pendingUploadFiles}
         />
       )}
diff --git a/src/containers/Tab/index.js b/src/containers/Tab/index.js
index bd8072ec..ba3b7222 100644
--- a/src/containers/Tab/index.js
+++ b/src/containers/Tab/index.js
@@ -9,7 +9,7 @@ import {
   resetSidebarActiveParams,
   unloadProjects
 } from '../../actions/sidebar'
-import { checkAdmin, checkCopilot, checkAdminOrTalentManager, checkIsProjectMember } from '../../util/tc'
+import { checkAdmin, checkAdminOrTalentManager, checkCanViewProjectAssets } from '../../util/tc'
 
 class TabContainer extends Component {
   constructor (props) {
@@ -30,11 +30,7 @@ class TabContainer extends Component {
     const { token, projectDetail } = props
     const resolvedToken = token || currentToken
     const resolvedProjectDetail = projectDetail || this.props.projectDetail
-    return !!resolvedToken && (
-      checkAdmin(resolvedToken) ||
-      checkCopilot(resolvedToken) ||
-      checkIsProjectMember(resolvedToken, resolvedProjectDetail)
-    )
+    return checkCanViewProjectAssets(resolvedToken, resolvedProjectDetail)
   }
 
   getCanViewEngagements (props = this.props) {
diff --git a/src/util/tc.js b/src/util/tc.js
index d0b6ca03..60a814af 100644
--- a/src/util/tc.js
+++ b/src/util/tc.js
@@ -227,6 +227,39 @@ export const checkTaskManager = (token) => {
   return roles.some(val => TASK_MANAGER_ROLES.indexOf(val.toLowerCase()) > -1)
 }
 
+const normalizeUserId = (userId) => {
+  if (_.isNil(userId)) {
+    return null
+  }
+
+  const normalizedUserId = `${userId}`.trim()
+  return normalizedUserId.length ? normalizedUserId : null
+}
+
+/**
+ * Returns the matching project member for the provided user id, if present.
+ *
+ * @param {Object|Object[]} projectDetail Project detail payload with `members`,
+ *   or a raw members array.
+ * @param {String|Number} userId Authenticated user id to match.
+ * @returns {Object|null} Matching member record or `null`.
+ */
+export const getProjectMemberByUserId = (projectDetail, userId) => {
+  const normalizedUserId = normalizeUserId(userId)
+  const members = Array.isArray(projectDetail)
+    ? projectDetail
+    : _.get(projectDetail, 'members', [])
+
+  if (!normalizedUserId || !Array.isArray(members)) {
+    return null
+  }
+
+  return _.find(
+    members,
+    member => normalizeUserId(member.userId) === normalizedUserId
+  ) || null
+}
+
 export const checkAdminOrPmOrTaskManager = (token, project) => {
   const tokenData = decodeToken(token)
   const roles = _.get(tokenData, 'roles')
@@ -236,10 +269,8 @@ export const checkAdminOrPmOrTaskManager = (token, project) => {
   const isManager = roles.some(val => MANAGER_ROLES.indexOf(val.toLowerCase()) > -1)
   const isTaskManager = roles.some(val => TASK_MANAGER_ROLES.indexOf(val.toLowerCase()) > -1)
 
-  const isProjectManager = project && !_.isEmpty(project) &&
-    project.members && project.members.some(member =>
-    member.userId === userId && member.role === PROJECT_ROLES.MANAGER
-  )
+  const isProjectManager =
+    _.get(getProjectMemberByUserId(project, userId), 'role') === PROJECT_ROLES.MANAGER
 
   return isAdmin || isManager || isTaskManager || isProjectManager
 }
@@ -251,7 +282,10 @@ export const checkCopilot = (token, project) => {
   const tokenData = decodeToken(token)
   const roles = _.get(tokenData, 'roles')
   const isCopilot = roles.some(val => COPILOT_ROLES.indexOf(val.toLowerCase()) > -1)
-  const canManageProject = !project || _.isEmpty(project) || ALLOWED_EDIT_RESOURCE_ROLES.includes(_.get(_.find(project.members, { userId: tokenData.userId }), 'role'))
+  const canManageProject = !project || _.isEmpty(project) ||
+    ALLOWED_EDIT_RESOURCE_ROLES.includes(
+      _.get(getProjectMemberByUserId(project, tokenData.userId), 'role')
+    )
 
   return isCopilot && canManageProject
 }
@@ -265,7 +299,10 @@ export const checkAdminOrCopilot = (token, project) => {
   const roles = _.get(tokenData, 'roles')
   const isAdmin = roles.some(val => ADMIN_ROLES.indexOf(val.toLowerCase()) > -1)
   const isCopilot = roles.some(val => COPILOT_ROLES.indexOf(val.toLowerCase()) > -1)
-  const canManageProject = !project || _.isEmpty(project) || ALLOWED_EDIT_RESOURCE_ROLES.includes(_.get(_.find(project.members, { userId: tokenData.userId }), 'role'))
+  const canManageProject = !project || _.isEmpty(project) ||
+    ALLOWED_EDIT_RESOURCE_ROLES.includes(
+      _.get(getProjectMemberByUserId(project, tokenData.userId), 'role')
+    )
 
   return isAdmin || (isCopilot && canManageProject)
 }
@@ -280,9 +317,25 @@ export const checkAdminOrCopilot = (token, project) => {
  */
 export const checkIsProjectMember = (token, projectDetail) => {
   const tokenData = decodeToken(token)
-  const userId = _.get(tokenData, 'userId')
+  return !!getProjectMemberByUserId(projectDetail, _.get(tokenData, 'userId'))
+}
+
+/**
+ * Checks whether the authenticated user can view the project assets library.
+ *
+ * Asset Library access is granted to admins, global copilots, and any member
+ * of the project regardless of project role.
+ *
+ * @param {String} token JWT token for the authenticated user.
+ * @param {Object} projectDetail Project detail payload that includes `members`.
+ * @returns {Boolean} `true` when the user can view the project assets library.
+ */
+export const checkCanViewProjectAssets = (token, projectDetail) => {
+  if (!token) {
+    return false
+  }
 
-  return !!(projectDetail && projectDetail.members && projectDetail.members.some(member => member.userId === userId))
+  return checkAdmin(token) || checkCopilot(token) || checkIsProjectMember(token, projectDetail)
 }
 
 /**

From 62107fd8d86cb413d8c31c6e7bd59ef2bc690fff Mon Sep 17 00:00:00 2001
From: Justin Gasper <jmgasper@gmail.com>
Date: Tue, 10 Mar 2026 08:16:40 +1100
Subject: [PATCH 17/17] QA fixes for assets library

---
 .../AssetsLibrary/ModalAddLink/index.js       |   7 +-
 .../ModalAttachmentOptions/index.js           |  11 +-
 .../AssetsLibrary/TableAssets/index.js        |  24 +++-
 .../AssetsLibrary/TableAssets/index.test.js   | 129 ++++++++++++++++++
 src/containers/ProjectAssets/index.jsx        |   2 +
 src/services/projects.js                      |  56 ++++++--
 6 files changed, 210 insertions(+), 19 deletions(-)
 create mode 100644 src/components/AssetsLibrary/TableAssets/index.test.js

diff --git a/src/components/AssetsLibrary/ModalAddLink/index.js b/src/components/AssetsLibrary/ModalAddLink/index.js
index 420f287a..55906f28 100644
--- a/src/components/AssetsLibrary/ModalAddLink/index.js
+++ b/src/components/AssetsLibrary/ModalAddLink/index.js
@@ -26,6 +26,7 @@ const ModalAddLink = ({
   classsName,
   theme,
   onCancel,
+  onSaved,
   link,
   addAttachment,
   updateAttachment,
@@ -70,6 +71,7 @@ const ModalAddLink = ({
             toastr.success('Success', 'Added link to the project successfully.')
             setIsProcessing(false)
             addAttachment(result)
+            onSaved()
             onCancel()
           })
           .catch(e => {
@@ -88,6 +90,7 @@ const ModalAddLink = ({
             toastr.success('Success', 'Updated link successfully.')
             setIsProcessing(false)
             updateAttachment(result)
+            onSaved()
             onCancel()
           })
           .catch(e => {
@@ -153,13 +156,15 @@ const ModalAddLink = ({
 ModalAddLink.defaultProps = {
   isProcessing: false,
   projectId: '',
-  onCancel: () => {}
+  onCancel: () => {},
+  onSaved: () => {}
 }
 
 ModalAddLink.propTypes = {
   classsName: PropTypes.string,
   theme: PropTypes.shape(),
   onCancel: PropTypes.func,
+  onSaved: PropTypes.func,
   addAttachment: PropTypes.func.isRequired,
   updateAttachment: PropTypes.func.isRequired,
   link: PropTypes.shape(),
diff --git a/src/components/AssetsLibrary/ModalAttachmentOptions/index.js b/src/components/AssetsLibrary/ModalAttachmentOptions/index.js
index 153aa297..d2c326fd 100644
--- a/src/components/AssetsLibrary/ModalAttachmentOptions/index.js
+++ b/src/components/AssetsLibrary/ModalAttachmentOptions/index.js
@@ -26,6 +26,7 @@ const ModalAttachmentOptions = ({
   classsName,
   theme,
   onCancel,
+  onSaved,
   attachment,
   members,
   addAttachment,
@@ -70,6 +71,7 @@ const ModalAttachmentOptions = ({
           toastr.success('Success', 'Updated file successfully.')
           setIsProcessing(false)
           updateAttachment(result)
+          onSaved()
           onCancel()
         })
         .catch(e => {
@@ -89,10 +91,14 @@ const ModalAttachmentOptions = ({
     allowedUsers => {
       let count = newAttachments.length
       let errorMessage = ''
+      let hasSuccessfulUpload = false
       const checkToFinish = () => {
         count = count - 1
         if (count === 0) {
           setIsProcessing(false)
+          if (hasSuccessfulUpload) {
+            onSaved()
+          }
           if (errorMessage) {
             toastr.error('Error', errorMessage)
           } else {
@@ -108,6 +114,7 @@ const ModalAttachmentOptions = ({
           allowedUsers
         })
           .then(result => {
+            hasSuccessfulUpload = true
             addAttachment(result)
             checkToFinish()
           })
@@ -251,13 +258,15 @@ const ModalAttachmentOptions = ({
 ModalAttachmentOptions.defaultProps = {
   members: [],
   newAttachments: [],
-  projectId: ''
+  projectId: '',
+  onSaved: () => {}
 }
 
 ModalAttachmentOptions.propTypes = {
   classsName: PropTypes.string,
   theme: PropTypes.shape(),
   onCancel: PropTypes.func,
+  onSaved: PropTypes.func,
   attachment: PropTypes.shape(),
   newAttachments: PropTypes.arrayOf(PropTypes.shape()),
   members: PropTypes.arrayOf(PropTypes.shape()),
diff --git a/src/components/AssetsLibrary/TableAssets/index.js b/src/components/AssetsLibrary/TableAssets/index.js
index 6af8267d..6e9a5c77 100644
--- a/src/components/AssetsLibrary/TableAssets/index.js
+++ b/src/components/AssetsLibrary/TableAssets/index.js
@@ -34,13 +34,23 @@ const TableAssets = ({
     () =>
       datas.map(item => {
         const titles = item.title.split('.')
-        const owner = getProjectMemberByUserId(members, item.createdBy)
+        const owner =
+          getProjectMemberByUserId(members, item.createdBy) ||
+          item.createdByUser ||
+          (`${item.createdBy}` === `${loggedInUser.userId}` ? loggedInUser : null)
         const canEdit =
           `${item.createdBy}` === `${loggedInUser.userId}` || isAdmin
+        const isSharedWithAdmins =
+          item.allowedUsers === 0 || item.allowedUsers === '0'
+        const sharedWithUsers = Array.isArray(item.allowedUsers)
+          ? item.allowedUsers
+          : []
         return {
           ...item,
           fileType: titles[titles.length - 1],
           owner,
+          isSharedWithAdmins,
+          sharedWithUsers,
           updatedAtString: item.updatedAt
             ? moment(item.updatedAt).format('MM/DD/YYYY h:mm A')
             : '—',
@@ -89,14 +99,14 @@ const TableAssets = ({
               )}
             </Table.Col>
             <Table.Col className={styles.blockItem}>
-              {!item.allowedUsers && PROJECT_ASSETS_SHARED_WITH_ALL_MEMBERS}
-              {item.allowedUsers &&
-                item.allowedUsers === 0 &&
-                PROJECT_ASSETS_SHARED_WITH_ADMIN}
-              {item.allowedUsers && item.allowedUsers !== 0 && (
+              {!item.isSharedWithAdmins &&
+                item.sharedWithUsers.length === 0 &&
+                PROJECT_ASSETS_SHARED_WITH_ALL_MEMBERS}
+              {item.isSharedWithAdmins && PROJECT_ASSETS_SHARED_WITH_ADMIN}
+              {item.sharedWithUsers.length > 0 && (
                 <ProjectMembers
                   members={members}
-                  allowedUsers={item.allowedUsers}
+                  allowedUsers={item.sharedWithUsers}
                 />
               )}
             </Table.Col>
diff --git a/src/components/AssetsLibrary/TableAssets/index.test.js b/src/components/AssetsLibrary/TableAssets/index.test.js
new file mode 100644
index 00000000..63d175d5
--- /dev/null
+++ b/src/components/AssetsLibrary/TableAssets/index.test.js
@@ -0,0 +1,129 @@
+/* eslint-disable react/prop-types */
+/* global describe, it, expect, beforeEach, afterEach, jest */
+
+import React from 'react'
+import ReactDOM from 'react-dom'
+import { act } from 'react-dom/test-utils'
+import TableAssets from './index'
+
+jest.mock('../../Icons/IconThreeDot', () => {
+  const React = require('react')
+  return function MockIconThreeDot () {
+    return React.createElement('span', null, 'menu')
+  }
+})
+
+jest.mock('../../DropdownMenu', () => {
+  const React = require('react')
+  return function MockDropdownMenu ({ children }) {
+    return React.createElement('div', null, children)
+  }
+})
+
+jest.mock('../DownloadFile', () => {
+  const React = require('react')
+  return function MockDownloadFile ({ file }) {
+    return React.createElement('span', null, file.title)
+  }
+})
+
+jest.mock('../../Icons/IconFile', () => {
+  const React = require('react')
+  return function MockIconFile () {
+    return React.createElement('span', null, 'file')
+  }
+})
+
+jest.mock('../ProjectMembers', () => {
+  const React = require('react')
+  return function MockProjectMembers ({ allowedUsers }) {
+    return React.createElement('span', null, allowedUsers.join(','))
+  }
+})
+
+jest.mock('../ProjectMember', () => {
+  const React = require('react')
+  return function MockProjectMember ({ memberInfo }) {
+    return React.createElement('span', null, memberInfo.handle || memberInfo.userId)
+  }
+})
+
+jest.mock('../../../util/tc', () => ({
+  getProjectMemberByUserId: (projectMembers, userId) => (
+    (projectMembers || []).find(member => `${member.userId}` === `${userId}`) || null
+  )
+}))
+
+describe('TableAssets', () => {
+  let container
+
+  const renderComponent = (props = {}) => {
+    act(() => {
+      ReactDOM.render(
+        <TableAssets
+          datas={[]}
+          loggedInUser={{ userId: '0', handle: 'viewer' }}
+          members={[]}
+          projectId='1000'
+          {...props}
+        />,
+        container
+      )
+    })
+  }
+
+  beforeEach(() => {
+    container = document.createElement('div')
+    document.body.appendChild(container)
+  })
+
+  afterEach(() => {
+    ReactDOM.unmountComponentAtNode(container)
+    container.remove()
+    container = null
+  })
+
+  it('shows all project members when allowedUsers is an empty array', () => {
+    renderComponent({
+      datas: [
+        {
+          id: 1,
+          title: 'link',
+          path: 'https://example.com',
+          type: 'link',
+          allowedUsers: [],
+          createdBy: '123',
+          updatedAt: '2026-03-09T00:00:00.000Z'
+        }
+      ],
+      members: [
+        { userId: '123', handle: 'owner' }
+      ]
+    })
+
+    expect(container.textContent).toContain('All Project Members')
+  })
+
+  it('shows the logged-in user as creator when the creator is not in project members', () => {
+    renderComponent({
+      datas: [
+        {
+          id: 2,
+          title: 'link',
+          path: 'https://example.com',
+          type: 'link',
+          allowedUsers: [],
+          createdBy: '456',
+          updatedAt: '2026-03-09T00:00:00.000Z'
+        }
+      ],
+      loggedInUser: {
+        userId: '456',
+        handle: 'current-user'
+      }
+    })
+
+    expect(container.textContent).toContain('current-user')
+    expect(container.textContent).not.toContain('Unknown')
+  })
+})
diff --git a/src/containers/ProjectAssets/index.jsx b/src/containers/ProjectAssets/index.jsx
index 02c6fa11..c8f54898 100644
--- a/src/containers/ProjectAssets/index.jsx
+++ b/src/containers/ProjectAssets/index.jsx
@@ -244,6 +244,7 @@ const ProjectAssets = ({
         <ModalAttachmentOptions
           theme={theme}
           onCancel={() => setShowAttachmentOptions(false)}
+          onSaved={() => loadOnlyProjectInfo(projectId)}
           attachment={
             showAttachmentOptions === true ? null : showAttachmentOptions
           }
@@ -256,6 +257,7 @@ const ProjectAssets = ({
         <ModalAddLink
           theme={theme}
           onCancel={() => setShowAddLink(false)}
+          onSaved={() => loadOnlyProjectInfo(projectId)}
           projectId={projectId}
           link={showAddLink === true ? null : showAddLink}
         />
diff --git a/src/services/projects.js b/src/services/projects.js
index b5e3b9ae..4fe68fd4 100644
--- a/src/services/projects.js
+++ b/src/services/projects.js
@@ -60,35 +60,71 @@ export function fetchMemberProjects (filters) {
 }
 
 /**
- * Api request for fetching a project by id with best-effort member-handle enrichment.
+ * Api request for fetching a project by id with best-effort user enrichment.
  *
  * After loading the project, this resolves any members with missing `handle`
- * values through `MEMBERS_API_URL` and merges resolved handles back into
- * `project.members`.
+ * values through `MEMBERS_API_URL`, and also resolves non-member attachment
+ * creators so the assets library can render `Created By` consistently.
  *
  * @param {string|number} id Project id.
- * @returns {Promise<Object>} Project payload with `members` enriched when possible.
+ * @returns {Promise<Object>} Project payload with `members` and attachment
+ * creator details enriched when possible.
  */
 export async function fetchProjectById (id) {
   const response = await axiosInstance.get(`${PROJECTS_API_URL}/${id}`)
   const project = _.get(response, 'data')
   const members = _.get(project, 'members', [])
+  const attachments = _.get(project, 'attachments', [])
   const membersWithoutHandle = members.filter(member => !member.handle && member.userId)
+  const memberUserIds = members.reduce((acc, member) => {
+    if (member.userId) {
+      acc[`${member.userId}`] = true
+    }
+    return acc
+  }, {})
+  const attachmentCreatorIds = _.uniq(
+    attachments
+      .map(attachment => `${_.get(attachment, 'createdBy', '')}`.trim())
+      .filter(createdBy => createdBy && /^\d+$/.test(createdBy) && !memberUserIds[createdBy])
+  )
+  const missingUserIds = _.uniq([
+    ...membersWithoutHandle.map(member => member.userId),
+    ...attachmentCreatorIds
+  ])
 
-  if (!membersWithoutHandle.length) {
+  if (!missingUserIds.length) {
     return project
   }
 
   try {
-    const missingUserIds = _.uniq(membersWithoutHandle.map(member => member.userId))
     const membersByUserId = await fetchInviteMembers(missingUserIds)
+    const enrichedMembers = members.map(member => ({
+      ...member,
+      handle: member.handle || _.get(membersByUserId, [member.userId, 'handle'], null)
+    }))
+    const enrichedMembersByUserId = enrichedMembers.reduce((acc, member) => {
+      if (member.userId) {
+        acc[`${member.userId}`] = member
+      }
+      return acc
+    }, {})
 
     return {
       ...project,
-      members: members.map(member => ({
-        ...member,
-        handle: member.handle || _.get(membersByUserId, [member.userId, 'handle'], null)
-      }))
+      members: enrichedMembers,
+      attachments: attachments.map(attachment => {
+        const creatorUserId = `${_.get(attachment, 'createdBy', '')}`.trim()
+        const createdByUser =
+          enrichedMembersByUserId[creatorUserId] ||
+          _.get(membersByUserId, [creatorUserId], null)
+
+        return createdByUser
+          ? {
+            ...attachment,
+            createdByUser
+          }
+          : attachment
+      })
     }
   } catch (error) {
     return project