From 8ce7886326f62f950c3633bab1d60013aeb18934 Mon Sep 17 00:00:00 2001
From: jasquat <jasquat@users.noreply.github.com>
Date: Fri, 4 Nov 2022 11:03:40 -0400
Subject: [PATCH] pyl is passing w/ burnettk

---
 src/routes/ProcessGroupList.tsx | 27 +++++++++++++++++++++++----
 1 file changed, 23 insertions(+), 4 deletions(-)

diff --git a/src/routes/ProcessGroupList.tsx b/src/routes/ProcessGroupList.tsx
index bb19e93..3e39644 100644
--- a/src/routes/ProcessGroupList.tsx
+++ b/src/routes/ProcessGroupList.tsx
@@ -1,12 +1,20 @@
 import { useEffect, useState } from 'react';
 import { Link, useNavigate, useSearchParams } from 'react-router-dom';
-// @ts-ignore
-import { Button, Table } from '@carbon/react';
+import {
+  Button,
+  Table,
+  ExpandableTile,
+  TileAboveTheFoldContent,
+  TileBelowTheFoldContent,
+  TextInput,
+  ClickableTile,
+  // @ts-ignore
+} from '@carbon/react';
 import ProcessBreadcrumb from '../components/ProcessBreadcrumb';
 import PaginationForTable from '../components/PaginationForTable';
 import HttpService from '../services/HttpService';
 import { getPageInfoFromSearchParams } from '../helpers';
-import { CarbonComboBoxSelection } from '../interfaces';
+import { CarbonComboBoxSelection, ProcessGroup } from '../interfaces';
 import ProcessModelSearch from '../components/ProcessModelSearch';
 
 // Example process group json
@@ -49,7 +57,7 @@ export default function ProcessGroupList() {
   }, [searchParams]);
 
   const buildTable = () => {
-    const rows = processGroups.map((row) => {
+    const rows = processGroups.map((row: ProcessGroup) => {
       return (
         <tr key={(row as any).id}>
           <td>
@@ -73,6 +81,17 @@ export default function ProcessGroupList() {
         <tbody>{rows}</tbody>
       </Table>
     );
+    // const rows = processGroups.map((row: ProcessGroup) => {
+    //   return (
+    //     <span>
+    //       <ClickableTile href={`/admin/process-groups/${row.id}`}>
+    //         {row.display_name}
+    //       </ClickableTile>
+    //     </span>
+    //   );
+    // });
+    //
+    // return <div style={{ width: '400px' }}>{rows}</div>;
   };
 
   const processGroupsDisplayArea = () => {