Create add proponent field

epictrack-web/src/components/project/ProjectList.tsx

@@ -19,10 +19,10 @@ import { useAppSelector } from "../../hooks";
 const ProjectList = () => {
   const [envRegions, setEnvRegions] = React.useState<string[]>([]);
   const [subTypes, setSubTypes] = React.useState<string[]>([]);
+  const [proponents, setProponents] = React.useState<string[]>([]);
   const [types, setTypes] = React.useState<string[]>([]);
   const [projectId, setProjectId] = React.useState<number>();
   const ctx = React.useContext(MasterContext);
-
   const { roles } = useAppSelector((state) => state.user.userDetail);
   const canEdit = hasPermission({ roles, allowed: [ROLES.EDIT] });
 
@@ -60,6 +60,10 @@ const ProjectList = () => {
     const envRegions = projects
       .map((p) => p.region_env?.name)
       .filter((ele, index, arr) => arr.findIndex((t) => t === ele) === index);
+    const projectProponents = projects
+      .map((p) => p.proponent.name)
+      .filter((ele, index, arr) => arr.findIndex((t) => t === ele) === index);
+    setProponents(projectProponents);
     setTypes(types);
     setSubTypes(subTypes);
     setEnvRegions(envRegions);
@@ -159,6 +163,35 @@ const ProjectList = () => {
           return filterValue.includes(value);
         },
       },
+      {
+        accessorKey: "proponent.name",
+        header: "Proponents",
+        filterSelectOptions: proponents,
+        filterVariant: "multi-select",
+        Filter: ({ header, column }) => {
+          return (
+            <TableFilter
+              isMulti
+              header={header}
+              column={column}
+              variant="inline"
+              name="rolesFilter"
+            />
+          );
+        },
+        filterFn: (row, id, filterValue) => {
+          if (
+            !filterValue.length ||
+            filterValue.length > proponents.length // select all is selected
+          ) {
+            return true;
+          }
+
+          const value: string = row.getValue(id) || "";
+
+          return filterValue.includes(value);
+        },
+      },
       {
         accessorKey: "region_env.name",
         header: "ENV Region",
@@ -231,7 +264,7 @@ const ProjectList = () => {
         ),
       },
     ],
-    [types, subTypes, envRegions]
+    [types, subTypes, envRegions, proponents]
   );
   return (
     <>

epictrack-web/src/models/project.ts

@@ -1,6 +1,7 @@
 import { Type } from "./type";
 import { SubType } from "./subtype";
 import { Region } from "./region";
+import { Proponent } from "./proponent";
 
 export interface Project {
   id: number;
@@ -14,6 +15,7 @@ export interface Project {
   region_id_env: number;
   region_id_flnro: number;
   proponent_id: number;
+  proponent: Proponent;
   ea_certificate: string;
   abbreviation: string;
   epic_guid: string;