@revenexx/studio-integrations 0.1.4 → 0.3.0

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

@@ -0,0 +1,239 @@
+<script setup>
+import { computed, ref, watch } from "vue";
+import { AddCircle as Plus, TrashBinMinimalistic as Trash2 } from "#solar-icons";
+import {
+  Button,
+  Input,
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue,
+  Textarea
+} from "@revenexx/studio";
+const props = defineProps({
+  modelValue: { type: null, required: true }
+});
+const emit = defineEmits(["update:modelValue"]);
+const METHODS = [
+  { value: "equal", label: "equals", attribute: true, values: "list" },
+  { value: "notEqual", label: "does not equal", attribute: true, values: "list" },
+  { value: "contains", label: "contains", attribute: true, values: "list" },
+  { value: "search", label: "search", attribute: true, values: "single" },
+  { value: "startsWith", label: "starts with", attribute: true, values: "single" },
+  { value: "endsWith", label: "ends with", attribute: true, values: "single" },
+  { value: "lessThan", label: "less than", attribute: true, values: "single" },
+  { value: "lessThanEqual", label: "less than or equal", attribute: true, values: "single" },
+  { value: "greaterThan", label: "greater than", attribute: true, values: "single" },
+  { value: "greaterThanEqual", label: "greater than or equal", attribute: true, values: "single" },
+  { value: "between", label: "between", attribute: true, values: "list" },
+  { value: "isNull", label: "is empty", attribute: true, values: "none" },
+  { value: "isNotNull", label: "is not empty", attribute: true, values: "none" },
+  { value: "orderAsc", label: "order ascending", attribute: true, values: "none" },
+  { value: "orderDesc", label: "order descending", attribute: true, values: "none" },
+  { value: "limit", label: "limit", attribute: false, values: "single" },
+  { value: "offset", label: "offset", attribute: false, values: "single" }
+];
+function methodMeta(method) {
+  return METHODS.find((m) => m.value === method) ?? null;
+}
+function formatValue(v) {
+  return typeof v === "string" ? v : JSON.stringify(v);
+}
+function parseRow(str) {
+  try {
+    const parsed = JSON.parse(str);
+    if (parsed && typeof parsed === "object" && !Array.isArray(parsed) && typeof parsed.method === "string" && methodMeta(parsed.method)) {
+      const p = parsed;
+      return {
+        kind: "query",
+        method: p.method,
+        attribute: typeof p.attribute === "string" ? p.attribute : "",
+        values: Array.isArray(p.values) ? p.values.map(formatValue).join(", ") : ""
+      };
+    }
+  } catch {
+  }
+  return { kind: "raw", text: str };
+}
+function coerceValue(part) {
+  const t = part.trim();
+  if (/^-?\d+(\.\d+)?$/.test(t)) return Number(t);
+  if (t === "true") return true;
+  if (t === "false") return false;
+  return t;
+}
+function rowToString(row) {
+  if (row.kind === "raw") {
+    const t = row.text.trim();
+    return t === "" ? null : t;
+  }
+  const meta = methodMeta(row.method);
+  if (!meta) return null;
+  const out = { method: row.method };
+  if (meta.attribute && row.attribute.trim() !== "") out.attribute = row.attribute.trim();
+  if (meta.values !== "none") {
+    const values = row.values.split(",").map(coerceValue).filter((v) => v !== "");
+    if (values.length) out.values = meta.values === "single" ? [values[0]] : values;
+  }
+  return JSON.stringify(out);
+}
+function rowsToStrings(rows2) {
+  return rows2.map(rowToString).filter((s) => s !== null);
+}
+const rows = ref([]);
+watch(
+  () => props.modelValue,
+  (v) => {
+    const external = Array.isArray(v) ? v.map(String) : [];
+    if (JSON.stringify(rowsToStrings(rows.value)) !== JSON.stringify(external)) {
+      rows.value = external.map(parseRow);
+    }
+  },
+  { immediate: true }
+);
+function commit() {
+  const strings = rowsToStrings(rows.value);
+  emit("update:modelValue", strings.length || rows.value.length ? strings : void 0);
+}
+function setRow(idx, patch) {
+  rows.value = rows.value.map((r, i) => {
+    if (i !== idx) return r;
+    const next = { ...r, ...patch };
+    if (next.kind === "query" && methodMeta(next.method)?.values === "none") next.values = "";
+    return next;
+  });
+  commit();
+}
+function addRow() {
+  rows.value = [...rows.value, { kind: "query", method: "equal", attribute: "", values: "" }];
+}
+function removeRow(idx) {
+  rows.value = rows.value.filter((_, i) => i !== idx);
+  commit();
+}
+const mode = ref("builder");
+const jsonDraft = ref("");
+const jsonError = ref(null);
+watch(mode, (m) => {
+  if (m === "json") {
+    jsonDraft.value = JSON.stringify(rowsToStrings(rows.value), null, 2);
+    jsonError.value = null;
+  }
+});
+function writeJson(text) {
+  jsonDraft.value = text;
+  if (text.trim() === "") {
+    jsonError.value = null;
+    emit("update:modelValue", void 0);
+    return;
+  }
+  try {
+    const parsed = JSON.parse(text);
+    if (!Array.isArray(parsed)) {
+      jsonError.value = "Must be a JSON array of query strings.";
+      return;
+    }
+    jsonError.value = null;
+    emit("update:modelValue", parsed.map(String));
+  } catch {
+    jsonError.value = "Not valid JSON yet \u2014 the value is kept once it parses.";
+  }
+}
+const rowMeta = computed(() => rows.value.map((r) => r.kind === "query" ? methodMeta(r.method) : null));
+</script>
+
+<template>
+  <div class="space-y-1.5">
+    <div class="flex items-center justify-end">
+      <div class="flex items-center rounded border border-black/[0.08] bg-white p-px">
+        <button
+          type="button"
+          class="rounded px-1 py-px text-[10px] font-medium transition"
+          :class="mode === 'builder' ? 'bg-slate-100 text-foreground' : 'text-muted-foreground hover:text-foreground'"
+          @click="mode = 'builder'"
+        >
+          Builder
+        </button>
+        <button
+          type="button"
+          class="rounded px-1 py-px text-[10px] font-medium transition"
+          :class="mode === 'json' ? 'bg-slate-100 text-foreground' : 'text-muted-foreground hover:text-foreground'"
+          @click="mode = 'json'"
+        >
+          JSON
+        </button>
+      </div>
+    </div>
+
+    <template v-if="mode === 'builder'">
+      <div v-for="(row, idx) in rows" :key="idx" class="flex items-center gap-1.5">
+        <template v-if="row.kind === 'query'">
+          <Select
+            :model-value="row.method"
+            @update:model-value="(v) => setRow(idx, { method: String(v) })"
+          >
+            <SelectTrigger class="h-7 w-40 shrink-0 bg-white text-sm">
+              <SelectValue />
+            </SelectTrigger>
+            <SelectContent>
+              <SelectItem v-for="m in METHODS" :key="m.value" :value="m.value">
+                {{ m.label }}
+              </SelectItem>
+            </SelectContent>
+          </Select>
+          <Input
+            v-if="rowMeta[idx]?.attribute"
+            :model-value="row.attribute"
+            placeholder="field"
+            class="h-7 w-36 shrink-0 bg-white font-mono text-sm"
+            @update:model-value="(v) => setRow(idx, { attribute: String(v) })"
+          />
+          <Input
+            v-if="rowMeta[idx]?.values !== 'none'"
+            :model-value="row.values"
+            :placeholder="rowMeta[idx]?.values === 'list' ? 'value, value, \u2026' : 'value'"
+            class="h-7 min-w-0 flex-1 bg-white text-sm"
+            @update:model-value="(v) => setRow(idx, { values: String(v) })"
+          />
+          <div v-else class="min-w-0 flex-1" />
+        </template>
+        <Input
+          v-else
+          :model-value="row.text"
+          class="h-7 min-w-0 flex-1 bg-white font-mono text-sm"
+          title="This entry is not in the builder vocabulary; edit it as text or in the JSON view."
+          @update:model-value="(v) => setRow(idx, { text: String(v) })"
+        />
+        <button
+          type="button"
+          class="flex size-6 shrink-0 items-center justify-center rounded text-muted-foreground transition hover:text-rose-600"
+          @click="removeRow(idx)"
+        >
+          <Trash2 :size="11" />
+        </button>
+      </div>
+      <Button
+        type="button"
+        variant="outline"
+        size="sm"
+        class="h-7 w-full text-sm"
+        @click="addRow"
+      >
+        <Plus :size="11" />
+        Add filter
+      </Button>
+    </template>
+
+    <template v-else>
+      <Textarea
+        :model-value="jsonDraft"
+        :rows="6"
+        spellcheck="false"
+        class="font-mono text-xs"
+        @update:model-value="(v) => writeJson(String(v))"
+      />
+      <p v-if="jsonError" class="text-sm text-amber-600">{{ jsonError }}</p>
+    </template>
+  </div>
+</template>

