From 3ab0c3398f50ce4aa147b3ff8a0faebd243a94b9 Mon Sep 17 00:00:00 2001
From: Thomas Cottee Meldrum <thomas.cottee-meldrum@stfc.ac.uk>
Date: Tue, 18 Nov 2025 13:42:26 +0000
Subject: [PATCH] fix: use prefered name in FAP panels

---
 .../frontend/src/components/fap/Members/FapMembers.tsx | 10 ++++++++--
 .../fap/Proposals/AssignFapMemberToProposalModal.tsx   |  6 +++++-
 .../fap/Proposals/FapAssignedReviewersTable.tsx        |  7 ++++++-
 .../fap/Proposals/MultiRankAssignmentDialog.tsx        |  2 +-
 apps/frontend/src/components/user/PeopleTable.tsx      |  2 ++
 5 files changed, 22 insertions(+), 5 deletions(-)

diff --git a/apps/frontend/src/components/fap/Members/FapMembers.tsx b/apps/frontend/src/components/fap/Members/FapMembers.tsx
index a71b65ad93..2c56bea6aa 100644
--- a/apps/frontend/src/components/fap/Members/FapMembers.tsx
+++ b/apps/frontend/src/components/fap/Members/FapMembers.tsx
@@ -28,7 +28,7 @@ import { UserContext } from 'context/UserContextProvider';
 import { BasicUserDetails, UserRole, Fap } from 'generated/sdk';
 import { useCheckAccess } from 'hooks/common/useCheckAccess';
 import { useRenewToken } from 'hooks/common/useRenewToken';
-import { useFapReviewersData } from 'hooks/fap/useFapReviewersData';
+import { FapMember, useFapReviewersData } from 'hooks/fap/useFapReviewersData';
 import { tableIcons } from 'utils/materialIcons';
 import useDataApiWithFeedback from 'utils/useDataApiWithFeedback';
 import { getFullUserName } from 'utils/user';
@@ -43,7 +43,13 @@ type FapMembersProps = {
 };
 
 const columns = [
-  { title: 'Name', field: 'user.firstname' },
+  {
+    title: 'Name',
+    render: (rowData: FapMember) =>
+      rowData.user.preferredname
+        ? rowData.user.preferredname
+        : rowData.user.firstname,
+  },
   {
     title: 'Surname',
     field: 'user.lastname',
diff --git a/apps/frontend/src/components/fap/Proposals/AssignFapMemberToProposalModal.tsx b/apps/frontend/src/components/fap/Proposals/AssignFapMemberToProposalModal.tsx
index 7a79bb200e..cd0e0f743a 100644
--- a/apps/frontend/src/components/fap/Proposals/AssignFapMemberToProposalModal.tsx
+++ b/apps/frontend/src/components/fap/Proposals/AssignFapMemberToProposalModal.tsx
@@ -27,7 +27,11 @@ type AssignFapMemberToProposalModalProps = {
 const memberRole = (member: FapAssignedMember) => `${member.role?.title}`;
 
 const columns = [
-  { title: 'Name', field: 'firstname' },
+  {
+    title: 'Name',
+    render: (rowData: FapAssignedMember) =>
+      rowData.preferredname ? rowData.preferredname : rowData.firstname,
+  },
   { title: 'Surname', field: 'lastname' },
   { title: 'Proposal Count', field: 'proposalsCountByCall' },
   {
diff --git a/apps/frontend/src/components/fap/Proposals/FapAssignedReviewersTable.tsx b/apps/frontend/src/components/fap/Proposals/FapAssignedReviewersTable.tsx
index ac463898c0..bead63fbb6 100644
--- a/apps/frontend/src/components/fap/Proposals/FapAssignedReviewersTable.tsx
+++ b/apps/frontend/src/components/fap/Proposals/FapAssignedReviewersTable.tsx
@@ -106,7 +106,12 @@ const FapAssignedReviewersTable = ({
   const assignmentColumns = [
     {
       title: 'First name',
-      field: 'user.firstname',
+      render: (rowData: FapProposalAssignmentType) =>
+        rowData.user
+          ? rowData.user.preferredname
+            ? rowData.user.preferredname
+            : rowData.user.firstname
+          : '-',
     },
     {
       title: 'Last name',
diff --git a/apps/frontend/src/components/fap/Proposals/MultiRankAssignmentDialog.tsx b/apps/frontend/src/components/fap/Proposals/MultiRankAssignmentDialog.tsx
index 2ea628b1b8..98fc679f02 100644
--- a/apps/frontend/src/components/fap/Proposals/MultiRankAssignmentDialog.tsx
+++ b/apps/frontend/src/components/fap/Proposals/MultiRankAssignmentDialog.tsx
@@ -94,7 +94,7 @@ export const MultiRankAssignmentDialog = ({
                   }}
                 >
                   <TableCell component="th" scope="row">
-                    {row.firstname}
+                    {row.preferredname ? row.preferredname : row.firstname}
                   </TableCell>
                   <TableCell align="left">{row.lastname}</TableCell>
                   <TableCell align="right">
diff --git a/apps/frontend/src/components/user/PeopleTable.tsx b/apps/frontend/src/components/user/PeopleTable.tsx
index 2e5379fc46..3f4c316038 100644
--- a/apps/frontend/src/components/user/PeopleTable.tsx
+++ b/apps/frontend/src/components/user/PeopleTable.tsx
@@ -325,6 +325,7 @@ const PeopleTable = ({
           ...(selectedItems.map((selectedItem) => ({
             id: selectedItem.id,
             firstname: selectedItem.firstname,
+            preferredname: selectedItem.preferredname,
             lastname: selectedItem.lastname,
             institution: selectedItem.institution,
             institutionId: selectedItem.institutionId,
@@ -346,6 +347,7 @@ const PeopleTable = ({
             {
               id: selectedItem.id,
               firstname: selectedItem.firstname,
+              preferredname: selectedItem.preferredname,
               lastname: selectedItem.lastname,
               institution: selectedItem.institution,
               institutionId: selectedItem.institutionId,