n8n-editor-ui 1.110.1 → 1.112.0

package/dist/assets/{WorkflowsView-CTnvp65F.js → WorkflowsView-B9rxI0No.js}

@@ -1,17 +1,18 @@
-import { d as defineComponent, a2 as useRoute, b as useRouter, av as useFoldersStore, r as ref, x as computed, c as useI18n, aF as ProjectTypes, V as VIEWS, a8 as resolveComponent, h as createElementBlock, g as openBlock, i as createVNode, w as withCtx, s as N8nCard, n as normalizeClass, j as createBaseVNode, f as createCommentVNode, e as createBlock, g5 as ProjectCardBadge, l as unref, aS as ResourceType, ed as N8nActionToggle, B as withModifiers, p as N8nText, k as createTextVNode, t as toDisplayString, eK as _sfc_main$7, m as N8nHeading, aK as N8nBadge, N as N8nIcon, _ as _export_sfc, a as useToast, v as useSettingsStore, Q as useUIStore, u as useUsersStore, a1 as useWorkflowsStore, au as useProjectsStore, aB as getResourcePermissions, fY as dateFormat, b2 as withDirectives, b3 as vShow, aN as WORKFLOW_SHARE_MODAL_KEY, al as useTelemetry, aR as DUPLICATE_MODAL_KEY, am as useMessage, an as MODAL_CONFIRM, aT as PROJECT_MOVE_RESOURCE_MODAL, g6 as FOLDER_NAME_ILLEGAL_CHARACTERS_REGEX, g7 as ILLEGAL_FOLDER_CHARACTERS, g8 as FOLDER_NAME_ONLY_DOTS_REGEX, g9 as FOLDER_NAME_MAX_LENGTH, $ as defineStore, dd as usePostHog, bb as useCloudPlanStore, bk as useTemplatesStore, bc as useStorage, ga as LOCAL_STORAGE_EXPERIMENTAL_DISMISSED_SUGGESTED_WORKFLOWS, dk as jsonParse, a7 as watch, fp as TEMPLATE_ONBOARDING_EXPERIMENT, a4 as STORES, z as N8nCallout, C as N8nLink, X as renderSlot, ad as useNodeTypesStore, bl as usePersonalizedTemplatesV2Store, o as onMounted, bX as NodeIcon, bv as EXPERIMENT_TEMPLATE_RECO_V2_KEY, F as Fragment, A as renderList, bm as useCalloutHelpers, af as useSourceControlStore, ar as useTagsStore, e$ as useUsageStore, gb as useInsightsStore, ax as useDocumentTitle, P as useDebounce, aE as EnterpriseEditionFeature, gc as isExtraTemplateLinksExperimentEnabled, aq as createEventBus, W as onBeforeUnmount, ao as debounce, gd as PROJECT_ROOT, aG as useTemplateRef, br as createSlots, a9 as Tooltip, q as N8nButton, cQ as InfoTip, dY as N8nActionBox, e5 as N8nInputLabel, aJ as _sfc_main$9, e8 as N8nSelect, e9 as _sfc_main$a, eZ as N8nCheckbox, ge as Draggable, dK as N8nLoading, aH as InlineRename, gf as DEFAULT_WORKFLOW_PAGE_SIZE, bw as trackTemplatesClick, bx as TemplateClickSource, gg as getEasyAiWorkflowJson, f1 as COMMUNITY_PLUS_ENROLLMENT_MODAL } from "./index--OJ5nhDf.js";
-import { _ as _sfc_main$8 } from "./EmptySharedSectionActionBox.vue_vue_type_script_setup_true_lang-DirQeoxa.js";
-import { B as Breadcrumbs } from "./ProjectBreadcrumb-BxMwihEP.js";
-import { W as WorkflowActivator, _ as __unplugin_components_0 } from "./WorkflowActivator-DZIgVvgL.js";
-import { R as ResourcesListLayout } from "./ResourcesListLayout-O-Z59wTE.js";
-import { P as ProjectHeader } from "./ProjectHeader-CVfPUZNI.js";
-import { T as Tags } from "./Tags-CdXa3Xx9.js";
-import { u as useProjectPages } from "./useProjectPages-CH519D2j.js";
-import { u as useAITemplatesStarterCollectionStore, a as useReadyToRunWorkflowsStore } from "./readyToRunWorkflows.store-Dhb8bhvk.js";
-import { I as InsightsSummary } from "./InsightsSummary-I5vKNG0I.js";
-import "./useWorkflowActivate-7Rw9KyzM.js";
-import "./TableBase-DBeBHkOY.js";
-import "./PageViewLayout--7SkYsc9.js";
-import "./Tag-BQAJRKFE.js";
+import { D as useRoute, b as useRouter, a6 as useFoldersStore, ag as ProjectTypes, V as VIEWS, f as N8nCard, fb as ProjectCardBadge, as as ResourceType, dr as N8nActionToggle, w as withModifiers, d as N8nText, dV as _sfc_main$8, c as N8nHeading, ak as N8nBadge, N as N8nIcon, _ as _export_sfc, a as useToast, g as useSettingsStore, s as useUIStore, u as useUsersStore, C as useWorkflowsStore, a5 as useProjectsStore, ac as getResourcePermissions, f3 as dateFormat, az as vShow, an as WORKFLOW_SHARE_MODAL_KEY, Y as useTelemetry, ar as DUPLICATE_MODAL_KEY, Z as useMessage, $ as MODAL_CONFIRM, at as PROJECT_MOVE_RESOURCE_MODAL, fc as FOLDER_NAME_ILLEGAL_CHARACTERS_REGEX, fd as ILLEGAL_FOLDER_CHARACTERS, fe as FOLDER_NAME_ONLY_DOTS_REGEX, ff as FOLDER_NAME_MAX_LENGTH, z as defineStore, cy as usePostHog, aH as useCloudPlanStore, aQ as useTemplatesStore, aI as useStorage, fg as LOCAL_STORAGE_EXPERIMENTAL_DISMISSED_SUGGESTED_WORKFLOWS, cF as jsonParse, ex as TEMPLATE_ONBOARDING_EXPERIMENT, S as STORES, i as N8nCallout, j as N8nLink, K as useNodeTypesStore, aR as usePersonalizedTemplatesV2Store, bp as NodeIcon, a_ as EXPERIMENT_TEMPLATE_RECO_V2_KEY, O as useSourceControlStore, aS as useCalloutHelpers, a2 as useTagsStore, e9 as useUsageStore, fh as useInsightsStore, a8 as useDocumentTitle, r as useDebounce, af as EnterpriseEditionFeature, fi as isExtraTemplateLinksExperimentEnabled, a1 as createEventBus, a0 as debounce, fj as PROJECT_ROOT, H as Tooltip, e as N8nButton, ca as InfoTip, d9 as N8nActionBox, di as N8nInputLabel, aj as _sfc_main$a, dl as N8nSelect, dm as _sfc_main$b, e7 as N8nCheckbox, fk as Draggable, cZ as N8nLoading, ah as InlineRename, fl as DEFAULT_WORKFLOW_PAGE_SIZE, a$ as trackTemplatesClick, b0 as TemplateClickSource, fm as getEasyAiWorkflowJson, ea as COMMUNITY_PLUS_ENROLLMENT_MODAL } from "./index-BJG79OsS.js";
+import { _ as _sfc_main$9 } from "./EmptySharedSectionActionBox.vue_vue_type_script_setup_true_lang-Y97PdUKW.js";
+import { B as Breadcrumbs } from "./ProjectBreadcrumb-9uWmVmc7.js";
+import { o as defineComponent, b8 as ref, a9 as computed, bT as useI18n, bc as resolveComponent, ac as createElementBlock, b1 as openBlock, k as createVNode, bI as withCtx, aQ as normalizeClass, ad as createBaseVNode, ab as createCommentVNode, aa as createBlock, u as unref, ah as createTextVNode, bo as toDisplayString, bK as withDirectives, w as watch, bb as renderSlot, r as onMounted, F as Fragment, ba as renderList, aV as onBeforeUnmount, bB as useTemplateRef, af as createSlots } from "./index-4g2Akj0I.js";
+import { W as WorkflowActivator, _ as __unplugin_components_0 } from "./WorkflowActivator-BOt1oNlm.js";
+import { R as ResourcesListLayout } from "./ResourcesListLayout-CfDIFGjS.js";
+import { P as ProjectHeader } from "./ProjectHeader-CWapIKXf.js";
+import { T as Tags } from "./Tags-DbX-5_Fk.js";
+import { u as useProjectPages } from "./useProjectPages-B-oTYbCo.js";
+import { u as useAITemplatesStarterCollectionStore, a as useReadyToRunWorkflowsStore } from "./readyToRunWorkflows.store-HSpbq3Bf.js";
+import { u as useReadyToRunWorkflowsV2Store } from "./readyToRunWorkflowsV2.store-DcRVIsRt.js";
+import { I as InsightsSummary } from "./InsightsSummary-BekdjOxv.js";
+import "./useWorkflowActivate-BDE2t3MM.js";
+import "./TableBase-CQEzJfeN.js";
+import "./PageViewLayout-DldtilHz.js";
 const FOLDER_LIST_ITEM_ACTIONS = {
   OPEN: "open",
   CREATE: "create",
@@ -22,7 +23,7 @@ const FOLDER_LIST_ITEM_ACTIONS = {
 };
 const _hoisted_1$3 = { "data-test-id": "folder-card" };
 const _hoisted_2$1 = { key: 0 };
-const _sfc_main$6 = /* @__PURE__ */ defineComponent({
+const _sfc_main$7 = /* @__PURE__ */ defineComponent({
   __name: "FolderCard",
   props: {
     data: {},
@@ -118,7 +119,7 @@ const _sfc_main$6 = /* @__PURE__ */ defineComponent({
       const _component_n8n_heading = N8nHeading;
       const _component_N8nBadge = N8nBadge;
       const _component_n8n_text = N8nText;
-      const _component_TimeAgo = _sfc_main$7;
+      const _component_TimeAgo = _sfc_main$8;
       const _component_n8n_breadcrumbs = Breadcrumbs;
       const _component_ProjectCardBadge = ProjectCardBadge;
       const _component_n8n_action_toggle = N8nActionToggle;
@@ -292,7 +293,7 @@ const _sfc_main$6 = /* @__PURE__ */ defineComponent({
 });
 const card = "_card_pt4ir_123";
 const cardBadge$1 = "_cardBadge_pt4ir_157";
-const style0$6 = {
+const style0$7 = {
   card,
   "folder-icon": "_folder-icon_pt4ir_131",
   "card-header": "_card-header_pt4ir_140",
@@ -303,11 +304,11 @@ const style0$6 = {
   "card-actions": "_card-actions_pt4ir_164",
   "info-cell--created": "_info-cell--created_pt4ir_182"
 };
-const cssModules$6 = {
-  "$style": style0$6
+const cssModules$7 = {
+  "$style": style0$7
 };
-const __unplugin_components_5 = /* @__PURE__ */ _export_sfc(_sfc_main$6, [["__cssModules", cssModules$6]]);
-const _sfc_main$5 = /* @__PURE__ */ defineComponent({
+const __unplugin_components_5 = /* @__PURE__ */ _export_sfc(_sfc_main$7, [["__cssModules", cssModules$7]]);
+const _sfc_main$6 = /* @__PURE__ */ defineComponent({
   __name: "WorkflowCard",
   props: {
     data: {},
@@ -745,7 +746,7 @@ const _sfc_main$5 = /* @__PURE__ */ defineComponent({
               default: withCtx(() => [
                 withDirectives(createBaseVNode("span", null, [
                   createTextVNode(toDisplayString(unref(locale).baseText("workflows.item.updated")) + " ", 1),
-                  createVNode(_sfc_main$7, {
+                  createVNode(_sfc_main$8, {
                     date: String(_ctx.data.updatedAt)
                   }, null, 8, ["date"]),
                   _cache[1] || (_cache[1] = createTextVNode(" | "))
@@ -789,7 +790,7 @@ const cardActions = "_cardActions_9y0d7_158";
 const cardBadge = "_cardBadge_9y0d7_169";
 const cardArchived = "_cardArchived_9y0d7_180";
 const breadcrumbs = "_breadcrumbs_9y0d7_198";
-const style0$5 = {
+const style0$6 = {
   cardLink,
   cardHeading,
   cardHeadingArchived,
@@ -801,10 +802,10 @@ const style0$5 = {
   cardArchived,
   breadcrumbs
 };
-const cssModules$5 = {
-  "$style": style0$5
+const cssModules$6 = {
+  "$style": style0$6
 };
-const WorkflowCard = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["__cssModules", cssModules$5]]);
+const WorkflowCard = /* @__PURE__ */ _export_sfc(_sfc_main$6, [["__cssModules", cssModules$6]]);
 function isDropTarget(target) {
   return target.type === "folder" || target.type === "project";
 }
@@ -1057,7 +1058,7 @@ const usePersonalizedTemplatesStore = defineStore(STORES.PERSONALIZED_TEMPLATES,
     getTemplateRoute
   };
 });
-const _sfc_main$4 = /* @__PURE__ */ defineComponent({
+const _sfc_main$5 = /* @__PURE__ */ defineComponent({
   __name: "SuggestedWorkflowCard",
   props: {
     data: {}
@@ -1124,19 +1125,19 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const style0$4 = {
+const style0$5 = {
   "suggested-workflow-callout": "_suggested-workflow-callout_1alzo_123",
   "callout-content": "_callout-content_1alzo_129",
   "callout-trailing-content": "_callout-trailing-content_1alzo_133"
 };
-const cssModules$4 = {
-  "$style": style0$4
+const cssModules$5 = {
+  "$style": style0$5
 };
-const SuggestedWorkflowCard = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["__cssModules", cssModules$4]]);
-const style0$3 = {
+const SuggestedWorkflowCard = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["__cssModules", cssModules$5]]);
+const style0$4 = {
   "suggested-workflows": "_suggested-workflows_t3ed6_123"
 };
-const _sfc_main$3 = {};
+const _sfc_main$4 = {};
 const _hoisted_1$2 = {
   class: "suggested-workflows",
   "data-test-id": "suggested-workflows"
@@ -1146,11 +1147,11 @@ function _sfc_render(_ctx, _cache) {
     renderSlot(_ctx.$slots, "default")
   ]);
 }
-const cssModules$3 = {
-  "$style": style0$3
+const cssModules$4 = {
+  "$style": style0$4
 };
-const SuggestedWorkflows = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["render", _sfc_render], ["__cssModules", cssModules$3]]);
-const _sfc_main$2 = /* @__PURE__ */ defineComponent({
+const SuggestedWorkflows = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["render", _sfc_render], ["__cssModules", cssModules$4]]);
+const _sfc_main$3 = /* @__PURE__ */ defineComponent({
   __name: "NodeRecommendationCard",
   props: {
     nodeName: {}
@@ -1211,21 +1212,21 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
 const nodeCard = "_nodeCard_1ub18_123";
 const nodeIcon = "_nodeIcon_1ub18_133";
 const emptyStateCardContent$1 = "_emptyStateCardContent_1ub18_137";
-const style0$2 = {
+const style0$3 = {
   nodeCard,
   nodeIcon,
   emptyStateCardContent: emptyStateCardContent$1
 };
-const cssModules$2 = {
-  "$style": style0$2
+const cssModules$3 = {
+  "$style": style0$3
 };
-const NodeRecommendationCard = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__cssModules", cssModules$2]]);
+const NodeRecommendationCard = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["__cssModules", cssModules$3]]);
 const _hoisted_1$1 = {
   key: 0,
   class: "text-center mt-3xl",
   "data-test-id": "list-empty-state"
 };
-const _sfc_main$1 = /* @__PURE__ */ defineComponent({
+const _sfc_main$2 = /* @__PURE__ */ defineComponent({
   __name: "TemplateRecommendationV2",
   setup(__props) {
     const templateRecoV2Store = usePersonalizedTemplatesV2Store();
@@ -1259,13 +1260,194 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
   }
 });
 const nodeCardsContainer = "_nodeCardsContainer_7g2he_123";
-const style0$1 = {
+const style0$2 = {
   nodeCardsContainer
 };
+const cssModules$2 = {
+  "$style": style0$2
+};
+const TemplateRecommendationV2 = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__cssModules", cssModules$2]]);
+const _sfc_main$1 = /* @__PURE__ */ defineComponent({
+  __name: "SimplifiedEmptyLayout",
+  emits: ["click:add"],
+  setup(__props, { emit: __emit }) {
+    const route = useRoute();
+    const i18n = useI18n();
+    const toast = useToast();
+    const usersStore = useUsersStore();
+    const projectsStore = useProjectsStore();
+    const sourceControlStore = useSourceControlStore();
+    const projectPages = useProjectPages();
+    const readyToRunWorkflowsV2Store = useReadyToRunWorkflowsV2Store();
+    const currentUser = computed(() => usersStore.currentUser ?? {});
+    const personalProject = computed(() => projectsStore.personalProject);
+    const readOnlyEnv = computed(() => sourceControlStore.preferences.branchReadOnly);
+    const projectPermissions = computed(() => {
+      return getResourcePermissions(
+        projectsStore.currentProject?.scopes ?? personalProject.value?.scopes
+      );
+    });
+    const emptyListDescription = computed(() => {
+      if (readOnlyEnv.value) {
+        return i18n.baseText("workflows.empty.description.readOnlyEnv");
+      } else if (!projectPermissions.value.workflow.create) {
+        return i18n.baseText("workflows.empty.description.noPermission");
+      } else {
+        return i18n.baseText("workflows.empty.description");
+      }
+    });
+    const showReadyToRunV2Card = computed(() => {
+      return readyToRunWorkflowsV2Store.getCardVisibility(
+        projectPermissions.value.workflow.create,
+        readOnlyEnv.value,
+        false
+        // loading is false in simplified layout
+      );
+    });
+    const handleReadyToRunV2Click = async () => {
+      const projectId = projectPages.isOverviewSubPage ? personalProject.value?.id : route.params.projectId;
+      try {
+        await readyToRunWorkflowsV2Store.claimCreditsAndOpenWorkflow(
+          "card",
+          route.params.folderId,
+          projectId
+        );
+      } catch (error) {
+        toast.showError(error, i18n.baseText("generic.error"));
+      }
+    };
+    const addWorkflow = () => {
+      emit("click:add");
+    };
+    const emit = __emit;
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass(_ctx.$style.simplifiedLayout)
+      }, [
+        createBaseVNode("div", {
+          class: normalizeClass(_ctx.$style.content)
+        }, [
+          createBaseVNode("div", {
+            class: normalizeClass(_ctx.$style.welcome)
+          }, [
+            createVNode(unref(N8nHeading), {
+              tag: "h1",
+              size: "2xlarge",
+              class: normalizeClass(_ctx.$style.welcomeTitle)
+            }, {
+              default: withCtx(() => [
+                createTextVNode(toDisplayString(currentUser.value.firstName ? unref(i18n).baseText("workflows.empty.heading", {
+                  interpolate: { name: currentUser.value.firstName }
+                }) : unref(i18n).baseText("workflows.empty.heading.userNotSetup")), 1)
+              ]),
+              _: 1
+            }, 8, ["class"]),
+            createVNode(unref(N8nText), {
+              size: "large",
+              color: "text-base",
+              class: normalizeClass(_ctx.$style.welcomeDescription)
+            }, {
+              default: withCtx(() => [
+                createTextVNode(toDisplayString(emptyListDescription.value), 1)
+              ]),
+              _: 1
+            }, 8, ["class"])
+          ], 2),
+          !readOnlyEnv.value && projectPermissions.value.workflow.create ? (openBlock(), createElementBlock("div", {
+            key: 0,
+            class: normalizeClass(_ctx.$style.actionsContainer)
+          }, [
+            showReadyToRunV2Card.value ? (openBlock(), createBlock(unref(N8nCard), {
+              key: 0,
+              class: normalizeClass(_ctx.$style.actionCard),
+              hoverable: "",
+              "data-test-id": "ready-to-run-v2-card",
+              onClick: handleReadyToRunV2Click
+            }, {
+              default: withCtx(() => [
+                createBaseVNode("div", {
+                  class: normalizeClass(_ctx.$style.cardContent)
+                }, [
+                  createVNode(unref(N8nIcon), {
+                    class: normalizeClass(_ctx.$style.cardIcon),
+                    icon: "sparkles",
+                    color: "foreground-dark",
+                    "stroke-width": 1.5
+                  }, null, 8, ["class"]),
+                  createVNode(unref(N8nText), {
+                    size: "large",
+                    class: "mt-xs"
+                  }, {
+                    default: withCtx(() => [
+                      createTextVNode(toDisplayString(unref(i18n).baseText("workflows.empty.readyToRunV2")), 1)
+                    ]),
+                    _: 1
+                  })
+                ], 2)
+              ]),
+              _: 1
+            }, 8, ["class"])) : createCommentVNode("", true),
+            createVNode(unref(N8nCard), {
+              class: normalizeClass(_ctx.$style.actionCard),
+              hoverable: "",
+              "data-test-id": "new-workflow-card",
+              onClick: addWorkflow
+            }, {
+              default: withCtx(() => [
+                createBaseVNode("div", {
+                  class: normalizeClass(_ctx.$style.cardContent)
+                }, [
+                  createVNode(unref(N8nIcon), {
+                    class: normalizeClass(_ctx.$style.cardIcon),
+                    icon: "file",
+                    color: "foreground-dark",
+                    "stroke-width": 1.5
+                  }, null, 8, ["class"]),
+                  createVNode(unref(N8nText), {
+                    size: "large",
+                    class: "mt-xs"
+                  }, {
+                    default: withCtx(() => [
+                      createTextVNode(toDisplayString(unref(i18n).baseText("workflows.empty.startFromScratch")), 1)
+                    ]),
+                    _: 1
+                  })
+                ], 2)
+              ]),
+              _: 1
+            }, 8, ["class"])
+          ], 2)) : createCommentVNode("", true)
+        ], 2)
+      ], 2);
+    };
+  }
+});
+const simplifiedLayout = "_simplifiedLayout_kqs3e_123";
+const header = "_header_kqs3e_131";
+const content = "_content_kqs3e_138";
+const welcome = "_welcome_kqs3e_146";
+const welcomeTitle = "_welcomeTitle_kqs3e_150";
+const welcomeDescription = "_welcomeDescription_kqs3e_154";
+const actionsContainer$1 = "_actionsContainer_kqs3e_158";
+const actionCard = "_actionCard_kqs3e_165";
+const cardIcon = "_cardIcon_kqs3e_178";
+const cardContent = "_cardContent_kqs3e_182";
+const style0$1 = {
+  simplifiedLayout,
+  header,
+  content,
+  welcome,
+  welcomeTitle,
+  welcomeDescription,
+  actionsContainer: actionsContainer$1,
+  actionCard,
+  cardIcon,
+  cardContent
+};
 const cssModules$1 = {
   "$style": style0$1
 };
-const TemplateRecommendationV2 = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__cssModules", cssModules$1]]);
+const SimplifiedEmptyLayout = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__cssModules", cssModules$1]]);
 const _hoisted_1 = { key: 0 };
 const _hoisted_2 = { key: 0 };
 const _hoisted_3 = { key: 1 };
@@ -1319,6 +1501,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const aiStarterTemplatesStore = useAITemplatesStarterCollectionStore();
     const personalizedTemplatesStore = usePersonalizedTemplatesStore();
     const readyToRunWorkflowsStore = useReadyToRunWorkflowsStore();
+    const readyToRunWorkflowsV2Store = useReadyToRunWorkflowsV2Store();
     const personalizedTemplatesV2Store = usePersonalizedTemplatesV2Store();
     const documentTitle = useDocumentTitle();
     const { callDebounced } = useDebounce();
@@ -1541,6 +1724,12 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const showPersonalizedTemplates = computed(
       () => !loading.value && personalizedTemplatesStore.isFeatureEnabled()
     );
+    const shouldUseSimplifiedLayout = computed(() => {
+      return readyToRunWorkflowsV2Store.getSimplifiedLayoutVisibility(route, loading.value);
+    });
+    const hasActiveCallouts = computed(() => {
+      return showPrebuiltAgentsCallout.value || showAIStarterCollectionCallout.value || showPersonalizedTemplates.value || showReadyToRunWorkflowsCallout.value;
+    });
     watch([() => route.params?.projectId, () => route.name], async () => {
       loading.value = true;
     });
@@ -1550,7 +1739,13 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         currentFolderId.value = newVal;
         filters.value.search = "";
         saveFiltersOnQueryString();
-        await fetchWorkflows();
+        await Promise.all([
+          fetchWorkflows(),
+          foldersStore.fetchTotalWorkflowsAndFoldersCount(
+            route.params.projectId,
+            currentFolderId.value ?? void 0
+          )
+        ]);
       }
     );
     sourceControlStore.$onAction(({ name: name2, after }) => {
@@ -1560,14 +1755,19 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const refreshWorkflows = async () => {
       await Promise.all([
         fetchWorkflows(),
-        foldersStore.fetchTotalWorkflowsAndFoldersCount(route.params.projectId)
+        foldersStore.fetchTotalWorkflowsAndFoldersCount(
+          route.params.projectId,
+          currentFolderId.value ?? void 0
+        )
       ]);
     };
     const onFolderDeleted = async (payload) => {
       const folderInfo = foldersStore.getCachedFolder(payload.folderId);
       foldersStore.deleteFoldersFromCache([payload.folderId, folderInfo?.parentFolder ?? ""]);
+      const nextFolderId = currentFolderId.value === payload.folderId ? folderInfo?.parentFolder ?? null : currentFolderId.value;
       await foldersStore.fetchTotalWorkflowsAndFoldersCount(
-        route.params.projectId
+        route.params.projectId,
+        nextFolderId ?? void 0
       );
       if (currentFolderId.value === payload.folderId) {
         void router.push({
@@ -1618,7 +1818,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         fetchWorkflows(),
         workflowsStore.fetchActiveWorkflows(),
         usageStore.getLicenseInfo(),
-        foldersStore.fetchTotalWorkflowsAndFoldersCount(route.params.projectId)
+        foldersStore.fetchTotalWorkflowsAndFoldersCount(
+          route.params.projectId,
+          currentFolderId.value ?? void 0
+        )
       ]);
       breadcrumbsLoading.value = false;
       workflowsAndFolders.value = resourcesPage;
@@ -1958,8 +2161,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         };
       }
       try {
-        const content = await foldersStore.fetchFolderContent(currentProject.value?.id ?? "", folderId);
-        return { workflowCount: content.totalWorkflows, subFolderCount: content.totalSubFolders };
+        const content2 = await foldersStore.fetchFolderContent(currentProject.value?.id ?? "", folderId);
+        return { workflowCount: content2.totalWorkflows, subFolderCount: content2.totalSubFolders };
       } catch (error) {
         toast.showMessage({
           title: i18n.baseText("folders.delete.error.message"),
@@ -2067,11 +2270,11 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           break;
         case FOLDER_LIST_ITEM_ACTIONS.DELETE:
           if (!route.params.folderId) return;
-          const content = await getFolderContent(route.params.folderId);
+          const content2 = await getFolderContent(route.params.folderId);
           await deleteFolder(
             route.params.folderId,
-            content.workflowCount,
-            content.subFolderCount
+            content2.workflowCount,
+            content2.subFolderCount
           );
           break;
         case FOLDER_LIST_ITEM_ACTIONS.RENAME:
@@ -2113,8 +2316,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           });
           break;
         case FOLDER_LIST_ITEM_ACTIONS.DELETE: {
-          const content = await getFolderContent(clickedFolder.id);
-          await deleteFolder(clickedFolder.id, content.workflowCount, content.subFolderCount);
+          const content2 = await getFolderContent(clickedFolder.id);
+          await deleteFolder(clickedFolder.id, content2.workflowCount, content2.subFolderCount);
           break;
         }
         case FOLDER_LIST_ITEM_ACTIONS.RENAME:
@@ -2559,11 +2762,15 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       const _component_n8n_loading = N8nLoading;
       const _component_FolderBreadcrumbs = __unplugin_components_0;
       const _component_FolderCard = __unplugin_components_5;
-      const _component_EmptySharedSectionActionBox = _sfc_main$8;
+      const _component_EmptySharedSectionActionBox = _sfc_main$9;
       const _component_N8nCheckbox = N8nCheckbox;
       const _component_N8nInfoTip = InfoTip;
       const _component_N8nActionBox = N8nActionBox;
-      return openBlock(), createBlock(ResourcesListLayout, {
+      return shouldUseSimplifiedLayout.value ? (openBlock(), createBlock(SimplifiedEmptyLayout, {
+        key: 0,
+        "onClick:add": addWorkflow
+      })) : (openBlock(), createBlock(ResourcesListLayout, {
+        key: 1,
         filters: filters.value,
         "onUpdate:filters": [
           _cache[9] || (_cache[9] = ($event) => filters.value = $event),
@@ -2588,7 +2795,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         onMouseleave: unref(folderHelpers).resetDropTarget
       }, createSlots({
         header: withCtx(() => [
-          createVNode(ProjectHeader, { onCreateFolder: createFolderInCurrent }, {
+          createVNode(ProjectHeader, {
+            "has-active-callouts": hasActiveCallouts.value,
+            onCreateFolder: createFolderInCurrent
+          }, {
             default: withCtx(() => [
               showInsights.value ? (openBlock(), createBlock(InsightsSummary, {
                 key: 0,
@@ -2598,7 +2808,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               }, null, 8, ["loading", "summary"])) : createCommentVNode("", true)
             ]),
             _: 1
-          })
+          }, 8, ["has-active-callouts"])
         ]),
         callout: withCtx(() => [
           showPrebuiltAgentsCallout.value ? (openBlock(), createBlock(_component_N8nCallout, {
@@ -3096,7 +3306,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               color: "text-base",
               class: "mb-3xs"
             }, null, 8, ["label"]),
-            createVNode(_sfc_main$9, {
+            createVNode(_sfc_main$a, {
               placeholder: unref(i18n).baseText("workflowOpen.filterWorkflows"),
               "model-value": filters.value.tags,
               "create-enabled": false,
@@ -3118,7 +3328,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             }, {
               default: withCtx(() => [
                 (openBlock(true), createElementBlock(Fragment, null, renderList(statusFilterOptions.value, (option) => {
-                  return openBlock(), createBlock(unref(_sfc_main$a), {
+                  return openBlock(), createBlock(unref(_sfc_main$b), {
                     key: option.label,
                     label: option.label,
                     value: option.value,
@@ -3217,7 +3427,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           ]),
           key: "0"
         } : void 0
-      ]), 1032, ["filters", "resources", "shareable", "disabled", "resources-refreshing", "custom-page-size", "total-items", "has-empty-state", "onMouseleave"]);
+      ]), 1032, ["filters", "resources", "shareable", "disabled", "resources-refreshing", "custom-page-size", "total-items", "has-empty-state", "onMouseleave"]));
     };
   }
 });