package/dist/runtime/components/Integrations/QueryBuilder.vue.d.ts

@@ -0,0 +1,9 @@
+type __VLS_Props = {
+    modelValue: unknown;
+};
+declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: unknown) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:modelValue"?: ((value: unknown) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;

package/dist/runtime/components/Integrations/{RunDetailDialog.d.vue.ts → RunActionsMenu.d.vue.ts}

@@ -1,11 +1,10 @@
 import type { WorkflowRun } from '../../types/integrations.js';
 type __VLS_Props = {
-    open: boolean;
-    run: WorkflowRun | null;
+    run: WorkflowRun;
 };
 declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    "update:open": (args_0: boolean) => any;
+    changed: () => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
-    "onUpdate:open"?: ((args_0: boolean) => any) | undefined;
+    onChanged?: (() => any) | undefined;
 }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 export default _default;

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

@@ -0,0 +1,86 @@
+<script setup>
+import { computed, ref } from "vue";
+import { MenuDots as MoreHorizontal } from "#solar-icons";
+import {
+  Button,
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuSeparator,
+  DropdownMenuTrigger
+} from "@revenexx/studio";
+import { toast } from "vue-sonner";
+const props = defineProps({
+  run: { type: Object, required: true }
+});
+const emit = defineEmits(["changed"]);
+const router = useRouter();
+const { cancelRun, terminateRun, retryRun, resumeRun } = useIntegrationsRuns();
+function viewDetails() {
+  void router.push({ path: `/integrations/workflows/${props.run.workflowId}`, query: { run: props.run.id } });
+}
+function viewReplay() {
+  void router.push({ path: `/integrations/workflows/${props.run.workflowId}`, query: { run: props.run.id, view: "replay" } });
+}
+const isActive = computed(() => props.run.status === "running" || props.run.status === "queued");
+const isTerminal = computed(() => ["succeeded", "failed", "cancelled"].includes(props.run.status));
+const canResume = computed(() => props.run.status === "failed");
+const hasAny = computed(() => isActive.value || isTerminal.value);
+const LABEL = { cancel: "Cancel", terminate: "Terminate", retry: "Retry", resume: "Resume" };
+const busy = ref(false);
+async function runAction(a) {
+  if (busy.value) return;
+  busy.value = true;
+  try {
+    let res = null;
+    switch (a) {
+      case "cancel":
+        res = await cancelRun(props.run.workflowId, props.run.id);
+        break;
+      case "terminate":
+        res = await terminateRun(props.run.workflowId, props.run.id);
+        break;
+      case "retry":
+        res = await retryRun(props.run.workflowId, props.run.id);
+        break;
+      case "resume":
+        res = await resumeRun(props.run.workflowId, props.run.id);
+        break;
+    }
+    const newId = res && typeof res === "object" && "id" in res ? String(res.id) : null;
+    toast.success(
+      (a === "retry" || a === "resume") && newId && newId !== String(props.run.id) ? `Started run #${newId}` : `${LABEL[a]} requested`
+    );
+    emit("changed");
+  } catch (e) {
+    toast.error(e?.message ?? `Could not ${LABEL[a].toLowerCase()} the run.`);
+  } finally {
+    busy.value = false;
+  }
+}
+function confirmTerminate() {
+  toast(`Terminate run #${props.run.id}?`, {
+    action: { label: "Terminate", onClick: () => void runAction("terminate") }
+  });
+}
+</script>
+
+<template>
+  <DropdownMenu>
+    <DropdownMenuTrigger as-child>
+      <Button variant="ghost" size="icon" class="size-7" :disabled="busy" @click.stop>
+        <MoreHorizontal :size="16" />
+      </Button>
+    </DropdownMenuTrigger>
+    <DropdownMenuContent align="end" class="w-40" @click.stop>
+      <DropdownMenuItem @select="viewDetails">View details</DropdownMenuItem>
+      <DropdownMenuItem @select="viewReplay">Replay</DropdownMenuItem>
+      <DropdownMenuSeparator v-if="hasAny" />
+      <DropdownMenuItem v-if="isActive" @select="runAction('cancel')">Cancel run</DropdownMenuItem>
+      <DropdownMenuItem v-if="isActive" class="text-rose-600" @select="confirmTerminate">Terminate</DropdownMenuItem>
+      <DropdownMenuSeparator v-if="isActive && (canResume || isTerminal)" />
+      <DropdownMenuItem v-if="canResume" @select="runAction('resume')">Resume</DropdownMenuItem>
+      <DropdownMenuItem v-if="isTerminal" @select="runAction('retry')">Retry</DropdownMenuItem>
+    </DropdownMenuContent>
+  </DropdownMenu>
+</template>

package/dist/runtime/components/Integrations/{RunDetailDialog.vue.d.ts → RunActionsMenu.vue.d.ts}

@@ -1,11 +1,10 @@
 import type { WorkflowRun } from '../../types/integrations.js';
 type __VLS_Props = {
-    open: boolean;
-    run: WorkflowRun | null;
+    run: WorkflowRun;
 };
 declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    "update:open": (args_0: boolean) => any;
+    changed: () => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
-    "onUpdate:open"?: ((args_0: boolean) => any) | undefined;
+    onChanged?: (() => any) | undefined;
 }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 export default _default;

package/dist/runtime/components/Integrations/RunDetailPanel.d.vue.ts

@@ -0,0 +1,14 @@
+import type { WorkflowRun } from '../../types/integrations.js';
+type __VLS_Props = {
+    run: WorkflowRun;
+    /** Which surface renders: the overview or the steps+history timeline. */
+    view?: 'details' | 'timeline';
+};
+declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    changed: () => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onChanged?: (() => any) | undefined;
+}>, {
+    view: "details" | "timeline";
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;