feat: add notification rule name to the ui

Fixes #2349
flanksource · Oct 21, 2024 · 4f3e474 · 4f3e474
1 parent 263cc09
commit 4f3e474
Show file tree

Hide file tree

Showing 4 changed files with 9 additions and 7 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/src/api/types/notifications.ts b/src/api/types/notifications.ts
@@ -6,7 +6,8 @@ import { Team, User } from "./users";
 
 export type NotificationRules = {
   id: string;
-  title: string;
+  name: string;
+  title?: string;
   events: string[];
   source?: "KubernetesCRD" | "ConfigFile" | "UI" | "Topology";
   template: string;

diff --git a/src/components/Notifications/Rules/NotificationsRulesForm.tsx b/src/components/Notifications/Rules/NotificationsRulesForm.tsx
@@ -44,6 +44,7 @@ export default function NotificationsRulesForm({
             className="flex flex-1 flex-col gap-4 overflow-y-auto"
           >
             <div className="flex flex-col gap-4 overflow-y-auto p-4">
+              <FormikTextInput name="name" label="Name" />
               <FormikTextInput name="title" label="Title" />
               <FormikNotificationEventsDropdown
                 name="events"

diff --git a/src/components/Notifications/Rules/notificationsRulesTableColumns.tsx b/src/components/Notifications/Rules/notificationsRulesTableColumns.tsx
@@ -97,7 +97,7 @@ export function StatusColumn({ cell }: MRTCellProps<NotificationRules>) {
         setIsModalOpen={setIsModalOpen}
         job={{
           details: cell.row.original.job_details,
-          name: cell.row.original.job_name ?? cell.row.original.title
+          name: cell.row.original.job_name ?? cell.row.original.name
         }}
       />
     </>
@@ -136,12 +136,12 @@ export const notificationsRulesTableColumns: MRT_ColumnDef<NotificationRules>[]
       }
     },
     {
-      header: "Title",
-      id: "title",
+      header: "Name",
+      id: "name",
       size: 150,
-      accessorKey: "title",
+      accessorKey: "name",
       Cell: ({ row, column }) => {
-        const value = row.getValue<string>(column.id);
+        const value = row.original.name;
         const error = row.original.error;
 
         const [showError, setShowError] = useState(false);