Merge pull request #1513 from cityofaustin/20325-status-badge-dictionary

Add project phase status badges to the Data dictionary
cityofaustin · Dec 19, 2024 · 80a9ab8 · 80a9ab8
2 parents d163e1e + 41dc473
commit 80a9ab8
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 1 deletion.
diff --git a/moped-editor/src/queries/tableLookups.js b/moped-editor/src/queries/tableLookups.js
@@ -4,6 +4,7 @@ export const TABLE_LOOKUPS_QUERY = gql`
   query TableLookupQuery {
     moped_phases(order_by: { phase_order: asc }) {
       phase_id
+      phase_key
       phase_name
       phase_name_simple
       phase_description

diff --git a/moped-editor/src/views/dev/LookupsView/RecordTable.js b/moped-editor/src/views/dev/LookupsView/RecordTable.js
@@ -14,7 +14,7 @@ import CircularProgress from "@mui/material/CircularProgress";
  * @returns { JSX } an MUI TableCell component with the row/column value
  */
 const WrappedTableCell = ({ row, column: { key, handler } }) => {
-  return <TableCell>{handler ? handler(row[key]) : row[key]}</TableCell>;
+  return <TableCell>{handler ? handler(row[key], row) : row[key]}</TableCell>;
 };
 
 /**

diff --git a/moped-editor/src/views/dev/LookupsView/settings.js b/moped-editor/src/views/dev/LookupsView/settings.js
@@ -1,3 +1,5 @@
+import ProjectStatusBadge from "src/views/projects/projectView/ProjectStatusBadge";
+
 /**
  * Parses an array of phase-subphases into an array of subphase names
  * @param {Object[]} subphases - array of moped_subphases objects
@@ -40,6 +42,20 @@ const workTypeHandler = (workTypes) =>
     <div key={workType.moped_work_type.id}>{workType.moped_work_type.name}</div>
   ));
 
+/**
+ * Uses phase name and phase key from row object to render status badge
+ * @param {string} phaseName - phase name
+ * @param {Object} row a single Moped record object as returned from Hasura
+ * @returns ProjectStatusBadge component
+ */
+const statusBadgeHandler = (phaseName, row) => (
+  <ProjectStatusBadge
+    phaseKey={row.phase_key}
+    phaseName={phaseName}
+    condensed
+  />
+);
+
 /**
  * Definitions for data tables.
  * @type { Object[]}  - An array of settings for data tables. Each object references a typename
@@ -167,6 +183,7 @@ export const SETTINGS = [
       {
         key: "phase_name",
         label: "Phase name",
+        handler: statusBadgeHandler,
       },
       {
         key: "phase_name_simple",