Manage Cockpit incident annotations

public/locales/de-DE/translation.json

@@ -324,7 +324,10 @@
       "cause-process-instance-id": "Verursachende Prozessinstanz-ID",
       "root-cause-process-instance-id": "Ursprüngliche Prozessinstanz-ID",
       "annotation": "Anmerkung",
-      "configuration": "Konfiguration"
+      "configuration": "Konfiguration",
+      "annotation-placeholder": "Anmerkung hinzufügen",
+      "save-annotation": "Speichern",
+      "clear-annotation": "Leeren"
     },
     "user-tasks": {
       "owner": "Besitzer",

public/locales/en-US/translation.json

@@ -324,7 +324,10 @@
       "cause-process-instance-id": "Cause Process Instance ID",
       "root-cause-process-instance-id": "Root Cause Process Instance ID",
       "annotation": "Annotation",
-      "configuration": "Configuration"
+      "configuration": "Configuration",
+      "annotation-placeholder": "Add annotation",
+      "save-annotation": "Save",
+      "clear-annotation": "Clear"
     },
     "user-tasks": {
       "owner": "Owner",

public/locales/es-ES/translation.json

@@ -291,7 +291,10 @@
       "cause-process-instance-id": "ID de instancia de proceso causa",
       "root-cause-process-instance-id": "ID de instancia de proceso causa raíz",
       "annotation": "Anotación",
-      "configuration": "Configuración"
+      "configuration": "Configuración",
+      "annotation-placeholder": "Añadir anotación",
+      "save-annotation": "Guardar",
+      "clear-annotation": "Borrar"
     },
     "user-tasks": {
       "owner": "Propietario",

public/locales/fr-FR/translation.json

@@ -291,7 +291,10 @@
       "cause-process-instance-id": "ID d'instance de processus cause",
       "root-cause-process-instance-id": "ID d'instance de processus cause racine",
       "annotation": "Annotation",
-      "configuration": "Configuration"
+      "configuration": "Configuration",
+      "annotation-placeholder": "Ajouter une annotation",
+      "save-annotation": "Enregistrer",
+      "clear-annotation": "Effacer"
     },
     "user-tasks": {
       "owner": "Propriétaire",

public/locales/nl-NL/translation.json

@@ -291,7 +291,10 @@
       "cause-process-instance-id": "Oorzaak procesinstantie-ID",
       "root-cause-process-instance-id": "Hoofdoorzaak procesinstantie-ID",
       "annotation": "Annotatie",
-      "configuration": "Configuratie"
+      "configuration": "Configuratie",
+      "annotation-placeholder": "Annotatie toevoegen",
+      "save-annotation": "Opslaan",
+      "clear-annotation": "Wissen"
     },
     "user-tasks": {
       "owner": "Eigenaar",

src/api/engine_rest.jsx

@@ -12,6 +12,7 @@ import process_definition from "./resources/process_definition.js";
 import process_instance from "./resources/process_instance.js";
 import deployment from "./resources/deployment.js";
 import history from "./resources/history.js";
+import incident from "./resources/incident.js";
 import job_definition from "./resources/job_definition.js";
 import migration from "./resources/migration.js";
 import task from "./resources/task.js";
@@ -29,6 +30,7 @@ const engine_rest = {
   filter,
   group,
   history,
+  incident,
   job_definition,
   migration,
   process_definition,

src/api/resources/incident.js

@@ -0,0 +1,40 @@
+import { DELETE, GET, PUT } from "../helper.jsx";
+
+const get_incidents_by_process_definition = (state, definition_id) =>
+  GET(
+    `/incident?processDefinitionId=${definition_id}`,
+    state,
+    state.api.incident.by_process_definition,
+  );
+
+const get_incidents_by_process_instance = (state, instance_id) =>
+  GET(
+    `/incident?processInstanceId=${instance_id}`,
+    state,
+    state.api.incident.by_process_instance,
+  );
+
+const set_annotation = (state, id, annotation) =>
+  PUT(
+    `/incident/${id}/annotation`,
+    { annotation },
+    state,
+    state.api.incident.annotation,
+  );
+
+const clear_annotation = (state, id) =>
+  DELETE(
+    `/incident/${id}/annotation`,
+    null,
+    state,
+    state.api.incident.annotation,
+  );
+
+const incident = {
+  by_process_definition: get_incidents_by_process_definition,
+  by_process_instance: get_incidents_by_process_instance,
+  set_annotation,
+  clear_annotation,
+};
+
+export default incident;

src/api/resources/incident.test.js

@@ -0,0 +1,56 @@
+import { describe, it, vi, beforeEach } from "vitest";
+
+vi.mock("../helper.jsx", () => ({
+  DELETE: vi.fn(),
+  GET: vi.fn(),
+  PUT: vi.fn(),
+}));
+
+import { DELETE, GET, PUT } from "../helper.jsx";
+import { create_mock_state, expect_api_call } from "../../test/helpers.js";
+import incident from "./incident.js";
+
+describe("api/resources/incident", () => {
+  let state;
+  beforeEach(() => {
+    state = create_mock_state();
+  });
+
+  it("by_process_definition() GETs runtime incidents filtered by definition", () => {
+    incident.by_process_definition(state, "def-1");
+    expect_api_call(GET, {
+      url: "/incident?processDefinitionId=def-1",
+      state,
+      signal: state.api.incident.by_process_definition,
+    });
+  });
+
+  it("by_process_instance() GETs runtime incidents filtered by instance", () => {
+    incident.by_process_instance(state, "inst-1");
+    expect_api_call(GET, {
+      url: "/incident?processInstanceId=inst-1",
+      state,
+      signal: state.api.incident.by_process_instance,
+    });
+  });
+
+  it("set_annotation() PUTs the annotation body", () => {
+    incident.set_annotation(state, "inc-1", "Checked by ops");
+    expect_api_call(PUT, {
+      url: "/incident/inc-1/annotation",
+      body: { annotation: "Checked by ops" },
+      state,
+      signal: state.api.incident.annotation,
+    });
+  });
+
+  it("clear_annotation() DELETEs the annotation", () => {
+    incident.clear_annotation(state, "inc-1");
+    expect_api_call(DELETE, {
+      url: "/incident/inc-1/annotation",
+      body: null,
+      state,
+      signal: state.api.incident.annotation,
+    });
+  });
+});

src/css/components.css

@@ -533,6 +533,23 @@ main#processes {
   max-width: 40%;
 }
 
+#processes form.incident-annotation {
+  display: flex;
+  align-items: center;
+  gap: var(--spacing-1);
+  margin: 0;
+}
+
+#processes form.incident-annotation input {
+  min-width: 14rem;
+}
+
+#processes form.incident-annotation .button-group {
+  grid-column: auto;
+  justify-content: flex-start;
+  flex-wrap: nowrap;
+}
+
 /* Definition / instance metadata renders as a <dl> grid. */
 #processes dl {
   display: grid;