n8n-editor-ui 1.91.1 → 1.93.0

package/dist/assets/{ResourcesListLayout-HzoSFUaj.js → ResourcesListLayout-Bbl-1i4l.js}

@@ -1,4 +1,5 @@
-import { _ as _export_sfc, i as createElementBlock, g as openBlock, x as renderSlot, k as createBaseVNode, n as normalizeClass, d as defineComponent, f as createCommentVNode, a1 as useProjectsStore, q as computed, X as watch, az as onBeforeMount, h as resolveComponent, e as createBlock, w as withCtx, m as unref, aa as EnterpriseEditionFeature, j as createVNode, c as useI18n, gp as ProjectSharing, l as createTextVNode, t as toDisplayString, R as useRoute, b as useRouter, G as useDebounce, u as useUsersStore, r as ref, fO as useSlots, gq as isSharedResource, gr as isResourceSortableByDate, o as onMounted, z as nextTick, y as onBeforeUnmount, F as Fragment, D as renderList, aA as withDirectives, b4 as normalizeProps, b5 as guardReactiveProps, aB as vShow, ag as useTelemetry } from "./index-BLAboPd2.js";
+import { _ as _export_sfc, i as createElementBlock, g as openBlock, x as renderSlot, k as createBaseVNode, n as normalizeClass, d as defineComponent, f as createCommentVNode, a1 as useProjectsStore, q as computed, X as watch, az as onBeforeMount, h as resolveComponent, e as createBlock, w as withCtx, m as unref, aa as EnterpriseEditionFeature, j as createVNode, c as useI18n, gB as ProjectSharing, l as createTextVNode, t as toDisplayString, av as useLocalStorage, gC as LOCAL_STORAGE_WORKFLOW_LIST_PREFERENCES_KEY, R as useRoute, b as useRouter, G as useDebounce, u as useUsersStore, r as ref, fZ as useSlots, gD as isSharedResource, gE as isResourceSortableByDate, o as onMounted, z as nextTick, y as onBeforeUnmount, F as Fragment, D as renderList, aA as withDirectives, b4 as normalizeProps, b5 as guardReactiveProps, aB as vShow, ag as useTelemetry } from "./index-DZ6VpjNj.js";
+import { u as useProjectPages } from "./useProjectPages-e8b03-5_.js";
 const wrapper$1 = "_wrapper_1x8n3_123";
 const content = "_content_1x8n3_139";
 const style0$3 = {
@@ -242,6 +243,46 @@ const cssModules$1 = {
   "$style": style0$1
 };
 const ResourceFiltersDropdown = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__cssModules", cssModules$1]]);
+function useN8nLocalStorage() {
+  const projectPages = useProjectPages();
+  const getProjectKey = (projectId) => {
+    return projectPages.isOverviewSubPage ? "home" : projectId;
+  };
+  const saveProjectPreferencesToLocalStorage = (projectId, tabKey, preferences) => {
+    const projectKey = getProjectKey(projectId);
+    if (!projectKey) {
+      return;
+    }
+    const localStorage = useLocalStorage(
+      LOCAL_STORAGE_WORKFLOW_LIST_PREFERENCES_KEY,
+      {}
+    );
+    if (!localStorage.value[projectKey]) {
+      localStorage.value[projectKey] = {};
+    }
+    localStorage.value[projectKey][tabKey] = {
+      ...localStorage.value[projectKey][tabKey],
+      ...preferences
+    };
+  };
+  const loadProjectPreferencesFromLocalStorage = (projectId, tabKey) => {
+    const projectKey = getProjectKey(projectId);
+    if (!projectKey) {
+      return {};
+    }
+    const localStorage = useLocalStorage(
+      LOCAL_STORAGE_WORKFLOW_LIST_PREFERENCES_KEY,
+      {}
+    );
+    const projectPreferences = localStorage.value[projectKey]?.[tabKey] || {};
+    return projectPreferences;
+  };
+  return {
+    saveProjectPreferencesToLocalStorage,
+    loadProjectPreferencesFromLocalStorage,
+    getProjectKey
+  };
+}
 const _hoisted_1 = {
   key: 0,
   class: "resource-list-loading"
@@ -249,7 +290,8 @@ const _hoisted_1 = {
 const _hoisted_2 = { key: 0 };
 const _hoisted_3 = {
   key: 0,
-  class: "mt-xs"
+  class: "mt-xs",
+  "data-test-id": "resources-list-filters-applied-info"
 };
 const _hoisted_4 = {
   key: 0,
@@ -280,7 +322,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     dontPerformSortingAndFiltering: { type: Boolean, default: false },
     hasEmptyState: { type: Boolean, default: true }
   },
-  emits: ["update:filters", "click:add", "update:current-page", "update:page-size", "sort", "update:search"],
+  emits: ["update:filters", "click:add", "update:pagination-and-sort", "update:search"],
   setup(__props, { expose: __expose, emit: __emit }) {
     const route = useRoute();
     const router = useRouter();
@@ -288,6 +330,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const { callDebounced } = useDebounce();
     const usersStore = useUsersStore();
     const telemetry = useTelemetry();
+    const n8nLocalStorage = useN8nLocalStorage();
     const props = __props;
     const sortBy = ref(props.sortOptions[0]);
     const hasFilters = ref(false);
@@ -295,6 +338,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const rowsPerPage = ref(props.customPageSize);
     const resettingFilters = ref(false);
     const search2 = ref(null);
+    const preferredPageSize = ref(props.customPageSize);
+    const preferredSort = ref(props.sortOptions[0]);
     const emit = __emit;
     useSlots();
     const filtersModel = computed({
@@ -391,21 +436,13 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         sendFiltersTelemetry("incomplete");
       }
     );
-    watch(
-      () => sortBy.value,
-      (newValue) => {
-        emit("sort", newValue);
-        sendSortingTelemetry();
-      }
-    );
-    watch(
-      () => route?.params?.projectId,
-      async () => {
-        await resetFilters();
-      }
-    );
+    watch([() => route.params?.projectId, () => route.name], async () => {
+      await resetFilters();
+      await loadPaginationPreferences();
+      await props.initialize();
+    });
     onMounted(async () => {
-      await loadPaginationFromQueryString();
+      await loadPaginationPreferences();
       await props.initialize();
       await nextTick();
       if (hasAppliedFilters()) {
@@ -427,32 +464,52 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         search2.value.focus();
       }
     };
-    const hasAppliedFilters = () => {
-      return !!filterKeys.value.find((key) => {
-        if (key === "search") return false;
-        if (typeof props.filters[key] === "boolean") {
-          return props.filters[key];
-        }
-        if (Array.isArray(props.filters[key])) {
-          return props.filters[key].length > 0;
-        }
-        return props.filters[key] !== "";
+    const isFilterApplied = (key) => {
+      if (key === "search") return false;
+      if (typeof props.filters[key] === "boolean") {
+        return props.filters[key];
+      }
+      if (Array.isArray(props.filters[key])) {
+        return props.filters[key].length > 0;
+      }
+      return props.filters[key] !== "";
+    };
+    const hasOnlyFiltersThatShowMoreResults = computed(() => {
+      const activeFilters = filterKeys.value.filter(isFilterApplied);
+      const filtersThatShowMoreResults = ["showArchived"];
+      return activeFilters.every((filter) => {
+        return filtersThatShowMoreResults.includes(filter);
       });
+    });
+    const hasAppliedFilters = () => {
+      return !!filterKeys.value.find(isFilterApplied);
     };
     const setRowsPerPage = async (numberOfRowsPerPage) => {
       rowsPerPage.value = numberOfRowsPerPage;
-      await savePaginationToQueryString();
-      emit("update:page-size", numberOfRowsPerPage);
+      await savePaginationPreferences();
+      emit("update:pagination-and-sort", {
+        pageSize: numberOfRowsPerPage
+      });
     };
-    const setCurrentPage = async (page) => {
+    const setSorting = async (sort, persistUpdate = true) => {
+      sortBy.value = sort;
+      if (persistUpdate) {
+        await savePaginationPreferences();
+      }
+      emit("update:pagination-and-sort", {
+        sort
+      });
+      sendSortingTelemetry();
+    };
+    const setCurrentPage = async (page, persistUpdate = true) => {
       currentPage.value = page;
-      await savePaginationToQueryString();
-      emit("update:current-page", page);
+      if (persistUpdate) {
+        await savePaginationPreferences();
+      }
+      emit("update:pagination-and-sort", {
+        page
+      });
     };
-    __expose({
-      currentPage,
-      setCurrentPage
-    });
     const sendFiltersTelemetry = (source) => {
       if (resettingFilters.value) {
         if (source !== "reset") {
@@ -486,7 +543,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       Object.keys(filtersModel.value).forEach((key) => {
         filtersModel.value[key] = Array.isArray(filtersModel.value[key]) ? [] : "";
       });
-      await setCurrentPage(1);
+      await setCurrentPage(1, false);
       resettingFilters.value = true;
       hasFilters.value = false;
       sendFiltersTelemetry("reset");
@@ -521,7 +578,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         (prev, curr) => Math.abs(curr - size) < Math.abs(prev - size) ? curr : prev
       );
     };
-    const savePaginationToQueryString = async () => {
+    const savePaginationPreferences = async () => {
       if (props.type !== "list-paginated") {
         return;
       }
@@ -531,31 +588,75 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       } else {
         delete currentQuery.page;
       }
-      if (rowsPerPage.value !== props.customPageSize) {
+      if (rowsPerPage.value !== preferredPageSize.value) {
         currentQuery.pageSize = rowsPerPage.value.toString();
+        preferredPageSize.value = rowsPerPage.value;
       } else {
         delete currentQuery.pageSize;
       }
+      if (sortBy.value !== preferredSort.value) {
+        currentQuery.sort = sortBy.value;
+        preferredSort.value = sortBy.value;
+      } else {
+        delete currentQuery.sort;
+      }
+      n8nLocalStorage.saveProjectPreferencesToLocalStorage(
+        route.params.projectId ?? "",
+        "workflows",
+        {
+          sort: sortBy.value,
+          pageSize: rowsPerPage.value
+        }
+      );
       await router.replace({
         query: Object.keys(currentQuery).length ? currentQuery : void 0
       });
     };
-    const loadPaginationFromQueryString = async () => {
+    const loadPaginationPreferences = async () => {
       if (props.type !== "list-paginated") {
         return;
       }
-      const query = router.currentRoute.value.query;
+      const query = route.query;
+      const localStorageValues = n8nLocalStorage.loadProjectPreferencesFromLocalStorage(
+        route.params.projectId ?? "",
+        "workflows"
+      );
+      const emitPayload = {};
       if (query.page) {
-        await setCurrentPage(parseInt(query.page, 10));
+        const newPage = parseInt(query.page, 10);
+        if (newPage > 1) {
+          currentPage.value = newPage;
+          emitPayload.page = newPage;
+        }
       }
-      if (query.pageSize) {
-        const parsedSize = parseInt(query.pageSize, 10);
-        await setRowsPerPage(findNearestPageSize(parsedSize));
+      if (query.pageSize ?? localStorageValues.pageSize) {
+        const parsedSize = parseInt(
+          query.pageSize || String(localStorageValues.pageSize),
+          10
+        );
+        const newPageSize = findNearestPageSize(parsedSize);
+        rowsPerPage.value = newPageSize;
+        emitPayload.pageSize = newPageSize;
+        preferredPageSize.value = newPageSize;
+      } else {
+        rowsPerPage.value = props.customPageSize;
+        emitPayload.pageSize = props.customPageSize;
       }
       if (query.sort) {
-        sortBy.value = query.sort;
+        sortBy.value = emitPayload.sort = preferredSort.value = query.sort;
+      } else if (localStorageValues.sort) {
+        await setSorting(localStorageValues.sort, false);
+        emitPayload.sort = localStorageValues.sort;
+        preferredSort.value = localStorageValues.sort;
+      } else {
+        sortBy.value = props.sortOptions[0];
       }
+      emit("update:pagination-and-sort", emitPayload);
     };
+    __expose({
+      currentPage,
+      setCurrentPage
+    });
     return (_ctx, _cache) => {
       const _component_n8n_loading = resolveComponent("n8n-loading");
       const _component_n8n_action_box = resolveComponent("n8n-action-box");
@@ -635,7 +736,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                         modelValue: sortBy.value,
                         "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => sortBy.value = $event),
                         size: "small",
-                        "data-test-id": "resources-list-sort"
+                        "data-test-id": "resources-list-sort",
+                        onChange: _cache[1] || (_cache[1] = ($event) => setSorting(sortBy.value))
                       }, {
                         default: withCtx(() => [
                           (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.sortOptions, (sortOption) => {
@@ -676,7 +778,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                 _ctx.showFiltersDropdown ? withDirectives((openBlock(), createElementBlock("div", _hoisted_3, [
                   createVNode(_component_n8n_info_tip, { bold: false }, {
                     default: withCtx(() => [
-                      createTextVNode(toDisplayString(unref(i18n).baseText(`${_ctx.resourceKey}.filters.active`)) + " ", 1),
+                      createTextVNode(toDisplayString(hasOnlyFiltersThatShowMoreResults.value ? unref(i18n).baseText(`${_ctx.resourceKey}.filters.active.shortText`) : unref(i18n).baseText(`${_ctx.resourceKey}.filters.active`)) + " ", 1),
                       createVNode(_component_n8n_link, {
                         "data-test-id": "workflows-filter-reset",
                         size: "small",
@@ -693,7 +795,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                 ], 512)), [
                   [vShow, hasFilters.value]
                 ]) : createCommentVNode("", true),
-                _cache[3] || (_cache[3] = createBaseVNode("div", { class: "pb-xs" }, null, -1))
+                _cache[4] || (_cache[4] = createBaseVNode("div", { class: "pb-xs" }, null, -1))
               ]),
               default: withCtx(() => [
                 renderSlot(_ctx.$slots, "preamble", {}, void 0, true),
@@ -724,7 +826,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                     _: 3
                   }, 8, ["items", "item-size"])) : _ctx.type === "list-paginated" ? (openBlock(), createElementBlock("div", {
                     key: 1,
-                    class: normalizeClass(_ctx.$style.paginatedListWrapper)
+                    class: normalizeClass(_ctx.$style.paginatedListWrapper),
+                    "data-test-id": "paginated-list"
                   }, [
                     createBaseVNode("div", {
                       class: normalizeClass(_ctx.$style.listItems)
@@ -749,11 +852,11 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                       createVNode(_component_el_pagination, {
                         "current-page": currentPage.value,
                         "onUpdate:currentPage": [
-                          _cache[1] || (_cache[1] = ($event) => currentPage.value = $event),
+                          _cache[2] || (_cache[2] = ($event) => currentPage.value = $event),
                           setCurrentPage
                         ],
                         "page-size": rowsPerPage.value,
-                        "onUpdate:pageSize": _cache[2] || (_cache[2] = ($event) => rowsPerPage.value = $event),
+                        "onUpdate:pageSize": _cache[3] || (_cache[3] = ($event) => rowsPerPage.value = $event),
                         background: "",
                         total: _ctx.totalItems,
                         "page-sizes": _ctx.availablePageSizeOptions,
@@ -823,7 +926,7 @@ const style0 = {
 const cssModules = {
   "$style": style0
 };
-const ResourcesListLayout = /* @__PURE__ */ _export_sfc(_sfc_main, [["__cssModules", cssModules], ["__scopeId", "data-v-b91b324f"]]);
+const ResourcesListLayout = /* @__PURE__ */ _export_sfc(_sfc_main, [["__cssModules", cssModules], ["__scopeId", "data-v-267490a8"]]);
 export {
   ResourcesListLayout as R
 };

package/dist/assets/{ResourcesListLayout-CtGME7aU.css → ResourcesListLayout-DuNjbsMn.css}

@@ -754,7 +754,7 @@
  -------------------------- */
 /* BEM
  -------------------------- */
-.resource-list-loading[data-v-b91b324f] {
+.resource-list-loading[data-v-267490a8] {
   position: relative;
   height: 0;
   width: 100%;
@@ -762,25 +762,25 @@
   /*
   Show the loading skeleton only if the loading takes longer than 300ms
   */
-  animation: 0.01s linear 0.3s forwards changeVisibility-b91b324f;
+  animation: 0.01s linear 0.3s forwards changeVisibility-267490a8;
 }
-.resource-list-loading[data-v-b91b324f] .el-skeleton {
+.resource-list-loading[data-v-267490a8] .el-skeleton {
   position: absolute;
   height: 100%;
   width: 100%;
   overflow: hidden;
 }
-.resource-list-loading[data-v-b91b324f] .el-skeleton > div > div:first-child .el-skeleton__item {
+.resource-list-loading[data-v-267490a8] .el-skeleton > div > div:first-child .el-skeleton__item {
   height: 42px;
   margin: 0;
 }
-.resource-list-loading[data-v-b91b324f] .el-skeleton .el-skeleton__item {
+.resource-list-loading[data-v-267490a8] .el-skeleton .el-skeleton__item {
   height: 69px;
 }
-.resource-list-loading-instant[data-v-b91b324f] {
-  animation: 0.01s linear 0s forwards changeVisibility-b91b324f;
+.resource-list-loading-instant[data-v-267490a8] {
+  animation: 0.01s linear 0s forwards changeVisibility-267490a8;
 }
-@keyframes changeVisibility-b91b324f {
+@keyframes changeVisibility-267490a8 {
 from {
     height: 0;
 }

package/dist/assets/{RunData-C9dtm1M2.css → RunData-DQeENuzG.css}

@@ -127,6 +127,10 @@
   border: 1px solid var(--color-foreground-base);
   border-radius: var(--border-radius-large);
 }
+.node-error-view_compact .node-error-view__header {
+  margin: 0 auto var(--spacing-2xs) auto;
+  border-radius: var(--border-radius-base);
+}
 .node-error-view__header-title {
   padding: var(--spacing-2xs) var(--spacing-s);
   border-bottom: 1px solid var(--color-danger-tint-1);
@@ -136,6 +140,9 @@
   border-radius: var(--border-radius-large) var(--border-radius-large) 0 0;
   color: var(--color-danger);
 }
+.node-error-view_compact .node-error-view__header-title {
+  border-radius: var(--border-radius-base);
+}
 .node-error-view__header-message {
   display: flex;
   justify-content: space-between;
@@ -213,6 +220,9 @@
   border: 1px solid var(--color-foreground-base);
   border-radius: var(--border-radius-large);
 }
+.node-error-view_compact .node-error-view__info {
+  border-radius: var(--border-radius-base);
+}
 .node-error-view__info-header {
   display: flex;
   align-items: center;
@@ -1718,7 +1728,7 @@ video {
  -------------------------- */
 /* BEM
  -------------------------- */
-.run-data .code-node-editor[data-v-5b056086] {
+.run-data .code-node-editor[data-v-148793aa] {
   height: 100%;
 }/* BEM support Func
  -------------------------- */
@@ -1842,7 +1852,7 @@ video {
  -------------------------- */
 /* BEM
  -------------------------- */
-[data-v-5b056086] .highlight {
+[data-v-148793aa] .highlight {
   background-color: #f7dc55;
   color: black;
   border-radius: var(--border-radius-base);