@orchestrator-ui/orchestrator-ui-components 1.6.1 → 1.7.0

package/dist/index.js

@@ -23127,10 +23127,10 @@ var require_jsstacktrace = __commonJS({
 var require_jsx = __commonJS({
   "../../node_modules/refractor/lang/jsx.js"(exports, module) {
     "use strict";
-    module.exports = jsx183;
-    jsx183.displayName = "jsx";
-    jsx183.aliases = [];
-    function jsx183(Prism) {
+    module.exports = jsx184;
+    jsx184.displayName = "jsx";
+    jsx184.aliases = [];
+    function jsx184(Prism) {
       ;
       (function(Prism2) {
         var javascript = Prism2.util.clone(Prism2.languages.javascript);
@@ -40738,6 +40738,62 @@ var workflowsApi = orchestratorApi.injectEndpoints({
 });
 var { useGetWorkflowsQuery, useLazyGetWorkflowsQuery } = workflowsApi;
 
+// src/rtk/endpoints/metadata/tasks.ts
+var tasksQuery = `
+query MetadataWorkflows(
+    $first: Int!
+    $after: Int!
+    $sortBy: [GraphqlSort!]
+    $query: String
+) {
+    workflows(
+        first: $first
+        after: $after
+        sortBy: $sortBy
+        query: $query
+        filterBy: { field: "target", value: "SYSTEM" }
+    ) {
+        page {
+            name
+            description
+            target
+            products {
+                tag
+            }
+            createdAt
+        }
+        pageInfo {
+            endCursor
+            hasNextPage
+            hasPreviousPage
+            startCursor
+            totalItems
+            sortFields
+            filterFields
+        }
+    }
+}
+`;
+var tasksApi = orchestratorApi.injectEndpoints({
+  endpoints: (builder) => ({
+    getTasks: builder.query({
+      query: (variables) => ({
+        document: tasksQuery,
+        variables
+      }),
+      transformResponse: (response) => {
+        const tasks = response.workflows.page || [];
+        const pageInfo = response.workflows.pageInfo || {};
+        return {
+          tasks,
+          pageInfo
+        };
+      }
+    })
+  })
+});
+var { useGetTasksQuery, useLazyGetTasksQuery } = tasksApi;
+
 // src/rtk/endpoints/processList.ts
 var processListQuery = `
     query ProcessList(
@@ -40882,6 +40938,7 @@ var BadgeType = /* @__PURE__ */ ((BadgeType2) => {
   BadgeType2["PRODUCT_BLOCK_TAG"] = "product_block_tag";
   BadgeType2["PRODUCT_TAG"] = "product_tag";
   BadgeType2["PRODUCT"] = "product";
+  BadgeType2["TASK"] = "task";
   return BadgeType2;
 })(BadgeType || {});
 var WorkflowTarget = /* @__PURE__ */ ((WorkflowTarget2) => {
@@ -42215,6 +42272,7 @@ var getDefaultTableConfig = (storageKey) => {
       ];
       return getTableConfig(productColumns);
     case METADATA_WORKFLOWS_TABLE_LOCAL_STORAGE_KEY:
+    case METADATA_TASKS_TABLE_LOCAL_STORAGE_KEY:
       const workflowColumns = ["createdAt"];
       return getTableConfig(workflowColumns);
     case ACTIVE_PROCESSES_LIST_TABLE_LOCAL_STORAGE_KEY:
@@ -42367,6 +42425,7 @@ function WfoProductBlockBadge({
           textColor: primaryText
         };
       case "workflow" /* WORKFLOW */:
+      case "task" /* TASK */:
       case "product" /* PRODUCT */:
         return {
           badgeColor: toSecondaryColor(danger),
@@ -44660,6 +44719,7 @@ var PATH_METADATA_PRODUCTS = "/metadata/products";
 var PATH_METADATA_PRODUCT_BLOCKS = "/metadata/productblocks";
 var PATH_METADATA_RESOURCE_TYPES = "/metadata/resource-types";
 var PATH_METADATA_WORKFLOWS = "/metadata/workflows";
+var PATH_METADATA_TASKS = "/metadata/tasks";
 var PATH_TASKS = "/tasks";
 var PATH_SETTINGS = "/settings";
 
@@ -44782,6 +44842,15 @@ var WfoSidebar = ({ overrideMenuItems }) => {
             e.preventDefault();
             router.push(PATH_METADATA_WORKFLOWS);
           }
+        },
+        {
+          name: t("metadataTasks"),
+          id: "5.5",
+          isSelected: router.pathname === PATH_METADATA_TASKS,
+          onClick: (e) => {
+            e.preventDefault();
+            router.push(PATH_METADATA_TASKS);
+          }
         }
       ]
     },
@@ -46551,6 +46620,7 @@ var METADATA_RESOURCE_TYPES_TABLE_LOCAL_STORAGE_KEY = "metadataResourceTypesTabl
 var METADATA_PRODUCT_BLOCKS_TABLE_LOCAL_STORAGE_KEY = "metadataProductBlocksTable";
 var METADATA_PRODUCT_TABLE_LOCAL_STORAGE_KEY = "metadataProductTable";
 var METADATA_WORKFLOWS_TABLE_LOCAL_STORAGE_KEY = "metadataWorkflowsTable";
+var METADATA_TASKS_TABLE_LOCAL_STORAGE_KEY = "metadataTasksTable";
 var SUBSCRIPTIONS_TABLE_LOCAL_STORAGE_KEY = "subscriptionsTable";
 
 // src/components/WfoTable/WfoDataGridTable/WfodataGridColumns.ts
@@ -52178,7 +52248,7 @@ var WfoDropdownButton = ({
 };
 
 // src/components/WfoProcessList/WfoProcessesList.tsx
-import { useTranslations as useTranslations56 } from "next-intl";
+import { useTranslations as useTranslations57 } from "next-intl";
 import Link8 from "next/link";
 
 // src/pages/metadata/WfoProductBlocksPage.tsx
@@ -52208,9 +52278,14 @@ var metaDataTabs = [
     path: "/metadata/resource-types"
   },
   {
-    id: 5,
+    id: 4,
     translationKey: "workflows",
     path: "/metadata/workflows"
+  },
+  {
+    id: 5,
+    translationKey: "tasks",
+    path: "/metadata/tasks"
   }
 ];
 var WfoMetadataPageLayout = ({
@@ -52820,23 +52895,24 @@ var WfoWorkflowsPage = () => {
     name: {
       field: "name",
       name: t("name"),
-      width: "200",
+      width: "20%",
       render: (name) => /* @__PURE__ */ jsx150(WfoProductBlockBadge, { badgeType: "workflow" /* WORKFLOW */, children: name })
     },
     description: {
       field: "description",
       name: t("description"),
-      width: "300"
+      width: "40%"
     },
     target: {
       field: "target",
       name: t("target"),
-      width: "90",
+      width: "15%",
       render: (target) => /* @__PURE__ */ jsx150(WfoWorkflowTargetBadge, { target })
     },
     productTags: {
       field: "productTags",
       name: t("productTags"),
+      width: "20%",
       render: (productTags) => /* @__PURE__ */ jsx150(Fragment33, { children: productTags == null ? void 0 : productTags.filter(onlyUnique).map((productTag, index) => /* @__PURE__ */ jsx150(
         WfoProductBlockBadge,
         {
@@ -52857,7 +52933,7 @@ var WfoWorkflowsPage = () => {
     createdAt: {
       field: "createdAt",
       name: t("createdAt"),
-      width: "110",
+      width: "15%",
       render: (date) => /* @__PURE__ */ jsx150(WfoDateTime, { dateOrIsoString: date }),
       renderDetails: parseIsoString(parseDateToLocaleDateTimeString),
       clipboardText: parseIsoString(parseDateToLocaleDateTimeString)
@@ -52938,10 +53014,183 @@ var WfoWorkflowsPage = () => {
   ) });
 };
 
+// src/pages/metadata/WfoTasksPage.tsx
+import { useEffect as useEffect20, useState as useState32 } from "react";
+import { useTranslations as useTranslations45 } from "next-intl";
+import { EuiBadgeGroup as EuiBadgeGroup6 } from "@elastic/eui";
+
+// src/pages/metadata/taskListObjectMapper.ts
+var mapTaskDefinitionToTaskListItem = (tasks) => tasks.map((taskDefinition) => {
+  const { name, target, description, createdAt, products: products2 } = taskDefinition;
+  const productTags = products2.map((product) => product.tag);
+  return {
+    name,
+    description,
+    target,
+    createdAt,
+    productTags
+  };
+});
+var taskFieldMapper = (field) => {
+  switch (field) {
+    case "productTags":
+      return "productTag";
+    default:
+      return field;
+  }
+};
+var graphQlTaskListMapper = ({
+  field,
+  order
+}) => ({
+  field: taskFieldMapper(field),
+  order
+});
+
+// src/pages/metadata/WfoTasksPage.tsx
+import { Fragment as Fragment34, jsx as jsx151 } from "@emotion/react/jsx-runtime";
+var WfoTasksPage = () => {
+  var _a, _b;
+  const t = useTranslations45("metadata.tasks");
+  const tError = useTranslations45("errors");
+  const { showToastMessage } = useShowToastMessage();
+  const [tableDefaults, setTableDefaults] = useState32();
+  const getStoredTableConfig = useStoredTableConfig(
+    METADATA_TASKS_TABLE_LOCAL_STORAGE_KEY
+  );
+  useEffect20(() => {
+    const storedConfig = getStoredTableConfig();
+    if (storedConfig) {
+      setTableDefaults(storedConfig);
+    }
+  }, [getStoredTableConfig]);
+  const { dataDisplayParams, setDataDisplayParam } = useDataDisplayParams({
+    // TODO: Improvement: A default pageSize value is set to avoid a graphql error when the query is executed
+    // the fist time before the useEffect has populated the tableDefaults. Better is to create a way for
+    // the query to wait for the values to be available
+    // https://github.com/workfloworchestrator/orchestrator-ui/issues/261
+    pageSize: (tableDefaults == null ? void 0 : tableDefaults.selectedPageSize) || DEFAULT_PAGE_SIZE,
+    sortBy: {
+      field: "name",
+      order: "ASC" /* ASC */
+    }
+  });
+  const tableColumns = {
+    name: {
+      field: "name",
+      name: t("name"),
+      width: "20%",
+      render: (name) => /* @__PURE__ */ jsx151(WfoProductBlockBadge, { badgeType: "task" /* TASK */, children: name })
+    },
+    description: {
+      field: "description",
+      name: t("description"),
+      width: "40%"
+    },
+    target: {
+      field: "target",
+      name: t("target"),
+      width: "15%",
+      render: (target) => /* @__PURE__ */ jsx151(WfoWorkflowTargetBadge, { target })
+    },
+    productTags: {
+      field: "productTags",
+      name: t("productTags"),
+      width: "20%",
+      render: (productTags) => /* @__PURE__ */ jsx151(Fragment34, { children: productTags == null ? void 0 : productTags.filter(onlyUnique).map((productTag, index) => /* @__PURE__ */ jsx151(
+        WfoProductBlockBadge,
+        {
+          badgeType: "product_tag" /* PRODUCT_TAG */,
+          children: productTag
+        },
+        index
+      )) }),
+      renderDetails: (productTags) => /* @__PURE__ */ jsx151(EuiBadgeGroup6, { gutterSize: "s", children: productTags == null ? void 0 : productTags.filter(onlyUnique).map((productTag, index) => /* @__PURE__ */ jsx151(
+        WfoProductBlockBadge,
+        {
+          badgeType: "product_tag" /* PRODUCT_TAG */,
+          children: productTag
+        },
+        index
+      )) })
+    },
+    createdAt: {
+      field: "createdAt",
+      name: t("createdAt"),
+      width: "15%",
+      render: (date) => /* @__PURE__ */ jsx151(WfoDateTime, { dateOrIsoString: date }),
+      renderDetails: parseIsoString(parseDateToLocaleDateTimeString),
+      clipboardText: parseIsoString(parseDateToLocaleDateTimeString)
+    }
+  };
+  const { pageSize, pageIndex, sortBy, queryString } = dataDisplayParams;
+  const taskListQueryVariables = {
+    first: pageSize,
+    after: pageIndex * pageSize,
+    sortBy: graphQlTaskListMapper(sortBy),
+    query: queryString || void 0
+  };
+  const { data, isFetching, isError: isError3 } = useGetTasksQuery(
+    taskListQueryVariables
+  );
+  const [getTasksTrigger, { isFetching: isFetchingCsv }] = useLazyGetTasksQuery();
+  const getTasksForExport = () => getTasksTrigger(
+    getQueryVariablesForExport(taskListQueryVariables)
+  ).unwrap();
+  const dataSorting = {
+    field: (_a = sortBy == null ? void 0 : sortBy.field) != null ? _a : "name",
+    sortOrder: (_b = sortBy == null ? void 0 : sortBy.order) != null ? _b : "ASC" /* ASC */
+  };
+  const { totalItems, sortFields, filterFields } = (data == null ? void 0 : data.pageInfo) || {};
+  const pagination = {
+    pageSize,
+    pageIndex,
+    pageSizeOptions: DEFAULT_PAGE_SIZES,
+    totalItemCount: totalItems ? totalItems : 0
+  };
+  return /* @__PURE__ */ jsx151(WfoMetadataPageLayout, { children: /* @__PURE__ */ jsx151(
+    WfoTableWithFilter,
+    {
+      data: data ? mapTaskDefinitionToTaskListItem(data.tasks) : [],
+      tableColumns: mapSortableAndFilterableValuesToTableColumnConfig(
+        tableColumns,
+        sortFields,
+        filterFields
+      ),
+      dataSorting,
+      defaultHiddenColumns: tableDefaults == null ? void 0 : tableDefaults.hiddenColumns,
+      onUpdateDataSort: getDataSortHandler(
+        setDataDisplayParam
+      ),
+      onUpdatePage: getPageChangeHandler(
+        setDataDisplayParam
+      ),
+      onUpdateQueryString: getQueryStringHandler(
+        setDataDisplayParam
+      ),
+      pagination,
+      isLoading: isFetching,
+      hasError: isError3,
+      queryString,
+      localStorageKey: METADATA_TASKS_TABLE_LOCAL_STORAGE_KEY,
+      onExportData: csvDownloadHandler(
+        getTasksForExport,
+        (data2) => data2.tasks,
+        (data2) => data2.pageInfo,
+        Object.keys(tableColumns),
+        getCsvFileNameWithDate("Tasks"),
+        showToastMessage,
+        tError
+      ),
+      exportDataIsLoading: isFetchingCsv
+    }
+  ) });
+};
+
 // src/pages/processes/WfoProcessListSubscriptionsCell.tsx
 import Link4 from "next/link";
 import { EuiFlexGroup as EuiFlexGroup16 } from "@elastic/eui";
-import { Fragment as Fragment34, jsx as jsx151, jsxs as jsxs84 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment35, jsx as jsx152, jsxs as jsxs84 } from "@emotion/react/jsx-runtime";
 var RENDER_ALL = "RENDER_ALL";
 var RenderDirection = /* @__PURE__ */ ((RenderDirection2) => {
   RenderDirection2["HORIZONTAL"] = "HORIZONTAL";
@@ -52959,13 +53208,13 @@ var WfoProcessListSubscriptionsCell = ({
   }
   const visibleSubscriptions = numberOfSubscriptionsToRender === RENDER_ALL ? subscriptions : subscriptions.slice(0, numberOfSubscriptionsToRender);
   const numberOfNotVisibleSubscriptions = length - visibleSubscriptions.length;
-  return /* @__PURE__ */ jsx151(Fragment34, { children: /* @__PURE__ */ jsxs84(
+  return /* @__PURE__ */ jsx152(Fragment35, { children: /* @__PURE__ */ jsxs84(
     EuiFlexGroup16,
     {
       direction: renderDirection === "HORIZONTAL" /* HORIZONTAL */ ? "row" : "column",
       gutterSize: renderDirection === "HORIZONTAL" /* HORIZONTAL */ ? "m" : "xs",
       children: [
-        visibleSubscriptions.map((subscription) => /* @__PURE__ */ jsx151(
+        visibleSubscriptions.map((subscription) => /* @__PURE__ */ jsx152(
           Link4,
           {
             href: `/subscriptions/${subscription.subscriptionId}`,
@@ -52977,14 +53226,14 @@ var WfoProcessListSubscriptionsCell = ({
           },
           subscription.subscriptionId
         )),
-        numberOfNotVisibleSubscriptions > 0 && /* @__PURE__ */ jsx151("span", { children: `(+${numberOfNotVisibleSubscriptions})` })
+        numberOfNotVisibleSubscriptions > 0 && /* @__PURE__ */ jsx152("span", { children: `(+${numberOfNotVisibleSubscriptions})` })
       ]
     }
   ) });
 };
 
 // src/pages/processes/WfoProcessDetailPage.tsx
-import { useEffect as useEffect22, useRef as useRef7, useState as useState36 } from "react";
+import { useEffect as useEffect23, useRef as useRef7, useState as useState37 } from "react";
 
 // src/rtk/endpoints/processDetail.ts
 var processDetailQuery = `query ProcessDetail($processId: String!) {
@@ -53040,8 +53289,8 @@ var processDetailApi = orchestratorApi.injectEndpoints({
 var { useGetProcessDetailQuery } = processDetailApi;
 
 // src/components/WfoWorkflowSteps/WfoStep/WfoStep.tsx
-import React45 from "react";
-import { useTranslations as useTranslations45 } from "next-intl";
+import React46 from "react";
+import { useTranslations as useTranslations46 } from "next-intl";
 import { EuiFlexGroup as EuiFlexGroup17, EuiFlexItem as EuiFlexItem25, EuiPanel as EuiPanel4, EuiText as EuiText29 } from "@elastic/eui";
 
 // src/components/WfoWorkflowSteps/WfoStepStatusIcon/WfoStepStatusIcon.tsx
@@ -53147,26 +53396,26 @@ var getStyles11 = (theme) => {
 };
 
 // src/components/WfoWorkflowSteps/WfoStepStatusIcon/WfoStepStatusIcon.tsx
-import { jsx as jsx152, jsxs as jsxs85 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx153, jsxs as jsxs85 } from "@emotion/react/jsx-runtime";
 var SubIcon = ({ stepStatus, color = "" }) => {
   switch (stepStatus) {
     case "suspend" /* SUSPEND */:
-      return /* @__PURE__ */ jsx152(WfoMinusCircleFill, { color });
+      return /* @__PURE__ */ jsx153(WfoMinusCircleFill, { color });
     case "failed" /* FAILED */:
-      return /* @__PURE__ */ jsx152(WfoXCircleFill, { color });
+      return /* @__PURE__ */ jsx153(WfoXCircleFill, { color });
     default:
-      return /* @__PURE__ */ jsx152(WfoCheckmarkCircleFill, { color });
+      return /* @__PURE__ */ jsx153(WfoCheckmarkCircleFill, { color });
   }
 };
 var MainIcon = ({ stepStatus, color = "", isStartStep }) => {
   if (isStartStep) {
-    return /* @__PURE__ */ jsx152(WfoPlayFill, { color });
+    return /* @__PURE__ */ jsx153(WfoPlayFill, { color });
   }
   switch (stepStatus) {
     case "form" /* FORM */:
-      return /* @__PURE__ */ jsx152(WfoPencilAlt, { color });
+      return /* @__PURE__ */ jsx153(WfoPencilAlt, { color });
     default:
-      return /* @__PURE__ */ jsx152(WfoCogFill, { color, width: 16, height: 16 });
+      return /* @__PURE__ */ jsx153(WfoCogFill, { color, width: 16, height: 16 });
   }
 };
 var WfoStepStatusIcon = ({
@@ -53217,7 +53466,7 @@ var WfoStepStatusIcon = ({
     }
   })();
   return /* @__PURE__ */ jsxs85(EuiFlexItem23, { css: { flexDirection: "row" }, grow: 0, children: [
-    /* @__PURE__ */ jsx152("div", { css: stepStateStyle, children: /* @__PURE__ */ jsx152(
+    /* @__PURE__ */ jsx153("div", { css: stepStateStyle, children: /* @__PURE__ */ jsx153(
       MainIcon,
       {
         color: mainIconColor,
@@ -53225,7 +53474,7 @@ var WfoStepStatusIcon = ({
         isStartStep
       }
     ) }),
-    /* @__PURE__ */ jsx152(
+    /* @__PURE__ */ jsx153(
       "div",
       {
         css: {
@@ -53233,7 +53482,7 @@ var WfoStepStatusIcon = ({
           width: `${theme.base}`,
           visibility: hasSubIcon ? "visible" : "hidden"
         },
-        children: /* @__PURE__ */ jsx152(SubIcon, { color: subIconColor, stepStatus })
+        children: /* @__PURE__ */ jsx153(SubIcon, { color: subIconColor, stepStatus })
       }
     )
   ] });
@@ -53261,15 +53510,15 @@ var getStepContent = (stepDelta, showHiddenKeys) => {
 };
 
 // src/components/WfoWorkflowSteps/WfoStep/WfoStepForm.tsx
-import { useState as useState32 } from "react";
+import { useState as useState33 } from "react";
 import { EuiFlexItem as EuiFlexItem24 } from "@elastic/eui";
-import { jsx as jsx153 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx154 } from "@emotion/react/jsx-runtime";
 var WfoStepForm = ({
   userInputForm,
   isTask,
   processId
 }) => {
-  const [isProcessing, setIsProcessing] = useState32(false);
+  const [isProcessing, setIsProcessing] = useState33(false);
   const { theme } = useOrchestratorTheme();
   const apiClient = useAxiosApiClient();
   const submitForm = (processInput) => {
@@ -53280,7 +53529,7 @@ var WfoStepForm = ({
       setIsProcessing(true);
     });
   };
-  return /* @__PURE__ */ jsx153(EuiFlexItem24, { css: { margin: theme.size.m }, children: isProcessing && /* @__PURE__ */ jsx153(WfoLoading, {}) || /* @__PURE__ */ jsx153(
+  return /* @__PURE__ */ jsx154(EuiFlexItem24, { css: { margin: theme.size.m }, children: isProcessing && /* @__PURE__ */ jsx154(WfoLoading, {}) || /* @__PURE__ */ jsx154(
     UserInputFormWizard,
     {
       stepUserInput: userInputForm,
@@ -53293,8 +53542,8 @@ var WfoStepForm = ({
 };
 
 // src/components/WfoWorkflowSteps/WfoStep/WfoStep.tsx
-import { Fragment as Fragment35, jsx as jsx154, jsxs as jsxs86 } from "@emotion/react/jsx-runtime";
-var WfoStep = React45.forwardRef(
+import { Fragment as Fragment36, jsx as jsx155, jsxs as jsxs86 } from "@emotion/react/jsx-runtime";
+var WfoStep = React46.forwardRef(
   ({
     stepListItem,
     onToggleStepDetail,
@@ -53316,7 +53565,7 @@ var WfoStep = React45.forwardRef(
       stepRowStyle,
       getStepToggleExpandStyle
     } = getStyles11(theme);
-    const t = useTranslations45("processes.steps");
+    const t = useTranslations46("processes.steps");
     const hasHtmlMail = (_a = step.stateDelta) == null ? void 0 : _a.hasOwnProperty("confirmation_mail");
     const stepContent = step.stateDelta ? getStepContent(step.stateDelta, showHiddenKeys) : {};
     const hasStepContent = hasHtmlMail || Object.keys(stepContent).length > 0;
@@ -53325,28 +53574,28 @@ var WfoStep = React45.forwardRef(
         return "";
       }
       return /* @__PURE__ */ jsxs86(EuiText29, { size: "s", children: [
-        /* @__PURE__ */ jsx154("h4", { children: "To" }),
-        /* @__PURE__ */ jsx154("p", { children: value.to.map(
+        /* @__PURE__ */ jsx155("h4", { children: "To" }),
+        /* @__PURE__ */ jsx155("p", { children: value.to.map(
           (v, i) => /* @__PURE__ */ jsxs86("div", { children: [
             v.name,
             " <",
-            /* @__PURE__ */ jsx154("a", { href: `mailto: ${v.email}`, children: v.email }),
+            /* @__PURE__ */ jsx155("a", { href: `mailto: ${v.email}`, children: v.email }),
             ">"
           ] }, `to-${i}`)
         ) }),
-        /* @__PURE__ */ jsx154("h4", { children: "CC" }),
-        /* @__PURE__ */ jsx154("p", { children: value.cc.map(
+        /* @__PURE__ */ jsx155("h4", { children: "CC" }),
+        /* @__PURE__ */ jsx155("p", { children: value.cc.map(
           (v, i) => /* @__PURE__ */ jsxs86("div", { children: [
             v.name,
             " <",
-            /* @__PURE__ */ jsx154("a", { href: `mailto: ${v.email}`, children: v.email }),
+            /* @__PURE__ */ jsx155("a", { href: `mailto: ${v.email}`, children: v.email }),
             ">"
           ] }, `cc-${i}`)
         ) }),
-        /* @__PURE__ */ jsx154("h4", { children: "Subject" }),
-        /* @__PURE__ */ jsx154("p", { children: value.subject }),
-        /* @__PURE__ */ jsx154("h4", { children: "Message" }),
-        /* @__PURE__ */ jsx154(
+        /* @__PURE__ */ jsx155("h4", { children: "Subject" }),
+        /* @__PURE__ */ jsx155("p", { children: value.subject }),
+        /* @__PURE__ */ jsx155("h4", { children: "Message" }),
+        /* @__PURE__ */ jsx155(
           "div",
           {
             className: "emailMessage",
@@ -53355,14 +53604,14 @@ var WfoStep = React45.forwardRef(
         )
       ] });
     };
-    return /* @__PURE__ */ jsx154("div", { ref, children: /* @__PURE__ */ jsxs86(EuiPanel4, { children: [
+    return /* @__PURE__ */ jsx155("div", { ref, children: /* @__PURE__ */ jsxs86(EuiPanel4, { children: [
       /* @__PURE__ */ jsxs86(
         EuiFlexGroup17,
         {
           css: getStepHeaderStyle(hasStepContent),
           onClick: () => hasStepContent && onToggleStepDetail(),
           children: [
-            /* @__PURE__ */ jsx154(
+            /* @__PURE__ */ jsx155(
               WfoStepStatusIcon,
               {
                 stepStatus: step.status,
@@ -53370,47 +53619,47 @@ var WfoStep = React45.forwardRef(
               }
             ),
             /* @__PURE__ */ jsxs86(EuiFlexItem25, { grow: 0, children: [
-              /* @__PURE__ */ jsx154(EuiText29, { css: stepListContentBoldTextStyle, children: step.name }),
+              /* @__PURE__ */ jsx155(EuiText29, { css: stepListContentBoldTextStyle, children: step.name }),
               /* @__PURE__ */ jsxs86(EuiText29, { children: [
                 step.status,
                 " ",
                 step.executed && `- ${formatDate(step.executed)}`
               ] })
             ] }),
-            /* @__PURE__ */ jsx154(EuiFlexGroup17, { css: stepRowStyle, children: step.executed && /* @__PURE__ */ jsxs86(Fragment35, { children: [
+            /* @__PURE__ */ jsx155(EuiFlexGroup17, { css: stepRowStyle, children: step.executed && /* @__PURE__ */ jsxs86(Fragment36, { children: [
               /* @__PURE__ */ jsxs86(
                 EuiFlexItem25,
                 {
                   grow: 0,
                   css: stepHeaderRightStyle,
                   children: [
-                    /* @__PURE__ */ jsx154(EuiText29, { css: stepDurationStyle, children: t("duration") }),
-                    /* @__PURE__ */ jsx154(EuiText29, { size: "m", children: calculateTimeDifference(
+                    /* @__PURE__ */ jsx155(EuiText29, { css: stepDurationStyle, children: t("duration") }),
+                    /* @__PURE__ */ jsx155(EuiText29, { size: "m", children: calculateTimeDifference(
                       startedAt,
                       step.executed
                     ) })
                   ]
                 }
               ),
-              /* @__PURE__ */ jsx154(
+              /* @__PURE__ */ jsx155(
                 EuiFlexItem25,
                 {
                   grow: 0,
                   css: getStepToggleExpandStyle(
                     hasStepContent
                   ),
-                  children: isExpanded && /* @__PURE__ */ jsx154(WfoChevronUp, {}) || /* @__PURE__ */ jsx154(WfoChevronDown, {})
+                  children: isExpanded && /* @__PURE__ */ jsx155(WfoChevronUp, {}) || /* @__PURE__ */ jsx155(WfoChevronDown, {})
                 }
               )
             ] }) })
           ]
         }
       ),
-      hasStepContent && !hasHtmlMail && isExpanded && /* @__PURE__ */ jsx154(WfoJsonCodeBlock, { data: stepContent }),
-      isExpanded && hasHtmlMail && /* @__PURE__ */ jsx154("div", { css: stepEmailContainerStyle, children: displayMailConfirmation(
+      hasStepContent && !hasHtmlMail && isExpanded && /* @__PURE__ */ jsx155(WfoJsonCodeBlock, { data: stepContent }),
+      isExpanded && hasHtmlMail && /* @__PURE__ */ jsx155("div", { css: stepEmailContainerStyle, children: displayMailConfirmation(
         step.stateDelta.confirmation_mail
       ) }),
-      step.status === "suspend" /* SUSPEND */ && userInputForm && /* @__PURE__ */ jsx154(
+      step.status === "suspend" /* SUSPEND */ && userInputForm && /* @__PURE__ */ jsx155(
         WfoStepForm,
         {
           userInputForm,
@@ -53424,9 +53673,9 @@ var WfoStep = React45.forwardRef(
 WfoStep.displayName = "WfoStep";
 
 // src/components/WfoWorkflowSteps/WfoStepList/WfoStepList.tsx
-import React46, { useImperativeHandle, useRef as useRef6 } from "react";
-import { Fragment as Fragment36, jsx as jsx155, jsxs as jsxs87 } from "@emotion/react/jsx-runtime";
-var WfoStepList = React46.forwardRef(
+import React47, { useImperativeHandle, useRef as useRef6 } from "react";
+import { Fragment as Fragment37, jsx as jsx156, jsxs as jsxs87 } from "@emotion/react/jsx-runtime";
+var WfoStepList = React47.forwardRef(
   ({
     stepListItems,
     showHiddenKeys,
@@ -53467,10 +53716,10 @@ var WfoStepList = React46.forwardRef(
       })
     }));
     const getReferenceCallbackForStepId = (stepId) => (node) => node ? stepReferences.current.set(stepId, node) : stepReferences.current.delete(stepId);
-    return /* @__PURE__ */ jsx155(Fragment36, { children: stepListItems.map((stepListItem, index) => {
+    return /* @__PURE__ */ jsx156(Fragment37, { children: stepListItems.map((stepListItem, index) => {
       const stepComponent = /* @__PURE__ */ jsxs87("div", { children: [
-        index !== 0 && /* @__PURE__ */ jsx155("div", { css: stepSpacerStyle }),
-        /* @__PURE__ */ jsx155(
+        index !== 0 && /* @__PURE__ */ jsx156("div", { css: stepSpacerStyle }),
+        /* @__PURE__ */ jsx156(
           WfoStep,
           {
             ref: getReferenceCallbackForStepId(
@@ -53496,15 +53745,15 @@ var WfoStepList = React46.forwardRef(
 WfoStepList.displayName = "WfoStepList";
 
 // src/components/WfoWorkflowSteps/WfoWorkflowStepList/WfoWorkflowStepList.tsx
-import React49, { useEffect as useEffect21, useState as useState35 } from "react";
-import { useTranslations as useTranslations48 } from "next-intl";
+import React50, { useEffect as useEffect22, useState as useState36 } from "react";
+import { useTranslations as useTranslations49 } from "next-intl";
 
 // src/components/WfoDiff/WfoDiff.tsx
 var refractor = __toESM(require_refractor(), 1);
-import { useCallback as useCallback5, useEffect as useEffect20, useMemo as useMemo4, useState as useState33 } from "react";
+import { useCallback as useCallback5, useEffect as useEffect21, useMemo as useMemo4, useState as useState34 } from "react";
 import { Diff, Hunk, parseDiff, tokenize } from "react-diff-view";
 import "react-diff-view/style/index.css";
-import { useTranslations as useTranslations46 } from "next-intl";
+import { useTranslations as useTranslations47 } from "next-intl";
 import "prism-themes/themes/prism-ghcolors.min.css";
 import { diffLines, formatLines } from "unidiff";
 import {
@@ -53514,15 +53763,15 @@ import {
   EuiSpacer as EuiSpacer16,
   EuiText as EuiText30
 } from "@elastic/eui";
-import { jsx as jsx156, jsxs as jsxs88 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx157, jsxs as jsxs88 } from "@emotion/react/jsx-runtime";
 var EMPTY_HUNKS = [];
 var SMALL_CONTEXT = 3;
 var FULL_CONTEXT = 1e6;
 var WfoDiff = ({ oldText, newText, syntax }) => {
-  const t = useTranslations46("processes.delta");
-  const [showSplit, setShowSplit] = useState33(true);
-  const [showFull, setShowFull] = useState33(false);
-  const [{ type, hunks }, setDiff] = useState33({
+  const t = useTranslations47("processes.delta");
+  const [showSplit, setShowSplit] = useState34(true);
+  const [showFull, setShowFull] = useState34(false);
+  const [{ type, hunks }, setDiff] = useState34({
     type: "modify",
     hunks: []
   });
@@ -53548,13 +53797,13 @@ var WfoDiff = ({ oldText, newText, syntax }) => {
       return void 0;
     }
   }, [hunks, syntax]);
-  useEffect20(() => {
+  useEffect21(() => {
     updateDiffText();
   }, [updateDiffText, showFull]);
   return /* @__PURE__ */ jsxs88("div", { children: [
     /* @__PURE__ */ jsxs88(EuiFlexGroup18, { gutterSize: "xs", children: [
-      /* @__PURE__ */ jsx156(EuiFlexItem26, { grow: false, children: /* @__PURE__ */ jsx156(EuiText30, { children: /* @__PURE__ */ jsx156("h3", { children: t("title") }) }) }),
-      /* @__PURE__ */ jsx156(EuiFlexItem26, { grow: false, children: /* @__PURE__ */ jsx156(
+      /* @__PURE__ */ jsx157(EuiFlexItem26, { grow: false, children: /* @__PURE__ */ jsx157(EuiText30, { children: /* @__PURE__ */ jsx157("h3", { children: t("title") }) }) }),
+      /* @__PURE__ */ jsx157(EuiFlexItem26, { grow: false, children: /* @__PURE__ */ jsx157(
         EuiButtonIcon4,
         {
           size: "s",
@@ -53562,7 +53811,7 @@ var WfoDiff = ({ oldText, newText, syntax }) => {
           onClick: () => setShowSplit(!showSplit)
         }
       ) }),
-      /* @__PURE__ */ jsx156(EuiFlexItem26, { grow: false, children: /* @__PURE__ */ jsx156(
+      /* @__PURE__ */ jsx157(EuiFlexItem26, { grow: false, children: /* @__PURE__ */ jsx157(
         EuiButtonIcon4,
         {
           size: "s",
@@ -53571,15 +53820,15 @@ var WfoDiff = ({ oldText, newText, syntax }) => {
         }
       ) })
     ] }),
-    /* @__PURE__ */ jsx156(EuiSpacer16, {}),
-    /* @__PURE__ */ jsx156(
+    /* @__PURE__ */ jsx157(EuiSpacer16, {}),
+    /* @__PURE__ */ jsx157(
       Diff,
       {
         viewType: showSplit ? "split" : "unified",
         diffType: type,
         hunks: hunks || EMPTY_HUNKS,
         tokens,
-        children: (hunks2) => hunks2.map((hunk) => /* @__PURE__ */ jsx156(Hunk, { hunk }, hunk.content))
+        children: (hunks2) => hunks2.map((hunk) => /* @__PURE__ */ jsx157(Hunk, { hunk }, hunk.content))
       }
     )
   ] });
@@ -53587,8 +53836,8 @@ var WfoDiff = ({ oldText, newText, syntax }) => {
 var WfoDiff_default = WfoDiff;
 
 // src/components/WfoWorkflowSteps/WfoWorkflowStepList/WfoStepListHeader.tsx
-import { useState as useState34 } from "react";
-import { useTranslations as useTranslations47 } from "next-intl";
+import { useState as useState35 } from "react";
+import { useTranslations as useTranslations48 } from "next-intl";
 import {
   EuiButton as EuiButton11,
   EuiFlexGroup as EuiFlexGroup19,
@@ -53619,14 +53868,14 @@ var getStyles12 = (theme) => {
 };
 
 // src/components/WfoTextAnchor/WfoTextAnchor.tsx
-import { jsx as jsx157 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx158 } from "@emotion/react/jsx-runtime";
 var WfoTextAnchor = ({ text, onClick }) => {
   const { textAnchorStyle } = useWithOrchestratorTheme(getStyles12);
-  return /* @__PURE__ */ jsx157(EuiText31, { onClick, css: textAnchorStyle, children: text });
+  return /* @__PURE__ */ jsx158(EuiText31, { onClick, css: textAnchorStyle, children: text });
 };
 
 // src/components/WfoWorkflowSteps/WfoWorkflowStepList/WfoStepListHeader.tsx
-import { jsx as jsx158, jsxs as jsxs89 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx159, jsxs as jsxs89 } from "@emotion/react/jsx-runtime";
 var WfoStepListHeader = ({
   showHiddenKeys,
   showRaw,
@@ -53638,7 +53887,7 @@ var WfoStepListHeader = ({
   onToggleAllDetailsIsOpen,
   isTask
 }) => {
-  const t = useTranslations47("processes.steps");
+  const t = useTranslations48("processes.steps");
   const { theme } = useOrchestratorTheme();
   const {
     stepListHeaderStyle,
@@ -53646,14 +53895,14 @@ var WfoStepListHeader = ({
     stepListContentBoldTextStyle,
     stepListOptionsContainerStyle
   } = getStyles11(theme);
-  const [isViewOptionOpen, setIsViewOptionOpen] = useState34(false);
+  const [isViewOptionOpen, setIsViewOptionOpen] = useState35(false);
   const onViewOptionClick = () => setIsViewOptionOpen((isViewOptionOpen2) => !isViewOptionOpen2);
   const closeViewOption = () => setIsViewOptionOpen(false);
-  const viewOptionButton = /* @__PURE__ */ jsx158(
+  const viewOptionButton = /* @__PURE__ */ jsx159(
     EuiButton11,
     {
       onClick: onViewOptionClick,
-      iconType: () => /* @__PURE__ */ jsx158(WfoEyeFill, { color: theme.colors.link }),
+      iconType: () => /* @__PURE__ */ jsx159(WfoEyeFill, { color: theme.colors.link }),
       iconSide: "right",
       size: "s",
       children: t("viewOptions")
@@ -53661,8 +53910,8 @@ var WfoStepListHeader = ({
   );
   return /* @__PURE__ */ jsxs89(EuiFlexGroup19, { css: stepListHeaderStyle, children: [
     /* @__PURE__ */ jsxs89(EuiFlexGroup19, { css: stepListContentStyle, children: [
-      /* @__PURE__ */ jsx158(EuiText32, { css: stepListContentBoldTextStyle, children: t(isTask ? "taskSteps" : "workflowSteps") }),
-      !showRaw && /* @__PURE__ */ jsx158(
+      /* @__PURE__ */ jsx159(EuiText32, { css: stepListContentBoldTextStyle, children: t(isTask ? "taskSteps" : "workflowSteps") }),
+      !showRaw && /* @__PURE__ */ jsx159(
         WfoTextAnchor,
         {
           text: allDetailToggleText,
@@ -53678,25 +53927,25 @@ var WfoStepListHeader = ({
         css: stepListOptionsContainerStyle,
         gutterSize: "s",
         children: [
-          !showRaw && /* @__PURE__ */ jsx158(
+          !showRaw && /* @__PURE__ */ jsx159(
             EuiButton11,
             {
               onClick: () => onChangeShowDelta(!showDelta),
               iconSide: "right",
               size: "s",
-              iconType: () => /* @__PURE__ */ jsx158(WfoCode, { color: theme.colors.link }),
+              iconType: () => /* @__PURE__ */ jsx159(WfoCode, { color: theme.colors.link }),
               children: showDelta ? t("hideDelta") : t("showDelta")
             }
           ),
-          /* @__PURE__ */ jsx158(
+          /* @__PURE__ */ jsx159(
             EuiPopover5,
             {
               button: viewOptionButton,
               isOpen: isViewOptionOpen,
               closePopover: closeViewOption,
               display: "block",
-              children: /* @__PURE__ */ jsx158("div", { children: /* @__PURE__ */ jsxs89(EuiForm2, { component: "form", children: [
-                /* @__PURE__ */ jsx158(EuiFormRow20, { children: /* @__PURE__ */ jsx158(
+              children: /* @__PURE__ */ jsx159("div", { children: /* @__PURE__ */ jsxs89(EuiForm2, { component: "form", children: [
+                /* @__PURE__ */ jsx159(EuiFormRow20, { children: /* @__PURE__ */ jsx159(
                   EuiSwitch3,
                   {
                     label: "Hidden keys",
@@ -53709,7 +53958,7 @@ var WfoStepListHeader = ({
                     }
                   }
                 ) }),
-                /* @__PURE__ */ jsx158(EuiFormRow20, { children: /* @__PURE__ */ jsx158(
+                /* @__PURE__ */ jsx159(EuiFormRow20, { children: /* @__PURE__ */ jsx159(
                   EuiSwitch3,
                   {
                     label: "Raw JSON data",
@@ -53730,10 +53979,10 @@ var WfoStepListHeader = ({
 };
 
 // src/components/WfoWorkflowSteps/WfoWorkflowStepList/WfoWorkflowStepList.tsx
-import { Fragment as Fragment37, jsx as jsx159, jsxs as jsxs90 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment38, jsx as jsx160, jsxs as jsxs90 } from "@emotion/react/jsx-runtime";
 var WfoProcessRawData = ({ processId }) => {
   const { data, isFetching } = useRawProcessDetails(processId);
-  return isFetching ? /* @__PURE__ */ jsx159(WfoLoading, {}) : /* @__PURE__ */ jsx159(WfoJsonCodeBlock, { data: data || {} });
+  return isFetching ? /* @__PURE__ */ jsx160(WfoLoading, {}) : /* @__PURE__ */ jsx160(WfoJsonCodeBlock, { data: data || {} });
 };
 var WfoProcessSubscriptionDelta = ({
   processId
@@ -53743,7 +53992,7 @@ var WfoProcessSubscriptionDelta = ({
   const subscriptionKey = (_c = (_b = (_a = data == null ? void 0 : data.current_state) == null ? void 0 : _a.subscription) == null ? void 0 : _b.subscription_id) != null ? _c : "";
   const newText = (_e = (_d = data == null ? void 0 : data.current_state) == null ? void 0 : _d.subscription) != null ? _e : null;
   const oldText = ((_f = data == null ? void 0 : data.current_state) == null ? void 0 : _f.__old_subscriptions__) && subscriptionKey in ((_g = data == null ? void 0 : data.current_state) == null ? void 0 : _g.__old_subscriptions__) ? (_h = data == null ? void 0 : data.current_state) == null ? void 0 : _h.__old_subscriptions__[subscriptionKey] : null;
-  return isFetching ? /* @__PURE__ */ jsx159(WfoLoading, {}) : /* @__PURE__ */ jsx159(
+  return isFetching ? /* @__PURE__ */ jsx160(WfoLoading, {}) : /* @__PURE__ */ jsx160(
     WfoDiff_default,
     {
       oldText: oldText ? JSON.stringify(oldText, null, 2) : "",
@@ -53752,7 +54001,7 @@ var WfoProcessSubscriptionDelta = ({
     }
   );
 };
-var WfoWorkflowStepList = React49.forwardRef(
+var WfoWorkflowStepList = React50.forwardRef(
   ({
     steps = [],
     startedAt,
@@ -53760,15 +54009,15 @@ var WfoWorkflowStepList = React49.forwardRef(
     isTask,
     userInputForm
   }, reference) => {
-    const [showHiddenKeys, setShowHiddenKeys] = useState35(false);
-    const [showRaw, setShowRaw] = useState35(false);
-    const [showDelta, setShowDelta] = useState35(false);
-    const t = useTranslations48("processes.steps");
+    const [showHiddenKeys, setShowHiddenKeys] = useState36(false);
+    const [showRaw, setShowRaw] = useState36(false);
+    const [showDelta, setShowDelta] = useState36(false);
+    const t = useTranslations49("processes.steps");
     const initialStepListItems = steps.map((step) => ({
       step,
       isExpanded: false
     }));
-    const [stepListItems, setStepListItems] = useState35(initialStepListItems);
+    const [stepListItems, setStepListItems] = useState36(initialStepListItems);
     const persistStepListItemState = (previousStepListItems, updatedSteps, userInputForm2) => {
       var _a;
       const reversedSteps = [...updatedSteps].reverse();
@@ -53786,7 +54035,7 @@ var WfoWorkflowStepList = React49.forwardRef(
         };
       });
     };
-    useEffect21(() => {
+    useEffect22(() => {
       setStepListItems(
         (previousStepListItems) => persistStepListItemState(
           previousStepListItems,
@@ -53816,8 +54065,8 @@ var WfoWorkflowStepList = React49.forwardRef(
     const handleExpandStepListItem = (stepListItem) => updateStepListItem(stepListItem, (item) => __spreadProps(__spreadValues({}, item), {
       isExpanded: true
     }));
-    return /* @__PURE__ */ jsxs90(Fragment37, { children: [
-      /* @__PURE__ */ jsx159(
+    return /* @__PURE__ */ jsxs90(Fragment38, { children: [
+      /* @__PURE__ */ jsx160(
         WfoStepListHeader,
         {
           showHiddenKeys,
@@ -53831,9 +54080,9 @@ var WfoWorkflowStepList = React49.forwardRef(
           isTask
         }
       ),
-      showRaw && /* @__PURE__ */ jsx159(WfoProcessRawData, { processId }),
-      showDelta && /* @__PURE__ */ jsx159(WfoProcessSubscriptionDelta, { processId }),
-      !showRaw && !showDelta && /* @__PURE__ */ jsx159(
+      showRaw && /* @__PURE__ */ jsx160(WfoProcessRawData, { processId }),
+      showDelta && /* @__PURE__ */ jsx160(WfoProcessSubscriptionDelta, { processId }),
+      !showRaw && !showDelta && /* @__PURE__ */ jsx160(
         WfoStepList,
         {
           ref: reference,
@@ -53853,7 +54102,7 @@ WfoWorkflowStepList.displayName = "WfoWorkflowStepList";
 
 // src/pages/processes/WfoProcessDetail.tsx
 import { useContext as useContext13 } from "react";
-import { useTranslations as useTranslations49 } from "next-intl";
+import { useTranslations as useTranslations50 } from "next-intl";
 import { useRouter as useRouter9 } from "next/router";
 import {
   EuiButton as EuiButton12,
@@ -53940,12 +54189,12 @@ var getIndexOfCurrentStep = (timelineItems) => {
 };
 
 // src/pages/processes/WfoProcessDetail.tsx
-import { Fragment as Fragment38, jsx as jsx160, jsxs as jsxs91 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment39, jsx as jsx161, jsxs as jsxs91 } from "@emotion/react/jsx-runtime";
 var ProcessHeaderValue = ({
   translationKey,
   value = ""
 }) => {
-  const t = useTranslations49("processes.detail");
+  const t = useTranslations50("processes.detail");
   const { theme } = useOrchestratorTheme();
   return /* @__PURE__ */ jsxs91(
     EuiFlexGroup20,
@@ -53958,8 +54207,8 @@ var ProcessHeaderValue = ({
         overflow: "hidden"
       },
       children: [
-        /* @__PURE__ */ jsx160(EuiText33, { size: "xs", children: t(translationKey) }),
-        /* @__PURE__ */ jsx160(
+        /* @__PURE__ */ jsx161(EuiText33, { size: "xs", children: t(translationKey) }),
+        /* @__PURE__ */ jsx161(
           EuiText33,
           {
             css: {
@@ -53987,7 +54236,7 @@ var WfoProcessDetail = ({
   hasError = false
 }) => {
   var _a, _b;
-  const t = useTranslations49("processes.detail");
+  const t = useTranslations50("processes.detail");
   const { theme } = useOrchestratorTheme();
   const { showConfirmDialog } = useContext13(ConfirmationDialogContext);
   const { deleteProcess, abortProcess, retryProcess } = useMutateProcess();
@@ -54046,12 +54295,12 @@ var WfoProcessDetail = ({
       router.push(PATH_TASKS);
     }
   });
-  return /* @__PURE__ */ jsxs91(Fragment38, { children: [
+  return /* @__PURE__ */ jsxs91(Fragment39, { children: [
     /* @__PURE__ */ jsxs91(EuiFlexGroup20, { children: [
       /* @__PURE__ */ jsxs91(EuiFlexItem27, { children: [
-        /* @__PURE__ */ jsx160(EuiPageHeader3, { pageTitle }),
-        /* @__PURE__ */ jsx160(EuiSpacer17, {}),
-        /* @__PURE__ */ jsx160(EuiText33, { size: "s", children: productNames })
+        /* @__PURE__ */ jsx161(EuiPageHeader3, { pageTitle }),
+        /* @__PURE__ */ jsx161(EuiSpacer17, {}),
+        /* @__PURE__ */ jsx161(EuiText33, { size: "s", children: productNames })
       ] }),
       /* @__PURE__ */ jsxs91(
         EuiFlexGroup20,
@@ -54061,15 +54310,15 @@ var WfoProcessDetail = ({
           css: { flexGrow: 0 },
           gutterSize: "s",
           children: [
-            /* @__PURE__ */ jsx160(
+            /* @__PURE__ */ jsx161(
               WfoIsAllowedToRender,
               {
                 resource: "/orchestrator/processes/retry/" /* PROCESS_RETRY */,
-                children: /* @__PURE__ */ jsx160(
+                children: /* @__PURE__ */ jsx161(
                   EuiButton12,
                   {
                     onClick: handleActionButtonClick(retryAction),
-                    iconType: () => /* @__PURE__ */ jsx160(
+                    iconType: () => /* @__PURE__ */ jsx161(
                       WfoRefresh,
                       {
                         color: retryButtonIsDisabled ? theme.colors.subduedText : theme.colors.link
@@ -54081,15 +54330,15 @@ var WfoProcessDetail = ({
                 )
               }
             ),
-            /* @__PURE__ */ jsx160(
+            /* @__PURE__ */ jsx161(
               WfoIsAllowedToRender,
               {
                 resource: "/orchestrator/processes/abort/" /* PROCESS_ABORT */,
-                children: /* @__PURE__ */ jsx160(
+                children: /* @__PURE__ */ jsx161(
                   EuiButton12,
                   {
                     onClick: handleActionButtonClick(abortAction),
-                    iconType: () => /* @__PURE__ */ jsx160(
+                    iconType: () => /* @__PURE__ */ jsx161(
                       WfoXCircleFill,
                       {
                         color: abortButtonIsDisabled ? theme.colors.subduedText : theme.colors.danger
@@ -54102,11 +54351,11 @@ var WfoProcessDetail = ({
                 )
               }
             ),
-            processDetail && processIsTask && isAllowed("/orchestrator/processes/delete/" /* PROCESS_DELETE */) && /* @__PURE__ */ jsx160(
+            processDetail && processIsTask && isAllowed("/orchestrator/processes/delete/" /* PROCESS_DELETE */) && /* @__PURE__ */ jsx161(
               EuiButton12,
               {
                 onClick: handleActionButtonClick(deleteAction),
-                iconType: () => /* @__PURE__ */ jsx160(
+                iconType: () => /* @__PURE__ */ jsx161(
                   WfoXCircleFill,
                   {
                     color: deleteButtonIsDisabled ? theme.colors.subduedText : theme.colors.danger
@@ -54121,44 +54370,44 @@ var WfoProcessDetail = ({
         }
       )
     ] }),
-    /* @__PURE__ */ jsx160(EuiSpacer17, {}),
-    /* @__PURE__ */ jsx160(
+    /* @__PURE__ */ jsx161(EuiSpacer17, {}),
+    /* @__PURE__ */ jsx161(
       EuiPanel5,
       {
         hasShadow: false,
         hasBorder: false,
         color: "subdued",
         element: "div",
-        children: isLoading && !hasError && /* @__PURE__ */ jsx160(WfoLoading, {}) || processDetail !== void 0 && /* @__PURE__ */ jsxs91(EuiFlexGroup20, { direction: "row", gutterSize: "m", children: [
-          /* @__PURE__ */ jsx160(
+        children: isLoading && !hasError && /* @__PURE__ */ jsx161(WfoLoading, {}) || processDetail !== void 0 && /* @__PURE__ */ jsxs91(EuiFlexGroup20, { direction: "row", gutterSize: "m", children: [
+          /* @__PURE__ */ jsx161(
             ProcessHeaderValue,
             {
               translationKey: "status",
               value: processDetail.lastStatus
             }
           ),
-          /* @__PURE__ */ jsx160(
+          /* @__PURE__ */ jsx161(
             ProcessHeaderValue,
             {
               translationKey: "lastStep",
               value: processDetail == null ? void 0 : processDetail.lastStep
             }
           ),
-          processDetail.customer && /* @__PURE__ */ jsx160(
+          processDetail.customer && /* @__PURE__ */ jsx161(
             ProcessHeaderValue,
             {
               translationKey: "customer",
               value: (_a = processDetail.customer) == null ? void 0 : _a.fullname
             }
           ),
-          /* @__PURE__ */ jsx160(
+          /* @__PURE__ */ jsx161(
             ProcessHeaderValue,
             {
               translationKey: "startedBy",
               value: processDetail == null ? void 0 : processDetail.createdBy
             }
           ),
-          /* @__PURE__ */ jsx160(
+          /* @__PURE__ */ jsx161(
             ProcessHeaderValue,
             {
               translationKey: "startedOn",
@@ -54167,7 +54416,7 @@ var WfoProcessDetail = ({
               )(processDetail == null ? void 0 : processDetail.startedAt) : ""
             }
           ),
-          /* @__PURE__ */ jsx160(
+          /* @__PURE__ */ jsx161(
             ProcessHeaderValue,
             {
               translationKey: "lastUpdate",
@@ -54188,8 +54437,8 @@ var WfoProcessDetail = ({
                 overflow: "hidden"
               },
               children: [
-                /* @__PURE__ */ jsx160(EuiText33, { size: "xs", children: t("relatedSubscriptions") }),
-                /* @__PURE__ */ jsx160(
+                /* @__PURE__ */ jsx161(EuiText33, { size: "xs", children: t("relatedSubscriptions") }),
+                /* @__PURE__ */ jsx161(
                   EuiText33,
                   {
                     css: {
@@ -54199,7 +54448,7 @@ var WfoProcessDetail = ({
                       textOverflow: "ellipsis",
                       fontSize: theme.size.m
                     },
-                    children: /* @__PURE__ */ jsx160(
+                    children: /* @__PURE__ */ jsx161(
                       WfoProcessListSubscriptionsCell,
                       {
                         subscriptions: process && ((_b = processDetail == null ? void 0 : processDetail.subscriptions) == null ? void 0 : _b.page.map(
@@ -54219,8 +54468,8 @@ var WfoProcessDetail = ({
         ] })
       }
     ),
-    /* @__PURE__ */ jsx160(EuiSpacer17, { size: "s" }),
-    /* @__PURE__ */ jsx160(
+    /* @__PURE__ */ jsx161(EuiSpacer17, { size: "s" }),
+    /* @__PURE__ */ jsx161(
       WfoTimeline,
       {
         timelineItems,
@@ -54233,7 +54482,7 @@ var WfoProcessDetail = ({
 };
 
 // src/pages/processes/WfoProcessDetailPage.tsx
-import { jsx as jsx161 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx162 } from "@emotion/react/jsx-runtime";
 var PROCESS_DETAIL_DEFAULT_REFETCH_INTERVAL = 3e3;
 var WfoProcessDetailPage = ({
   processId,
@@ -54241,8 +54490,8 @@ var WfoProcessDetailPage = ({
 }) => {
   var _a, _b;
   const stepListRef = useRef7(null);
-  const [fetchInterval, setFetchInterval] = useState36();
-  const [process2, setProcess] = useState36();
+  const [fetchInterval, setFetchInterval] = useState37();
+  const [process2, setProcess] = useState37();
   const { data, isLoading, isError: isError3 } = useGetProcessDetailQuery(
     { processId },
     { pollingInterval: fetchInterval }
@@ -54252,7 +54501,7 @@ var WfoProcessDetailPage = ({
       setFetchInterval(void 0);
     }
   }
-  useEffect22(() => {
+  useEffect23(() => {
     const process3 = data == null ? void 0 : data.processes[0];
     const lastStatus = process3 == null ? void 0 : process3.lastStatus.toLocaleLowerCase();
     const isInProgress = !(lastStatus && ProcessDoneStatuses.includes(lastStatus));
@@ -54260,7 +54509,7 @@ var WfoProcessDetailPage = ({
       isInProgress ? processDetailRefetchInterval : void 0
     );
   }, [data, processDetailRefetchInterval]);
-  useEffect22(() => {
+  useEffect23(() => {
     const fetchedProcessDetails = data == null ? void 0 : data.processes[0];
     if (!process2) {
       setProcess(fetchedProcessDetails);
@@ -54277,7 +54526,7 @@ var WfoProcessDetailPage = ({
   const isTask = (_b = process2 == null ? void 0 : process2.isTask) != null ? _b : false;
   const groupedSteps = convertStepsToGroupedSteps(steps);
   const timelineItems = mapGroupedStepsToTimelineItems(groupedSteps);
-  return /* @__PURE__ */ jsx161(
+  return /* @__PURE__ */ jsx162(
     WfoProcessDetail,
     {
       pageTitle,
@@ -54291,7 +54540,7 @@ var WfoProcessDetailPage = ({
       },
       isLoading,
       hasError: isError3,
-      children: isError3 && /* @__PURE__ */ jsx161(WfoError, {}) || isLoading && /* @__PURE__ */ jsx161(WfoLoading, {}) || process2 !== void 0 && /* @__PURE__ */ jsx161(
+      children: isError3 && /* @__PURE__ */ jsx162(WfoError, {}) || isLoading && /* @__PURE__ */ jsx162(WfoLoading, {}) || process2 !== void 0 && /* @__PURE__ */ jsx162(
         WfoWorkflowStepList,
         {
           ref: stepListRef,
@@ -54303,14 +54552,14 @@ var WfoProcessDetailPage = ({
           startedAt: process2.startedAt,
           isTask
         }
-      ) || /* @__PURE__ */ jsx161("h1", { children: "Invalid processId" })
+      ) || /* @__PURE__ */ jsx162("h1", { children: "Invalid processId" })
     }
   );
 };
 
 // src/pages/processes/WfoStartProcessPage.tsx
-import { useCallback as useCallback6, useEffect as useEffect23, useMemo as useMemo5, useState as useState37 } from "react";
-import { useTranslations as useTranslations50 } from "next-intl";
+import { useCallback as useCallback6, useEffect as useEffect24, useMemo as useMemo5, useState as useState38 } from "react";
+import { useTranslations as useTranslations51 } from "next-intl";
 import { useRouter as useRouter10 } from "next/router";
 import {
   EuiFlexGroup as EuiFlexGroup21,
@@ -54319,7 +54568,7 @@ import {
   EuiPanel as EuiPanel6,
   EuiText as EuiText34
 } from "@elastic/eui";
-import { jsx as jsx162, jsxs as jsxs92 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx163, jsxs as jsxs92 } from "@emotion/react/jsx-runtime";
 var getInitialProcessPayload = ({
   productId,
   subscriptionId
@@ -54341,11 +54590,11 @@ var WfoStartProcessPage = ({
   isTask = false
 }) => {
   const apiClient = useAxiosApiClient();
-  const t = useTranslations50("processes.steps");
+  const t = useTranslations51("processes.steps");
   const router = useRouter10();
-  const [hasError, setHasError] = useState37(false);
+  const [hasError, setHasError] = useState38(false);
   const { theme } = useOrchestratorTheme();
-  const [form, setForm] = useState37({});
+  const [form, setForm] = useState38({});
   const { productId, subscriptionId } = router.query;
   const startProcessPayload = useMemo5(
     () => getInitialProcessPayload({ productId, subscriptionId }),
@@ -54404,7 +54653,7 @@ var WfoStartProcessPage = ({
     },
     [apiClient, processName, startProcessPayload, isTask, router]
   );
-  useEffect23(() => {
+  useEffect24(() => {
     if (processName) {
       const clientResultCallback = (json) => {
         var _a;
@@ -54426,7 +54675,7 @@ var WfoStartProcessPage = ({
     workflowName: processName,
     createdBy: "-"
   };
-  return /* @__PURE__ */ jsx162(
+  return /* @__PURE__ */ jsx163(
     WfoProcessDetail,
     {
       pageTitle: processName,
@@ -54437,16 +54686,16 @@ var WfoStartProcessPage = ({
       isLoading,
       children: /* @__PURE__ */ jsxs92(EuiPanel6, { css: { marginTop: theme.base * 3 }, children: [
         /* @__PURE__ */ jsxs92(EuiFlexGroup21, { css: getStepHeaderStyle(false), children: [
-          /* @__PURE__ */ jsx162(WfoStepStatusIcon, { stepStatus: "form" /* FORM */ }),
+          /* @__PURE__ */ jsx163(WfoStepStatusIcon, { stepStatus: "form" /* FORM */ }),
           /* @__PURE__ */ jsxs92(EuiFlexItem28, { grow: 0, children: [
-            /* @__PURE__ */ jsx162(EuiText34, { css: stepListContentBoldTextStyle, children: t("userInput") }),
-            /* @__PURE__ */ jsx162(EuiText34, { children: t(
+            /* @__PURE__ */ jsx163(EuiText34, { css: stepListContentBoldTextStyle, children: t("userInput") }),
+            /* @__PURE__ */ jsx163(EuiText34, { children: t(
               isTask ? "submitTaskFormLabel" : "submitWorkflowFormLabel"
             ) })
           ] })
         ] }),
-        /* @__PURE__ */ jsx162(EuiHorizontalRule6, {}),
-        hasError && /* @__PURE__ */ jsx162(WfoError, {}) || stepUserInput && /* @__PURE__ */ jsx162(
+        /* @__PURE__ */ jsx163(EuiHorizontalRule6, {}),
+        hasError && /* @__PURE__ */ jsx163(WfoError, {}) || stepUserInput && /* @__PURE__ */ jsx163(
           UserInputFormWizard_default,
           {
             stepUserInput,
@@ -54457,14 +54706,14 @@ var WfoStartProcessPage = ({
             hasNext,
             isTask
           }
-        ) || /* @__PURE__ */ jsx162(WfoLoading, {})
+        ) || /* @__PURE__ */ jsx163(WfoLoading, {})
       ] })
     }
   );
 };
 
 // src/pages/startPage/WfoStartPage.tsx
-import { useTranslations as useTranslations51 } from "next-intl";
+import { useTranslations as useTranslations52 } from "next-intl";
 import { EuiFlexItem as EuiFlexItem33 } from "@elastic/eui";
 
 // src/components/WfoSummary/WfoSummaryCards.tsx
@@ -54524,7 +54773,7 @@ var getWfoSummaryCardHeaderStyles = (theme) => {
 };
 
 // src/components/WfoSummary/WfoSummaryCardHeader/WfoSummaryCardHeader.tsx
-import { jsx as jsx163, jsxs as jsxs93 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx164, jsxs as jsxs93 } from "@emotion/react/jsx-runtime";
 var WfoSummaryCardHeader = ({
   text,
   value,
@@ -54533,8 +54782,8 @@ var WfoSummaryCardHeader = ({
 }) => {
   const { theme } = useOrchestratorTheme();
   const { avatarStyle, totalSectionStyle, valueStyle } = getWfoSummaryCardHeaderStyles(theme);
-  return /* @__PURE__ */ jsx163(EuiFlexItem29, { grow: 0, children: /* @__PURE__ */ jsx163(EuiPanel7, { hasShadow: false, color: "subdued", paddingSize: "l", children: /* @__PURE__ */ jsxs93(EuiFlexGroup22, { children: [
-    /* @__PURE__ */ jsx163(
+  return /* @__PURE__ */ jsx164(EuiFlexItem29, { grow: 0, children: /* @__PURE__ */ jsx164(EuiPanel7, { hasShadow: false, color: "subdued", paddingSize: "l", children: /* @__PURE__ */ jsxs93(EuiFlexGroup22, { children: [
+    /* @__PURE__ */ jsx164(
       EuiAvatar2,
       {
         iconSize: "l",
@@ -54548,8 +54797,8 @@ var WfoSummaryCardHeader = ({
       }
     ),
     /* @__PURE__ */ jsxs93("div", { css: totalSectionStyle, children: [
-      /* @__PURE__ */ jsx163(EuiText35, { color: "subdued", children: text }),
-      /* @__PURE__ */ jsx163(EuiText35, { css: valueStyle, children: value })
+      /* @__PURE__ */ jsx164(EuiText35, { color: "subdued", children: text }),
+      /* @__PURE__ */ jsx164(EuiText35, { css: valueStyle, children: value })
     ] })
   ] }) }) });
 };
@@ -54571,15 +54820,15 @@ import { EuiFlexGroup as EuiFlexGroup23, EuiFlexItem as EuiFlexItem30, EuiIcon a
 
 // src/components/WfoOptionalLink/WfoOptionalLink.tsx
 import Link5 from "next/link";
-import { jsx as jsx164 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx165 } from "@emotion/react/jsx-runtime";
 var WfoOptionalLink = ({
   children,
   href
 }) => {
   if (!href) {
-    return /* @__PURE__ */ jsx164("span", { children });
+    return /* @__PURE__ */ jsx165("span", { children });
   }
-  return /* @__PURE__ */ jsx164(Link5, { href, children });
+  return /* @__PURE__ */ jsx165(Link5, { href, children });
 };
 
 // src/components/WfoSummary/WfoSummaryCardList/styles.ts
@@ -54628,7 +54877,7 @@ var getWfoSummaryCardListStyles = (theme) => {
 };
 
 // src/components/WfoSummary/WfoSummaryCardList/WfoSummaryCardListItem.tsx
-import { jsx as jsx165, jsxs as jsxs94 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx166, jsxs as jsxs94 } from "@emotion/react/jsx-runtime";
 var WfoSummaryCardListItem = ({
   title,
   value,
@@ -54641,9 +54890,9 @@ var WfoSummaryCardListItem = ({
     listItemSubtitleStyle,
     listItemHighlightIconStyle
   } = getWfoSummaryCardListStyles(theme);
-  return /* @__PURE__ */ jsx165(WfoOptionalLink, { href: url, children: /* @__PURE__ */ jsxs94(EuiFlexGroup23, { css: listItemContainerStyle, gutterSize: "none", children: [
+  return /* @__PURE__ */ jsx166(WfoOptionalLink, { href: url, children: /* @__PURE__ */ jsxs94(EuiFlexGroup23, { css: listItemContainerStyle, gutterSize: "none", children: [
     /* @__PURE__ */ jsxs94(EuiFlexItem30, { children: [
-      /* @__PURE__ */ jsx165(
+      /* @__PURE__ */ jsx166(
         EuiTextColor,
         {
           color: url ? theme.colors.link : theme.colors.title,
@@ -54651,22 +54900,22 @@ var WfoSummaryCardListItem = ({
           children: title
         }
       ),
-      /* @__PURE__ */ jsx165(EuiTextColor, { css: listItemSubtitleStyle, children: value })
+      /* @__PURE__ */ jsx166(EuiTextColor, { css: listItemSubtitleStyle, children: value })
     ] }),
-    /* @__PURE__ */ jsx165(
+    /* @__PURE__ */ jsx166(
       EuiFlexItem30,
       {
         className: url ? "highlight-icon" : void 0,
         grow: false,
         css: listItemHighlightIconStyle,
-        children: /* @__PURE__ */ jsx165(EuiIcon5, { type: "sortRight", color: "primary" })
+        children: /* @__PURE__ */ jsx166(EuiIcon5, { type: "sortRight", color: "primary" })
       }
     )
   ] }) });
 };
 
 // src/components/WfoSummary/WfoSummaryCardList/WfoSummaryCardList.tsx
-import { jsx as jsx166, jsxs as jsxs95 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx167, jsxs as jsxs95 } from "@emotion/react/jsx-runtime";
 var WfoSummaryCardList = ({
   title,
   items,
@@ -54676,7 +54925,7 @@ var WfoSummaryCardList = ({
   const router = useRouter11();
   const euiScrollBarStyle = useEuiScrollBar2();
   const { listContainerStyle, listHeaderStyle, listStyle } = useWithOrchestratorTheme(getWfoSummaryCardListStyles);
-  return /* @__PURE__ */ jsx166(EuiFlexItem31, { children: /* @__PURE__ */ jsxs95(
+  return /* @__PURE__ */ jsx167(EuiFlexItem31, { children: /* @__PURE__ */ jsxs95(
     EuiPanel8,
     {
       css: listContainerStyle,
@@ -54685,10 +54934,10 @@ var WfoSummaryCardList = ({
       paddingSize: "l",
       children: [
         /* @__PURE__ */ jsxs95("div", { children: [
-          /* @__PURE__ */ jsx166("p", { css: listHeaderStyle, children: title }),
-          /* @__PURE__ */ jsx166(EuiSpacer18, { size: "m" }),
-          /* @__PURE__ */ jsx166(EuiSkeletonText, { isLoading, lines: 10, children: /* @__PURE__ */ jsx166("div", { css: [listStyle, euiScrollBarStyle], children: items == null ? void 0 : items.map((item, index) => /* @__PURE__ */ jsxs95("div", { children: [
-            /* @__PURE__ */ jsx166(
+          /* @__PURE__ */ jsx167("p", { css: listHeaderStyle, children: title }),
+          /* @__PURE__ */ jsx167(EuiSpacer18, { size: "m" }),
+          /* @__PURE__ */ jsx167(EuiSkeletonText, { isLoading, lines: 10, children: /* @__PURE__ */ jsx167("div", { css: [listStyle, euiScrollBarStyle], children: items == null ? void 0 : items.map((item, index) => /* @__PURE__ */ jsxs95("div", { children: [
+            /* @__PURE__ */ jsx167(
               WfoSummaryCardListItem,
               {
                 title: item.title,
@@ -54696,11 +54945,11 @@ var WfoSummaryCardList = ({
                 url: item.url
               }
             ),
-            index === items.length - 1 ? null : /* @__PURE__ */ jsx166(EuiHorizontalRule7, { margin: "none" })
+            index === items.length - 1 ? null : /* @__PURE__ */ jsx167(EuiHorizontalRule7, { margin: "none" })
           ] }, index)) }) })
         ] }),
-        /* @__PURE__ */ jsx166(EuiSpacer18, { size: "m" }),
-        button && /* @__PURE__ */ jsx166(
+        /* @__PURE__ */ jsx167(EuiSpacer18, { size: "m" }),
+        button && /* @__PURE__ */ jsx167(
           EuiButton13,
           {
             fullWidth: true,
@@ -54726,7 +54975,7 @@ var getWfoSummaryCardsStyles = (theme) => {
 };
 
 // src/components/WfoSummary/WfoSummaryCards.tsx
-import { jsx as jsx167, jsxs as jsxs96 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx168, jsxs as jsxs96 } from "@emotion/react/jsx-runtime";
 var WfoSummaryCards = ({ summaryCards }) => {
   const { theme } = useOrchestratorTheme();
   const { cardContainerStyle } = getWfoSummaryCardsStyles(theme);
@@ -54751,7 +55000,7 @@ var WfoSummaryCards = ({ summaryCards }) => {
         };
     }
   };
-  return /* @__PURE__ */ jsx167(
+  return /* @__PURE__ */ jsx168(
     EuiFlexGrid2,
     {
       responsive: false,
@@ -54767,7 +55016,7 @@ var WfoSummaryCards = ({ summaryCards }) => {
           button,
           isLoading
         }, index) => /* @__PURE__ */ jsxs96(EuiFlexItem32, { css: cardContainerStyle, children: [
-          /* @__PURE__ */ jsx167(
+          /* @__PURE__ */ jsx168(
             WfoSummaryCardHeader,
             __spreadValues({
               text: headerTitle,
@@ -54776,8 +55025,8 @@ var WfoSummaryCards = ({ summaryCards }) => {
               headerStatus
             ))
           ),
-          /* @__PURE__ */ jsx167(EuiSpacer19, { size: "m" }),
-          /* @__PURE__ */ jsx167(
+          /* @__PURE__ */ jsx168(EuiSpacer19, { size: "m" }),
+          /* @__PURE__ */ jsx168(
             WfoSummaryCardList,
             {
               title: listTitle,
@@ -54843,10 +55092,10 @@ var subscriptionListSummaryApi = orchestratorApi.injectEndpoints({
 var { useGetSubscriptionSummaryListQuery } = subscriptionListSummaryApi;
 
 // src/pages/startPage/WfoStartPage.tsx
-import { jsx as jsx168, jsxs as jsxs97 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx169, jsxs as jsxs97 } from "@emotion/react/jsx-runtime";
 var WfoStartPage = () => {
   var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k;
-  const t = useTranslations51("startPage");
+  const t = useTranslations52("startPage");
   const { isAllowed } = usePolicy();
   const {
     data: subscriptionsSummaryResult,
@@ -54958,8 +55207,8 @@ var WfoStartPage = () => {
             justifyContent: "space-between"
           },
           children: [
-            /* @__PURE__ */ jsx168("div", { children: product.name }),
-            /* @__PURE__ */ jsx168("div", { children: product.subscriptions.pageInfo.totalItems || 0 })
+            /* @__PURE__ */ jsx169("div", { children: product.name }),
+            /* @__PURE__ */ jsx169("div", { children: product.subscriptions.pageInfo.totalItems || 0 })
           ]
         }
       )
@@ -54976,7 +55225,7 @@ var WfoStartPage = () => {
     latestActiveSubscriptionsSummaryCard,
     productsSummaryCard
   ];
-  return /* @__PURE__ */ jsx168(EuiFlexItem33, { children: /* @__PURE__ */ jsx168(WfoSummaryCards, { summaryCards: allowedSummaryCards }) });
+  return /* @__PURE__ */ jsx169(EuiFlexItem33, { children: /* @__PURE__ */ jsx169(WfoSummaryCards, { summaryCards: allowedSummaryCards }) });
 };
 var subscriptionsListSummaryQueryVariables = {
   first: 5,
@@ -55064,16 +55313,16 @@ var productsSummaryQueryVariables = {
 
 // src/pages/subscriptions/WfoSubscriptionDetailPage.tsx
 import { useRouter as useRouter12 } from "next/router";
-import { Fragment as Fragment39, jsx as jsx169 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment40, jsx as jsx170 } from "@emotion/react/jsx-runtime";
 var WfoSubscriptionDetailPage = () => {
   const router = useRouter12();
   const { subscriptionId } = router.query;
-  return subscriptionId && /* @__PURE__ */ jsx169(TreeProvider, { children: /* @__PURE__ */ jsx169(WfoSubscription, { subscriptionId }) }) || /* @__PURE__ */ jsx169(Fragment39, {});
+  return subscriptionId && /* @__PURE__ */ jsx170(TreeProvider, { children: /* @__PURE__ */ jsx170(WfoSubscription, { subscriptionId }) }) || /* @__PURE__ */ jsx170(Fragment40, {});
 };
 
 // src/pages/subscriptions/WfoSubscriptionsListPage.tsx
-import { useEffect as useEffect24, useState as useState38 } from "react";
-import { useTranslations as useTranslations53 } from "next-intl";
+import { useEffect as useEffect25, useState as useState39 } from "react";
+import { useTranslations as useTranslations54 } from "next-intl";
 import { StringParam as StringParam3, useQueryParam as useQueryParam2, withDefault as withDefault3 } from "use-query-params";
 import { EuiPageHeader as EuiPageHeader4, EuiSpacer as EuiSpacer20 } from "@elastic/eui";
 
@@ -55156,7 +55405,7 @@ var subscriptionListTabs = [
 ];
 
 // src/components/WfoSubscriptionsList/WfoSubscriptionsList.tsx
-import { useTranslations as useTranslations52 } from "next-intl";
+import { useTranslations as useTranslations53 } from "next-intl";
 import Link6 from "next/link";
 import { useRouter as useRouter13 } from "next/router";
 
@@ -55228,7 +55477,7 @@ var subscriptionListApi = orchestratorApi.injectEndpoints({
 var { useGetSubscriptionListQuery, useLazyGetSubscriptionListQuery } = subscriptionListApi;
 
 // src/components/WfoSubscriptionsList/WfoSubscriptionsList.tsx
-import { jsx as jsx170 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx171 } from "@emotion/react/jsx-runtime";
 var WfoSubscriptionsList = ({
   alwaysOnFilters,
   dataDisplayParams,
@@ -55237,34 +55486,34 @@ var WfoSubscriptionsList = ({
 }) => {
   var _a, _b, _c;
   const router = useRouter13();
-  const t = useTranslations52("subscriptions.index");
-  const tError = useTranslations52("errors");
+  const t = useTranslations53("subscriptions.index");
+  const tError = useTranslations53("errors");
   const { showToastMessage } = useShowToastMessage();
   const tableColumns = {
     subscriptionId: {
       field: "subscriptionId",
       name: t("id"),
       width: "100",
-      render: (value) => /* @__PURE__ */ jsx170(WfoFirstPartUUID, { UUID: value }),
+      render: (value) => /* @__PURE__ */ jsx171(WfoFirstPartUUID, { UUID: value }),
       renderDetails: (value) => value
     },
     description: {
       field: "description",
       name: t("description"),
       width: "400",
-      render: (value, record) => /* @__PURE__ */ jsx170(Link6, { href: `/subscriptions/${record.subscriptionId}`, children: value })
+      render: (value, record) => /* @__PURE__ */ jsx171(Link6, { href: `/subscriptions/${record.subscriptionId}`, children: value })
     },
     status: {
       field: "status",
       name: t("status"),
       width: "110",
-      render: (value) => /* @__PURE__ */ jsx170(WfoSubscriptionStatusBadge, { status: value })
+      render: (value) => /* @__PURE__ */ jsx171(WfoSubscriptionStatusBadge, { status: value })
     },
     insync: {
       field: "insync",
       name: t("insync"),
       width: "110",
-      render: (value) => /* @__PURE__ */ jsx170(WfoInsyncIcon, { inSync: value })
+      render: (value) => /* @__PURE__ */ jsx171(WfoInsyncIcon, { inSync: value })
     },
     productName: {
       field: "productName",
@@ -55289,7 +55538,7 @@ var WfoSubscriptionsList = ({
       field: "startDate",
       name: t("startDate"),
       width: "150",
-      render: (value) => /* @__PURE__ */ jsx170(WfoDateTime, { dateOrIsoString: value }),
+      render: (value) => /* @__PURE__ */ jsx171(WfoDateTime, { dateOrIsoString: value }),
       renderDetails: parseDateToLocaleDateTimeString,
       clipboardText: parseDateToLocaleDateTimeString
     },
@@ -55297,7 +55546,7 @@ var WfoSubscriptionsList = ({
       field: "endDate",
       name: t("endDate"),
       width: "150",
-      render: (value) => /* @__PURE__ */ jsx170(WfoDateTime, { dateOrIsoString: value }),
+      render: (value) => /* @__PURE__ */ jsx171(WfoDateTime, { dateOrIsoString: value }),
       renderDetails: parseDateToLocaleDateTimeString,
       clipboardText: parseDateToLocaleDateTimeString
     },
@@ -55308,8 +55557,8 @@ var WfoSubscriptionsList = ({
     metadata: {
       field: "metadata",
       name: t("metadata"),
-      render: (value) => /* @__PURE__ */ jsx170(WfoInlineJson, { data: value }),
-      renderDetails: (value) => value && /* @__PURE__ */ jsx170(WfoJsonCodeBlock, { data: value, isBasicStyle: true })
+      render: (value) => /* @__PURE__ */ jsx171(WfoInlineJson, { data: value }),
+      renderDetails: (value) => value && /* @__PURE__ */ jsx171(WfoJsonCodeBlock, { data: value, isBasicStyle: true })
     }
   };
   const { sortBy, queryString, pageIndex, pageSize } = dataDisplayParams;
@@ -55343,7 +55592,7 @@ var WfoSubscriptionsList = ({
     pageSizeOptions: DEFAULT_PAGE_SIZES,
     totalItemCount: totalItems != null ? totalItems : 0
   };
-  return /* @__PURE__ */ jsx170(
+  return /* @__PURE__ */ jsx171(
     WfoTableWithFilter,
     {
       queryString: dataDisplayParams.queryString,
@@ -55384,15 +55633,15 @@ var WfoSubscriptionsList = ({
 };
 
 // src/pages/subscriptions/WfoSubscriptionsListPage.tsx
-import { Fragment as Fragment40, jsx as jsx171, jsxs as jsxs98 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment41, jsx as jsx172, jsxs as jsxs98 } from "@emotion/react/jsx-runtime";
 var WfoSubscriptionsListPage = () => {
   var _a;
-  const t = useTranslations53("subscriptions.detail");
-  const [tableDefaults, setTableDefaults] = useState38();
+  const t = useTranslations54("subscriptions.detail");
+  const [tableDefaults, setTableDefaults] = useState39();
   const getStoredTableConfig = useStoredTableConfig(
     SUBSCRIPTIONS_TABLE_LOCAL_STORAGE_KEY
   );
-  useEffect24(() => {
+  useEffect25(() => {
     const storedConfig = getStoredTableConfig();
     if (storedConfig) {
       setTableDefaults(storedConfig);
@@ -55424,11 +55673,11 @@ var WfoSubscriptionsListPage = () => {
   const alwaysOnFilters = (_a = subscriptionListTabs.find(
     ({ id }) => id === activeTab
   )) == null ? void 0 : _a.alwaysOnFilters;
-  return /* @__PURE__ */ jsxs98(Fragment40, { children: [
-    /* @__PURE__ */ jsx171(EuiSpacer20, {}),
-    /* @__PURE__ */ jsx171(EuiPageHeader4, { pageTitle: t("title") }),
-    /* @__PURE__ */ jsx171(EuiSpacer20, { size: "m" }),
-    /* @__PURE__ */ jsx171(
+  return /* @__PURE__ */ jsxs98(Fragment41, { children: [
+    /* @__PURE__ */ jsx172(EuiSpacer20, {}),
+    /* @__PURE__ */ jsx172(EuiPageHeader4, { pageTitle: t("title") }),
+    /* @__PURE__ */ jsx172(EuiSpacer20, { size: "m" }),
+    /* @__PURE__ */ jsx172(
       WfoFilterTabs,
       {
         tabs: subscriptionListTabs,
@@ -55437,8 +55686,8 @@ var WfoSubscriptionsListPage = () => {
         onChangeTab: handleChangeSubscriptionsTab
       }
     ),
-    /* @__PURE__ */ jsx171(EuiSpacer20, { size: "xxl" }),
-    /* @__PURE__ */ jsx171(
+    /* @__PURE__ */ jsx172(EuiSpacer20, { size: "xxl" }),
+    /* @__PURE__ */ jsx172(
       WfoSubscriptionsList,
       {
         hiddenColumns: tableDefaults == null ? void 0 : tableDefaults.hiddenColumns,
@@ -55451,8 +55700,8 @@ var WfoSubscriptionsListPage = () => {
 };
 
 // src/pages/tasks/WfoTasksListPage.tsx
-import { useContext as useContext14, useEffect as useEffect25, useState as useState39 } from "react";
-import { useTranslations as useTranslations54 } from "next-intl";
+import { useContext as useContext14, useEffect as useEffect26, useState as useState40 } from "react";
+import { useTranslations as useTranslations55 } from "next-intl";
 import Link7 from "next/link";
 import { useRouter as useRouter14 } from "next/router";
 import { StringParam as StringParam4, useQueryParam as useQueryParam3, withDefault as withDefault4 } from "use-query-params";
@@ -55527,16 +55776,16 @@ var getTasksListTabTypeFromString = (tabId) => {
 };
 
 // src/pages/tasks/WfoTasksListPage.tsx
-import { Fragment as Fragment41, jsx as jsx172, jsxs as jsxs99 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment42, jsx as jsx173, jsxs as jsxs99 } from "@emotion/react/jsx-runtime";
 var WfoTasksListPage = () => {
   var _a;
   const router = useRouter14();
-  const t = useTranslations54("tasks.page");
+  const t = useTranslations55("tasks.page");
   const [activeTab, setActiveTab] = useQueryParam3(
     "activeTab",
     withDefault4(StringParam4, "ACTIVE" /* ACTIVE */)
   );
-  const [tableDefaults, setTableDefaults] = useState39();
+  const [tableDefaults, setTableDefaults] = useState40();
   const selectedTasksListTab = getTasksListTabTypeFromString(activeTab);
   const localStorageKey = selectedTasksListTab === "ACTIVE" /* ACTIVE */ ? ACTIVE_TASKS_LIST_TABLE_LOCAL_STORAGE_KEY : COMPLETED_TASKS_LIST_TABLE_LOCAL_STORAGE_KEY;
   const getStoredTableConfig = useStoredTableConfig(localStorageKey);
@@ -55544,7 +55793,7 @@ var WfoTasksListPage = () => {
   const { showConfirmDialog } = useContext14(ConfirmationDialogContext);
   const { retryAllProcesses } = useMutateProcess();
   const { isEngineRunningNow } = useCheckEngineStatus();
-  useEffect25(() => {
+  useEffect26(() => {
     const storedConfig = getStoredTableConfig();
     if (storedConfig) {
       setTableDefaults(storedConfig);
@@ -55584,7 +55833,7 @@ var WfoTasksListPage = () => {
     workflowName: {
       field: "workflowName",
       name: t("taskName"),
-      render: (value, { processId }) => /* @__PURE__ */ jsx172(Link7, { href: `${PATH_TASKS}/${processId}`, children: value })
+      render: (value, { processId }) => /* @__PURE__ */ jsx173(Link7, { href: `${PATH_TASKS}/${processId}`, children: value })
     },
     lastStep: defaultTableColumns.lastStep,
     lastStatus: defaultTableColumns.lastStatus,
@@ -55600,21 +55849,21 @@ var WfoTasksListPage = () => {
     startedAt: defaultTableColumns.startedAt,
     lastModifiedAt: defaultTableColumns.lastModifiedAt
   });
-  return /* @__PURE__ */ jsxs99(Fragment41, { children: [
-    /* @__PURE__ */ jsx172(EuiSpacer21, {}),
+  return /* @__PURE__ */ jsxs99(Fragment42, { children: [
+    /* @__PURE__ */ jsx173(EuiSpacer21, {}),
     /* @__PURE__ */ jsxs99(EuiFlexGroup24, { children: [
-      /* @__PURE__ */ jsx172(EuiFlexItem34, { children: /* @__PURE__ */ jsx172(EuiPageHeader5, { pageTitle: "Tasks" }) }),
-      /* @__PURE__ */ jsx172(EuiFlexItem34, { children: /* @__PURE__ */ jsxs99(EuiFlexGroup24, { justifyContent: "flexEnd", children: [
+      /* @__PURE__ */ jsx173(EuiFlexItem34, { children: /* @__PURE__ */ jsx173(EuiPageHeader5, { pageTitle: "Tasks" }) }),
+      /* @__PURE__ */ jsx173(EuiFlexItem34, { children: /* @__PURE__ */ jsxs99(EuiFlexGroup24, { justifyContent: "flexEnd", children: [
         " ",
-        /* @__PURE__ */ jsx172(
+        /* @__PURE__ */ jsx173(
           WfoIsAllowedToRender,
           {
             resource: "/orchestrator/processes/all-tasks/retry" /* TASKS_RETRY_ALL */,
-            children: /* @__PURE__ */ jsx172(
+            children: /* @__PURE__ */ jsx173(
               EuiButton14,
               {
                 onClick: handleRerunAllButtonClick,
-                iconType: () => /* @__PURE__ */ jsx172(
+                iconType: () => /* @__PURE__ */ jsx173(
                   WfoRefresh,
                   {
                     color: theme.colors.primaryText
@@ -55625,16 +55874,16 @@ var WfoTasksListPage = () => {
             )
           }
         ),
-        /* @__PURE__ */ jsx172(
+        /* @__PURE__ */ jsx173(
           WfoIsAllowedToRender,
           {
             resource: "/orchestrator/processes/create/task" /* TASKS_CREATE */,
-            children: /* @__PURE__ */ jsx172(WfoStartTaskButtonComboBox, {})
+            children: /* @__PURE__ */ jsx173(WfoStartTaskButtonComboBox, {})
           }
         )
       ] }) })
     ] }),
-    /* @__PURE__ */ jsx172(
+    /* @__PURE__ */ jsx173(
       WfoFilterTabs,
       {
         tabs: defaultTasksListTabs,
@@ -55643,8 +55892,8 @@ var WfoTasksListPage = () => {
         onChangeTab: handleChangeTasksListTab
       }
     ),
-    /* @__PURE__ */ jsx172(EuiSpacer21, { size: "xxl" }),
-    /* @__PURE__ */ jsx172(
+    /* @__PURE__ */ jsx173(EuiSpacer21, { size: "xxl" }),
+    /* @__PURE__ */ jsx173(
       WfoProcessesList,
       {
         defaultHiddenColumns: tableDefaults == null ? void 0 : tableDefaults.hiddenColumns,
@@ -55659,8 +55908,8 @@ var WfoTasksListPage = () => {
 };
 
 // src/pages/workflows/WfoWorkflowsListPage.tsx
-import { useEffect as useEffect26, useState as useState40 } from "react";
-import { useTranslations as useTranslations55 } from "next-intl";
+import { useEffect as useEffect27, useState as useState41 } from "react";
+import { useTranslations as useTranslations56 } from "next-intl";
 import { useRouter as useRouter15 } from "next/router";
 import { StringParam as StringParam5, useQueryParam as useQueryParam4, withDefault as withDefault5 } from "use-query-params";
 import { EuiPageHeader as EuiPageHeader6, EuiSpacer as EuiSpacer22 } from "@elastic/eui";
@@ -55728,20 +55977,20 @@ var getWorkflowsListTabTypeFromString = (tabId) => {
 };
 
 // src/pages/workflows/WfoWorkflowsListPage.tsx
-import { Fragment as Fragment42, jsx as jsx173, jsxs as jsxs100 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment43, jsx as jsx174, jsxs as jsxs100 } from "@emotion/react/jsx-runtime";
 var WfoWorkflowsListPage = () => {
   var _a;
   const router = useRouter15();
-  const t = useTranslations55("workflows.index");
+  const t = useTranslations56("workflows.index");
   const [activeTab, setActiveTab] = useQueryParam4(
     "activeTab",
     withDefault5(StringParam5, "ACTIVE" /* ACTIVE */)
   );
-  const [tableDefaults, setTableDefaults] = useState40();
+  const [tableDefaults, setTableDefaults] = useState41();
   const selectedWorkflowsListTab = getWorkflowsListTabTypeFromString(activeTab);
   const localStorageKey = selectedWorkflowsListTab === "ACTIVE" /* ACTIVE */ ? ACTIVE_PROCESSES_LIST_TABLE_LOCAL_STORAGE_KEY : COMPLETED_PROCESSES_LIST_TABLE_LOCAL_STORAGE_KEY;
   const getStoredTableConfig = useStoredTableConfig(localStorageKey);
-  useEffect26(() => {
+  useEffect27(() => {
     const storedConfig = getStoredTableConfig();
     if (storedConfig) {
       setTableDefaults(storedConfig);
@@ -55767,11 +56016,11 @@ var WfoWorkflowsListPage = () => {
     router.replace(PATH_WORKFLOWS);
     return null;
   }
-  return /* @__PURE__ */ jsxs100(Fragment42, { children: [
-    /* @__PURE__ */ jsx173(EuiSpacer22, {}),
-    /* @__PURE__ */ jsx173(EuiPageHeader6, { pageTitle: t("title") }),
-    /* @__PURE__ */ jsx173(EuiSpacer22, { size: "m" }),
-    /* @__PURE__ */ jsx173(
+  return /* @__PURE__ */ jsxs100(Fragment43, { children: [
+    /* @__PURE__ */ jsx174(EuiSpacer22, {}),
+    /* @__PURE__ */ jsx174(EuiPageHeader6, { pageTitle: t("title") }),
+    /* @__PURE__ */ jsx174(EuiSpacer22, { size: "m" }),
+    /* @__PURE__ */ jsx174(
       WfoFilterTabs,
       {
         tabs: defaultWorkflowsListTabs,
@@ -55780,8 +56029,8 @@ var WfoWorkflowsListPage = () => {
         onChangeTab: handleChangeWorkflowsListTab
       }
     ),
-    /* @__PURE__ */ jsx173(EuiSpacer22, { size: "xxl" }),
-    /* @__PURE__ */ jsx173(
+    /* @__PURE__ */ jsx174(EuiSpacer22, { size: "xxl" }),
+    /* @__PURE__ */ jsx174(
       WfoProcessesList,
       {
         alwaysOnFilters,
@@ -55891,7 +56140,7 @@ var graphQlProcessFilterMapper = (data) => data == null ? void 0 : data.map(({ f
 }));
 
 // src/components/WfoProcessList/WfoProcessesList.tsx
-import { jsx as jsx174 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx175 } from "@emotion/react/jsx-runtime";
 var WfoProcessesList = ({
   alwaysOnFilters,
   defaultHiddenColumns = [],
@@ -55901,15 +56150,15 @@ var WfoProcessesList = ({
   overrideDefaultTableColumns
 }) => {
   var _a, _b;
-  const t = useTranslations56("processes.index");
-  const tError = useTranslations56("errors");
+  const t = useTranslations57("processes.index");
+  const tError = useTranslations57("errors");
   const { showToastMessage } = useShowToastMessage();
   const defaultTableColumns = {
     workflowName: {
       field: "workflowName",
       name: t("workflowName"),
       width: "20%",
-      render: (value, { processId }) => /* @__PURE__ */ jsx174(Link8, { href: `${PATH_WORKFLOWS}/${processId}`, children: value })
+      render: (value, { processId }) => /* @__PURE__ */ jsx175(Link8, { href: `${PATH_WORKFLOWS}/${processId}`, children: value })
     },
     lastStep: {
       field: "lastStep",
@@ -55920,13 +56169,13 @@ var WfoProcessesList = ({
       field: "lastStatus",
       name: t("status"),
       width: "100",
-      render: (cellValue) => /* @__PURE__ */ jsx174(WfoProcessStatusBadge, { processStatus: cellValue })
+      render: (cellValue) => /* @__PURE__ */ jsx175(WfoProcessStatusBadge, { processStatus: cellValue })
     },
     workflowTarget: {
       field: "workflowTarget",
       name: t("workflowTarget"),
       width: "100",
-      render: (target) => /* @__PURE__ */ jsx174(WfoWorkflowTargetBadge, { target })
+      render: (target) => /* @__PURE__ */ jsx175(WfoWorkflowTargetBadge, { target })
     },
     tag: {
       field: "tag",
@@ -55952,14 +56201,14 @@ var WfoProcessesList = ({
       field: "subscriptions",
       name: t("subscriptions"),
       width: "15%",
-      render: ({ page: subscriptions }) => /* @__PURE__ */ jsx174(
+      render: ({ page: subscriptions }) => /* @__PURE__ */ jsx175(
         WfoProcessListSubscriptionsCell,
         {
           subscriptions,
           numberOfSubscriptionsToRender: 1
         }
       ),
-      renderDetails: ({ page: subscriptions }) => /* @__PURE__ */ jsx174(
+      renderDetails: ({ page: subscriptions }) => /* @__PURE__ */ jsx175(
         WfoProcessListSubscriptionsCell,
         {
           subscriptions
@@ -55981,14 +56230,14 @@ var WfoProcessesList = ({
       field: "processId",
       name: t("processId"),
       width: "90",
-      render: (value) => /* @__PURE__ */ jsx174(WfoFirstPartUUID, { UUID: value }),
+      render: (value) => /* @__PURE__ */ jsx175(WfoFirstPartUUID, { UUID: value }),
       renderDetails: (value) => value
     },
     startedAt: {
       field: "startedAt",
       name: t("started"),
       width: "100",
-      render: (value) => /* @__PURE__ */ jsx174(WfoDateTime, { dateOrIsoString: value }),
+      render: (value) => /* @__PURE__ */ jsx175(WfoDateTime, { dateOrIsoString: value }),
       renderDetails: parseDateToLocaleDateTimeString,
       clipboardText: parseDateToLocaleDateTimeString
     },
@@ -55996,7 +56245,7 @@ var WfoProcessesList = ({
       field: "lastModifiedAt",
       name: t("lastModified"),
       width: "100",
-      render: (value) => /* @__PURE__ */ jsx174(WfoDateTime, { dateOrIsoString: value }),
+      render: (value) => /* @__PURE__ */ jsx175(WfoDateTime, { dateOrIsoString: value }),
       renderDetails: parseDateToLocaleDateTimeString,
       clipboardText: parseDateToLocaleDateTimeString
     }
@@ -56026,7 +56275,7 @@ var WfoProcessesList = ({
   const getProcessListForExport = () => getProcessListTrigger(
     getQueryVariablesForExport(processListQueryVars)
   ).unwrap();
-  return /* @__PURE__ */ jsx174(
+  return /* @__PURE__ */ jsx175(
     WfoTableWithFilter,
     {
       queryString,
@@ -56090,14 +56339,14 @@ var getStyles13 = (theme) => {
 };
 
 // src/components/WfoJsonCodeBlock/WfoJsonCodeBlock.tsx
-import { jsx as jsx175 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx176 } from "@emotion/react/jsx-runtime";
 var WfoJsonCodeBlock = ({
   data,
   isBasicStyle = false
 }) => {
   const { euiCodeBlockStyle, euiBasicCodeBlockStyle } = useWithOrchestratorTheme(getStyles13);
   const json = JSON.stringify(data, null, 4);
-  return /* @__PURE__ */ jsx175(
+  return /* @__PURE__ */ jsx176(
     EuiCodeBlock2,
     {
       css: isBasicStyle ? euiBasicCodeBlockStyle : euiCodeBlockStyle,
@@ -56110,8 +56359,8 @@ var WfoJsonCodeBlock = ({
 };
 
 // src/components/WfoSettings/WfoFlushSettings.tsx
-import { useState as useState41 } from "react";
-import { useTranslations as useTranslations57 } from "next-intl";
+import { useState as useState42 } from "react";
+import { useTranslations as useTranslations58 } from "next-intl";
 import {
   EuiButton as EuiButton15,
   EuiComboBox,
@@ -56119,11 +56368,11 @@ import {
   EuiSpacer as EuiSpacer23,
   EuiText as EuiText36
 } from "@elastic/eui";
-import { jsx as jsx176, jsxs as jsxs101 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx177, jsxs as jsxs101 } from "@emotion/react/jsx-runtime";
 var WfoFlushSettings = () => {
   const [clearCache] = useClearCacheMutation();
-  const t = useTranslations57("settings.page");
-  const [selectedOptions, setSelected] = useState41(
+  const t = useTranslations58("settings.page");
+  const [selectedOptions, setSelected] = useState42(
     []
   );
   const { showToastMessage } = useShowToastMessage();
@@ -56162,9 +56411,9 @@ var WfoFlushSettings = () => {
       paddingSize: "l",
       style: { width: "50%" },
       children: [
-        /* @__PURE__ */ jsx176(EuiText36, { size: "s", children: /* @__PURE__ */ jsx176("h4", { children: t("flushCacheSettingsTitle") }) }),
-        /* @__PURE__ */ jsx176(EuiSpacer23, { size: "m" }),
-        /* @__PURE__ */ jsx176(
+        /* @__PURE__ */ jsx177(EuiText36, { size: "s", children: /* @__PURE__ */ jsx177("h4", { children: t("flushCacheSettingsTitle") }) }),
+        /* @__PURE__ */ jsx177(EuiSpacer23, { size: "m" }),
+        /* @__PURE__ */ jsx177(
           EuiComboBox,
           {
             "aria-label": "Flush settings",
@@ -56176,26 +56425,26 @@ var WfoFlushSettings = () => {
             fullWidth: true
           }
         ),
-        /* @__PURE__ */ jsx176(EuiSpacer23, { size: "m" }),
-        /* @__PURE__ */ jsx176(EuiButton15, { onClick: flushCache, iconType: "refresh", children: t("flushButton") })
+        /* @__PURE__ */ jsx177(EuiSpacer23, { size: "m" }),
+        /* @__PURE__ */ jsx177(EuiButton15, { onClick: flushCache, iconType: "refresh", children: t("flushButton") })
       ]
     }
   );
 };
 
 // src/components/WfoSettings/WfoEngineStatusButton.tsx
-import { useTranslations as useTranslations58 } from "next-intl";
+import { useTranslations as useTranslations59 } from "next-intl";
 import { EuiButton as EuiButton16 } from "@elastic/eui";
-import { jsx as jsx177 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx178 } from "@emotion/react/jsx-runtime";
 var WfoEngineStatusButton = () => {
   const { data, isLoading } = useGetEngineStatusQuery();
   const { engineStatus } = data || {};
   const [setEngineStatus, { isLoading: isSettingEngineStatus }] = useSetEngineStatusMutation();
-  const t = useTranslations58("settings.page");
+  const t = useTranslations59("settings.page");
   if (isLoading || isSettingEngineStatus) {
-    return /* @__PURE__ */ jsx177(EuiButton16, { isLoading: true, fill: true, children: "Loading..." });
+    return /* @__PURE__ */ jsx178(EuiButton16, { isLoading: true, fill: true, children: "Loading..." });
   }
-  return engineStatus === "RUNNING" /* RUNNING */ ? /* @__PURE__ */ jsx177(
+  return engineStatus === "RUNNING" /* RUNNING */ ? /* @__PURE__ */ jsx178(
     EuiButton16,
     {
       onClick: () => setEngineStatus(true),
@@ -56204,7 +56453,7 @@ var WfoEngineStatusButton = () => {
       iconType: "pause",
       children: t("pauseEngine")
     }
-  ) : /* @__PURE__ */ jsx177(
+  ) : /* @__PURE__ */ jsx178(
     EuiButton16,
     {
       onClick: () => setEngineStatus(false),
@@ -56217,17 +56466,17 @@ var WfoEngineStatusButton = () => {
 };
 
 // src/components/WfoSettings/WfoModifySettings.tsx
-import { useTranslations as useTranslations60 } from "next-intl";
+import { useTranslations as useTranslations61 } from "next-intl";
 import { EuiFlexItem as EuiFlexItem35, EuiPanel as EuiPanel10, EuiSpacer as EuiSpacer24, EuiText as EuiText37 } from "@elastic/eui";
 
 // src/components/WfoSettings/WfoResetTextSearchIndexButton.tsx
-import { useTranslations as useTranslations59 } from "next-intl";
+import { useTranslations as useTranslations60 } from "next-intl";
 import { EuiButton as EuiButton17 } from "@elastic/eui";
-import { jsx as jsx178 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx179 } from "@emotion/react/jsx-runtime";
 var WfoResetTextSearchIndexButton = () => {
   const [resetTextSearchIndex] = useResetTextSearchIndexMutation();
-  const t = useTranslations59("settings.page");
-  return /* @__PURE__ */ jsx178(
+  const t = useTranslations60("settings.page");
+  return /* @__PURE__ */ jsx179(
     EuiButton17,
     {
       onClick: () => resetTextSearchIndex(null),
@@ -56238,9 +56487,9 @@ var WfoResetTextSearchIndexButton = () => {
 };
 
 // src/components/WfoSettings/WfoModifySettings.tsx
-import { jsx as jsx179, jsxs as jsxs102 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx180, jsxs as jsxs102 } from "@emotion/react/jsx-runtime";
 var WfoModifySettings = () => {
-  const t = useTranslations60("settings.page");
+  const t = useTranslations61("settings.page");
   return /* @__PURE__ */ jsxs102(EuiFlexItem35, { children: [
     /* @__PURE__ */ jsxs102(
       EuiPanel10,
@@ -56250,13 +56499,13 @@ var WfoModifySettings = () => {
         paddingSize: "l",
         css: { width: "50%" },
         children: [
-          /* @__PURE__ */ jsx179(EuiText37, { size: "s", children: /* @__PURE__ */ jsx179("h4", { children: t("resetTextSearchIndex") }) }),
-          /* @__PURE__ */ jsx179(EuiSpacer24, { size: "m" }),
-          /* @__PURE__ */ jsx179(WfoResetTextSearchIndexButton, {})
+          /* @__PURE__ */ jsx180(EuiText37, { size: "s", children: /* @__PURE__ */ jsx180("h4", { children: t("resetTextSearchIndex") }) }),
+          /* @__PURE__ */ jsx180(EuiSpacer24, { size: "m" }),
+          /* @__PURE__ */ jsx180(WfoResetTextSearchIndexButton, {})
         ]
       }
     ),
-    /* @__PURE__ */ jsx179(EuiSpacer24, {}),
+    /* @__PURE__ */ jsx180(EuiSpacer24, {}),
     /* @__PURE__ */ jsxs102(
       EuiPanel10,
       {
@@ -56265,9 +56514,9 @@ var WfoModifySettings = () => {
         paddingSize: "l",
         css: { width: "50%" },
         children: [
-          /* @__PURE__ */ jsx179(EuiText37, { size: "s", children: /* @__PURE__ */ jsx179("h4", { children: t("modifyEngine") }) }),
-          /* @__PURE__ */ jsx179(EuiSpacer24, { size: "m" }),
-          /* @__PURE__ */ jsx179(WfoEngineStatusButton, {})
+          /* @__PURE__ */ jsx180(EuiText37, { size: "s", children: /* @__PURE__ */ jsx180("h4", { children: t("modifyEngine") }) }),
+          /* @__PURE__ */ jsx180(EuiSpacer24, { size: "m" }),
+          /* @__PURE__ */ jsx180(WfoEngineStatusButton, {})
         ]
       }
     )
@@ -56275,7 +56524,7 @@ var WfoModifySettings = () => {
 };
 
 // src/components/WfoSettings/WfoStatus.tsx
-import { useTranslations as useTranslations61 } from "next-intl";
+import { useTranslations as useTranslations62 } from "next-intl";
 import {
   EuiFlexGroup as EuiFlexGroup25,
   EuiFlexItem as EuiFlexItem36,
@@ -56283,13 +56532,13 @@ import {
   EuiSpacer as EuiSpacer25,
   EuiText as EuiText38
 } from "@elastic/eui";
-import { jsx as jsx180, jsxs as jsxs103 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx181, jsxs as jsxs103 } from "@emotion/react/jsx-runtime";
 var WfoStatus = () => {
   const { theme } = useOrchestratorTheme();
   const { data } = useGetEngineStatusQuery();
   const { engineStatus, runningProcesses } = data || {};
   const isRunning = engineStatus === "RUNNING" /* RUNNING */;
-  const t = useTranslations61("settings.page");
+  const t = useTranslations62("settings.page");
   return /* @__PURE__ */ jsxs103(
     EuiPanel11,
     {
@@ -56299,20 +56548,20 @@ var WfoStatus = () => {
       style: { width: "50%" },
       children: [
         /* @__PURE__ */ jsxs103(EuiFlexGroup25, { children: [
-          /* @__PURE__ */ jsx180(EuiFlexItem36, { grow: false, style: { minWidth: 208 }, children: /* @__PURE__ */ jsx180(EuiText38, { size: "s", children: /* @__PURE__ */ jsx180("h4", { children: t("runningProcesses") }) }) }),
-          /* @__PURE__ */ jsx180(EuiFlexItem36, { grow: false, children: /* @__PURE__ */ jsx180(EuiText38, { size: "s", children: /* @__PURE__ */ jsx180("p", { children: runningProcesses || "-" }) }) })
+          /* @__PURE__ */ jsx181(EuiFlexItem36, { grow: false, style: { minWidth: 208 }, children: /* @__PURE__ */ jsx181(EuiText38, { size: "s", children: /* @__PURE__ */ jsx181("h4", { children: t("runningProcesses") }) }) }),
+          /* @__PURE__ */ jsx181(EuiFlexItem36, { grow: false, children: /* @__PURE__ */ jsx181(EuiText38, { size: "s", children: /* @__PURE__ */ jsx181("p", { children: runningProcesses || "-" }) }) })
         ] }),
-        /* @__PURE__ */ jsx180(EuiSpacer25, { size: "m" }),
+        /* @__PURE__ */ jsx181(EuiSpacer25, { size: "m" }),
         /* @__PURE__ */ jsxs103(EuiFlexGroup25, { children: [
-          /* @__PURE__ */ jsx180(EuiFlexItem36, { grow: false, style: { minWidth: 200 }, children: /* @__PURE__ */ jsx180(EuiText38, { size: "s", children: /* @__PURE__ */ jsx180("h4", { children: t("engineStatus") }) }) }),
-          /* @__PURE__ */ jsx180(EuiFlexItem36, { grow: false, children: /* @__PURE__ */ jsxs103(EuiFlexGroup25, { gutterSize: "xs", children: [
-            /* @__PURE__ */ jsx180(EuiFlexItem36, { children: /* @__PURE__ */ jsx180(
+          /* @__PURE__ */ jsx181(EuiFlexItem36, { grow: false, style: { minWidth: 200 }, children: /* @__PURE__ */ jsx181(EuiText38, { size: "s", children: /* @__PURE__ */ jsx181("h4", { children: t("engineStatus") }) }) }),
+          /* @__PURE__ */ jsx181(EuiFlexItem36, { grow: false, children: /* @__PURE__ */ jsxs103(EuiFlexGroup25, { gutterSize: "xs", children: [
+            /* @__PURE__ */ jsx181(EuiFlexItem36, { children: /* @__PURE__ */ jsx181(
               WfoStatusDotIcon,
               {
                 color: isRunning ? theme.colors.success : theme.colors.warning
               }
             ) }),
-            /* @__PURE__ */ jsx180(EuiFlexItem36, { children: /* @__PURE__ */ jsx180(EuiText38, { size: "xs", style: { marginTop: 4 }, children: /* @__PURE__ */ jsx180("p", { children: engineStatus }) }) })
+            /* @__PURE__ */ jsx181(EuiFlexItem36, { children: /* @__PURE__ */ jsx181(EuiText38, { size: "xs", style: { marginTop: 4 }, children: /* @__PURE__ */ jsx181("p", { children: engineStatus }) }) })
           ] }) })
         ] })
       ]
@@ -56321,9 +56570,9 @@ var WfoStatus = () => {
 };
 
 // src/components/WfoErrorBoundary/WfoErrorBoundary.tsx
-import React57 from "react";
-import { jsx as jsx181, jsxs as jsxs104 } from "@emotion/react/jsx-runtime";
-var WfoErrorBoundary = class extends React57.Component {
+import React58 from "react";
+import { jsx as jsx182, jsxs as jsxs104 } from "@emotion/react/jsx-runtime";
+var WfoErrorBoundary = class extends React58.Component {
   constructor(props) {
     super(props);
     this.state = { hasError: false };
@@ -56342,7 +56591,7 @@ var WfoErrorBoundary = class extends React57.Component {
       return /* @__PURE__ */ jsxs104("p", { children: [
         "An unexpected error occurred, try to go back to the",
         " ",
-        /* @__PURE__ */ jsx181("a", { href: "/", children: "home page" })
+        /* @__PURE__ */ jsx182("a", { href: "/", children: "home page" })
       ] });
     }
     return this.props.children;
@@ -56386,12 +56635,12 @@ var WfoNoResults = ({ text, icon }) => {
 };
 
 // src/components/WfoStartButton/WfoStartTaskComboBox.tsx
-import { useTranslations as useTranslations62 } from "next-intl";
+import { useTranslations as useTranslations63 } from "next-intl";
 import { useRouter as useRouter16 } from "next/router";
-import { jsx as jsx182 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx183 } from "@emotion/react/jsx-runtime";
 var WfoStartTaskButtonComboBox = () => {
   const router = useRouter16();
-  const t = useTranslations62("common");
+  const t = useTranslations63("common");
   const { isEngineRunningNow } = useCheckEngineStatus();
   const { data } = useGetTaskOptionsQuery();
   const taskOptions = (data == null ? void 0 : data.startOptions) || [];
@@ -56411,7 +56660,7 @@ var WfoStartTaskButtonComboBox = () => {
       });
     }
   });
-  return /* @__PURE__ */ jsx182(
+  return /* @__PURE__ */ jsx183(
     WfoStartButtonComboBox,
     {
       buttonText: t("newTask"),
@@ -56433,6 +56682,7 @@ var en_GB_default = {
     metadataProductblocks: "Product blocks",
     metadataResourceTypes: "Resource types",
     metadataWorkflows: "Workflows",
+    metadataTasks: "Tasks",
     mobileTitle: "Main menu",
     settings: "Settings",
     start: "Start",
@@ -56554,7 +56804,8 @@ var en_GB_default = {
       products: "Products",
       productBlocks: "Product blocks",
       resourceTypes: "Resource types",
-      workflows: "Workflows"
+      workflows: "Workflows",
+      tasks: "Tasks"
     },
     products: {
       id: "ID",
@@ -56591,6 +56842,13 @@ var en_GB_default = {
       target: "Target",
       productTags: "Product tags",
       createdAt: "Created"
+    },
+    tasks: {
+      name: "Task",
+      description: "Task description",
+      target: "Target",
+      productTags: "Product tags",
+      createdAt: "Created"
     }
   },
   processes: {
@@ -56820,6 +57078,7 @@ var nl_NL_default = {
     metadataProductblocks: "Product blocks",
     metadataResourceTypes: "Resource types",
     metadataWorkflows: "Workflows",
+    metadataTasks: "Taken",
     mobileTitle: "Hoofdmenu",
     settings: "Settings",
     start: "Start",
@@ -56940,7 +57199,8 @@ var nl_NL_default = {
       products: "Producten",
       productBlocks: "Product blocks",
       resourceTypes: "Resource types",
-      workflows: "Workflows"
+      workflows: "Workflows",
+      tasks: "Taken"
     },
     products: {
       id: "ID",
@@ -56977,6 +57237,13 @@ var nl_NL_default = {
       target: "Target",
       productTags: "Product tags",
       createdAt: "Aangemaakt"
+    },
+    tasks: {
+      name: "Taak",
+      description: "Taak beschrijving",
+      target: "Target",
+      productTags: "Product tags",
+      createdAt: "Aangemaakt"
     }
   },
   processes: {
@@ -57362,6 +57629,7 @@ export {
   METADATA_PRODUCT_BLOCKS_TABLE_LOCAL_STORAGE_KEY,
   METADATA_PRODUCT_TABLE_LOCAL_STORAGE_KEY,
   METADATA_RESOURCE_TYPES_TABLE_LOCAL_STORAGE_KEY,
+  METADATA_TASKS_TABLE_LOCAL_STORAGE_KEY,
   METADATA_WORKFLOWS_TABLE_LOCAL_STORAGE_KEY,
   NUMBER_OF_ITEMS_REPRESENTING_ALL_ITEMS,
   NestField,
@@ -57373,6 +57641,7 @@ export {
   PATH_METADATA_PRODUCTS,
   PATH_METADATA_PRODUCT_BLOCKS,
   PATH_METADATA_RESOURCE_TYPES,
+  PATH_METADATA_TASKS,
   PATH_METADATA_WORKFLOWS,
   PATH_SETTINGS,
   PATH_START,
@@ -57529,6 +57798,7 @@ export {
   WfoTableWithFilter,
   WfoTasksListPage,
   WfoTasksListTabType,
+  WfoTasksPage,
   WfoTextAnchor,
   WfoTimeline,
   WfoToastsList,
@@ -57631,6 +57901,7 @@ export {
   subscriptionDetailQuery,
   subscriptionListTabs,
   subscriptionsDropdownOptionsQuery,
+  tasksQuery,
   toastMessagesReducer,
   toastMessagesSlice,
   upperCaseFirstChar,
@@ -57652,6 +57923,7 @@ export {
   useGetSubscriptionDetailQuery,
   useGetSubscriptionsDropdownOptionsQuery,
   useGetTaskOptionsQuery,
+  useGetTasksQuery,
   useGetTimeLineItemsQuery,
   useGetTranslationMessages,
   useGetWorkflowOptionsQuery,
@@ -57660,6 +57932,7 @@ export {
   useLazyGetProductBlocksQuery,
   useLazyGetProductsQuery,
   useLazyGetResourceTypesQuery,
+  useLazyGetTasksQuery,
   useLazyGetWorkflowsQuery,
   useMutateProcess,
   useOrchestratorConfig,