@orchestrator-ui/orchestrator-ui-components 5.7.1 → 5.8.1

package/dist/index.js

@@ -241,7 +241,7 @@ var require_xlink = __commonJS({
         xLinkType: null
       }
     });
-    function xlinkTransform(_2, prop2) {
+    function xlinkTransform(_5, prop2) {
       return "xlink:" + prop2.slice(5).toLowerCase();
     }
   }
@@ -261,7 +261,7 @@ var require_xml = __commonJS({
         xmlSpace: null
       }
     });
-    function xmlTransform(_2, prop2) {
+    function xmlTransform(_5, prop2) {
       return "xml:" + prop2.slice(3).toLowerCase();
     }
   }
@@ -373,7 +373,7 @@ var require_aria = __commonJS({
         role: null
       }
     });
-    function ariaTransform(_2, prop2) {
+    function ariaTransform(_5, prop2) {
       return prop2 === "role" ? prop2 : "aria-" + prop2.slice(4).toLowerCase();
     }
   }
@@ -3835,7 +3835,7 @@ var require_prism_core = __commonJS({
       var lang = /(?:^|\s)lang(?:uage)?-([\w-]+)(?=\s|$)/i;
       var uniqueId = 0;
       var plainTextGrammar = {};
-      var _2 = {
+      var _5 = {
         /**
          * By default, Prism will attempt to highlight all code elements (by calling {@link Prism.highlightAll}) on the
          * current page after the page finished loading. This might be a problem if e.g. you wanted to asynchronously load
@@ -3944,9 +3944,9 @@ var require_prism_core = __commonJS({
             visited = visited || {};
             var clone;
             var id;
-            switch (_2.util.type(o)) {
+            switch (_5.util.type(o)) {
               case "Object":
-                id = _2.util.objId(o);
+                id = _5.util.objId(o);
                 if (visited[id]) {
                   return visited[id];
                 }
@@ -3963,7 +3963,7 @@ var require_prism_core = __commonJS({
                   clone
                 );
               case "Array":
-                id = _2.util.objId(o);
+                id = _5.util.objId(o);
                 if (visited[id]) {
                   return visited[id];
                 }
@@ -4121,7 +4121,7 @@ var require_prism_core = __commonJS({
            * });
            */
           extend: function(id, redef) {
-            var lang2 = _2.util.clone(_2.languages[id]);
+            var lang2 = _5.util.clone(_5.languages[id]);
             for (var key in redef) {
               lang2[key] = redef[key];
             }
@@ -4204,7 +4204,7 @@ var require_prism_core = __commonJS({
            */
           insertBefore: function(inside, before, insert2, root) {
             root = root || /** @type {any} */
-            _2.languages;
+            _5.languages;
             var grammar = root[inside];
             var ret = {};
             for (var token in grammar) {
@@ -4223,7 +4223,7 @@ var require_prism_core = __commonJS({
             }
             var old = root[inside];
             root[inside] = ret;
-            _2.languages.DFS(_2.languages, function(key, value) {
+            _5.languages.DFS(_5.languages, function(key, value) {
               if (value === old && key != inside) {
                 this[key] = ret;
               }
@@ -4233,12 +4233,12 @@ var require_prism_core = __commonJS({
           // Traverse a language definition with Depth First Search
           DFS: function DFS(o, callback, type, visited) {
             visited = visited || {};
-            var objId = _2.util.objId;
+            var objId = _5.util.objId;
             for (var i in o) {
               if (o.hasOwnProperty(i)) {
                 callback.call(o, i, o[i], type || i);
                 var property = o[i];
-                var propertyType = _2.util.type(property);
+                var propertyType = _5.util.type(property);
                 if (propertyType === "Object" && !visited[objId(property)]) {
                   visited[objId(property)] = true;
                   DFS(property, callback, null, visited);
@@ -4264,7 +4264,7 @@ var require_prism_core = __commonJS({
          * @public
          */
         highlightAll: function(async, callback) {
-          _2.highlightAllUnder(document, async, callback);
+          _5.highlightAllUnder(document, async, callback);
         },
         /**
          * Fetches all the descendants of `container` that have a `.language-xxxx` class and then calls
@@ -4287,11 +4287,11 @@ var require_prism_core = __commonJS({
             container,
             selector: 'code[class*="language-"], [class*="language-"] code, code[class*="lang-"], [class*="lang-"] code'
           };
-          _2.hooks.run("before-highlightall", env);
+          _5.hooks.run("before-highlightall", env);
           env.elements = Array.prototype.slice.apply(env.container.querySelectorAll(env.selector));
-          _2.hooks.run("before-all-elements-highlight", env);
+          _5.hooks.run("before-all-elements-highlight", env);
           for (var i = 0, element; element = env.elements[i++]; ) {
-            _2.highlightElement(element, async === true, env.callback);
+            _5.highlightElement(element, async === true, env.callback);
           }
         },
         /**
@@ -4323,12 +4323,12 @@ var require_prism_core = __commonJS({
          * @public
          */
         highlightElement: function(element, async, callback) {
-          var language = _2.util.getLanguage(element);
-          var grammar = _2.languages[language];
-          _2.util.setLanguage(element, language);
+          var language = _5.util.getLanguage(element);
+          var grammar = _5.languages[language];
+          _5.util.setLanguage(element, language);
           var parent = element.parentElement;
           if (parent && parent.nodeName.toLowerCase() === "pre") {
-            _2.util.setLanguage(parent, language);
+            _5.util.setLanguage(parent, language);
           }
           var code = element.textContent;
           var env = {
@@ -4339,29 +4339,29 @@ var require_prism_core = __commonJS({
           };
           function insertHighlightedCode(highlightedCode) {
             env.highlightedCode = highlightedCode;
-            _2.hooks.run("before-insert", env);
+            _5.hooks.run("before-insert", env);
             env.element.innerHTML = env.highlightedCode;
-            _2.hooks.run("after-highlight", env);
-            _2.hooks.run("complete", env);
+            _5.hooks.run("after-highlight", env);
+            _5.hooks.run("complete", env);
             callback && callback.call(env.element);
           }
-          _2.hooks.run("before-sanity-check", env);
+          _5.hooks.run("before-sanity-check", env);
           parent = env.element.parentElement;
           if (parent && parent.nodeName.toLowerCase() === "pre" && !parent.hasAttribute("tabindex")) {
             parent.setAttribute("tabindex", "0");
           }
           if (!env.code) {
-            _2.hooks.run("complete", env);
+            _5.hooks.run("complete", env);
             callback && callback.call(env.element);
             return;
           }
-          _2.hooks.run("before-highlight", env);
+          _5.hooks.run("before-highlight", env);
           if (!env.grammar) {
-            insertHighlightedCode(_2.util.encode(env.code));
+            insertHighlightedCode(_5.util.encode(env.code));
             return;
           }
           if (async && _self2.Worker) {
-            var worker = new Worker(_2.filename);
+            var worker = new Worker(_5.filename);
             worker.onmessage = function(evt) {
               insertHighlightedCode(evt.data);
             };
@@ -4371,7 +4371,7 @@ var require_prism_core = __commonJS({
               immediateClose: true
             }));
           } else {
-            insertHighlightedCode(_2.highlight(env.code, env.grammar, env.language));
+            insertHighlightedCode(_5.highlight(env.code, env.grammar, env.language));
           }
         },
         /**
@@ -4400,13 +4400,13 @@ var require_prism_core = __commonJS({
             grammar,
             language
           };
-          _2.hooks.run("before-tokenize", env);
+          _5.hooks.run("before-tokenize", env);
           if (!env.grammar) {
             throw new Error('The language "' + env.language + '" has no grammar.');
           }
-          env.tokens = _2.tokenize(env.code, env.grammar);
-          _2.hooks.run("after-tokenize", env);
-          return Token.stringify(_2.util.encode(env.tokens), env.language);
+          env.tokens = _5.tokenize(env.code, env.grammar);
+          _5.hooks.run("after-tokenize", env);
+          return Token.stringify(_5.util.encode(env.tokens), env.language);
         },
         /**
          * This is the heart of Prism, and the most low-level function you can use. It accepts a string of text as input
@@ -4465,7 +4465,7 @@ var require_prism_core = __commonJS({
            * @public
            */
           add: function(name, callback) {
-            var hooks = _2.hooks.all;
+            var hooks = _5.hooks.all;
             hooks[name] = hooks[name] || [];
             hooks[name].push(callback);
           },
@@ -4479,7 +4479,7 @@ var require_prism_core = __commonJS({
            * @public
            */
           run: function(name, env) {
-            var callbacks = _2.hooks.all[name];
+            var callbacks = _5.hooks.all[name];
             if (!callbacks || !callbacks.length) {
               return;
             }
@@ -4490,7 +4490,7 @@ var require_prism_core = __commonJS({
         },
         Token
       };
-      _self2.Prism = _2;
+      _self2.Prism = _5;
       function Token(type, content, alias, matchedStr) {
         this.type = type;
         this.content = content;
@@ -4524,7 +4524,7 @@ var require_prism_core = __commonJS({
             env.classes.push(aliases);
           }
         }
-        _2.hooks.run("wrap", env);
+        _5.hooks.run("wrap", env);
         var attributes = "";
         for (var name in env.attributes) {
           attributes += " " + name + '="' + (env.attributes[name] || "").replace(/"/g, """) + '"';
@@ -4620,7 +4620,7 @@ var require_prism_core = __commonJS({
                 pos += before.length;
               }
               removeRange(tokenList, removeFrom, removeCount);
-              var wrapped = new Token(token, inside ? _2.tokenize(matchStr, inside) : matchStr, alias, matchStr);
+              var wrapped = new Token(token, inside ? _5.tokenize(matchStr, inside) : matchStr, alias, matchStr);
               currentNode = addAfter(tokenList, removeFrom, wrapped);
               if (after) {
                 addAfter(tokenList, currentNode, after);
@@ -4675,35 +4675,35 @@ var require_prism_core = __commonJS({
       }
       if (!_self2.document) {
         if (!_self2.addEventListener) {
-          return _2;
+          return _5;
         }
-        if (!_2.disableWorkerMessageHandler) {
+        if (!_5.disableWorkerMessageHandler) {
           _self2.addEventListener("message", function(evt) {
             var message = JSON.parse(evt.data);
             var lang2 = message.language;
             var code = message.code;
             var immediateClose = message.immediateClose;
-            _self2.postMessage(_2.highlight(code, _2.languages[lang2], lang2));
+            _self2.postMessage(_5.highlight(code, _5.languages[lang2], lang2));
             if (immediateClose) {
               _self2.close();
             }
           }, false);
         }
-        return _2;
+        return _5;
       }
-      var script = _2.util.currentScript();
+      var script = _5.util.currentScript();
       if (script) {
-        _2.filename = script.src;
+        _5.filename = script.src;
         if (script.hasAttribute("data-manual")) {
-          _2.manual = true;
+          _5.manual = true;
         }
       }
       function highlightAutomaticallyCallback() {
-        if (!_2.manual) {
-          _2.highlightAll();
+        if (!_5.manual) {
+          _5.highlightAll();
         }
       }
-      if (!_2.manual) {
+      if (!_5.manual) {
         var readyState = document.readyState;
         if (readyState === "loading" || readyState === "interactive" && script && script.defer) {
           document.addEventListener("DOMContentLoaded", highlightAutomaticallyCallback);
@@ -4715,7 +4715,7 @@ var require_prism_core = __commonJS({
           }
         }
       }
-      return _2;
+      return _5;
     }(_self);
     if (typeof module !== "undefined" && module.exports) {
       module.exports = Prism;
@@ -26790,6 +26790,7 @@ var PolicyResource = /* @__PURE__ */ ((PolicyResource2) => {
   PolicyResource2["SUBSCRIPTION_CREATE"] = "/orchestrator/processes/create/process/menu";
   PolicyResource2["SUBSCRIPTION_MODIFY"] = "/orchestrator/subscriptions/modify/";
   PolicyResource2["SUBSCRIPTION_TERMINATE"] = "/orchestrator/subscriptions/terminate/";
+  PolicyResource2["SUBSCRIPTION_RECONCILE"] = "/orchestrator/subscriptions/reconcile/";
   PolicyResource2["SUBSCRIPTION_VALIDATE"] = "/orchestrator/subscriptions/validate/";
   PolicyResource2["TASKS_CREATE"] = "/orchestrator/processes/create/task";
   PolicyResource2["TASKS_RETRY_ALL"] = "/orchestrator/processes/all-tasks/retry";
@@ -26800,7 +26801,7 @@ var PolicyResource = /* @__PURE__ */ ((PolicyResource2) => {
 })(PolicyResource || {});
 
 // src/configuration/version.ts
-var ORCHESTRATOR_UI_LIBRARY_VERSION = "5.7.1";
+var ORCHESTRATOR_UI_LIBRARY_VERSION = "5.8.1";
 
 // src/types/types.ts
 var EngineStatus = /* @__PURE__ */ ((EngineStatus3) => {
@@ -26839,6 +26840,7 @@ var WorkflowTarget = /* @__PURE__ */ ((WorkflowTarget2) => {
   WorkflowTarget2["TERMINATE"] = "terminate";
   WorkflowTarget2["SYSTEM"] = "system";
   WorkflowTarget2["VALIDATE"] = "validate";
+  WorkflowTarget2["RECONCILE"] = "reconcile";
   return WorkflowTarget2;
 })(WorkflowTarget || {});
 var StepStatus = /* @__PURE__ */ ((StepStatus2) => {
@@ -28696,7 +28698,7 @@ function createImmutableStateInvariantMiddleware(options = {}) {
       return JSON.stringify(obj, getSerialize2(serializer, decycler), indent);
     }, getSerialize2 = function(serializer, decycler) {
       let stack = [], keys = [];
-      if (!decycler) decycler = function(_2, value) {
+      if (!decycler) decycler = function(_5, value) {
         if (stack[0] === value) return "[Circular ~]";
         return "[Circular ~." + keys.slice(0, stack.indexOf(value)).join(".") + "]";
       };
@@ -29336,7 +29338,7 @@ var createAsyncThunk = /* @__PURE__ */ (() => {
                 message: "Aborted due to condition callback returning false."
               };
             }
-            const abortedPromise = new Promise((_2, reject) => {
+            const abortedPromise = new Promise((_5, reject) => {
               abortHandler = () => {
                 reject({
                   name: "AbortError",
@@ -31843,7 +31845,7 @@ var buildCacheLifecycleHandler = ({
     });
     lifecycleMap[queryCacheKey] = lifecycle;
     const selector = api.endpoints[endpointName].select(isAnyQueryDefinition(endpointDefinition) ? originalArgs : queryCacheKey);
-    const extra = mwApi.dispatch((_2, __, extra2) => extra2);
+    const extra = mwApi.dispatch((_5, __, extra2) => extra2);
     const lifecycleApi = {
       ...mwApi,
       getCacheEntry: () => selector(mwApi.getState()),
@@ -32096,7 +32098,7 @@ var buildQueryLifecycleHandler = ({
         });
         lifecycleMap[requestId] = lifecycle;
         const selector = api.endpoints[endpointName].select(isAnyQueryDefinition(endpointDefinition) ? originalArgs : requestId);
-        const extra = mwApi.dispatch((_2, __, extra2) => extra2);
+        const extra = mwApi.dispatch((_5, __, extra2) => extra2);
         const lifecycleApi = {
           ...mwApi,
           getCacheEntry: () => selector(mwApi.getState()),
@@ -32708,8 +32710,8 @@ function buildHooks({
         createSelector2([
           // @ts-ignore
           select(stableArg),
-          (_2, lastResult) => lastResult,
-          (_2) => stableArg
+          (_5, lastResult) => lastResult,
+          (_5) => stableArg
         ], preSelector, {
           memoizeOptions: {
             resultEqualityCheck: shallowEqual2
@@ -34031,7 +34033,7 @@ query MetadataWorkflows(
         after: $after
         sortBy: $sortBy
         query: $query
-        filterBy: { field: "target", value: "CREATE|MODIFY|TERMINATE" }
+        filterBy: { field: "target", value: "CREATE|MODIFY|TERMINATE|RECONCILE" }
     ) {
         page {
             workflowId
@@ -34080,7 +34082,7 @@ var workflowsApi = orchestratorApi.injectEndpoints({
         document: workflowsDescription,
         variables
       }),
-      transformResponse: (response, _2, variables) => {
+      transformResponse: (response, _5, variables) => {
         const workflows = response.workflows.page || [];
         const workflow = workflows.find(
           ({ name: name2 }) => name2 === variables.workflowName
@@ -34864,7 +34866,7 @@ var streamMessagesApi = orchestratorApi.injectEndpoints({
       queryFn: () => {
         return { data: true };
       },
-      async onCacheEntryAdded(_2, {
+      async onCacheEntryAdded(_5, {
         cacheDataLoaded,
         cacheEntryRemoved,
         dispatch,
@@ -38237,7 +38239,7 @@ var WfoStartButtonComboBox = ({
           css: selectableStyle,
           searchable: true,
           options,
-          onChange: (_2, __, changedOption) => onOptionChange(changedOption),
+          onChange: (_5, __, changedOption) => onOptionChange(changedOption),
           height: 200,
           children: (list, search) => /* @__PURE__ */ jsxs41(Fragment3, { children: [
             search,
@@ -39164,7 +39166,9 @@ var WfoWorkflowTargetBadge = ({
       success,
       successText,
       warning: warning2,
-      warningText
+      warningText,
+      accent,
+      accentText
     } = theme.colors;
     switch (_target?.toLowerCase()) {
       case "create" /* CREATE */:
@@ -39188,6 +39192,11 @@ var WfoWorkflowTargetBadge = ({
           badgeColor: toSecondaryColor(danger),
           textColor: dangerText
         };
+      case "reconcile" /* RECONCILE */:
+        return {
+          badgeColor: toSecondaryColor(accent),
+          textColor: accentText
+        };
       default:
         return {
           badgeColor: toSecondaryColor(primary),
@@ -40031,6 +40040,8 @@ var getWorkflowTargetColor = (workflowTarget, theme) => {
     case "system" /* SYSTEM */:
     case "validate" /* VALIDATE */:
       return theme.colors.warning;
+    case "reconcile" /* RECONCILE */:
+      return theme.colors.accent;
     case "terminate" /* TERMINATE */:
       return theme.colors.danger;
   }
@@ -40045,6 +40056,8 @@ var getWorkflowTargetIconContent = (workflowTarget) => {
       return "T";
     case "terminate" /* TERMINATE */:
       return "X";
+    case "reconcile" /* RECONCILE */:
+      return "R";
     default:
       return "M";
   }
@@ -41215,11 +41228,11 @@ var WfoDragHandler = ({
   const onStart = () => {
     setIsDragging(false);
   };
-  const onDrag = (_2, data) => {
+  const onDrag = (_5, data) => {
     setIsDragging(true);
     setPosition({ x: data.x, y: data.y });
   };
-  const onStop = (_2, data) => {
+  const onStop = (_5, data) => {
     if (headerRowRef.current && isDragging) {
       const newWidth = startWidth + data.x;
       onUpdateColumWidth(
@@ -42380,14 +42393,53 @@ import Link8 from "next/link";
 import { useRouter as useRouter5 } from "next/router";
 import {
   EuiButton as EuiButton7,
+  EuiButtonIcon as EuiButtonIcon7,
   EuiContextMenuItem,
   EuiContextMenuPanel,
+  EuiLoadingSpinner,
   EuiPanel,
   EuiPopover as EuiPopover4,
   EuiTitle,
   EuiToolTip as EuiToolTip6
 } from "@elastic/eui";
 
+// src/icons/WfoDotsHorizontal.tsx
+import { jsx as jsx121, jsxs as jsxs67 } from "@emotion/react/jsx-runtime";
+var WfoDotsHorizontal = ({
+  width = 20,
+  height = 20,
+  color = "currentColor"
+}) => /* @__PURE__ */ jsxs67(
+  "svg",
+  {
+    width,
+    height,
+    viewBox: "0 0 24 24",
+    version: "1.1",
+    xmlns: "http://www.w3.org/2000/svg",
+    children: [
+      /* @__PURE__ */ jsx121("title", { children: "icon/dots-horizontal" }),
+      /* @__PURE__ */ jsx121(
+        "g",
+        {
+          id: "Symbols",
+          stroke: "none",
+          strokeWidth: "1",
+          fill: "none",
+          fillRule: "evenodd",
+          children: /* @__PURE__ */ jsx121("g", { id: "icon/dots-horizontal", fill: color, fillRule: "nonzero", children: /* @__PURE__ */ jsx121(
+            "path",
+            {
+              d: "M8,12 C8,13.1046 7.10457,14 6,14 C4.89543,14 4,13.1046 4,12 C4,10.89543 4.89543,10 6,10 C7.10457,10 8,10.89543 8,12 Z M14,12 C14,13.1046 13.1046,14 12,14 C10.89543,14 10,13.1046 10,12 C10,10.89543 10.89543,10 12,10 C13.1046,10 14,10.89543 14,12 Z M18,14 C19.1046,14 20,13.1046 20,12 C20,10.89543 19.1046,10 18,10 C16.8954,10 16,10.89543 16,12 C16,13.1046 16.8954,14 18,14 Z",
+              id: "Combined-Shape"
+            }
+          ) })
+        }
+      )
+    ]
+  }
+);
+
 // src/components/WfoSubscription/WfoSubscriptionActions/WfoSubscriptionActionExpandableMenuItem.tsx
 import { useState as useState18 } from "react";
 import { useTranslations as useTranslations29 } from "next-intl";
@@ -42458,7 +42510,7 @@ var getSubscriptionActionStyles = ({ theme }) => {
 };
 
 // src/components/WfoSubscription/WfoSubscriptionActions/WfoSubscriptionActionExpandableMenuItem.tsx
-import { jsx as jsx121, jsxs as jsxs67 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx122, jsxs as jsxs68 } from "@emotion/react/jsx-runtime";
 var WfoSubscriptionActionExpandableMenuItem = ({ subscriptionAction, onClickLockedRelation, children }) => {
   const t = useTranslations29("subscriptions.detail.actions");
   const {
@@ -42470,8 +42522,8 @@ var WfoSubscriptionActionExpandableMenuItem = ({ subscriptionAction, onClickLock
   } = useWithOrchestratorTheme(getSubscriptionActionStyles);
   const [isExpanded, setIsExpanded] = useState18(false);
   const { locked_relations: lockedRelations } = subscriptionAction;
-  return /* @__PURE__ */ jsxs67("div", { children: [
-    /* @__PURE__ */ jsxs67(
+  return /* @__PURE__ */ jsxs68("div", { children: [
+    /* @__PURE__ */ jsxs68(
       "div",
       {
         css: [
@@ -42480,8 +42532,8 @@ var WfoSubscriptionActionExpandableMenuItem = ({ subscriptionAction, onClickLock
         ],
         onClick: () => setIsExpanded(!isExpanded),
         children: [
-          /* @__PURE__ */ jsx121("div", { children }),
-          lockedRelations && /* @__PURE__ */ jsx121(
+          /* @__PURE__ */ jsx122("div", { children }),
+          lockedRelations && /* @__PURE__ */ jsx122(
             EuiButtonIcon6,
             {
               css: expandButtonStyle,
@@ -42493,9 +42545,9 @@ var WfoSubscriptionActionExpandableMenuItem = ({ subscriptionAction, onClickLock
         ]
       }
     ),
-    lockedRelations && isExpanded && /* @__PURE__ */ jsxs67("div", { css: expandedContentStyle, children: [
-      /* @__PURE__ */ jsx121(EuiText8, { size: "xs", children: t("lockedBySubscriptions") }),
-      lockedRelations.map((relation) => /* @__PURE__ */ jsx121(EuiText8, { size: "xs", children: /* @__PURE__ */ jsx121(
+    lockedRelations && isExpanded && /* @__PURE__ */ jsxs68("div", { css: expandedContentStyle, children: [
+      /* @__PURE__ */ jsx122(EuiText8, { size: "xs", children: t("lockedBySubscriptions") }),
+      lockedRelations.map((relation) => /* @__PURE__ */ jsx122(EuiText8, { size: "xs", children: /* @__PURE__ */ jsx122(
         Link7,
         {
           css: linkStyle,
@@ -42510,11 +42562,12 @@ var WfoSubscriptionActionExpandableMenuItem = ({ subscriptionAction, onClickLock
 };
 
 // src/components/WfoSubscription/WfoSubscriptionActions/WfoSubscriptionActions.tsx
-import { Fragment as Fragment24, jsx as jsx122, jsxs as jsxs68 } from "@emotion/react/jsx-runtime";
-var MenuBlock = ({ title }) => /* @__PURE__ */ jsx122(EuiTitle, { size: "xxxs", children: /* @__PURE__ */ jsx122("h3", { children: title }) });
+import { Fragment as Fragment24, jsx as jsx123, jsxs as jsxs69 } from "@emotion/react/jsx-runtime";
+var MenuBlock = ({ title }) => /* @__PURE__ */ jsx123(EuiTitle, { size: "xxxs", children: /* @__PURE__ */ jsx123("h3", { children: title }) });
 var WfoSubscriptionActions = ({
   subscriptionId,
-  isLoading
+  isLoading,
+  compactMode = false
 }) => {
   const { theme } = useOrchestratorTheme();
   const {
@@ -42527,20 +42580,18 @@ var WfoSubscriptionActions = ({
   const router = useRouter5();
   const t = useTranslations30("subscriptions.detail.actions");
   const [isPopoverOpen, setPopover] = useState19(false);
-  const { data: subscriptionActions } = useGetSubscriptionActionsQuery(
-    {
-      subscriptionId
-    },
-    { skip: isLoading }
+  const disableQuery = isLoading || !isPopoverOpen && compactMode;
+  const {
+    data: subscriptionActions,
+    isLoading: subscriptionActionsIsLoading
+  } = useGetSubscriptionActionsQuery(
+    { subscriptionId },
+    { skip: disableQuery }
   );
   const { isEngineRunningNow } = useCheckEngineStatus();
   const { isAllowed } = usePolicy();
-  const onButtonClick = () => {
-    setPopover(!isPopoverOpen);
-  };
-  const closePopover = () => {
-    setPopover(false);
-  };
+  const onButtonClick = () => setPopover(!isPopoverOpen);
+  const closePopover = () => setPopover(false);
   const MenuItem = ({
     action,
     target,
@@ -42559,12 +42610,12 @@ var WfoSubscriptionActions = ({
           router.push(url);
         }
       };
-      return /* @__PURE__ */ jsx122(Link8, { href: url, onClick: handleLinkClick, children: /* @__PURE__ */ jsx122("div", { css: linkMenuItemStyle, children: actionItem }) });
+      return /* @__PURE__ */ jsx123(Link8, { href: url, onClick: handleLinkClick, children: /* @__PURE__ */ jsx123("div", { css: linkMenuItemStyle, children: actionItem }) });
     };
     const tooltipIt = (actionItem) => {
       if (!action.reason) return actionItem;
       const tooltipContent = t(action.reason, flattenArrayProps(action));
-      return /* @__PURE__ */ jsx122("div", { css: tooltipMenuItemStyle, children: /* @__PURE__ */ jsx122(EuiToolTip6, { position: "top", content: tooltipContent, children: /* @__PURE__ */ jsx122(
+      return /* @__PURE__ */ jsx123("div", { css: tooltipMenuItemStyle, children: /* @__PURE__ */ jsx123(EuiToolTip6, { position: "top", content: tooltipContent, children: /* @__PURE__ */ jsx123(
         WfoSubscriptionActionExpandableMenuItem,
         {
           subscriptionAction: action,
@@ -42573,23 +42624,29 @@ var WfoSubscriptionActions = ({
         }
       ) }) });
     };
-    const getIcon = () => {
-      return action.reason ? /* @__PURE__ */ jsxs68("div", { css: disabledIconStyle, children: [
-        /* @__PURE__ */ jsx122(WfoTargetTypeIcon, { target, disabled: true }),
-        /* @__PURE__ */ jsx122("div", { css: secondaryIconStyle, children: /* @__PURE__ */ jsx122(
-          WfoXCircleFill,
-          {
-            width: 20,
-            height: 20,
-            color: theme.colors.danger
-          }
-        ) })
-      ] }) : /* @__PURE__ */ jsx122("div", { css: iconStyle, children: /* @__PURE__ */ jsx122(WfoTargetTypeIcon, { target }) });
-    };
-    const ActionItem = () => /* @__PURE__ */ jsx122(EuiContextMenuItem, { icon: getIcon(), disabled: !!action.reason, children: action.description });
-    return action?.reason ? tooltipIt(/* @__PURE__ */ jsx122(ActionItem, {})) : linkIt(/* @__PURE__ */ jsx122(ActionItem, {}));
+    const getIcon = () => action.reason ? /* @__PURE__ */ jsxs69("div", { css: disabledIconStyle, children: [
+      /* @__PURE__ */ jsx123(WfoTargetTypeIcon, { target, disabled: true }),
+      /* @__PURE__ */ jsx123("div", { css: secondaryIconStyle, children: /* @__PURE__ */ jsx123(
+        WfoXCircleFill,
+        {
+          width: 20,
+          height: 20,
+          color: theme.colors.danger
+        }
+      ) })
+    ] }) : /* @__PURE__ */ jsx123("div", { css: iconStyle, children: /* @__PURE__ */ jsx123(WfoTargetTypeIcon, { target }) });
+    const ActionItem = () => /* @__PURE__ */ jsx123(EuiContextMenuItem, { icon: getIcon(), disabled: !!action.reason, children: action.description });
+    return action?.reason ? tooltipIt(/* @__PURE__ */ jsx123(ActionItem, {})) : linkIt(/* @__PURE__ */ jsx123(ActionItem, {}));
   };
-  const button = /* @__PURE__ */ jsx122(
+  const button = compactMode ? /* @__PURE__ */ jsx123(
+    EuiButtonIcon7,
+    {
+      iconType: () => /* @__PURE__ */ jsx123(WfoDotsHorizontal, {}),
+      onClick: onButtonClick,
+      "aria-label": "Row context menu",
+      isLoading
+    }
+  ) : /* @__PURE__ */ jsx123(
     EuiButton7,
     {
       iconType: "arrowDown",
@@ -42599,7 +42656,68 @@ var WfoSubscriptionActions = ({
       children: t("actions")
     }
   );
-  return /* @__PURE__ */ jsx122(
+  const {
+    SUBSCRIPTION_VALIDATE,
+    SUBSCRIPTION_RECONCILE,
+    SUBSCRIPTION_MODIFY,
+    SUBSCRIPTION_TERMINATE
+  } = PolicyResource;
+  const compactItems = /* @__PURE__ */ jsxs69(Fragment24, { children: [
+    isAllowed(SUBSCRIPTION_VALIDATE + subscriptionId) && subscriptionActions?.validate && /* @__PURE__ */ jsxs69(Fragment24, { children: [
+      !compactMode && /* @__PURE__ */ jsx123(MenuBlock, { title: t("tasks") }),
+      subscriptionActions.validate.map((action, index) => /* @__PURE__ */ jsx123(
+        MenuItem,
+        {
+          action,
+          index,
+          target: "validate" /* VALIDATE */,
+          isTask: true
+        },
+        `s_${index}`
+      ))
+    ] }),
+    isAllowed(SUBSCRIPTION_RECONCILE + subscriptionId) && (subscriptionActions?.reconcile?.length ?? 0) > 0 && /* @__PURE__ */ jsxs69(Fragment24, { children: [
+      !compactMode && /* @__PURE__ */ jsx123(MenuBlock, { title: t("reconcile") }),
+      subscriptionActions?.reconcile.map((action, index) => /* @__PURE__ */ jsx123(
+        MenuItem,
+        {
+          action,
+          index,
+          target: "reconcile" /* RECONCILE */
+        },
+        `r_${index}`
+      ))
+    ] })
+  ] });
+  const fullItems = /* @__PURE__ */ jsxs69(Fragment24, { children: [
+    isAllowed(SUBSCRIPTION_MODIFY + subscriptionId) && subscriptionActions?.modify && /* @__PURE__ */ jsxs69(Fragment24, { children: [
+      /* @__PURE__ */ jsx123(MenuBlock, { title: t("modify") }),
+      subscriptionActions.modify.map((action, index) => /* @__PURE__ */ jsx123(
+        MenuItem,
+        {
+          action,
+          index,
+          target: "modify" /* MODIFY */
+        },
+        `m_${index}`
+      ))
+    ] }),
+    compactItems,
+    isAllowed(SUBSCRIPTION_TERMINATE + subscriptionId) && subscriptionActions?.terminate && /* @__PURE__ */ jsxs69(Fragment24, { children: [
+      /* @__PURE__ */ jsx123(MenuBlock, { title: t("terminate") }),
+      subscriptionActions.terminate.map((action, index) => /* @__PURE__ */ jsx123(
+        MenuItem,
+        {
+          action,
+          index,
+          target: "terminate" /* TERMINATE */
+        },
+        `t_${index}`
+      ))
+    ] })
+  ] });
+  const MenuItemsList = () => compactMode ? compactItems : fullItems;
+  return /* @__PURE__ */ jsx123(
     EuiPopover4,
     {
       id: "subscriptionActionPopover",
@@ -42608,57 +42726,7 @@ var WfoSubscriptionActions = ({
       closePopover,
       panelPaddingSize: "none",
       anchorPosition: "downLeft",
-      children: /* @__PURE__ */ jsx122(EuiContextMenuPanel, { children: /* @__PURE__ */ jsxs68(EuiPanel, { color: "transparent", paddingSize: "s", children: [
-        subscriptionActions && isAllowed(
-          "/orchestrator/subscriptions/modify/" /* SUBSCRIPTION_MODIFY */ + subscriptionId
-        ) && subscriptionActions.modify && /* @__PURE__ */ jsxs68(Fragment24, { children: [
-          /* @__PURE__ */ jsx122(MenuBlock, { title: t("modify") }),
-          subscriptionActions.modify.map(
-            (action, index) => /* @__PURE__ */ jsx122(
-              MenuItem,
-              {
-                action,
-                index,
-                target: "modify" /* MODIFY */
-              },
-              `m_${index}`
-            )
-          )
-        ] }),
-        subscriptionActions && isAllowed(
-          "/orchestrator/subscriptions/validate/" /* SUBSCRIPTION_VALIDATE */ + subscriptionId
-        ) && subscriptionActions.validate && /* @__PURE__ */ jsxs68(Fragment24, { children: [
-          /* @__PURE__ */ jsx122(MenuBlock, { title: t("tasks") }),
-          subscriptionActions.validate.map(
-            (action, index) => /* @__PURE__ */ jsx122(
-              MenuItem,
-              {
-                action,
-                index,
-                target: "validate" /* VALIDATE */,
-                isTask: true
-              },
-              `s_${index}`
-            )
-          )
-        ] }),
-        subscriptionActions && isAllowed(
-          "/orchestrator/subscriptions/terminate/" /* SUBSCRIPTION_TERMINATE */ + subscriptionId
-        ) && subscriptionActions.terminate && /* @__PURE__ */ jsxs68(Fragment24, { children: [
-          /* @__PURE__ */ jsx122(MenuBlock, { title: t("terminate") }),
-          subscriptionActions.terminate.map(
-            (action, index) => /* @__PURE__ */ jsx122(
-              MenuItem,
-              {
-                action,
-                index,
-                target: "terminate" /* TERMINATE */
-              },
-              `t_${index}`
-            )
-          )
-        ] })
-      ] }) })
+      children: /* @__PURE__ */ jsx123(EuiContextMenuPanel, { children: /* @__PURE__ */ jsx123(EuiPanel, { color: "transparent", paddingSize: "s", children: subscriptionActionsIsLoading ? /* @__PURE__ */ jsx123(EuiLoadingSpinner, {}) : /* @__PURE__ */ jsx123(MenuItemsList, {}) }) })
     }
   );
 };
@@ -42680,7 +42748,7 @@ import {
 // src/components/WfoSubscription/WfoInUseByRelations.tsx
 import { useTranslations as useTranslations31 } from "next-intl";
 import Link9 from "next/link";
-import { Fragment as Fragment25, jsx as jsx123 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment25, jsx as jsx124 } from "@emotion/react/jsx-runtime";
 var WfoInUseByRelations = ({
   inUseByRelations
 }) => {
@@ -42693,16 +42761,16 @@ var WfoInUseByRelations = ({
     subscriptionIds
   });
   if (isError2) {
-    return /* @__PURE__ */ jsx123(WfoError, {});
+    return /* @__PURE__ */ jsx124(WfoError, {});
   }
   if (isLoading) {
-    return /* @__PURE__ */ jsx123(WfoLoading, {});
+    return /* @__PURE__ */ jsx124(WfoLoading, {});
   }
   const getKeyValues = (inUseByRelationDetails) => {
     return [
       {
         key: t("subscriptionId"),
-        value: /* @__PURE__ */ jsx123(
+        value: /* @__PURE__ */ jsx124(
           WfoFirstPartUUID,
           {
             UUID: inUseByRelationDetails.subscriptionId,
@@ -42713,7 +42781,7 @@ var WfoInUseByRelations = ({
       },
       {
         key: t("description"),
-        value: /* @__PURE__ */ jsx123(
+        value: /* @__PURE__ */ jsx124(
           Link9,
           {
             href: `${PATH_SUBSCRIPTIONS}/${inUseByRelationDetails.subscriptionId}`,
@@ -42730,9 +42798,9 @@ var WfoInUseByRelations = ({
       }
     ];
   };
-  return /* @__PURE__ */ jsx123(Fragment25, { children: data?.inUseByRelationDetails.map((relation, index) => {
+  return /* @__PURE__ */ jsx124(Fragment25, { children: data?.inUseByRelationDetails.map((relation, index) => {
     const keyValues = getKeyValues(relation);
-    return /* @__PURE__ */ jsx123("div", { css: inUseByRelationDetailsStyle, children: /* @__PURE__ */ jsx123(
+    return /* @__PURE__ */ jsx124("div", { css: inUseByRelationDetailsStyle, children: /* @__PURE__ */ jsx124(
       WfoKeyValueTable,
       {
         keyValues,
@@ -42811,7 +42879,7 @@ var getStyles6 = (wfoTheme) => {
 };
 
 // src/components/WfoSubscription/WfoSubscriptionProductBlock/WfoSubscriptionProductBlock.tsx
-import { Fragment as Fragment26, jsx as jsx124, jsxs as jsxs69 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment26, jsx as jsx125, jsxs as jsxs70 } from "@emotion/react/jsx-runtime";
 var HIDDEN_KEYS = ["title", "name", "label", "inUseByIds"];
 var WfoSubscriptionProductBlock = ({
   productBlock,
@@ -42839,33 +42907,33 @@ var WfoSubscriptionProductBlock = ({
   const isEmpty2 = (value) => {
     return value === null || value === void 0 || value === "" || Array.isArray(value) && value.length === 0;
   };
-  return /* @__PURE__ */ jsxs69(Fragment26, { children: [
-    /* @__PURE__ */ jsx124(EuiSpacer14, { size: "m" }),
-    /* @__PURE__ */ jsxs69(
+  return /* @__PURE__ */ jsxs70(Fragment26, { children: [
+    /* @__PURE__ */ jsx125(EuiSpacer14, { size: "m" }),
+    /* @__PURE__ */ jsxs70(
       EuiPanel2,
       {
         color: "transparent",
         hasShadow: false,
         css: isOutsideCurrentSubscription ? panelStyleOutsideCurrentSubscription : panelStyle,
         children: [
-          /* @__PURE__ */ jsxs69(EuiFlexGroup11, { children: [
-            /* @__PURE__ */ jsx124(EuiFlexItem8, { grow: false, children: /* @__PURE__ */ jsx124(
+          /* @__PURE__ */ jsxs70(EuiFlexGroup11, { children: [
+            /* @__PURE__ */ jsx125(EuiFlexItem8, { grow: false, children: /* @__PURE__ */ jsx125(
               "div",
               {
                 css: isOutsideCurrentSubscription ? iconOutsideCurrentSubscriptionStyle : iconStyle,
-                children: /* @__PURE__ */ jsx124(EuiIcon, { type: "filebeatApp", color: "currentColor" })
+                children: /* @__PURE__ */ jsx125(EuiIcon, { type: "filebeatApp", color: "currentColor" })
               }
             ) }),
-            /* @__PURE__ */ jsxs69(EuiFlexItem8, { children: [
-              /* @__PURE__ */ jsx124(EuiText9, { grow: true, children: /* @__PURE__ */ jsx124("h3", { children: getProductBlockTitle(
+            /* @__PURE__ */ jsxs70(EuiFlexItem8, { children: [
+              /* @__PURE__ */ jsx125(EuiText9, { grow: true, children: /* @__PURE__ */ jsx125("h3", { children: getProductBlockTitle(
                 productBlock.productBlockInstanceValues
               ) }) }),
-              /* @__PURE__ */ jsx124(EuiText9, { size: "s", children: getFieldFromProductBlockInstanceValues(
+              /* @__PURE__ */ jsx125(EuiText9, { size: "s", children: getFieldFromProductBlockInstanceValues(
                 productBlock.productBlockInstanceValues,
                 "name"
               ) })
             ] }),
-            /* @__PURE__ */ jsx124(EuiFlexItem8, { grow: false, children: /* @__PURE__ */ jsx124(
+            /* @__PURE__ */ jsx125(EuiFlexItem8, { grow: false, children: /* @__PURE__ */ jsx125(
               EuiButtonEmpty4,
               {
                 "aria-label": showDetails ? t("hideDetails") : t("showDetails"),
@@ -42875,15 +42943,15 @@ var WfoSubscriptionProductBlock = ({
               }
             ) })
           ] }),
-          /* @__PURE__ */ jsx124(EuiSpacer14, { size: "m" }),
-          /* @__PURE__ */ jsx124("table", { width: "100%", children: /* @__PURE__ */ jsxs69("tbody", { children: [
-            isOutsideCurrentSubscription && /* @__PURE__ */ jsxs69("tr", { css: rowStyle, children: [
-              /* @__PURE__ */ jsx124("td", { css: leftColumnStyleWithAlignSelf, children: /* @__PURE__ */ jsx124("b", { children: t("ownerSubscriptionId") }) }),
-              /* @__PURE__ */ jsx124("td", { children: /* @__PURE__ */ jsx124(
+          /* @__PURE__ */ jsx125(EuiSpacer14, { size: "m" }),
+          /* @__PURE__ */ jsx125("table", { width: "100%", children: /* @__PURE__ */ jsxs70("tbody", { children: [
+            isOutsideCurrentSubscription && /* @__PURE__ */ jsxs70("tr", { css: rowStyle, children: [
+              /* @__PURE__ */ jsx125("td", { css: leftColumnStyleWithAlignSelf, children: /* @__PURE__ */ jsx125("b", { children: t("ownerSubscriptionId") }) }),
+              /* @__PURE__ */ jsx125("td", { children: /* @__PURE__ */ jsx125(
                 WfoValueCell,
                 {
-                  value: /* @__PURE__ */ jsxs69(Fragment26, { children: [
-                    /* @__PURE__ */ jsx124(
+                  value: /* @__PURE__ */ jsxs70(Fragment26, { children: [
+                    /* @__PURE__ */ jsx125(
                       "a",
                       {
                         href: `${subscriptionPath}/${ownerSubscriptionId}`,
@@ -42891,7 +42959,7 @@ var WfoSubscriptionProductBlock = ({
                         children: productBlock.subscription.description
                       }
                     ),
-                    /* @__PURE__ */ jsx124(
+                    /* @__PURE__ */ jsx125(
                       EuiText9,
                       {
                         css: outsideSubscriptionIdTextStyle,
@@ -42908,18 +42976,18 @@ var WfoSubscriptionProductBlock = ({
                 }
               ) })
             ] }, -1),
-            showDetails && /* @__PURE__ */ jsxs69(Fragment26, { children: [
-              /* @__PURE__ */ jsxs69("tr", { css: rowStyle, children: [
-                /* @__PURE__ */ jsx124("td", { css: leftColumnStyle, children: /* @__PURE__ */ jsx124("b", { children: t("subscriptionInstanceId") }) }),
-                /* @__PURE__ */ jsx124("td", { children: productBlock.subscriptionInstanceId })
+            showDetails && /* @__PURE__ */ jsxs70(Fragment26, { children: [
+              /* @__PURE__ */ jsxs70("tr", { css: rowStyle, children: [
+                /* @__PURE__ */ jsx125("td", { css: leftColumnStyle, children: /* @__PURE__ */ jsx125("b", { children: t("subscriptionInstanceId") }) }),
+                /* @__PURE__ */ jsx125("td", { children: productBlock.subscriptionInstanceId })
               ] }, -2),
-              !isOutsideCurrentSubscription && /* @__PURE__ */ jsxs69("tr", { css: rowStyle, children: [
-                /* @__PURE__ */ jsx124("td", { css: leftColumnStyle, children: /* @__PURE__ */ jsx124("b", { children: t("ownerSubscriptionId") }) }),
-                /* @__PURE__ */ jsx124("td", { children: /* @__PURE__ */ jsx124(Fragment26, { children: /* @__PURE__ */ jsx124(EuiBadge2, { children: t("self") }) }) })
+              !isOutsideCurrentSubscription && /* @__PURE__ */ jsxs70("tr", { css: rowStyle, children: [
+                /* @__PURE__ */ jsx125("td", { css: leftColumnStyle, children: /* @__PURE__ */ jsx125("b", { children: t("ownerSubscriptionId") }) }),
+                /* @__PURE__ */ jsx125("td", { children: /* @__PURE__ */ jsx125(Fragment26, { children: /* @__PURE__ */ jsx125(EuiBadge2, { children: t("self") }) }) })
               ] }, -3),
-              /* @__PURE__ */ jsxs69("tr", { css: rowStyle, children: [
-                /* @__PURE__ */ jsx124("td", { css: leftColumnStyle, children: /* @__PURE__ */ jsx124("b", { children: t("inUseByRelations") }) }),
-                /* @__PURE__ */ jsx124("td", { children: inUseByRelations.length === 0 && "None" || /* @__PURE__ */ jsx124(
+              /* @__PURE__ */ jsxs70("tr", { css: rowStyle, children: [
+                /* @__PURE__ */ jsx125("td", { css: leftColumnStyle, children: /* @__PURE__ */ jsx125("b", { children: t("inUseByRelations") }) }),
+                /* @__PURE__ */ jsx125("td", { children: inUseByRelations.length === 0 && "None" || /* @__PURE__ */ jsx125(
                   WfoInUseByRelations,
                   {
                     inUseByRelations
@@ -42945,7 +43013,7 @@ var WfoSubscriptionProductBlock = ({
               if (productBlockInstanceValue && (!isEmpty2(
                 productBlockInstanceValue.value
               ) || showDetails)) {
-                return /* @__PURE__ */ jsx124(
+                return /* @__PURE__ */ jsx125(
                   WfoProductBlockKeyValueRow,
                   {
                     fieldValue: productBlockInstanceValue,
@@ -42964,7 +43032,7 @@ var WfoSubscriptionProductBlock = ({
 
 // src/components/WfoSubscription/WfoSubscriptionProductBlock/WfoProductBlockKeyValueRow.tsx
 import { EuiBadge as EuiBadge3 } from "@elastic/eui";
-import { Fragment as Fragment27, jsx as jsx125, jsxs as jsxs70 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment27, jsx as jsx126, jsxs as jsxs71 } from "@emotion/react/jsx-runtime";
 var KEY_CELL_CLASS_NAME = "key-cell";
 var VALUE_CELL_CLASS_NAME = "value-cell";
 var WfoProductBlockKeyValueRow = ({ fieldValue, allFieldValues, className }) => {
@@ -42973,17 +43041,17 @@ var WfoProductBlockKeyValueRow = ({ fieldValue, allFieldValues, className }) =>
   const { field, value } = fieldValue;
   const WfoProductBlockValue = ({ value: value2 }) => {
     if (typeof value2 === "boolean") {
-      return /* @__PURE__ */ jsx125(EuiBadge3, { children: value2.toString() });
+      return /* @__PURE__ */ jsx126(EuiBadge3, { children: value2.toString() });
     } else if (Array.isArray(value2)) {
       const result = value2.join(", ");
-      return /* @__PURE__ */ jsx125(Fragment27, { children: result });
+      return /* @__PURE__ */ jsx126(Fragment27, { children: result });
     } else {
-      return /* @__PURE__ */ jsx125(Fragment27, { children: value2 });
+      return /* @__PURE__ */ jsx126(Fragment27, { children: value2 });
     }
   };
-  return /* @__PURE__ */ jsxs70("tr", { className, css: rowStyle, children: [
-    /* @__PURE__ */ jsx125("td", { className: KEY_CELL_CLASS_NAME, css: leftColumnStyle, children: /* @__PURE__ */ jsx125("b", { children: camelToHuman(field) }) }),
-    /* @__PURE__ */ jsx125("td", { className: VALUE_CELL_CLASS_NAME, children: getOverriddenValue(fieldValue, allFieldValues) ?? /* @__PURE__ */ jsx125(WfoProductBlockValue, { value }) })
+  return /* @__PURE__ */ jsxs71("tr", { className, css: rowStyle, children: [
+    /* @__PURE__ */ jsx126("td", { className: KEY_CELL_CLASS_NAME, css: leftColumnStyle, children: /* @__PURE__ */ jsx126("b", { children: camelToHuman(field) }) }),
+    /* @__PURE__ */ jsx126("td", { className: VALUE_CELL_CLASS_NAME, children: getOverriddenValue(fieldValue, allFieldValues) ?? /* @__PURE__ */ jsx126(WfoProductBlockValue, { value }) })
   ] });
 };
 
@@ -43031,7 +43099,7 @@ var getWfoButtonComboBoxStyles = ({ theme }) => {
 };
 
 // src/components/WfoButtonComboBox/WfoButtonComboBox.tsx
-import { Fragment as Fragment28, jsx as jsx126, jsxs as jsxs71 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment28, jsx as jsx127, jsxs as jsxs72 } from "@emotion/react/jsx-runtime";
 var WfoButtonComboBox = ({
   options,
   onOptionChange,
@@ -43049,7 +43117,7 @@ var WfoButtonComboBox = ({
       setOptionsState(options);
     }
   }, [isPopoverOpen, options]);
-  return /* @__PURE__ */ jsxs71(
+  return /* @__PURE__ */ jsxs72(
     EuiPopover5,
     {
       initialFocus: `.euiSelectable .euiFieldSearch`,
@@ -43057,25 +43125,25 @@ var WfoButtonComboBox = ({
       isOpen: isPopoverOpen,
       closePopover: () => setPopoverOpen(false),
       children: [
-        title && /* @__PURE__ */ jsxs71(Fragment28, { children: [
-          /* @__PURE__ */ jsx126(EuiText10, { size: "s", css: titleStyle, children: title }),
-          /* @__PURE__ */ jsx126(EuiSpacer15, { size: "s" })
+        title && /* @__PURE__ */ jsxs72(Fragment28, { children: [
+          /* @__PURE__ */ jsx127(EuiText10, { size: "s", css: titleStyle, children: title }),
+          /* @__PURE__ */ jsx127(EuiSpacer15, { size: "s" })
         ] }),
-        /* @__PURE__ */ jsx126(
+        /* @__PURE__ */ jsx127(
           EuiSelectable2,
           {
             className,
             css: selectableStyle,
             options: optionsState,
             searchable: true,
-            onChange: (options2, _2, changedOption) => {
+            onChange: (options2, _5, changedOption) => {
               onOptionChange(changedOption);
               setOptionsState(options2);
             },
             height: 200,
-            children: (list, search) => /* @__PURE__ */ jsxs71(Fragment28, { children: [
+            children: (list, search) => /* @__PURE__ */ jsxs72(Fragment28, { children: [
               search,
-              /* @__PURE__ */ jsx126(EuiSpacer15, { size: "s" }),
+              /* @__PURE__ */ jsx127(EuiSpacer15, { size: "s" }),
               list
             ] })
           }
@@ -43114,7 +43182,7 @@ import { EuiFlexGroup as EuiFlexGroup13, EuiFlexItem as EuiFlexItem10, EuiIcon a
 import { useContext as useContext7 } from "react";
 import { useTranslations as useTranslations33 } from "next-intl";
 import {
-  EuiButtonIcon as EuiButtonIcon7,
+  EuiButtonIcon as EuiButtonIcon8,
   EuiFlexGroup as EuiFlexGroup12,
   EuiFlexItem as EuiFlexItem9,
   EuiText as EuiText11,
@@ -43164,11 +43232,11 @@ var getStyles7 = (wfoTheme) => {
 };
 
 // src/icons/WfoXMarkSmall.tsx
-import { jsx as jsx127, jsxs as jsxs72 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx128, jsxs as jsxs73 } from "@emotion/react/jsx-runtime";
 var WfoXMarkSmall = ({
   width = 20,
   height = 20
-}) => /* @__PURE__ */ jsxs72(
+}) => /* @__PURE__ */ jsxs73(
   "svg",
   {
     width,
@@ -43177,8 +43245,8 @@ var WfoXMarkSmall = ({
     version: "1.1",
     xmlns: "http://www.w3.org/2000/svg",
     children: [
-      /* @__PURE__ */ jsx127("title", { children: "icon/x-mark" }),
-      /* @__PURE__ */ jsx127(
+      /* @__PURE__ */ jsx128("title", { children: "icon/x-mark" }),
+      /* @__PURE__ */ jsx128(
         "g",
         {
           id: "Symbols",
@@ -43186,7 +43254,7 @@ var WfoXMarkSmall = ({
           strokeWidth: "1",
           fill: "none",
           fillRule: "evenodd",
-          children: /* @__PURE__ */ jsx127("g", { xmlns: "http://www.w3.org/2000/svg", fill: "currentColor", children: /* @__PURE__ */ jsx127("path", { d: "M5.28 4.22a.75.75 0 0 0-1.06 1.06L6.94 8l-2.72 2.72a.75.75 0 1 0 1.06 1.06L8 9.06l2.72 2.72a.75.75 0 1 0 1.06-1.06L9.06 8l2.72-2.72a.75.75 0 0 0-1.06-1.06L8 6.94 5.28 4.22Z" }) })
+          children: /* @__PURE__ */ jsx128("g", { xmlns: "http://www.w3.org/2000/svg", fill: "currentColor", children: /* @__PURE__ */ jsx128("path", { d: "M5.28 4.22a.75.75 0 0 0-1.06 1.06L6.94 8l-2.72 2.72a.75.75 0 1 0 1.06 1.06L8 9.06l2.72 2.72a.75.75 0 1 0 1.06-1.06L9.06 8l2.72-2.72a.75.75 0 0 0-1.06-1.06L8 6.94 5.28 4.22Z" }) })
         }
       )
     ]
@@ -43194,7 +43262,7 @@ var WfoXMarkSmall = ({
 );
 
 // src/components/WfoTree/WfoTreeNodeListItem.tsx
-import { jsx as jsx128, jsxs as jsxs73 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx129, jsxs as jsxs74 } from "@emotion/react/jsx-runtime";
 var WfoTreeNodeListItem = ({
   item,
   selected
@@ -43205,7 +43273,7 @@ var WfoTreeNodeListItem = ({
   const { selectedTreeItemStyle, treeItemStyle } = useWithOrchestratorTheme(getStyles7);
   const { isOutsideCurrentSubscription, id, label } = item;
   const textLabel = label.toString();
-  return /* @__PURE__ */ jsxs73(
+  return /* @__PURE__ */ jsxs74(
     EuiFlexGroup12,
     {
       alignItems: "center",
@@ -43214,12 +43282,12 @@ var WfoTreeNodeListItem = ({
       gutterSize: "xs",
       justifyContent: "spaceBetween",
       children: [
-        /* @__PURE__ */ jsx128(EuiFlexItem9, { children: /* @__PURE__ */ jsx128(EuiText11, { title: textLabel, children: /* @__PURE__ */ jsx128(EuiTextTruncate, { text: textLabel }) }) }),
-        /* @__PURE__ */ jsx128(EuiFlexItem9, { css: { maxWidth: theme.size.l }, children: /* @__PURE__ */ jsx128(
-          EuiButtonIcon7,
+        /* @__PURE__ */ jsx129(EuiFlexItem9, { children: /* @__PURE__ */ jsx129(EuiText11, { title: textLabel, children: /* @__PURE__ */ jsx129(EuiTextTruncate, { text: textLabel }) }) }),
+        /* @__PURE__ */ jsx129(EuiFlexItem9, { css: { maxWidth: theme.size.l }, children: /* @__PURE__ */ jsx129(
+          EuiButtonIcon8,
           {
             color: "primary",
-            iconType: () => /* @__PURE__ */ jsx128(WfoXMarkSmall, { color: "currentColor" }),
+            iconType: () => /* @__PURE__ */ jsx129(WfoXMarkSmall, { color: "currentColor" }),
             size: "xs",
             "aria-label": t("deselect"),
             css: { display: selected ? "block" : "none" }
@@ -43231,7 +43299,7 @@ var WfoTreeNodeListItem = ({
 };
 
 // src/components/WfoTree/WfoTreeNode.tsx
-import { jsx as jsx129, jsxs as jsxs74 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx130, jsxs as jsxs75 } from "@emotion/react/jsx-runtime";
 var WfoTreeNode = ({
   item,
   hasChildren,
@@ -43243,8 +43311,8 @@ var WfoTreeNode = ({
   const expanded = expandedIds.includes(item.id);
   const selected = selectedIds.includes(item.id);
   const expandIcon = expanded ? "arrowDown" : "arrowRight";
-  return /* @__PURE__ */ jsx129("div", { style: { paddingLeft: `${level * parseInt(theme.size.m)}px` }, children: /* @__PURE__ */ jsxs74(EuiFlexGroup13, { children: [
-    /* @__PURE__ */ jsx129(EuiFlexItem10, { grow: false, css: treeContainerStyle, children: hasChildren ? /* @__PURE__ */ jsx129(
+  return /* @__PURE__ */ jsx130("div", { style: { paddingLeft: `${level * parseInt(theme.size.m)}px` }, children: /* @__PURE__ */ jsxs75(EuiFlexGroup13, { children: [
+    /* @__PURE__ */ jsx130(EuiFlexItem10, { grow: false, css: treeContainerStyle, children: hasChildren ? /* @__PURE__ */ jsx130(
       EuiIcon2,
       {
         type: expandIcon,
@@ -43252,13 +43320,13 @@ var WfoTreeNode = ({
         cursor: "hand",
         onClick: () => expanded ? collapseNode(item.id) : expandNode(item.id)
       }
-    ) : /* @__PURE__ */ jsx129(EuiToken, { iconType: item.icon }) }),
-    /* @__PURE__ */ jsx129(EuiFlexItem10, { children: /* @__PURE__ */ jsx129(WfoTreeNodeListItem, { item, selected }) })
+    ) : /* @__PURE__ */ jsx130(EuiToken, { iconType: item.icon }) }),
+    /* @__PURE__ */ jsx130(EuiFlexItem10, { children: /* @__PURE__ */ jsx130(WfoTreeNodeListItem, { item, selected }) })
   ] }) });
 };
 
 // src/components/WfoTree/WfoTreeBranch.tsx
-import { Fragment as Fragment29, jsx as jsx130, jsxs as jsxs75 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment29, jsx as jsx131, jsxs as jsxs76 } from "@emotion/react/jsx-runtime";
 var WfoTreeBranch = ({ item, level }) => {
   const { expandedIds } = React35.useContext(TreeContext);
   const selected = expandedIds.includes(item.id);
@@ -43269,18 +43337,18 @@ var WfoTreeBranch = ({ item, level }) => {
   const renderBranches = () => {
     if (hasChildren) {
       const newLevel = level + 1;
-      return item.children.map((child) => /* @__PURE__ */ jsx130(WfoTreeBranch, { item: child, level: newLevel }, child.id));
+      return item.children.map((child) => /* @__PURE__ */ jsx131(WfoTreeBranch, { item: child, level: newLevel }, child.id));
     }
     return null;
   };
-  return /* @__PURE__ */ jsxs75(Fragment29, { children: [
-    /* @__PURE__ */ jsx130(
+  return /* @__PURE__ */ jsxs76(Fragment29, { children: [
+    /* @__PURE__ */ jsx131(
       EuiListGroup,
       {
         flush: true,
         color: "primary",
         maxWidth: productBlockTreeWidth,
-        children: /* @__PURE__ */ jsx130(
+        children: /* @__PURE__ */ jsx131(
           WfoTreeNode,
           {
             item,
@@ -43295,13 +43363,13 @@ var WfoTreeBranch = ({ item, level }) => {
 };
 
 // src/components/WfoTree/WfoTree.tsx
-import { jsx as jsx131 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx132 } from "@emotion/react/jsx-runtime";
 var WfoTree = ({ treeBlocks, depthList }) => {
   const { setDepths } = React36.useContext(TreeContext);
   useEffect10(() => {
     setDepths(depthList);
   }, [setDepths, TreeContext]);
-  return /* @__PURE__ */ jsx131("div", { style: { width: "500px" }, children: treeBlocks.map((item) => /* @__PURE__ */ jsx131(WfoTreeBranch, { item, level: 0 }, item.id)) });
+  return /* @__PURE__ */ jsx132("div", { style: { width: "500px" }, children: treeBlocks.map((item) => /* @__PURE__ */ jsx132(WfoTreeBranch, { item, level: 0 }, item.id)) });
 };
 
 // src/components/WfoTree/treeUtils.ts
@@ -43365,7 +43433,7 @@ var getPositionInTree = (tree, id) => {
 };
 
 // src/components/WfoSubscription/WfoSubscriptionDetailTree.tsx
-import { jsx as jsx132, jsxs as jsxs76 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx133, jsxs as jsxs77 } from "@emotion/react/jsx-runtime";
 var EUI_OPTION_CHECKED_STATE_ON = "on";
 var WfoSubscriptionDetailTree = ({
   productBlockInstances,
@@ -43457,7 +43525,7 @@ var WfoSubscriptionDetailTree = ({
     expandAll();
     return shouldAddIds ? selectIds(data.ids) : deselectIds(data.ids);
   };
-  return /* @__PURE__ */ jsxs76(
+  return /* @__PURE__ */ jsxs77(
     EuiFlexGroup14,
     {
       css: {
@@ -43465,7 +43533,7 @@ var WfoSubscriptionDetailTree = ({
         height: `calc(100vh - ${headerHeight}px)`
       },
       children: [
-        /* @__PURE__ */ jsx132(
+        /* @__PURE__ */ jsx133(
           EuiFlexItem11,
           {
             style: {
@@ -43475,16 +43543,16 @@ var WfoSubscriptionDetailTree = ({
               overflowY: "auto"
             },
             grow: true,
-            children: /* @__PURE__ */ jsxs76(EuiFlexGroup14, { direction: "column", children: [
-              /* @__PURE__ */ jsx132(EuiFlexItem11, { grow: false, children: /* @__PURE__ */ jsxs76(
+            children: /* @__PURE__ */ jsxs77(EuiFlexGroup14, { direction: "column", children: [
+              /* @__PURE__ */ jsx133(EuiFlexItem11, { grow: false, children: /* @__PURE__ */ jsxs77(
                 EuiFlexGroup14,
                 {
                   justifyContent: "spaceBetween",
                   alignItems: "center",
                   children: [
-                    /* @__PURE__ */ jsx132(EuiFlexItem11, { children: /* @__PURE__ */ jsx132(EuiText12, { children: /* @__PURE__ */ jsx132("h3", { children: t("productBlocks") }) }) }),
-                    /* @__PURE__ */ jsx132(EuiFlexItem11, { grow: false, children: /* @__PURE__ */ jsxs76(EuiFlexGroup14, { children: [
-                      /* @__PURE__ */ jsx132(
+                    /* @__PURE__ */ jsx133(EuiFlexItem11, { children: /* @__PURE__ */ jsx133(EuiText12, { children: /* @__PURE__ */ jsx133("h3", { children: t("productBlocks") }) }) }),
+                    /* @__PURE__ */ jsx133(EuiFlexItem11, { grow: false, children: /* @__PURE__ */ jsxs77(EuiFlexGroup14, { children: [
+                      /* @__PURE__ */ jsx133(
                         WfoTextAnchor,
                         {
                           text: t(
@@ -43493,7 +43561,7 @@ var WfoSubscriptionDetailTree = ({
                           onClick: toggleShowAll
                         }
                       ),
-                      /* @__PURE__ */ jsx132(
+                      /* @__PURE__ */ jsx133(
                         WfoButtonComboBox,
                         {
                           options: mapProductBlockInstancesToEuiSelectableOptions(
@@ -43501,7 +43569,7 @@ var WfoSubscriptionDetailTree = ({
                           ),
                           onOptionChange: handleOptionChange,
                           title: t("selectByNameTitle"),
-                          children: (togglePopover) => /* @__PURE__ */ jsx132(
+                          children: (togglePopover) => /* @__PURE__ */ jsx133(
                             WfoTextAnchor,
                             {
                               text: t(
@@ -43516,9 +43584,9 @@ var WfoSubscriptionDetailTree = ({
                   ]
                 }
               ) }),
-              /* @__PURE__ */ jsxs76(EuiFlexItem11, { grow: true, children: [
-                !tree && /* @__PURE__ */ jsx132(WfoLoading, {}),
-                tree && /* @__PURE__ */ jsx132(
+              /* @__PURE__ */ jsxs77(EuiFlexItem11, { grow: true, children: [
+                !tree && /* @__PURE__ */ jsx133(WfoLoading, {}),
+                tree && /* @__PURE__ */ jsx133(
                   WfoTree,
                   {
                     treeBlocks: [tree],
@@ -43529,7 +43597,7 @@ var WfoSubscriptionDetailTree = ({
             ] })
           }
         ),
-        /* @__PURE__ */ jsx132(
+        /* @__PURE__ */ jsx133(
           EuiFlexItem11,
           {
             css: {
@@ -43537,10 +43605,10 @@ var WfoSubscriptionDetailTree = ({
               minWidth: 350
             },
             grow: true,
-            children: /* @__PURE__ */ jsxs76("div", { children: [
-              /* @__PURE__ */ jsx132("div", { children: "\xA0" }),
+            children: /* @__PURE__ */ jsxs77("div", { children: [
+              /* @__PURE__ */ jsx133("div", { children: "\xA0" }),
               " ",
-              selectedIds.length === 0 && /* @__PURE__ */ jsx132(
+              selectedIds.length === 0 && /* @__PURE__ */ jsx133(
                 EuiCallOut,
                 {
                   css: {
@@ -43550,7 +43618,7 @@ var WfoSubscriptionDetailTree = ({
                   size: "m",
                   title: t("noProductBlockSelected"),
                   iconType: "inspect",
-                  children: /* @__PURE__ */ jsxs76(EuiText12, { children: [
+                  children: /* @__PURE__ */ jsxs77(EuiText12, { children: [
                     t("ctaSelectProductBlock"),
                     " "
                   ] })
@@ -43558,7 +43626,7 @@ var WfoSubscriptionDetailTree = ({
               ),
               selectedIds.length !== 0 && selectedIds.sort(sortByTree).map((id) => {
                 const block = idToNodeMap[id];
-                return /* @__PURE__ */ jsx132(
+                return /* @__PURE__ */ jsx133(
                   WfoSubscriptionProductBlock,
                   {
                     subscriptionId,
@@ -43578,7 +43646,7 @@ var WfoSubscriptionDetailTree = ({
 
 // src/components/WfoSubscription/WfoSubscriptionGeneral.tsx
 import { EuiFlexGrid, EuiFlexItem as EuiFlexItem12 } from "@elastic/eui";
-import { jsx as jsx133 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx134 } from "@emotion/react/jsx-runtime";
 var WfoSubscriptionGeneralSections = /* @__PURE__ */ ((WfoSubscriptionGeneralSections2) => {
   WfoSubscriptionGeneralSections2["BLOCK_TITLE_SUBSCRIPTION_DETAILS"] = "blockTitleSubscriptionDetails";
   WfoSubscriptionGeneralSections2["BLOCK_TITLE_METADATA"] = "metadata";
@@ -43596,7 +43664,7 @@ var WfoSubscriptionGeneral = ({
   const defaultConfiguration = [
     {
       id: "blockTitleSubscriptionDetails" /* BLOCK_TITLE_SUBSCRIPTION_DETAILS */,
-      node: /* @__PURE__ */ jsx133(
+      node: /* @__PURE__ */ jsx134(
         WfoSubscriptionDetailSection,
         {
           subscriptionDetail
@@ -43606,14 +43674,14 @@ var WfoSubscriptionGeneral = ({
     ...toOptionalArrayEntry(
       {
         id: "metadata" /* BLOCK_TITLE_METADATA */,
-        node: /* @__PURE__ */ jsx133(WfoSubscriptionMetadataSection, { metadata })
+        node: /* @__PURE__ */ jsx134(WfoSubscriptionMetadataSection, { metadata })
       },
       hasMetadata
     ),
     ...toOptionalArrayEntry(
       {
         id: "blockTitleFixedInputs" /* BLOCK_TITLE_FIXED_INPUTS */,
-        node: /* @__PURE__ */ jsx133(
+        node: /* @__PURE__ */ jsx134(
           WfoSubscriptionFixedInputSection,
           {
             fixedInputs
@@ -43624,11 +43692,11 @@ var WfoSubscriptionGeneral = ({
     ),
     {
       id: "blockTitleProductInfo" /* BLOCK_TITLE_PRODUCT_INFO */,
-      node: /* @__PURE__ */ jsx133(WfoSubscriptionProductInfoSection, { product })
+      node: /* @__PURE__ */ jsx134(WfoSubscriptionProductInfoSection, { product })
     }
   ];
   const configuration = overrideSections?.(defaultConfiguration, subscriptionDetail) || defaultConfiguration;
-  return /* @__PURE__ */ jsx133(EuiFlexGrid, { direction: "row", children: configuration.map(({ id, node }) => /* @__PURE__ */ jsx133(EuiFlexItem12, { children: node }, id)) });
+  return /* @__PURE__ */ jsx134(EuiFlexGrid, { direction: "row", children: configuration.map(({ id, node }) => /* @__PURE__ */ jsx134(EuiFlexItem12, { children: node }, id)) });
 };
 
 // src/rtk/endpoints/customerDescriptions.ts
@@ -43679,7 +43747,7 @@ var {
 // src/components/WfoInlineEdit/WfoInlineEdit.tsx
 import { useEffect as useEffect11, useState as useState23 } from "react";
 import { EuiInlineEditText } from "@elastic/eui";
-import { jsx as jsx134 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx135 } from "@emotion/react/jsx-runtime";
 var WfoInlineEdit = ({
   value,
   onlyShowOnHover = false,
@@ -43699,7 +43767,7 @@ var WfoInlineEdit = ({
   useEffect11(() => {
     setValue(value);
   }, [value]);
-  return /* @__PURE__ */ jsx134(
+  return /* @__PURE__ */ jsx135(
     "div",
     {
       css: {
@@ -43713,14 +43781,14 @@ var WfoInlineEdit = ({
           width: "100%"
         }
       },
-      children: /* @__PURE__ */ jsx134(
+      children: /* @__PURE__ */ jsx135(
         WfoToolTip,
         {
           css: {
             visibility: isTooltipVisible && note !== INVISIBLE_CHARACTER ? "visible" : "hidden"
           },
           tooltipContent: note,
-          children: /* @__PURE__ */ jsx134("span", { children: /* @__PURE__ */ jsx134(
+          children: /* @__PURE__ */ jsx135("span", { children: /* @__PURE__ */ jsx135(
             EuiInlineEditText,
             {
               inputAriaLabel: "Edit field",
@@ -43789,7 +43857,7 @@ var WfoInlineEdit = ({
 };
 
 // src/components/WfoSubscription/WfoCustomerDescriptionsField.tsx
-import { jsx as jsx135, jsxs as jsxs77 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx136, jsxs as jsxs78 } from "@emotion/react/jsx-runtime";
 var WfoCustomerDescriptionsField = ({ customerDescriptions, subscriptionCustomerId, subscriptionId }) => {
   const {
     customerDescriptionsCustomerNameStyle,
@@ -43826,14 +43894,14 @@ var WfoCustomerDescriptionsField = ({ customerDescriptions, subscriptionCustomer
     description,
     id,
     subscriptionId: subscriptionId2
-  }) => /* @__PURE__ */ jsxs77("div", { css: { display: "flex" }, children: [
-    /* @__PURE__ */ jsxs77("div", { css: customerDescriptionsCustomerNameStyle, children: [
+  }) => /* @__PURE__ */ jsxs78("div", { css: { display: "flex" }, children: [
+    /* @__PURE__ */ jsxs78("div", { css: customerDescriptionsCustomerNameStyle, children: [
       fullname ?? customerId,
       " ",
       `${shortcode ?? customerId}`,
       ":"
     ] }),
-    /* @__PURE__ */ jsx135(
+    /* @__PURE__ */ jsx136(
       WfoInlineEdit,
       {
         value: description,
@@ -43848,7 +43916,7 @@ var WfoCustomerDescriptionsField = ({ customerDescriptions, subscriptionCustomer
   ] }, customerId);
   const customerDescriptionCreateForm = () => {
     if (!subscriptionCustomerId) return;
-    return /* @__PURE__ */ jsx135("div", { children: /* @__PURE__ */ jsx135(
+    return /* @__PURE__ */ jsx136("div", { children: /* @__PURE__ */ jsx136(
       WfoInlineEdit,
       {
         value: INVISIBLE_CHARACTER,
@@ -43864,7 +43932,7 @@ var WfoCustomerDescriptionsField = ({ customerDescriptions, subscriptionCustomer
   const currentCustomerSubscriptionDescription = customerDescriptionsWithName.find(
     ({ customerId }) => customerId === subscriptionCustomerId
   );
-  return /* @__PURE__ */ jsxs77("div", { css: customerDescriptionsFormStyle, children: [
+  return /* @__PURE__ */ jsxs78("div", { css: customerDescriptionsFormStyle, children: [
     currentCustomerSubscriptionDescription && customerDescriptionEditForm(
       currentCustomerSubscriptionDescription
     ) || customerDescriptionCreateForm(),
@@ -43906,7 +43974,7 @@ var getWfoTableSettingsModalStyles = (wfoTheme) => {
 };
 
 // src/components/WfoTable/WfoTableSettingsModal/WfoTableSettingsModal.tsx
-import { jsx as jsx136, jsxs as jsxs78 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx137, jsxs as jsxs79 } from "@emotion/react/jsx-runtime";
 var TableSettingsModal = ({
   tableConfig,
   pageSizeOptions,
@@ -43935,7 +44003,7 @@ var TableSettingsModal = ({
     );
     setColumns(updatedColumns);
   };
-  return /* @__PURE__ */ jsx136(
+  return /* @__PURE__ */ jsx137(
     WfoSettingsModal,
     {
       title: t("tableSettings"),
@@ -43945,15 +44013,15 @@ var TableSettingsModal = ({
         columns,
         selectedPageSize
       }),
-      children: /* @__PURE__ */ jsxs78(EuiForm2, { children: [
-        columns.map(({ field, name, isVisible }) => /* @__PURE__ */ jsxs78("div", { children: [
-          /* @__PURE__ */ jsx136(
+      children: /* @__PURE__ */ jsxs79(EuiForm2, { children: [
+        columns.map(({ field, name, isVisible }) => /* @__PURE__ */ jsxs79("div", { children: [
+          /* @__PURE__ */ jsx137(
             EuiFormRow3,
             {
               display: "columnCompressed",
               label: name,
               css: formRowStyle,
-              children: /* @__PURE__ */ jsx136(
+              children: /* @__PURE__ */ jsx137(
                 EuiSwitch2,
                 {
                   showLabel: false,
@@ -43967,17 +44035,17 @@ var TableSettingsModal = ({
               )
             }
           ),
-          /* @__PURE__ */ jsx136(EuiHorizontalRule3, { margin: "xs" })
+          /* @__PURE__ */ jsx137(EuiHorizontalRule3, { margin: "xs" })
         ] }, field.toString())),
-        /* @__PURE__ */ jsx136(EuiSpacer16, { size: "xs" }),
-        /* @__PURE__ */ jsx136(
+        /* @__PURE__ */ jsx137(EuiSpacer16, { size: "xs" }),
+        /* @__PURE__ */ jsx137(
           EuiFormRow3,
           {
             css: formRowStyle,
             hasEmptyLabelSpace: true,
             label: t("numberOfRows"),
             display: "columnCompressed",
-            children: /* @__PURE__ */ jsx136(
+            children: /* @__PURE__ */ jsx137(
               EuiSelect,
               {
                 css: selectFieldStyle,
@@ -44046,12 +44114,12 @@ var getWfoStatusColorFieldStyles = ({ theme }) => {
 };
 
 // src/components/WfoTable/WfoStatusColorField/WfoStatusColorField.tsx
-import { jsx as jsx137 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx138 } from "@emotion/react/jsx-runtime";
 var WfoStatusColorField = ({ color }) => {
   const { getStatusColorFieldStyle } = useWithOrchestratorTheme(
     getWfoStatusColorFieldStyles
   );
-  return /* @__PURE__ */ jsx137("div", { css: getStatusColorFieldStyle(color) });
+  return /* @__PURE__ */ jsx138("div", { css: getStatusColorFieldStyle(color) });
 };
 
 // src/components/WfoTable/WfoTableWithFilter/updateQueryString.ts
@@ -44106,7 +44174,7 @@ var getStyles8 = () => {
 };
 
 // src/components/WfoTable/WfoSortButtons/WfoSortButton.tsx
-import { jsx as jsx138 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx139 } from "@emotion/react/jsx-runtime";
 var WfoSortButton = ({
   WfoIconComponent,
   isActive,
@@ -44114,12 +44182,12 @@ var WfoSortButton = ({
 }) => {
   const { theme } = useOrchestratorTheme();
   const { getSortButtonStyle } = getStyles8();
-  return /* @__PURE__ */ jsx138(
+  return /* @__PURE__ */ jsx139(
     "button",
     {
       css: getSortButtonStyle(isActive),
       onClick: () => isActive && onClick?.(),
-      children: /* @__PURE__ */ jsx138(
+      children: /* @__PURE__ */ jsx139(
         WfoIconComponent,
         {
           color: isActive ? theme.colors.title : theme.colors.lightShade
@@ -44130,14 +44198,14 @@ var WfoSortButton = ({
 };
 
 // src/components/WfoTable/WfoSortButtons/WfoSortButtons.tsx
-import { jsx as jsx139, jsxs as jsxs79 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx140, jsxs as jsxs80 } from "@emotion/react/jsx-runtime";
 var WfoSortButtons = ({
   sortOrder,
   onChangeSortOrder
 }) => {
   const { sortButtonsContainerStyle } = getStyles8();
-  return /* @__PURE__ */ jsxs79("div", { css: sortButtonsContainerStyle, children: [
-    /* @__PURE__ */ jsx139(
+  return /* @__PURE__ */ jsxs80("div", { css: sortButtonsContainerStyle, children: [
+    /* @__PURE__ */ jsx140(
       WfoSortButton,
       {
         WfoIconComponent: WfoSortAsc,
@@ -44145,7 +44213,7 @@ var WfoSortButtons = ({
         onClick: () => onChangeSortOrder("ASC" /* ASC */)
       }
     ),
-    /* @__PURE__ */ jsx139(
+    /* @__PURE__ */ jsx140(
       WfoSortButton,
       {
         WfoIconComponent: WfoSortDesc,
@@ -44185,22 +44253,22 @@ var getStyles9 = ({ theme }) => {
 };
 
 // src/components/WfoTable/WfoFirstPartUUID/WfoFirstPartUUID.tsx
-import { jsx as jsx140, jsxs as jsxs80 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx141, jsxs as jsxs81 } from "@emotion/react/jsx-runtime";
 var WfoFirstPartUUID = ({
   UUID,
   showCopyIcon = true
 }) => {
   const { uuidFieldStyle, clickable } = useWithOrchestratorTheme(getStyles9);
   const { theme } = useOrchestratorTheme();
-  return /* @__PURE__ */ jsxs80("span", { css: uuidFieldStyle, children: [
+  return /* @__PURE__ */ jsxs81("span", { css: uuidFieldStyle, children: [
     getFirstUuidPart(UUID),
-    showCopyIcon && /* @__PURE__ */ jsx140(EuiCopy2, { textToCopy: UUID, children: (copy) => /* @__PURE__ */ jsx140(
+    showCopyIcon && /* @__PURE__ */ jsx141(EuiCopy2, { textToCopy: UUID, children: (copy) => /* @__PURE__ */ jsx141(
       "div",
       {
         className: COPY_ICON_CLASS,
         onClick: copy,
         css: clickable,
-        children: /* @__PURE__ */ jsx140(
+        children: /* @__PURE__ */ jsx141(
           WfoClipboardCopy,
           {
             width: 16,
@@ -44214,61 +44282,22 @@ var WfoFirstPartUUID = ({
 };
 
 // src/components/WfoTable/WfoInlineJson/WfoInlineJson.tsx
-import { jsx as jsx141 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx142 } from "@emotion/react/jsx-runtime";
 var WfoInlineJson = ({ data }) => {
   if (!data) {
     return null;
   }
   const valueAsString = JSON.stringify(data);
-  return /* @__PURE__ */ jsx141("span", { children: valueAsString });
+  return /* @__PURE__ */ jsx142("span", { children: valueAsString });
 };
 
 // src/components/WfoTable/WfoRowContextMenu/WfoRowContextMenu.tsx
 import { useEffect as useEffect12, useRef as useRef9, useState as useState25 } from "react";
 import {
-  EuiButtonIcon as EuiButtonIcon8,
+  EuiButtonIcon as EuiButtonIcon9,
   EuiContextMenu as EuiContextMenu2,
   EuiPopover as EuiPopover6
 } from "@elastic/eui";
-
-// src/icons/WfoDotsHorizontal.tsx
-import { jsx as jsx142, jsxs as jsxs81 } from "@emotion/react/jsx-runtime";
-var WfoDotsHorizontal = ({
-  width = 20,
-  height = 20,
-  color = "currentColor"
-}) => /* @__PURE__ */ jsxs81(
-  "svg",
-  {
-    width,
-    height,
-    viewBox: "0 0 24 24",
-    version: "1.1",
-    xmlns: "http://www.w3.org/2000/svg",
-    children: [
-      /* @__PURE__ */ jsx142("title", { children: "icon/dots-horizontal" }),
-      /* @__PURE__ */ jsx142(
-        "g",
-        {
-          id: "Symbols",
-          stroke: "none",
-          strokeWidth: "1",
-          fill: "none",
-          fillRule: "evenodd",
-          children: /* @__PURE__ */ jsx142("g", { id: "icon/dots-horizontal", fill: color, fillRule: "nonzero", children: /* @__PURE__ */ jsx142(
-            "path",
-            {
-              d: "M8,12 C8,13.1046 7.10457,14 6,14 C4.89543,14 4,13.1046 4,12 C4,10.89543 4.89543,10 6,10 C7.10457,10 8,10.89543 8,12 Z M14,12 C14,13.1046 13.1046,14 12,14 C10.89543,14 10,13.1046 10,12 C10,10.89543 10.89543,10 12,10 C13.1046,10 14,10.89543 14,12 Z M18,14 C19.1046,14 20,13.1046 20,12 C20,10.89543 19.1046,10 18,10 C16.8954,10 16,10.89543 16,12 C16,13.1046 16.8954,14 18,14 Z",
-              id: "Combined-Shape"
-            }
-          ) })
-        }
-      )
-    ]
-  }
-);
-
-// src/components/WfoTable/WfoRowContextMenu/WfoRowContextMenu.tsx
 import { jsx as jsx143 } from "@emotion/react/jsx-runtime";
 var WfoRowContextMenu = ({
   items,
@@ -44287,7 +44316,7 @@ var WfoRowContextMenu = ({
     EuiPopover6,
     {
       button: /* @__PURE__ */ jsx143(
-        EuiButtonIcon8,
+        EuiButtonIcon9,
         {
           iconType: () => /* @__PURE__ */ jsx143(WfoDotsHorizontal, {}),
           onClick: togglePopover,
@@ -44348,7 +44377,7 @@ import { useEffect as useEffect13, useState as useState26 } from "react";
 import { useTranslations as useTranslations36 } from "next-intl";
 import {
   EuiButton as EuiButton8,
-  EuiButtonIcon as EuiButtonIcon9,
+  EuiButtonIcon as EuiButtonIcon10,
   EuiFlexGroup as EuiFlexGroup15,
   EuiFlexItem as EuiFlexItem13,
   EuiSpacer as EuiSpacer17,
@@ -44448,7 +44477,7 @@ var WfoAdvancedTable = ({
         }
       ) }),
       /* @__PURE__ */ jsx145(EuiFlexItem13, { grow: false, children: /* @__PURE__ */ jsx145(
-        EuiButtonIcon9,
+        EuiButtonIcon10,
         {
           onClick: () => setShowSearchModal(true),
           iconSize: "xl",
@@ -47369,7 +47398,7 @@ import {
   useForm as useForm8
 } from "uniforms";
 import {
-  EuiButtonIcon as EuiButtonIcon10,
+  EuiButtonIcon as EuiButtonIcon11,
   EuiFlexGroup as EuiFlexGroup16,
   EuiFlexItem as EuiFlexItem20,
   EuiFormRow as EuiFormRow18,
@@ -47547,7 +47576,7 @@ function SubscriptionFieldDefinition({
                 gutterSize: "none",
                 responsive: false,
                 children: /* @__PURE__ */ jsx178(
-                  EuiButtonIcon10,
+                  EuiButtonIcon11,
                   {
                     className: "reload-subscriptions-icon-button",
                     id: `refresh-icon-${id}`,
@@ -47765,7 +47794,7 @@ function Summary({
     return null;
   }
   const { headers, labels, columns } = data;
-  const extraColumnsData = columns.filter((_2, index) => index !== 0);
+  const extraColumnsData = columns.filter((_5, index) => index !== 0);
   const rows = columns[0].map((row, index) => /* @__PURE__ */ jsxs98("tr", { children: [
     labels && /* @__PURE__ */ jsx181("td", { className: `label`, children: labels[index] }),
     /* @__PURE__ */ jsx181("td", { className: `value`, children: typeof row === "string" && row.includes("<!doctype html>") ? /* @__PURE__ */ jsx181(
@@ -47775,7 +47804,7 @@ function Summary({
         dangerouslySetInnerHTML: { __html: row }
       }
     ) : row }),
-    extraColumnsData && extraColumnsData.map((_2, idx) => /* @__PURE__ */ jsx181("td", { className: `value`, children: extraColumnsData[idx][index] }, idx))
+    extraColumnsData && extraColumnsData.map((_5, idx) => /* @__PURE__ */ jsx181("td", { className: `value`, children: extraColumnsData[idx][index] }, idx))
   ] }, index));
   const tableHeader = !headers || headers.length === 0 ? null : /* @__PURE__ */ jsxs98("tr", { children: [
     labels && /* @__PURE__ */ jsx181("th", {}),
@@ -50329,7 +50358,7 @@ var WfoProcessDetailPage = ({
 };
 
 // src/pages/processes/WfoStartProcessPage.tsx
-import { useCallback as useCallback9, useEffect as useEffect34, useMemo as useMemo7, useState as useState50 } from "react";
+import { useCallback as useCallback9, useEffect as useEffect34, useMemo as useMemo7, useState as useState51 } from "react";
 import { useTranslations as useTranslations69 } from "next-intl";
 import { useRouter as useRouter10 } from "next/router";
 import {
@@ -50342,6 +50371,7 @@ import {
 
 // src/components/WfoPydanticForm/WfoPydanticForm.tsx
 import { useCallback as useCallback6, useMemo as useMemo4 } from "react";
+import _4 from "lodash";
 import { useMessages, useTranslations as useTranslations62 } from "next-intl";
 import { useRouter as useRouter9 } from "next/router";
 import {
@@ -50527,6 +50557,8 @@ var WfoTextArea = ({
 };
 
 // src/components/WfoPydanticForm/fields/WfoText.tsx
+import _2 from "lodash";
+import { getFormFieldIdWithPath } from "pydantic-forms";
 import { EuiFieldText as EuiFieldText4 } from "@elastic/eui";
 import { jsx as jsx208 } from "@emotion/react/jsx-runtime";
 var WfoText = ({
@@ -50538,6 +50570,8 @@ var WfoText = ({
   const { formFieldBaseStyle } = useWithOrchestratorTheme(
     getFormFieldsBaseStyle
   );
+  const fieldName = getFormFieldIdWithPath(pydanticFormField.id);
+  const fieldValue = _2.isObject(value) && _2.has(value, fieldName) ? _2.get(value, fieldName) : value;
   return /* @__PURE__ */ jsx208(
     EuiFieldText4,
     {
@@ -50545,7 +50579,7 @@ var WfoText = ({
       css: formFieldBaseStyle,
       disabled,
       onChange: (event) => onChange(event.target.value),
-      value: value ?? "",
+      value: fieldValue,
       fullWidth: true
     }
   );
@@ -50618,7 +50652,7 @@ var WfoSummary = ({ pydanticFormField }) => {
   const headers = summaryData?.headers;
   const labels = summaryData?.labels;
   const columns = summaryData?.columns || [];
-  const extraColumnsData = columns.filter((_2, index) => index !== 0);
+  const extraColumnsData = columns.filter((_5, index) => index !== 0);
   const rows = columns[0].map((row, index) => /* @__PURE__ */ jsxs111("tr", { children: [
     labels && /* @__PURE__ */ jsx212("td", { className: `label`, children: getNestedSummaryLabel(labels, index) }),
     /* @__PURE__ */ jsx212("td", { className: `value`, children: typeof row === "string" && row.includes("<!doctype html>") ? /* @__PURE__ */ jsx212(
@@ -50628,7 +50662,7 @@ var WfoSummary = ({ pydanticFormField }) => {
         dangerouslySetInnerHTML: { __html: row }
       }
     ) : row }),
-    extraColumnsData && extraColumnsData.map((_2, idx) => /* @__PURE__ */ jsx212("td", { className: `value`, children: extraColumnsData[idx][index].toString() }, idx))
+    extraColumnsData && extraColumnsData.map((_5, idx) => /* @__PURE__ */ jsx212("td", { className: `value`, children: extraColumnsData[idx][index].toString() }, idx))
   ] }, index));
   const tableHeader = !headers || headers.length === 0 ? null : /* @__PURE__ */ jsxs111("tr", { children: [
     labels && /* @__PURE__ */ jsx212("th", {}),
@@ -51463,7 +51497,7 @@ var WfoRadio = ({
   value,
   disabled
 }) => {
-  const radioOptions = pydanticFormField.options.map((option) => ({
+  const radioOptions = pydanticFormField.options?.map((option) => ({
     id: option.value,
     label: option.label
   }));
@@ -51471,7 +51505,7 @@ var WfoRadio = ({
     EuiRadioGroup,
     {
       "data-testid": pydanticFormField.id,
-      options: radioOptions,
+      options: radioOptions || [],
       idSelected: value,
       onChange: (id) => onChange(id),
       name: pydanticFormField.id,
@@ -51481,6 +51515,8 @@ var WfoRadio = ({
 };
 
 // src/components/WfoPydanticForm/fields/WfoInteger.tsx
+import _3 from "lodash";
+import { getFormFieldIdWithPath as getFormFieldIdWithPath2 } from "pydantic-forms";
 import { EuiFieldNumber as EuiFieldNumber2 } from "@elastic/eui";
 import { css as css38 } from "@emotion/react";
 import { jsx as jsx216 } from "@emotion/react/jsx-runtime";
@@ -51505,6 +51541,8 @@ var WfoInteger = ({
   const { formFieldBaseStyle } = useWithOrchestratorTheme(
     getFormFieldsBaseStyle2
   );
+  const fieldName = getFormFieldIdWithPath2(pydanticFormField.id);
+  const fieldValue = _3.isObject(value) && _3.has(value, fieldName) ? _3.get(value, fieldName) : value;
   return /* @__PURE__ */ jsx216(
     EuiFieldNumber2,
     {
@@ -51512,16 +51550,16 @@ var WfoInteger = ({
       css: formFieldBaseStyle,
       name: pydanticFormField.id,
       onChange: (event) => onChange(parseInt(event.target.value)),
-      value,
+      value: fieldValue,
       disabled
     }
   );
 };
 
 // src/components/WfoPydanticForm/fields/WfoReactSelect/WfoReactSelect.tsx
-import React67, { useEffect as useEffect30 } from "react";
+import { useEffect as useEffect30, useState as useState44 } from "react";
 import ReactSelect5, { components } from "react-select";
-import { EuiButtonIcon as EuiButtonIcon11 } from "@elastic/eui";
+import { EuiButtonIcon as EuiButtonIcon12 } from "@elastic/eui";
 
 // src/components/WfoPydanticForm/fields/WfoReactSelect/styles.ts
 import { css as css39 } from "@emotion/react";
@@ -51595,16 +51633,18 @@ var WfoReactSelect = ({
   hasError = false,
   refetch
 }) => {
-  useEffect30(() => {
-    const selectedValue2 = options.find(
-      (option) => option.value === value
-    );
-    setSelectedValue(selectedValue2 || null);
-  }, [options, value]);
   const initialValue = options.find(
     (option) => option.value === value
   );
-  const [selectedValue, setSelectedValue] = React67.useState(initialValue || null);
+  const [selectedValue, setSelectedValue] = useState44(initialValue || null);
+  useEffect30(() => {
+    const preSelectedValue = options.find(
+      (option) => option.value === value
+    );
+    if (preSelectedValue !== selectedValue) {
+      setSelectedValue(preSelectedValue || null);
+    }
+  }, [options, selectedValue, value]);
   const {
     reactSelectInnerComponentStyles,
     containerStyle,
@@ -51621,7 +51661,7 @@ var WfoReactSelect = ({
   };
   return /* @__PURE__ */ jsxs113("div", { css: containerStyle, children: [
     refetch && /* @__PURE__ */ jsx217(
-      EuiButtonIcon11,
+      EuiButtonIcon12,
       {
         className: "reload-subscriptions-icon-button",
         css: refreshButtonStyle,
@@ -51644,7 +51684,7 @@ var WfoReactSelect = ({
         onChange: (option) => {
           if (option === null) {
             setSelectedValue(null);
-            onChange(void 0);
+            onChange(null);
           } else {
             const selectedValue2 = option?.value;
             setSelectedValue(option);
@@ -51675,14 +51715,14 @@ var WfoDropdown = ({
   pydanticFormField,
   value
 }) => {
-  const dropDownOptions = pydanticFormField.options.map((option) => ({
+  const dropDownOptions = pydanticFormField.options?.map((option) => ({
     value: option.value,
     label: option.label
   }));
   return /* @__PURE__ */ jsx218(
     WfoReactSelect,
     {
-      options: dropDownOptions,
+      options: dropDownOptions || [],
       onChange,
       id: pydanticFormField.id,
       value
@@ -51691,7 +51731,7 @@ var WfoDropdown = ({
 };
 
 // src/components/WfoPydanticForm/fields/WfoMultiCheckboxField.tsx
-import { useEffect as useEffect31, useState as useState44 } from "react";
+import { useEffect as useEffect31, useState as useState45 } from "react";
 import { EuiCheckboxGroup } from "@elastic/eui";
 import { jsx as jsx219 } from "@emotion/react/jsx-runtime";
 var WfoMultiCheckboxField = ({
@@ -51712,9 +51752,9 @@ var WfoMultiCheckboxField = ({
     };
     setCheckboxIdToSelectedMap(getInitialMap());
   }, [value]);
-  const [checkboxIdToSelectedMap, setCheckboxIdToSelectedMap] = useState44({});
+  const [checkboxIdToSelectedMap, setCheckboxIdToSelectedMap] = useState45({});
   const { options, id } = pydanticFormField;
-  const checkboxes = options.map((option, index) => ({
+  const checkboxes = options?.map((option, index) => ({
     label: option.label,
     id: option.value,
     "data-test-id": `${id}-${index}`
@@ -51735,7 +51775,7 @@ var WfoMultiCheckboxField = ({
   return /* @__PURE__ */ jsx219(
     EuiCheckboxGroup,
     {
-      options: checkboxes,
+      options: checkboxes || [],
       idToSelectedMap: checkboxIdToSelectedMap,
       onChange: (id2) => handleCheckboxChange(id2),
       "data-testid": id
@@ -51848,7 +51888,7 @@ var useWfoPydanticFormConfig = () => {
             isControlledElement: true
           },
           matcher(field) {
-            return field.type === PydanticFormFieldType.STRING && Array.isArray(field.options) && field.options.length > 0;
+            return field.type === PydanticFormFieldType.STRING && _4.isArray(field.options) && field.options.length > 0;
           }
         },
         {
@@ -51869,7 +51909,7 @@ var useWfoPydanticFormConfig = () => {
             isControlledElement: true
           },
           matcher(field) {
-            return field.type === PydanticFormFieldType.ARRAY && field.options?.length > 0 && field.options?.length <= 5;
+            return field.type === PydanticFormFieldType.ARRAY && _4.isArray(field.options) && field.options?.length > 0 && field.options?.length <= 5;
           },
           validator: zodValidationPresets.multiSelect
         },
@@ -52017,7 +52057,7 @@ var WfoPydanticForm = ({
 };
 
 // src/components/WfoWorkflowSteps/WfoStep/WfoStep.tsx
-import React72, { useState as useState46 } from "react";
+import React72, { useState as useState47 } from "react";
 import { useTranslations as useTranslations64 } from "next-intl";
 import {
   EuiButton as EuiButton13,
@@ -52028,7 +52068,7 @@ import {
 } from "@elastic/eui";
 
 // src/components/WfoWorkflowSteps/WfoStep/WfoStepFormOld.tsx
-import { useState as useState45 } from "react";
+import { useState as useState46 } from "react";
 import { EuiFlexItem as EuiFlexItem25 } from "@elastic/eui";
 import { jsx as jsx221 } from "@emotion/react/jsx-runtime";
 var WfoStepFormOld = ({
@@ -52037,8 +52077,8 @@ var WfoStepFormOld = ({
   processId,
   userPermissions
 }) => {
-  const [isProcessing, setIsProcessing] = useState45(false);
-  const [hasError, setHasError] = useState45(false);
+  const [isProcessing, setIsProcessing] = useState46(false);
+  const [hasError, setHasError] = useState46(false);
   const { theme } = useOrchestratorTheme();
   const [resumeProcess] = useResumeProcessMutation();
   const submitForm = (processInput) => {
@@ -52428,7 +52468,7 @@ var WfoStep = React72.forwardRef(
     userPermissions
   }, ref) => {
     const { isExpanded, step, userInputForm } = stepListItem;
-    const [tableView, setTableView] = useState46(false);
+    const [tableView, setTableView] = useState47(false);
     const { theme } = useOrchestratorTheme();
     const {
       stepEmailContainerStyle,
@@ -52668,19 +52708,19 @@ var WfoStepList = React73.forwardRef(
 WfoStepList.displayName = "WfoStepList";
 
 // src/components/WfoWorkflowSteps/WfoWorkflowStepList/WfoWorkflowStepList.tsx
-import React75, { useEffect as useEffect33, useState as useState48 } from "react";
+import React75, { useEffect as useEffect33, useState as useState49 } from "react";
 import { useTranslations as useTranslations67 } from "next-intl";
 
 // src/components/WfoDiff/WfoDiff.tsx
 var refractor = __toESM(require_refractor(), 1);
-import { useCallback as useCallback8, useEffect as useEffect32, useMemo as useMemo6, useState as useState47 } from "react";
+import { useCallback as useCallback8, useEffect as useEffect32, useMemo as useMemo6, useState as useState48 } from "react";
 import { Diff, Hunk, parseDiff, tokenize } from "react-diff-view";
 import "react-diff-view/style/index.css";
 import { useTranslations as useTranslations65 } from "next-intl";
 import "prism-themes/themes/prism-ghcolors.min.css";
 import { diffLines, formatLines } from "unidiff";
 import {
-  EuiButtonIcon as EuiButtonIcon12,
+  EuiButtonIcon as EuiButtonIcon13,
   EuiFlexGroup as EuiFlexGroup23,
   EuiFlexItem as EuiFlexItem29,
   EuiSpacer as EuiSpacer20,
@@ -52730,10 +52770,10 @@ var SMALL_CONTEXT = 3;
 var FULL_CONTEXT = 1e6;
 var WfoDiff = ({ oldText, newText, syntax }) => {
   const t = useTranslations65("processes.delta");
-  const [showSplit, setShowSplit] = useState47(true);
-  const [showFull, setShowFull] = useState47(false);
+  const [showSplit, setShowSplit] = useState48(true);
+  const [showFull, setShowFull] = useState48(false);
   const { diffStyle } = useWithOrchestratorTheme(getWfoDiffStyles);
-  const [{ type, hunks }, setDiff] = useState47({
+  const [{ type, hunks }, setDiff] = useState48({
     type: "modify",
     hunks: []
   });
@@ -52766,7 +52806,7 @@ var WfoDiff = ({ oldText, newText, syntax }) => {
     /* @__PURE__ */ jsxs118(EuiFlexGroup23, { gutterSize: "xs", children: [
       /* @__PURE__ */ jsx227(EuiFlexItem29, { grow: false, children: /* @__PURE__ */ jsx227(EuiText38, { children: /* @__PURE__ */ jsx227("h3", { children: t("title") }) }) }),
       /* @__PURE__ */ jsx227(EuiFlexItem29, { grow: false, children: /* @__PURE__ */ jsx227(
-        EuiButtonIcon12,
+        EuiButtonIcon13,
         {
           size: "s",
           iconType: showSplit ? "continuityAboveBelow" : "continuityWithin",
@@ -52777,7 +52817,7 @@ var WfoDiff = ({ oldText, newText, syntax }) => {
         }
       ) }),
       /* @__PURE__ */ jsx227(EuiFlexItem29, { grow: false, children: /* @__PURE__ */ jsx227(
-        EuiButtonIcon12,
+        EuiButtonIcon13,
         {
           size: "s",
           iconType: showFull ? "fullScreenExit" : "fullScreen",
@@ -52866,16 +52906,16 @@ var WfoWorkflowStepList = React75.forwardRef(
     userInputForm,
     userPermissions
   }, reference) => {
-    const [showHiddenKeys, setShowHiddenKeys] = useState48(false);
-    const [showRaw, setShowRaw] = useState48(false);
-    const [showDelta, setShowDelta] = useState48(false);
-    const [showTraceback, setShowTraceback] = useState48(false);
+    const [showHiddenKeys, setShowHiddenKeys] = useState49(false);
+    const [showRaw, setShowRaw] = useState49(false);
+    const [showDelta, setShowDelta] = useState49(false);
+    const [showTraceback, setShowTraceback] = useState49(false);
     const t = useTranslations67("processes.steps");
     const initialStepListItems = steps.map((step) => ({
       step,
       isExpanded: false
     }));
-    const [stepListItems, setStepListItems] = useState48(initialStepListItems);
+    const [stepListItems, setStepListItems] = useState49(initialStepListItems);
     const persistStepListItemState = (previousStepListItems, updatedSteps, userInputForm2) => {
       const reversedSteps = [...updatedSteps].reverse();
       const lastStepWithSuspendStatusStepId = reversedSteps.find(
@@ -52971,7 +53011,7 @@ var WfoWorkflowStepList = React75.forwardRef(
 WfoWorkflowStepList.displayName = "WfoWorkflowStepList";
 
 // src/components/WfoWorkflowSteps/WfoWorkflowStepList/WfoStepListHeader.tsx
-import { useState as useState49 } from "react";
+import { useState as useState50 } from "react";
 import { useTranslations as useTranslations68 } from "next-intl";
 import {
   EuiButton as EuiButton14,
@@ -53034,7 +53074,7 @@ var WfoStepListHeader = ({
     stepListContentBoldTextStyle,
     stepListOptionsContainerStyle
   } = useWithOrchestratorTheme(getWorkflowStepsStyles);
-  const [isViewOptionOpen, setIsViewOptionOpen] = useState49(false);
+  const [isViewOptionOpen, setIsViewOptionOpen] = useState50(false);
   const onViewOptionClick = () => setIsViewOptionOpen((isViewOptionOpen2) => !isViewOptionOpen2);
   const closeViewOption = () => setIsViewOptionOpen(false);
   const viewOptionButton = /* @__PURE__ */ jsx231(
@@ -53154,9 +53194,9 @@ var WfoStartProcessPage = ({
 }) => {
   const t = useTranslations69("processes.steps");
   const router = useRouter10();
-  const [hasError, setHasError] = useState50(false);
+  const [hasError, setHasError] = useState51(false);
   const { theme } = useOrchestratorTheme();
-  const [form, setForm] = useState50({});
+  const [form, setForm] = useState51({});
   const { productId, subscriptionId } = router.query;
   const {
     data: subscriptionDetail,
@@ -53313,7 +53353,7 @@ var WfoStartProcessPage = ({
 
 // src/pages/processes/WfoProductInformationWithLink.tsx
 import { useTranslations as useTranslations70 } from "next-intl";
-import { EuiButtonIcon as EuiButtonIcon13, EuiFlexGroup as EuiFlexGroup26, EuiText as EuiText43, EuiToolTip as EuiToolTip8 } from "@elastic/eui";
+import { EuiButtonIcon as EuiButtonIcon14, EuiFlexGroup as EuiFlexGroup26, EuiText as EuiText43, EuiToolTip as EuiToolTip8 } from "@elastic/eui";
 import { jsx as jsx233, jsxs as jsxs123 } from "@emotion/react/jsx-runtime";
 var WfoProductInformationWithLink = ({
   workflowName,
@@ -53324,7 +53364,7 @@ var WfoProductInformationWithLink = ({
   const docsUrl = workflowInformationLinkUrl + workflowName;
   return /* @__PURE__ */ jsxs123(EuiFlexGroup26, { gutterSize: "s", alignItems: "center", children: [
     showWorkflowInformationLink && /* @__PURE__ */ jsx233(EuiToolTip8, { content: t("openWorkflowTaskInfo"), children: /* @__PURE__ */ jsx233("a", { href: docsUrl, target: "_blank", children: /* @__PURE__ */ jsx233(
-      EuiButtonIcon13,
+      EuiButtonIcon14,
       {
         iconSize: "l",
         iconType: "iInCircle",
@@ -53574,14 +53614,14 @@ var WfoSubscriptionDetailPage = () => {
 };
 
 // src/pages/subscriptions/WfoSubscriptionsListPage.tsx
-import { useEffect as useEffect35, useState as useState51 } from "react";
+import { useEffect as useEffect35, useState as useState52 } from "react";
 import { useTranslations as useTranslations74 } from "next-intl";
 import { StringParam as StringParam4, useQueryParam as useQueryParam3, withDefault as withDefault4 } from "use-query-params";
 import { EuiSpacer as EuiSpacer23 } from "@elastic/eui";
 import { Fragment as Fragment58, jsx as jsx238, jsxs as jsxs127 } from "@emotion/react/jsx-runtime";
 var WfoSubscriptionsListPage = () => {
   const t = useTranslations74("subscriptions.detail");
-  const [tableDefaults, setTableDefaults] = useState51();
+  const [tableDefaults, setTableDefaults] = useState52();
   const getStoredTableConfig = useStoredTableConfig(
     SUBSCRIPTIONS_TABLE_LOCAL_STORAGE_KEY
   );
@@ -53646,7 +53686,7 @@ var WfoSubscriptionsListPage = () => {
 };
 
 // src/pages/tasks/WfoTasksListPage.tsx
-import { useContext as useContext11, useEffect as useEffect36, useState as useState52 } from "react";
+import { useContext as useContext11, useEffect as useEffect36, useState as useState53 } from "react";
 import { useTranslations as useTranslations75 } from "next-intl";
 import Link11 from "next/link";
 import { useRouter as useRouter12 } from "next/router";
@@ -53724,7 +53764,7 @@ var WfoTasksListPage = () => {
     "activeTab",
     withDefault5(StringParam5, "ACTIVE" /* ACTIVE */)
   );
-  const [tableDefaults, setTableDefaults] = useState52();
+  const [tableDefaults, setTableDefaults] = useState53();
   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);
@@ -53833,7 +53873,7 @@ var WfoTasksListPage = () => {
 };
 
 // src/pages/workflows/WfoWorkflowsListPage.tsx
-import { useEffect as useEffect37, useState as useState53 } from "react";
+import { useEffect as useEffect37, useState as useState54 } from "react";
 import { useTranslations as useTranslations76 } from "next-intl";
 import { useRouter as useRouter13 } from "next/router";
 import { StringParam as StringParam6, useQueryParam as useQueryParam5, withDefault as withDefault6 } from "use-query-params";
@@ -53910,7 +53950,7 @@ var WfoWorkflowsListPage = () => {
     "activeTab",
     withDefault6(StringParam6, "ACTIVE" /* ACTIVE */)
   );
-  const [tableDefaults, setTableDefaults] = useState53();
+  const [tableDefaults, setTableDefaults] = useState54();
   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);
@@ -54296,7 +54336,7 @@ var WfoJsonCodeBlock = ({
 };
 
 // src/components/WfoSettings/WfoFlushSettings.tsx
-import { useState as useState54 } from "react";
+import { useState as useState55 } from "react";
 import { useTranslations as useTranslations78 } from "next-intl";
 import {
   EuiButton as EuiButton17,
@@ -54338,7 +54378,7 @@ var WfoFlushSettings = () => {
   );
   const [clearCache] = useClearCacheMutation();
   const t = useTranslations78("settings.page");
-  const [selectedOptions, setSelected] = useState54(
+  const [selectedOptions, setSelected] = useState55(
     []
   );
   const { showToastMessage } = useShowToastMessage();
@@ -54848,6 +54888,18 @@ var WfoSubscriptionsList = ({
         );
       }
     },
+    actions: {
+      columnType: "control" /* CONTROL */,
+      label: t("actions"),
+      width: "80px",
+      renderControl: (row) => /* @__PURE__ */ jsx253(
+        WfoSubscriptionActions,
+        {
+          compactMode: true,
+          subscriptionId: row.subscriptionId
+        }
+      )
+    },
     metadata: {
       columnType: "data" /* DATA */,
       label: t("metadata"),
@@ -54942,7 +54994,7 @@ import {
   EuiAvatar as EuiAvatar2,
   EuiFlexGroup as EuiFlexGroup30,
   EuiFlexItem as EuiFlexItem36,
-  EuiLoadingSpinner,
+  EuiLoadingSpinner as EuiLoadingSpinner2,
   EuiPanel as EuiPanel12,
   EuiText as EuiText50
 } from "@elastic/eui";
@@ -54999,7 +55051,7 @@ var WfoSummaryCardHeader = ({
       /* @__PURE__ */ jsx254(EuiText50, { color: "subdued", children: text }),
       /* @__PURE__ */ jsxs137(EuiFlexGroup30, { gutterSize: "s", alignItems: "center", children: [
         /* @__PURE__ */ jsx254(EuiText50, { css: valueStyle, children: value }),
-        isFetching && /* @__PURE__ */ jsx254(EuiLoadingSpinner, {})
+        isFetching && /* @__PURE__ */ jsx254(EuiLoadingSpinner2, {})
       ] })
     ] })
   ] }) }) });
@@ -55612,7 +55664,7 @@ var WfoTitleWithWebsocketBadge = ({
 };
 
 // src/components/WfoRadioDropdown/WfoRadioDropdown.tsx
-import { useState as useState55 } from "react";
+import { useState as useState56 } from "react";
 import {
   EuiButtonEmpty as EuiButtonEmpty5,
   EuiFlexGroup as EuiFlexGroup32,
@@ -55625,7 +55677,7 @@ var WfoRadioDropdown = ({
   onUpdateOption,
   selectedOption
 }) => {
-  const [isOpen, setIsOpen] = useState55(false);
+  const [isOpen, setIsOpen] = useState56(false);
   const handleClose = () => {
     if (isOpen) {
       setIsOpen(false);
@@ -56191,8 +56243,13 @@ var en_GB_default = {
         modify: "Modify workflow",
         tasks: "Tasks",
         terminate: "Terminate workflow",
+        reconcile: "Reconcile workflow",
         actions: "Actions",
         lockedBySubscriptions: "This action is locked by the following subscriptions:",
+        notAvailable: "Not available",
+        notAvailableForWorkflow: "Not available for this workflow",
+        reconcileSubscription: "Reconcile subscription",
+        validateSubscription: "Validate subscription",
         subscription: {
           no_modify_deleted_related_objects: "This subscription can not be modified because it contains references to other systems that are deleted.",
           no_modify_in_use_by_subscription: "This subscription can not be {action} as it is used in other subscriptions: {unterminated_in_use_by_subscriptions}",
@@ -56654,6 +56711,11 @@ var nl_NL_default = {
         modify: "Modify workflow",
         tasks: "Taken",
         terminate: "Terminate workflow",
+        reconcile: "Reconcile workflow",
+        notAvailable: "Niet beschikbaar",
+        notAvailableForWorkflow: "Niet beschikbaar voor deze workflow",
+        reconcileSubscription: "Reconcile subscription",
+        validateSubscription: "Validate subscription",
         actions: "Acties",
         lockedBySubscriptions: "Deze actie is geblokkeerd door de volgende subscriptions:",
         subscription: {