@nvent-addon/app 0.4.5 → 0.5.1

package/dist/runtime/app/components/FlowStepSelector.vue

@@ -1,238 +0,0 @@
-<template>
-  <div :class="ui.root">
-    <button
-      v-for="item in items"
-      :key="item.value"
-      type="button"
-      :class="itemClasses(item)"
-      @click="$emit('update:modelValue', item.value)"
-    >
-      <!-- Status Icon or All Icon -->
-      <div
-        class="flex-shrink-0"
-        :class="item.step.showAllIndicator ? '' : 'mt-0.5'"
-      >
-        <div
-          v-if="item.step.showAllIndicator"
-          class="w-6 h-6 rounded-full flex items-center justify-center bg-gray-100 dark:bg-gray-800"
-        >
-          <UIcon
-            name="i-lucide-layers"
-            class="w-3 h-3 text-gray-600 dark:text-gray-400"
-          />
-        </div>
-        <div
-          v-else
-          class="w-8 h-8 rounded-full flex items-center justify-center"
-          :class="getStepStatusBg(item.step.status)"
-        >
-          <UIcon
-            :name="getStepStatusIcon(item.step.status)"
-            class="w-4 h-4"
-            :class="getStepStatusIconColor(item.step.status)"
-          />
-        </div>
-      </div>
-
-      <!-- Step Details -->
-      <div class="flex-1 min-w-0 ml-3">
-        <h4 class="text-sm font-medium text-gray-900 dark:text-gray-100">
-          {{ item.step.key }}
-        </h4>
-        <div
-          v-if="!item.step.showAllIndicator"
-          class="flex items-center gap-3 mt-1 text-xs text-gray-500"
-        >
-          <span
-            class="capitalize"
-            :class="getStepStatusTextColor(item.step.status)"
-          >
-            {{ item.step.status || "pending" }}
-          </span>
-          <span v-if="item.step.attempt && item.step.attempt > 1">
-            Attempt {{ item.step.attempt }}
-          </span>
-        </div>
-        <div
-          v-else
-          class="mt-1 text-xs text-gray-500"
-        >
-          Show all events from all steps
-        </div>
-
-        <!-- Additional Details (from description slot) -->
-        <div
-          v-if="!item.step.showAllIndicator && (item.step.startedAt || item.step.completedAt || item.step.error || item.step.awaitType)"
-          class="mt-3"
-        >
-          <!-- Timing Info -->
-          <div
-            v-if="item.step.startedAt || item.step.completedAt"
-            class="flex items-center gap-4 text-xs text-gray-500"
-          >
-            <div
-              v-if="item.step.startedAt"
-              class="flex items-center gap-1"
-            >
-              <UIcon
-                name="i-lucide-clock"
-                class="w-3 h-3"
-              />
-              <span>{{ formatTime(item.step.startedAt) }}</span>
-            </div>
-            <div
-              v-if="item.step.completedAt"
-              class="flex items-center gap-1"
-            >
-              <UIcon
-                name="i-lucide-check-circle"
-                class="w-3 h-3"
-              />
-              <span>{{ formatTime(item.step.completedAt) }}</span>
-            </div>
-          </div>
-
-          <!-- Error Message -->
-          <div
-            v-if="item.step.error"
-            class="mt-2"
-          >
-            <div
-              class="p-2 bg-red-50 dark:bg-red-900/10 border border-red-200 dark:border-red-900/30 rounded text-xs text-red-600 dark:text-red-400"
-              :title="String(item.step.error || '')"
-            >
-              <div class="flex items-start gap-1">
-                <UIcon
-                  name="i-lucide-alert-circle"
-                  class="w-3 h-3 flex-shrink-0 mt-0.5"
-                />
-                <p class="line-clamp-2 break-all">
-                  {{ item.step.error }}
-                </p>
-              </div>
-            </div>
-          </div>
-
-          <!-- Await Info -->
-          <div
-            v-if="item.step.awaitType"
-            class="mt-2 p-2 bg-blue-50 dark:bg-blue-900/10 border border-blue-200 dark:border-blue-900/30 rounded text-xs text-blue-600 dark:text-blue-400"
-          >
-            <div class="flex items-center gap-1">
-              <UIcon
-                name="i-lucide-timer"
-                class="w-3 h-3"
-              />
-              <span>Waiting: {{ item.step.awaitType }}</span>
-            </div>
-          </div>
-        </div>
-      </div>
-    </button>
-  </div>
-</template>
-
-<script setup>
-import { computed } from "vue";
-import { tv } from "tailwind-variants";
-import { twMerge } from "tailwind-merge";
-import { UIcon } from "#components";
-const props = defineProps({
-  modelValue: { type: String, required: true },
-  items: { type: Array, required: true },
-  ui: { type: Object, required: false }
-});
-defineEmits(["update:modelValue"]);
-const defaultUi = {
-  root: "space-y-3",
-  itemBase: "w-full flex items-start border rounded-lg text-sm p-3.5 transition-colors text-left hover:bg-gray-50 dark:hover:bg-gray-900/50",
-  item: "border-gray-200 dark:border-gray-800",
-  itemSelected: "border-primary bg-primary/5 dark:bg-primary/10"
-};
-const ui = computed(() => ({
-  root: twMerge(defaultUi.root, props.ui?.root),
-  itemBase: twMerge(defaultUi.itemBase, props.ui?.itemBase),
-  item: props.ui?.item || defaultUi.item,
-  itemSelected: props.ui?.itemSelected || defaultUi.itemSelected
-}));
-const itemVariants = computed(() => tv({
-  base: ui.value.itemBase,
-  variants: {
-    selected: {
-      true: ui.value.itemSelected,
-      false: ui.value.item
-    }
-  }
-}));
-const itemClasses = (item) => {
-  return itemVariants.value({
-    selected: props.modelValue === item.value
-  });
-};
-const formatTime = (timestamp) => {
-  const date = new Date(timestamp);
-  const now = /* @__PURE__ */ new Date();
-  const diff = now.getTime() - date.getTime();
-  const seconds = Math.floor(diff / 1e3);
-  const minutes = Math.floor(seconds / 60);
-  const hours = Math.floor(minutes / 60);
-  const days = Math.floor(hours / 24);
-  if (days > 0)
-    return `${days}d ago`;
-  if (hours > 0)
-    return `${hours}h ago`;
-  if (minutes > 0)
-    return `${minutes}m ago`;
-  if (seconds > 10)
-    return `${seconds}s ago`;
-  return "just now";
-};
-const getStepStatusBg = (status) => {
-  switch (status) {
-    case "completed":
-      return "bg-emerald-50 dark:bg-emerald-900/20";
-    case "failed":
-      return "bg-red-50 dark:bg-red-900/20";
-    case "running":
-      return "bg-blue-50 dark:bg-blue-900/20";
-    default:
-      return "bg-gray-50 dark:bg-gray-900/20";
-  }
-};
-const getStepStatusIcon = (status) => {
-  switch (status) {
-    case "completed":
-      return "i-lucide-check-circle";
-    case "failed":
-      return "i-lucide-x-circle";
-    case "running":
-      return "i-lucide-loader-circle";
-    default:
-      return "i-lucide-circle";
-  }
-};
-const getStepStatusIconColor = (status) => {
-  switch (status) {
-    case "completed":
-      return "text-emerald-600 dark:text-emerald-400";
-    case "failed":
-      return "text-red-600 dark:text-red-400";
-    case "running":
-      return "text-blue-600 dark:text-blue-400 animate-spin";
-    default:
-      return "text-gray-400";
-  }
-};
-const getStepStatusTextColor = (status) => {
-  switch (status) {
-    case "completed":
-      return "text-emerald-600 dark:text-emerald-400";
-    case "failed":
-      return "text-red-600 dark:text-red-400";
-    case "running":
-      return "text-blue-600 dark:text-blue-400";
-    default:
-      return "text-gray-500";
-  }
-};
-</script>

