Merge pull request #336 from STAPLE-verse/fix-0710

Fix 0710

Author: doomlab

src/core/components/Modal.tsx

@@ -15,10 +15,13 @@ const Modal = ({ children, open, size = "max-w-lg" }: Props) => {
       renderBackdrop={(props) => (
         <div {...props} className="fixed inset-0 bg-black opacity-50 z-[1040]" />
       )}
-      className="fixed inset-0 flex items-center justify-center z-[1050]"
+      className="fixed inset-0 flex items-center justify-center z-[1050] overflow-y-auto"
     >
       <div
-        className={cn("flex justify-center bg-base-100 p-6 rounded-lg shadow-lg relative", size)}
+        className={cn(
+          "flex justify-center bg-base-100 p-6 rounded-lg shadow-lg relative max-w-lg w-full md:max-w-2xl max-h-[90vh] overflow-y-auto",
+          size
+        )}
       >
         <div className="w-full">{children}</div>
       </div>

src/pages/projects/[projectId]/tasks/[taskId]/tasklog.tsx

@@ -25,6 +25,8 @@ const AssignmentsContent = () => {
   const processedIndividualAssignments = processIndividualTaskLogs(individualProjectMembers)
   const processedTeamAssignments = processTeamTaskLogs(teamProjectMembers)
 
+  console.log(processedTeamAssignments)
+
   // Get columns definitions for tables
   const individualColumns = task.formVersionId ? taskLogTableColumnsSchema : taskLogTableColumns
   const teamColumns = task.formVersionId ? teamTaskLogTableColumnsSchema : teamTaskLogTableColumns

src/tasklogs/components/ShowTeamModal.tsx

@@ -27,7 +27,7 @@ export const ShowTeamModal = ({ projectMember }) => {
         data-testid="open-modal"
         onClick={() => handleToggle()}
       >
-        <span>{`${projectMember.name}`}</span>
+        <span>{`${projectMember.projectMember.name}`}</span>
       </button>
       <Tooltip
         id="showTeamModalTooltip"

src/tasklogs/components/TeamTaskLogTable.tsx

@@ -11,7 +11,14 @@ const columnHelper = createColumnHelper<ProcessedTeamTaskLog>()
 // ColumnDefs
 export const teamTaskLogTableColumns: ColumnDef<ProcessedTeamTaskLog>[] = [
   columnHelper.accessor("projectMember", {
-    cell: (info) => <div>{<ShowTeamModal projectMember={info.getValue()}></ShowTeamModal>}</div>,
+    cell: (info) => {
+      const rowData = info.row.original // Access the entire row data
+      return (
+        <div>
+          <ShowTeamModal projectMember={rowData}></ShowTeamModal>
+        </div>
+      )
+    },
     header: "Team Name",
   }),
   columnHelper.accessor("lastUpdate", {

src/tasklogs/utils/processTaskLogs.ts

@@ -57,7 +57,7 @@ export function processTeamTaskLogs(
 
     const latestLog = filterLatestTaskLog(projectMember.taskLogAssignedTo)
     return {
-      projectMember: getProjectMemberName(projectMember),
+      projectMember: projectMember,
       lastUpdate: latestLog
         ? latestLog.createdAt.toLocaleDateString(undefined, {
             year: "numeric",
@@ -75,6 +75,7 @@ export function processTeamTaskLogs(
           : "Not Completed"
         : "Unknown",
       taskLog: latestLog,
+      users: projectMember.users,
     }
   })
 }

test/ShowTeamModal.test.tsx

@@ -4,7 +4,7 @@
 
 import { expect, vi, test } from "vitest"
 import { render, screen, fireEvent } from "test/utils"
-import { ShowTeamModal } from "src/assignments/components/ShowTeamModal"
+import { ShowTeamModal } from "src/tasklogs/components/ShowTeamModal"
 
 test("renders show team modal", async () => {
   const curentTeam = {