@revenexx/studio-integrations 3.0.0 → 3.0.1

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @revenexx/studio-integrations
 
+## 3.0.1
+
+### Patch Changes
+
+- 259fe08: A template card whose definition could not be fetched now says "Couldn't load the flow" instead of showing "Loading the flow" for the rest of the visit, on every surface that draws the card. Sorting the gallery by most steps puts templates whose step count is not known after every template whose count is, rather than ranking them as having no steps (PO-249).
+
 ## 3.0.0
 
 ### Major Changes

package/dist/module.json

@@ -1,7 +1,7 @@
 {
   "name": "@revenexx/studio-integrations",
   "configKey": "studioIntegrations",
-  "version": "3.0.0",
+  "version": "3.0.1",
   "builder": {
     "@nuxt/module-builder": "1.0.3",
     "unbuild": "unknown"

package/dist/runtime/components/Integrations/TemplateCard.vue

@@ -1,6 +1,6 @@
 <script setup>
 import { computed, resolveComponent } from "vue";
-import { RefreshCircle as Loader2 } from "#solar-icons";
+import { RefreshCircle as Loader2, DangerTriangle as AlertTriangle } from "#solar-icons";
 import { triggerGlyph as glyphForTrigger } from "../../data/triggerGlyphs";
 import { templateCategoryLabel, templatePackageLabel } from "../../data/integrationTemplates";
 import TemplateFlowPreview from "./TemplateFlowPreview.vue";
@@ -68,6 +68,17 @@ const chipSize = computed(() => full.value ? "px-2 py-0.5 text-xs" : "px-1.5 py-
         :height="full ? 116 : 96"
         :class="full ? 'mt-7' : ''"
       />
+      <!-- The read came back without a definition. Said in words, because a
+           spinner here would wait for the rest of the visit, and the card would
+           go on looking like a template still worth waiting for (PO-249). -->
+      <div
+        v-else-if="template.detailFailed"
+        role="status"
+        class="flex h-full items-center justify-center gap-1.5 px-3 text-xs text-muted-foreground"
+      >
+        <AlertTriangle :size="full ? 14 : 12" class="shrink-0" />
+        {{ t("integration.templates.card.state.flowUnavailable") }}
+      </div>
       <!-- Named, because "still on its way" and "this template draws nothing"
            are the same sight otherwise — and a spinner nobody can address is a
            promise no test can hold to. -->

package/dist/runtime/composables/useIntegrationsTemplates.js

@@ -95,10 +95,12 @@ export function useIntegrationsTemplates() {
   const t = useIntegrationsT();
   const rawList = useState("integrations.templates.raw", () => []);
   const rawDetails = useState("integrations.templates.rawDetails", () => ({}));
+  const failedDetails = useState("integrations.templates.failedDetails", () => ({}));
   const templates = computed(() => rawList.value.map((item) => {
     const base = mapListItem(item);
     const detail = rawDetails.value[item.slug];
-    return detail ? applyDetail(base, detail) : base;
+    if (detail) return applyDetail(base, detail);
+    return failedDetails.value[item.slug] ? { ...base, detailFailed: true } : base;
   }));
   const loaded = useState("integrations.templates.loaded", () => false);
   const loading = useState("integrations.templates.loading", () => false);
@@ -112,11 +114,13 @@ export function useIntegrationsTemplates() {
       const list2 = unwrapList(await api.get("/templates"));
       rawList.value = list2;
       rawDetails.value = {};
+      failedDetails.value = {};
       loaded.value = true;
     } catch (e) {
       error.value = errorReason(e, t("integration.templates.state.error.fallback"));
       rawList.value = [];
       rawDetails.value = {};
+      failedDetails.value = {};
       loaded.value = true;
     } finally {
       gate.release();
@@ -142,14 +146,19 @@ export function useIntegrationsTemplates() {
   });
   function remember(details) {
     const found = [...details].filter((entry) => entry[1] !== null);
-    if (!found.length) return;
-    rawDetails.value = { ...rawDetails.value, ...Object.fromEntries(found) };
+    const missing = [...details].filter(([, detail]) => detail === null).map(([slug]) => slug);
+    if (found.length) rawDetails.value = { ...rawDetails.value, ...Object.fromEntries(found) };
+    if (found.length || missing.length) {
+      const failed = { ...failedDetails.value };
+      for (const [slug] of found) delete failed[slug];
+      for (const slug of missing) failed[slug] = true;
+      failedDetails.value = failed;
+    }
   }
   async function fetchDetail(slug) {
     const base = get(slug);
     if (!base?.fromApi) return base;
-    const detail = await loader.one(slug);
-    if (detail) remember(/* @__PURE__ */ new Map([[slug, detail]]));
+    remember(/* @__PURE__ */ new Map([[slug, await loader.one(slug)]]));
     return get(slug);
   }
   async function ensureDetails(slugs, _concurrency = 4) {

package/dist/runtime/i18n/messages/de.json

@@ -1113,6 +1113,7 @@
   "integration.secrets.table.column.key": "Schlüssel",
   "integration.secrets.table.column.updated": "Aktualisiert",
   "integration.shell.action.skipToContent": "Zum Inhalt springen",
+  "integration.templates.card.state.flowUnavailable": "Der Ablauf konnte nicht geladen werden",
   "integration.templates.card.state.loadingFlow": "Der Ablauf wird geladen",
   "integration.templates.card.trigger.event": "Event-gesteuert",
   "integration.templates.card.trigger.schedule": "Geplant",

package/dist/runtime/i18n/messages/en.json

@@ -1113,6 +1113,7 @@
   "integration.secrets.table.column.key": "Key",
   "integration.secrets.table.column.updated": "Updated",
   "integration.shell.action.skipToContent": "Skip to content",
+  "integration.templates.card.state.flowUnavailable": "Couldn't load the flow",
   "integration.templates.card.state.loadingFlow": "Loading the flow",
   "integration.templates.card.trigger.event": "Event-driven",
   "integration.templates.card.trigger.schedule": "Scheduled",

package/dist/runtime/pages/integrations/templates/index.vue

@@ -49,7 +49,7 @@ const filtered = computed(() => {
   const sorted = [...items];
   if (sortBy.value === "name") sorted.sort((a, b) => a.name.localeCompare(b.name));
   else if (sortBy.value === "level") sorted.sort((a, b) => (LEVEL_RANK[a.level] ?? 0) - (LEVEL_RANK[b.level] ?? 0) || a.name.localeCompare(b.name));
-  else sorted.sort((a, b) => b.nodeCount - a.nodeCount || a.name.localeCompare(b.name));
+  else sorted.sort((a, b) => Number(!!b.detailLoaded) - Number(!!a.detailLoaded) || b.nodeCount - a.nodeCount || a.name.localeCompare(b.name));
   return sorted;
 });
 watch(() => templates.value.length, () => {

package/dist/runtime/types/integrations.d.ts

@@ -616,6 +616,8 @@ export interface WorkflowTemplate {
     }>;
     /** True once the heavy definition blob has been merged via fetchDetail. */
     detailLoaded?: boolean;
+    /** True when the definition was asked for and did not arrive — not "still on its way". */
+    detailFailed?: boolean;
     /** Source node package this template ships with (e.g. Business Central). */
     package?: {
         name: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@revenexx/studio-integrations",
-  "version": "3.0.0",
+  "version": "3.0.1",
   "type": "module",
   "description": "Integration Studio (core: workflows, node editor, runs, schedules, credentials, secrets, audit) as a standalone, publishable Nuxt module.",
   "repository": {