package/dist/runtime/app/components/QueueConfigDetails.vue

@@ -1,412 +0,0 @@
-<template>
-  <USlideover
-    v-model:open="isOpen"
-    :ui="{
-  body: 'p-0 sm:p-0'
-}"
-  >
-    <template #title>
-      <div class="flex items-center justify-between w-full pr-4">
-        <div>
-          <div class="text-sm font-semibold">
-            Queue Configuration
-          </div>
-          <div class="text-xs font-mono text-gray-500 mt-0.5">
-            {{ queueName }}
-          </div>
-        </div>
-      </div>
-    </template>
-    <template #body>
-      <!-- Fixed Tabs Header -->
-      <div class="sticky top-0 z-10 bg-white dark:bg-gray-950 border-b border-gray-200 dark:border-gray-800 px-6 pt-2">
-        <UTabs
-          v-model="selectedTab"
-          :items="tabs"
-        />
-      </div>
-
-      <!-- Scrollable Content Area -->
-      <div class="flex-1 overflow-y-auto overflow-x-hidden">
-        <!-- Queue Config Tab -->
-        <div
-          v-if="selectedTab === 'queue'"
-          class="p-6 space-y-6"
-        >
-          <div
-            v-if="!queueConfig || !hasQueueConfig"
-            class="text-sm text-gray-400 text-center py-8"
-          >
-            <UIcon
-              name="i-lucide-info"
-              class="w-8 h-8 mx-auto mb-2 opacity-50"
-            />
-            <p>No queue configuration defined</p>
-            <p class="text-xs mt-1">
-              Using default values
-            </p>
-          </div>
-          <template v-else>
-            <!-- Queue Name -->
-            <div class="space-y-2">
-              <div class="flex items-center gap-2 text-sm font-medium text-gray-700 dark:text-gray-300">
-                <UIcon
-                  name="i-lucide-tag"
-                  class="w-4 h-4"
-                />
-                <span>Queue Name</span>
-              </div>
-              <div class="pl-6">
-                <div class="text-sm font-mono text-gray-900 dark:text-gray-100 bg-gray-50 dark:bg-gray-900 px-3 py-2 rounded border border-gray-200 dark:border-gray-800">
-                  {{ queueConfig.name || queueName }}
-                </div>
-              </div>
-            </div>
-
-            <!-- Prefix -->
-            <div
-              v-if="queueConfig.prefix"
-              class="space-y-2"
-            >
-              <div class="flex items-center gap-2 text-sm font-medium text-gray-700 dark:text-gray-300">
-                <UIcon
-                  name="i-lucide-folder"
-                  class="w-4 h-4"
-                />
-                <span>Prefix</span>
-              </div>
-              <div class="pl-6">
-                <div class="text-sm font-mono text-gray-900 dark:text-gray-100 bg-gray-50 dark:bg-gray-900 px-3 py-2 rounded border border-gray-200 dark:border-gray-800">
-                  {{ queueConfig.prefix }}
-                </div>
-                <p class="text-xs text-gray-500 mt-1">
-                  Redis key prefix for this queue
-                </p>
-              </div>
-            </div>
-
-            <!-- Rate Limiter -->
-            <div
-              v-if="queueConfig.limiter"
-              class="space-y-2"
-            >
-              <div class="flex items-center gap-2 text-sm font-medium text-gray-700 dark:text-gray-300">
-                <UIcon
-                  name="i-lucide-gauge"
-                  class="w-4 h-4"
-                />
-                <span>Rate Limiter</span>
-              </div>
-              <div class="pl-6 space-y-3">
-                <div class="bg-gray-50 dark:bg-gray-900 px-3 py-2 rounded border border-gray-200 dark:border-gray-800">
-                  <div class="flex items-center justify-between text-sm">
-                    <span class="text-gray-600 dark:text-gray-400">Max Jobs</span>
-                    <span class="font-medium text-gray-900 dark:text-gray-100">{{ queueConfig.limiter.max }}</span>
-                  </div>
-                </div>
-                <div class="bg-gray-50 dark:bg-gray-900 px-3 py-2 rounded border border-gray-200 dark:border-gray-800">
-                  <div class="flex items-center justify-between text-sm">
-                    <span class="text-gray-600 dark:text-gray-400">Duration</span>
-                    <span class="font-medium text-gray-900 dark:text-gray-100">{{ queueConfig.limiter.duration }}ms</span>
-                  </div>
-                </div>
-                <div
-                  v-if="queueConfig.limiter.groupKey"
-                  class="bg-gray-50 dark:bg-gray-900 px-3 py-2 rounded border border-gray-200 dark:border-gray-800"
-                >
-                  <div class="flex items-center justify-between text-sm">
-                    <span class="text-gray-600 dark:text-gray-400">Group Key</span>
-                    <span class="font-medium font-mono text-gray-900 dark:text-gray-100">{{ queueConfig.limiter.groupKey }}</span>
-                  </div>
-                </div>
-                <p class="text-xs text-gray-500">
-                  Limits processing to {{ queueConfig.limiter.max }} jobs per {{ queueConfig.limiter.duration }}ms
-                </p>
-              </div>
-            </div>
-
-            <!-- Default Job Options -->
-            <div
-              v-if="queueConfig.defaultJobOptions && hasJobOptions"
-              class="space-y-2"
-            >
-              <div class="flex items-center gap-2 text-sm font-medium text-gray-700 dark:text-gray-300">
-                <UIcon
-                  name="i-lucide-settings"
-                  class="w-4 h-4"
-                />
-                <span>Default Job Options</span>
-              </div>
-              <div class="pl-6 space-y-3">
-                <div
-                  v-if="typeof queueConfig.defaultJobOptions.attempts === 'number'"
-                  class="bg-gray-50 dark:bg-gray-900 px-3 py-2 rounded border border-gray-200 dark:border-gray-800"
-                >
-                  <div class="flex items-center justify-between text-sm">
-                    <span class="text-gray-600 dark:text-gray-400">Max Attempts</span>
-                    <span class="font-medium text-gray-900 dark:text-gray-100">{{ queueConfig.defaultJobOptions.attempts }}</span>
-                  </div>
-                </div>
-                <div
-                  v-if="queueConfig.defaultJobOptions.backoff"
-                  class="bg-gray-50 dark:bg-gray-900 px-3 py-2 rounded border border-gray-200 dark:border-gray-800"
-                >
-                  <div class="text-sm space-y-1">
-                    <div class="flex items-center justify-between">
-                      <span class="text-gray-600 dark:text-gray-400">Backoff Type</span>
-                      <span class="font-medium text-gray-900 dark:text-gray-100">{{ queueConfig.defaultJobOptions.backoff.type || "exponential" }}</span>
-                    </div>
-                    <div
-                      v-if="queueConfig.defaultJobOptions.backoff.delay"
-                      class="flex items-center justify-between"
-                    >
-                      <span class="text-gray-600 dark:text-gray-400">Delay</span>
-                      <span class="font-medium text-gray-900 dark:text-gray-100">{{ queueConfig.defaultJobOptions.backoff.delay }}ms</span>
-                    </div>
-                  </div>
-                </div>
-                <div
-                  v-if="typeof queueConfig.defaultJobOptions.priority === 'number'"
-                  class="bg-gray-50 dark:bg-gray-900 px-3 py-2 rounded border border-gray-200 dark:border-gray-800"
-                >
-                  <div class="flex items-center justify-between text-sm">
-                    <span class="text-gray-600 dark:text-gray-400">Priority</span>
-                    <span class="font-medium text-gray-900 dark:text-gray-100">{{ queueConfig.defaultJobOptions.priority }}</span>
-                  </div>
-                </div>
-                <div
-                  v-if="typeof queueConfig.defaultJobOptions.timeout === 'number'"
-                  class="bg-gray-50 dark:bg-gray-900 px-3 py-2 rounded border border-gray-200 dark:border-gray-800"
-                >
-                  <div class="flex items-center justify-between text-sm">
-                    <span class="text-gray-600 dark:text-gray-400">Timeout</span>
-                    <span class="font-medium text-gray-900 dark:text-gray-100">{{ queueConfig.defaultJobOptions.timeout }}ms</span>
-                  </div>
-                </div>
-                <div
-                  v-if="typeof queueConfig.defaultJobOptions.removeOnComplete === 'boolean' || typeof queueConfig.defaultJobOptions.removeOnComplete === 'number'"
-                  class="bg-gray-50 dark:bg-gray-900 px-3 py-2 rounded border border-gray-200 dark:border-gray-800"
-                >
-                  <div class="flex items-center justify-between text-sm">
-                    <span class="text-gray-600 dark:text-gray-400">Remove on Complete</span>
-                    <span class="font-medium text-gray-900 dark:text-gray-100">{{ queueConfig.defaultJobOptions.removeOnComplete }}</span>
-                  </div>
-                </div>
-                <div
-                  v-if="typeof queueConfig.defaultJobOptions.removeOnFail === 'boolean' || typeof queueConfig.defaultJobOptions.removeOnFail === 'number'"
-                  class="bg-gray-50 dark:bg-gray-900 px-3 py-2 rounded border border-gray-200 dark:border-gray-800"
-                >
-                  <div class="flex items-center justify-between text-sm">
-                    <span class="text-gray-600 dark:text-gray-400">Remove on Fail</span>
-                    <span class="font-medium text-gray-900 dark:text-gray-100">{{ queueConfig.defaultJobOptions.removeOnFail }}</span>
-                  </div>
-                </div>
-              </div>
-            </div>
-          </template>
-        </div>
-
-        <!-- Worker Config Tab -->
-        <div
-          v-if="selectedTab === 'worker'"
-          class="p-6 space-y-6"
-        >
-          <div
-            v-if="!workerConfig || !hasWorkerConfig"
-            class="text-sm text-gray-400 text-center py-8"
-          >
-            <UIcon
-              name="i-lucide-info"
-              class="w-8 h-8 mx-auto mb-2 opacity-50"
-            />
-            <p>No worker configuration defined</p>
-            <p class="text-xs mt-1">
-              Using default values
-            </p>
-          </div>
-          <template v-else>
-            <!-- Concurrency -->
-            <div
-              v-if="typeof workerConfig.concurrency === 'number'"
-              class="space-y-2"
-            >
-              <div class="flex items-center gap-2 text-sm font-medium text-gray-700 dark:text-gray-300">
-                <UIcon
-                  name="i-lucide-layers"
-                  class="w-4 h-4"
-                />
-                <span>Concurrency</span>
-              </div>
-              <div class="pl-6">
-                <div class="text-sm bg-gray-50 dark:bg-gray-900 px-3 py-2 rounded border border-gray-200 dark:border-gray-800">
-                  <div class="flex items-center justify-between">
-                    <span class="text-gray-600 dark:text-gray-400">Parallel Jobs</span>
-                    <span class="font-medium text-gray-900 dark:text-gray-100">{{ workerConfig.concurrency }}</span>
-                  </div>
-                </div>
-                <p class="text-xs text-gray-500 mt-1">
-                  Maximum number of jobs processed simultaneously
-                </p>
-              </div>
-            </div>
-
-            <!-- Lock Duration -->
-            <div
-              v-if="typeof workerConfig.lockDurationMs === 'number'"
-              class="space-y-2"
-            >
-              <div class="flex items-center gap-2 text-sm font-medium text-gray-700 dark:text-gray-300">
-                <UIcon
-                  name="i-lucide-lock"
-                  class="w-4 h-4"
-                />
-                <span>Lock Duration</span>
-              </div>
-              <div class="pl-6">
-                <div class="text-sm bg-gray-50 dark:bg-gray-900 px-3 py-2 rounded border border-gray-200 dark:border-gray-800">
-                  <div class="flex items-center justify-between">
-                    <span class="text-gray-600 dark:text-gray-400">Duration</span>
-                    <span class="font-medium text-gray-900 dark:text-gray-100">{{ workerConfig.lockDurationMs }}ms</span>
-                  </div>
-                </div>
-                <p class="text-xs text-gray-500 mt-1">
-                  Time before job lock expires and becomes available for retry
-                </p>
-              </div>
-            </div>
-
-            <!-- Max Stalled Count -->
-            <div
-              v-if="typeof workerConfig.maxStalledCount === 'number'"
-              class="space-y-2"
-            >
-              <div class="flex items-center gap-2 text-sm font-medium text-gray-700 dark:text-gray-300">
-                <UIcon
-                  name="i-lucide-alert-triangle"
-                  class="w-4 h-4"
-                />
-                <span>Max Stalled Count</span>
-              </div>
-              <div class="pl-6">
-                <div class="text-sm bg-gray-50 dark:bg-gray-900 px-3 py-2 rounded border border-gray-200 dark:border-gray-800">
-                  <div class="flex items-center justify-between">
-                    <span class="text-gray-600 dark:text-gray-400">Max Retries</span>
-                    <span class="font-medium text-gray-900 dark:text-gray-100">{{ workerConfig.maxStalledCount }}</span>
-                  </div>
-                </div>
-                <p class="text-xs text-gray-500 mt-1">
-                  Maximum times a job can stall before being marked as failed
-                </p>
-              </div>
-            </div>
-
-            <!-- Drain Delay -->
-            <div
-              v-if="typeof workerConfig.drainDelayMs === 'number'"
-              class="space-y-2"
-            >
-              <div class="flex items-center gap-2 text-sm font-medium text-gray-700 dark:text-gray-300">
-                <UIcon
-                  name="i-lucide-timer"
-                  class="w-4 h-4"
-                />
-                <span>Drain Delay</span>
-              </div>
-              <div class="pl-6">
-                <div class="text-sm bg-gray-50 dark:bg-gray-900 px-3 py-2 rounded border border-gray-200 dark:border-gray-800">
-                  <div class="flex items-center justify-between">
-                    <span class="text-gray-600 dark:text-gray-400">Delay</span>
-                    <span class="font-medium text-gray-900 dark:text-gray-100">{{ workerConfig.drainDelayMs }}ms</span>
-                  </div>
-                </div>
-                <p class="text-xs text-gray-500 mt-1">
-                  Time to wait for jobs to complete during graceful shutdown
-                </p>
-              </div>
-            </div>
-
-            <!-- Polling Interval -->
-            <div
-              v-if="typeof workerConfig.pollingIntervalMs === 'number'"
-              class="space-y-2"
-            >
-              <div class="flex items-center gap-2 text-sm font-medium text-gray-700 dark:text-gray-300">
-                <UIcon
-                  name="i-lucide-refresh-cw"
-                  class="w-4 h-4"
-                />
-                <span>Polling Interval</span>
-              </div>
-              <div class="pl-6">
-                <div class="text-sm bg-gray-50 dark:bg-gray-900 px-3 py-2 rounded border border-gray-200 dark:border-gray-800">
-                  <div class="flex items-center justify-between">
-                    <span class="text-gray-600 dark:text-gray-400">Interval</span>
-                    <span class="font-medium text-gray-900 dark:text-gray-100">{{ workerConfig.pollingIntervalMs }}ms</span>
-                  </div>
-                </div>
-                <p class="text-xs text-gray-500 mt-1">
-                  Frequency to check for new jobs (PGBoss compatibility)
-                </p>
-              </div>
-            </div>
-
-            <!-- Autorun -->
-            <div
-              v-if="typeof workerConfig.autorun === 'boolean'"
-              class="space-y-2"
-            >
-              <div class="flex items-center gap-2 text-sm font-medium text-gray-700 dark:text-gray-300">
-                <UIcon
-                  name="i-lucide-play-circle"
-                  class="w-4 h-4"
-                />
-                <span>Autorun</span>
-              </div>
-              <div class="pl-6">
-                <div class="text-sm bg-gray-50 dark:bg-gray-900 px-3 py-2 rounded border border-gray-200 dark:border-gray-800">
-                  <div class="flex items-center justify-between">
-                    <span class="text-gray-600 dark:text-gray-400">Enabled</span>
-                    <span class="font-medium text-gray-900 dark:text-gray-100">{{ workerConfig.autorun ? "Yes" : "No" }}</span>
-                  </div>
-                </div>
-                <p class="text-xs text-gray-500 mt-1">
-                  Whether worker starts automatically on initialization
-                </p>
-              </div>
-            </div>
-          </template>
-        </div>
-      </div>
-    </template>
-  </USlideover>
-</template>
-
-<script setup>
-import { ref, computed } from "#imports";
-import { USlideover, UTabs, UIcon } from "#components";
-const props = defineProps({
-  queueName: { type: String, required: true },
-  queueConfig: { type: Object, required: false },
-  workerConfig: { type: Object, required: false }
-});
-const isOpen = defineModel("open", { type: Boolean, ...{ default: false } });
-const selectedTab = ref("queue");
-const tabs = [
-  { label: "Queue Config", value: "queue", icon: "i-lucide-list" },
-  { label: "Worker Config", value: "worker", icon: "i-lucide-cpu" }
-];
-const hasQueueConfig = computed(() => {
-  if (!props.queueConfig) return false;
-  const { name, ...rest } = props.queueConfig;
-  return Object.values(rest).some((v) => v !== void 0 && v !== null);
-});
-const hasJobOptions = computed(() => {
-  const opts = props.queueConfig?.defaultJobOptions;
-  if (!opts) return false;
-  return Object.values(opts).some((v) => v !== void 0 && v !== null);
-});
-const hasWorkerConfig = computed(() => {
-  if (!props.workerConfig) return false;
-  return Object.values(props.workerConfig).some((v) => v !== void 0 && v !== null);
-});
-</script>