n8n-editor-ui 1.74.1 → 1.75.0

package/dist/assets/{TestDefinitionEditView-DM4tV2LS.css → TestDefinitionEditView-FI1GVbhl.css}

@@ -419,16 +419,14 @@
  -------------------------- */
 /* BEM
  -------------------------- */
-._header_vi783_123 {
+._header_qmfly_123 {
   display: flex;
   align-items: center;
-  gap: var(--spacing-2xs);
-  margin-bottom: var(--spacing-l);
 }
-._header_vi783_123:hover ._editInputButton_vi783_129 {
+._header_qmfly_123:hover ._editInputButton_qmfly_127 {
   opacity: 1;
 }
-._title_vi783_133 {
+._title_qmfly_131 {
   margin: 0;
   flex-grow: 1;
   font-size: var(--font-size-xl);
@@ -439,20 +437,21 @@
   max-width: 100%;
   overflow: hidden;
 }
-._title_vi783_133 ._titleText_vi783_144 {
+._title_qmfly_131 ._titleText_qmfly_142 {
   display: block;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
 }
-._editInputButton_vi783_129 {
+._editInputButton_qmfly_127 {
   --button-font-color: var(--prim-gray-490);
-  opacity: 0;
+  opacity: 0.2;
   border: none;
 }
-._backButton_vi783_157 {
+._backButton_qmfly_155 {
   --button-font-color: var(--color-text-light);
   border: none;
+  padding-left: 0;
 }/* BEM support Func
  -------------------------- */
 /* Transition
@@ -575,9 +574,28 @@
  -------------------------- */
 /* BEM
  -------------------------- */
-._field_2al59_123 {
-  width: 100%;
-  margin-top: var(--spacing-xs);
+._description_f14k1_123 {
+  display: flex;
+  align-items: center;
+  color: var(--color-text-light);
+  font-size: var(--font-size-s);
+}
+._description_f14k1_123:hover ._editInputButton_f14k1_129 {
+  opacity: 1;
+}
+._descriptionText_f14k1_133 {
+  display: block;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+._descriptionText_f14k1_133 ._icon_f14k1_139 {
+  margin-right: var(--spacing-2xs);
+}
+._editInputButton_f14k1_129 {
+  --button-font-color: var(--prim-gray-490);
+  opacity: 0;
+  border: none;
 }/* BEM support Func
  -------------------------- */
 /* Transition
@@ -700,7 +718,7 @@
  -------------------------- */
 /* BEM
  -------------------------- */
-._evaluationStep_11knb_123 {
+._evaluationStep_65xdl_123 {
   display: grid;
   grid-template-columns: 1fr;
   gap: var(--spacing-m);
@@ -712,18 +730,11 @@
   width: 100%;
   color: var(--color-text-dark);
 }
-._evaluationStep_11knb_123._small_11knb_135 {
+._evaluationStep_65xdl_123._small_65xdl_135 {
   width: 80%;
+  margin-left: auto;
 }
-._contentPlaceholder_11knb_139 {
-  position: absolute;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
-  z-index: -1;
-}
-._icon_11knb_148 {
+._icon_65xdl_140 {
   display: flex;
   align-items: center;
   justify-content: center;
@@ -732,31 +743,31 @@
   width: 2rem;
   height: 2rem;
 }
-._icon_11knb_148._warning_11knb_157 {
+._icon_65xdl_140._warning_65xdl_149 {
   background-color: var(--color-warning-tint-2);
 }
-._content_11knb_139 {
+._content_65xdl_153 {
   display: grid;
   gap: var(--spacing-2xs);
 }
-._header_11knb_166 {
+._header_65xdl_158 {
   display: flex;
   gap: var(--spacing-2xs);
   align-items: center;
 }
-._title_11knb_172 {
+._title_65xdl_164 {
   font-weight: var(--font-weight-bold);
   font-size: var(--font-size-s);
   line-height: 1.125rem;
 }
-._warningIcon_11knb_178 {
+._warningIcon_65xdl_170 {
   color: var(--color-warning);
 }
-._cardContent_11knb_182 {
+._cardContent_65xdl_174 {
   font-size: var(--font-size-s);
   margin-top: var(--spacing-xs);
 }
-._collapseButton_11knb_187 {
+._collapseButton_65xdl_179 {
   cursor: pointer;
   border: none;
   background: none;
@@ -769,8 +780,13 @@
   min-width: -moz-fit-content;
   min-width: fit-content;
 }
-._cardContentWrapper_11knb_200 {
+._cardContentWrapper_65xdl_192 {
   height: max-content;
+}
+._description_65xdl_196 {
+  font-size: var(--font-size-2xs);
+  color: var(--color-text-light);
+  line-height: 1rem;
 }/* BEM support Func
  -------------------------- */
 /* Transition
@@ -1168,64 +1184,105 @@
  -------------------------- */
 /* BEM
  -------------------------- */
-._container_7ygna_123 {
-  width: 100%;
+._container_y9ejv_123 {
+  --evaluation-edit-panel-width: 24rem;
+  --metrics-chart-height: 10rem;
   height: 100%;
-  overflow: hidden;
-  padding: var(--spacing-s);
-  display: grid;
-  grid-template-columns: minmax(auto, 24rem) 1fr;
-  gap: var(--spacing-2xl);
+  display: flex;
+  flex-direction: column;
+}
+@media (min-height: 56rem) {
+._container_y9ejv_123 {
+    --metrics-chart-height: 16rem;
+}
+}
+@media screen and (min-width: 1200px) {
+._container_y9ejv_123 {
+    --evaluation-edit-panel-width: 30rem;
+}
+}
+._content_y9ejv_141 {
+  display: flex;
+  overflow-y: hidden;
+  position: relative;
+}
+._noRuns_y9ejv_146 ._content_y9ejv_141 {
+  justify-content: center;
+  overflow-y: auto;
 }
-._formContent_7ygna_133 {
+._headerSection_y9ejv_151 {
+  display: flex;
+  justify-content: space-between;
+  align-items: flex-start;
+  background-color: var(--color-background-light);
   width: 100%;
-  min-width: -moz-fit-content;
-  min-width: fit-content;
-  padding-bottom: 10px;
-  overflow: hidden;
+}
+._headerMeta_y9ejv_159 {
+  max-width: 50%;
+}
+._name_y9ejv_163 {
   display: flex;
-  flex-direction: column;
+  align-items: center;
 }
-._runsTableTotal_7ygna_142 {
-  display: block;
-  margin-bottom: var(--spacing-xs);
+._name_y9ejv_163 ._lastSaved_y9ejv_167 {
+  font-size: var(--font-size-s);
+  color: var(--color-text-light);
 }
-._runsTable_7ygna_142 {
-  flex-shrink: 1;
-  max-width: 100%;
-  max-height: 80vh;
+._descriptionInput_y9ejv_172 {
+  margin-top: var(--spacing-2xs);
+}
+._runs_y9ejv_176 {
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-m);
+  flex: 1;
+  padding-top: var(--spacing-3xs);
   overflow: auto;
 }
-._runsTableHeading_7ygna_154 {
-  display: block;
-  margin-bottom: var(--spacing-xl);
+@media (min-height: 56rem) {
+._runs_y9ejv_176 {
+    margin-top: var(--spacing-2xl);
+}
 }
-._panelBlock_7ygna_159 {
-  max-width: var(--evaluation-edit-panel-width, 24rem);
+._panelBlock_y9ejv_190 {
+  width: var(--evaluation-edit-panel-width);
   display: grid;
+  height: 100%;
   overflow-y: auto;
-  min-height: 0;
+  flex-shrink: 0;
+  padding-bottom: var(--spacing-l);
+  margin-left: var(--spacing-2xl);
+  transition: width 0.2s ease;
+}
+._panelBlock_y9ejv_190._hidden_y9ejv_200 {
+  margin-left: 0;
+  width: 0;
+  overflow: hidden;
+  flex-shrink: 1;
 }
-._panelIntro_7ygna_166 {
+._noRuns_y9ejv_146 ._panelBlock_y9ejv_190 {
+  overflow-y: initial;
+}
+._panelIntro_y9ejv_210 {
   font-size: var(--font-size-m);
   color: var(--color-text-dark);
-  margin-top: var(--spacing-s);
   justify-self: center;
   position: relative;
   display: block;
 }
-._step_7ygna_175 {
+._step_y9ejv_218 {
   position: relative;
 }
-._step_7ygna_175:not(:first-child) {
+._step_y9ejv_218:not(:first-child) {
   margin-top: var(--spacing-m);
 }
-._introArrow_7ygna_182 {
+._introArrow_y9ejv_225 {
   --arrow-height: 1.5rem;
+  margin-bottom: -1rem;
   justify-self: center;
 }
-._evaluationArrows_7ygna_187 {
-  --arrow-height: 13.8rem;
+._evaluationArrows_y9ejv_231 {
+  --arrow-height: 22rem;
   display: flex;
   justify-content: space-between;
   width: 100%;
@@ -1234,34 +1291,7 @@
   margin-bottom: -100%;
   z-index: 0;
 }
-._footer_7ygna_198 {
-  margin-top: var(--spacing-xl);
+._controls_y9ejv_242 {
   display: flex;
-  justify-content: flex-start;
-}
-._workflow_7ygna_204 {
-  padding: var(--spacing-l);
-  background-color: var(--color-background-light);
-  border-radius: var(--border-radius-large);
-  border: var(--border-base);
-}
-._workflowSteps_7ygna_211 {
-  display: grid;
-  gap: var(--spacing-2xs);
-  max-width: 42rem;
-  margin: 0 auto;
-}
-._sideBySide_7ygna_218 {
-  display: grid;
-  grid-template-columns: 1fr auto 1fr;
-  gap: var(--spacing-2xs);
-  justify-items: end;
-  align-items: start;
-}
-._mockedNodesLabel_7ygna_226 {
-  min-height: 1.5rem;
-  display: block;
-}
-._runTestButton_7ygna_231 {
-  margin-top: var(--spacing-m);
+  gap: var(--spacing-s);
 }

package/dist/assets/{TestDefinitionListView-6hn-gG-H.js → TestDefinitionListView-BnnmuS88.js}

@@ -1,4 +1,4 @@
-import { d as defineComponent, m as resolveComponent, c as openBlock, h as createElementBlock, j as createBaseVNode, t as toDisplayString, l as unref, n as normalizeClass, i as createVNode, g as useI18n, _ as _export_sfc, w as withCtx, k as createTextVNode, F as Fragment, fy as _sfc_main$4, f as createCommentVNode, A as renderList, e as createBlock, a$ as resolveDynamicComponent, aP as _sfc_main$5, I as withModifiers, a_ as mergeProps, b as useRouter, hA as useAnnotationTagsStore, hI as useTestDefinitionStore, r as ref, a as useToast, q as computed, o as onMounted, V as VIEWS } from "./index-D0W-rAl_.js";
+import { d as defineComponent, m as resolveComponent, c as openBlock, h as createElementBlock, j as createBaseVNode, t as toDisplayString, l as unref, n as normalizeClass, i as createVNode, g as useI18n, _ as _export_sfc, q as computed, w as withCtx, k as createTextVNode, F as Fragment, fA as _sfc_main$4, f as createCommentVNode, A as renderList, e as createBlock, b1 as resolveDynamicComponent, aR as _sfc_main$5, I as withModifiers, b0 as mergeProps, b as useRouter, hE as useAnnotationTagsStore, hM as useTestDefinitionStore, r as ref, a as useToast, o as onMounted, V as VIEWS } from "./index-DVhaXv7m.js";
 const _sfc_main$3 = /* @__PURE__ */ defineComponent({
   __name: "EmptyState",
   emits: ["create-test"],
@@ -14,20 +14,37 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
         }, [
           createBaseVNode("h1", null, toDisplayString(unref(locale).baseText("testDefinition.list.tests")), 1)
         ], 2),
-        createVNode(_component_n8n_action_box, {
-          description: unref(locale).baseText("testDefinition.list.actionDescription"),
-          "button-text": unref(locale).baseText("testDefinition.list.actionButton"),
-          "onClick:button": _cache[0] || (_cache[0] = ($event) => _ctx.$emit("create-test"))
-        }, null, 8, ["description", "button-text"])
+        createBaseVNode("div", {
+          class: normalizeClass(_ctx.$style.content)
+        }, [
+          createVNode(_component_n8n_action_box, {
+            class: normalizeClass(_ctx.$style.actionBox),
+            heading: unref(locale).baseText("testDefinition.list.evaluations"),
+            description: unref(locale).baseText("testDefinition.list.actionDescription"),
+            "button-text": unref(locale).baseText("testDefinition.list.actionButton"),
+            "onClick:button": _cache[0] || (_cache[0] = ($event) => _ctx.$emit("create-test"))
+          }, null, 8, ["class", "heading", "description", "button-text"]),
+          createVNode(_component_n8n_action_box, {
+            class: normalizeClass(_ctx.$style.actionBox),
+            heading: unref(locale).baseText("testDefinition.list.unitTests.title"),
+            description: unref(locale).baseText("testDefinition.list.unitTests.description"),
+            "button-text": unref(locale).baseText("testDefinition.list.unitTests.cta"),
+            "button-type": "tertiary"
+          }, null, 8, ["class", "heading", "description", "button-text"])
+        ], 2)
       ], 2);
     };
   }
 });
-const container$1 = "_container_84f9f_123";
-const header = "_header_84f9f_129";
+const container$1 = "_container_8wqbe_123";
+const header = "_header_8wqbe_127";
+const content = "_content_8wqbe_139";
+const actionBox = "_actionBox_8wqbe_145";
 const style0$3 = {
   container: container$1,
-  header
+  header,
+  content,
+  actionBox
 };
 const cssModules$3 = {
   "$style": style0$3
@@ -40,7 +57,7 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
   props: {
     test: {}
   },
-  emits: ["run-test", "view-details", "edit-test", "delete-test"],
+  emits: ["run-test", "view-details", "edit-test", "delete-test", "cancel-test-run"],
   setup(__props, { emit: __emit }) {
     const props = __props;
     const locale = useI18n();
@@ -50,7 +67,15 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
         icon: "play",
         id: "run",
         event: () => emit("run-test", props.test.id),
-        tooltip: locale.baseText("testDefinition.runTest")
+        tooltip: locale.baseText("testDefinition.runTest"),
+        show: () => props.test.execution.status !== "running"
+      },
+      {
+        icon: "stop",
+        id: "cancel",
+        event: () => emit("cancel-test-run", props.test.id, props.test.execution.id),
+        tooltip: locale.baseText("testDefinition.cancelTestRun"),
+        show: () => props.test.execution.status === "running"
       },
       {
         icon: "list",
@@ -71,6 +96,7 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
         tooltip: locale.baseText("testDefinition.deleteTest")
       }
     ];
+    const visibleActions = computed(() => actions2.filter((action) => action.show?.() ?? true));
     return (_ctx, _cache) => {
       const _component_n8n_text = resolveComponent("n8n-text");
       const _component_n8n_spinner = resolveComponent("n8n-spinner");
@@ -124,8 +150,8 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
         createBaseVNode("div", {
           class: normalizeClass(_ctx.$style.actions)
         }, [
-          (openBlock(), createElementBlock(Fragment, null, renderList(actions2, (action) => {
-            return createVNode(_component_n8n_tooltip, {
+          (openBlock(true), createElementBlock(Fragment, null, renderList(visibleActions.value, (action) => {
+            return openBlock(), createBlock(_component_n8n_tooltip, {
               key: action.icon,
               placement: "top",
               "show-after": 1e3
@@ -144,7 +170,7 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
               ]),
               _: 2
             }, 1024);
-          }), 64))
+          }), 128))
         ], 2)
       ], 10, _hoisted_1);
     };
@@ -241,6 +267,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       const lastRun = testDefinitionStore.lastRunByTestId[testId];
       if (!lastRun) {
         return {
+          id: null,
           lastRun: null,
           errorRate: 0,
           metrics: {},
@@ -248,6 +275,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         };
       }
       const mockExecutions = {
+        id: lastRun.id,
         lastRun: lastRun.updatedAt ?? "",
         errorRate: 0,
         metrics: lastRun.metrics ?? {},
@@ -274,6 +302,25 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         toast.showError(error, locale.baseText("testDefinition.list.testStartError"));
       }
     }
+    async function onCancelTestRun(testId, testRunId) {
+      try {
+        if (!testRunId) {
+          throw new Error("Failed to cancel test run");
+        }
+        const result = await testDefinitionStore.cancelTestRun(testId, testRunId);
+        if (result.success) {
+          toast.showMessage({
+            title: locale.baseText("testDefinition.list.testCancelled"),
+            type: "success"
+          });
+          await testDefinitionStore.fetchTestRuns(testId);
+        } else {
+          throw new Error("Failed to cancel test run");
+        }
+      } catch (error) {
+        toast.showError(error, locale.baseText("testDefinition.list.testStartError"));
+      }
+    }
     async function onViewDetails(testId) {
       void router.push({ name: VIEWS.TEST_DEFINITION_RUNS, params: { testId } });
     }
@@ -344,15 +391,16 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             onRunTest,
             onViewDetails,
             onEditTest,
-            onDeleteTest
+            onDeleteTest,
+            onCancelTestRun
           }, null, 8, ["tests"]))
         ], 64))
       ], 2);
     };
   }
 });
-const container = "_container_1c8ch_123";
-const loading = "_loading_1c8ch_130";
+const container = "_container_12eu3_123";
+const loading = "_loading_12eu3_130";
 const style0 = {
   container,
   loading

package/dist/assets/{TestDefinitionListView-BD5_O4Fx.css → TestDefinitionListView-GsFM1AF9.css}

@@ -120,12 +120,10 @@
  -------------------------- */
 /* BEM
  -------------------------- */
-._container_84f9f_123 {
-  max-width: 44rem;
-  margin: var(--spacing-4xl) auto 0;
-  gap: var(--spacing-l);
+._container_8wqbe_123 {
+  max-width: 75rem;
 }
-._header_84f9f_129 {
+._header_8wqbe_127 {
   display: flex;
   justify-content: space-between;
   align-items: center;
@@ -133,8 +131,16 @@
   font-size: var(--font-size-l);
   margin-bottom: var(--spacing-xl);
 }
-._header_84f9f_129 h1 {
+._header_8wqbe_127 h1 {
   margin: 0;
+}
+._content_8wqbe_139 {
+  width: 100%;
+  display: flex;
+  gap: var(--spacing-m);
+}
+._actionBox_8wqbe_145 {
+  flex: 1;
 }/* BEM support Func
  -------------------------- */
 /* Transition
@@ -553,13 +559,13 @@
  -------------------------- */
 /* BEM
  -------------------------- */
-._container_1c8ch_123 {
-  padding: var(--spacing-xl) var(--spacing-l);
+._container_12eu3_123 {
   height: 100%;
   width: 100%;
   max-width: var(--content-container-width);
+  margin: auto;
 }
-._loading_1c8ch_130 {
+._loading_12eu3_130 {
   display: flex;
   justify-content: center;
   align-items: center;

package/dist/assets/TestDefinitionRootView-D0gG8g0k.js

@@ -0,0 +1,36 @@
+import { d as defineComponent, b as useRouter, a4 as useWorkflowHelpers, T as useWorkflowsStore, o as onMounted, c as openBlock, h as createElementBlock, i as createVNode, n as normalizeClass, m as resolveComponent, _ as _export_sfc } from "./index-DVhaXv7m.js";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "TestDefinitionRootView",
+  setup(__props) {
+    const router = useRouter();
+    const workflowHelpers = useWorkflowHelpers({ router });
+    const workflowStore = useWorkflowsStore();
+    async function initWorkflow() {
+      const workflowId = router.currentRoute.value.params.name;
+      const isAlreadyInitialized = workflowStore.workflow.id === workflowId;
+      if (isAlreadyInitialized) return;
+      const workflow = await workflowStore.fetchWorkflow(workflowId);
+      void workflowHelpers.initState(workflow);
+    }
+    onMounted(initWorkflow);
+    return (_ctx, _cache) => {
+      const _component_router_view = resolveComponent("router-view");
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass(_ctx.$style.evaluationsView)
+      }, [
+        createVNode(_component_router_view)
+      ], 2);
+    };
+  }
+});
+const evaluationsView = "_evaluationsView_qv3lh_123";
+const style0 = {
+  evaluationsView
+};
+const cssModules = {
+  "$style": style0
+};
+const TestDefinitionRootView = /* @__PURE__ */ _export_sfc(_sfc_main, [["__cssModules", cssModules]]);
+export {
+  TestDefinitionRootView as default
+};