@morscherlab/mint-sdk 1.4.0-beta.2 → 1.4.0-beta.21

package/src/composables/useJobCenter.ts

@@ -5,20 +5,26 @@ import {
   ref,
   shallowRef,
   toValue,
+  useId,
+  watch,
   type ComputedRef,
   type MaybeRefOrGetter,
   type Ref,
   type ShallowRef,
 } from 'vue'
 
-import { isActiveJobStatus, normalizeJobState } from '../jobs'
+import { isActiveJobStatus, jobStatusLabel, normalizeJobPercent, normalizeJobState } from '../jobs'
 import type {
   JobListPayload,
   JobState,
   JobStateInput,
+  JobStatus,
+  TopBarJob,
 } from '../types/jobs'
+import { usePlatform } from './usePlatform'
 
-export type JobsStatusTrayTab = 'active' | 'history'
+/** How long a job that just completed stays in the top-bar run slot. */
+const FINISHED_HOLD_MS = 6000
 
 /**
  * The canonical owner of a collection of plugin jobs.
@@ -143,9 +149,41 @@ function duplicatePluginJobId(jobId: string): Error {
 export interface UseJobCenterOptions {
   source?: MaybeRefOrGetter<PluginJobCenterSource | undefined>
   loadOnMount?: boolean
+  /**
+   * Maps the job that the top-bar chip shows. It is called for the chosen own
+   * active job AND for the held just-completed job, so check `job.status`.
+   * `null` keeps the default mapping.
+   */
+  topBarJob?: (job: JobState) => TopBarJob | null
+  /**
+   * Overrides how a tray row looks: `status` (icon, awaiting-input tint and
+   * pinning), `percent` (progress bar and value) and `message` (detail line).
+   * A missing or `undefined` field, or a `null` status or message, keeps the
+   * job's own; `percent: null` hides the bar and shows the time, and a status
+   * alone keeps the job's own percent. The job's section, actions and counts
+   * do not change.
+   */
+  rowJob?: (job: JobState) => JobRowOverride | null
+}
+
+/** A `rowJob` result; see `UseJobCenterOptions.rowJob`. */
+export interface JobRowOverride {
+  status?: JobStatus | null
+  percent?: number | null
+  message?: string | null
+}
+
+/** How a tray row shows a job; see `UseJobCenterReturn.rowView`. */
+export interface JobRowView {
+  status: JobStatus
+  /** 0-100, rounded; `null` hides the progress bar and shows the time instead. */
+  percent: number | null
+  message: string
 }
 
 export interface UseJobCenterReturn {
+  /** The current source; a new identity is a new job list. */
+  source: ComputedRef<PluginJobCenterSource | undefined>
   jobs: ComputedRef<JobState[]>
   activeJobs: ComputedRef<JobState[]>
   historyJobs: ComputedRef<JobState[]>
@@ -155,14 +193,23 @@ export interface UseJobCenterReturn {
   canCancel: ComputedRef<boolean>
   canDelete: ComputedRef<boolean>
   canClearFinished: ComputedRef<boolean>
+  /** DOM id of the JobsStatusTray panel, for `AppTopBar`'s `jobsPanelId` prop. */
+  panelId: string
+  /** The row view of a job, with the `rowJob` option applied. */
+  rowView: (job: JobState) => JobRowView
+  /** The viewer's own job for `AppTopBar`'s `job` prop. */
+  topBarJob: ComputedRef<TopBarJob | null>
+  /** Jobs in the list with status `completed`, for `AppTopBar`'s `jobsDone` prop. */
+  completedCount: ComputedRef<number>
   isOpen: Ref<boolean>
-  activeTab: Ref<JobsStatusTrayTab>
   isLoading: Ref<boolean>
   error: ShallowRef<string | null>
   pendingJobIds: Ref<Set<string>>
   open: () => void
   close: () => void
   toggle: () => void
+  /** The top-bar chip: with the tray closed and none of the viewer's jobs active, selects the held just-completed job; else toggles. */
+  handleTopBarClick: (onSelect: (job: JobState) => void) => void
   refresh: () => Promise<boolean>
   cancelJob: (job: JobState) => Promise<boolean>
   deleteJob: (job: JobState) => Promise<boolean>
@@ -170,6 +217,35 @@ export interface UseJobCenterReturn {
   isPending: (job: JobState) => boolean
 }
 
+/** The stored seen failures, or null when nothing is stored or storage is blocked. */
+function readSeenFailed(key: string): Set<string> | null {
+  try {
+    const parsed: unknown = JSON.parse(globalThis.localStorage?.getItem(key) ?? 'null')
+    return Array.isArray(parsed) ? new Set(parsed.filter((id): id is string => typeof id === 'string')) : null
+  } catch {
+    return null
+  }
+}
+
+function writeSeenFailed(key: string, seen: Set<string>): void {
+  try {
+    globalThis.localStorage?.setItem(key, JSON.stringify([...seen]))
+  } catch {
+    // Private windows and full storage: the state lasts until reload.
+  }
+}
+
+function jobMessage(job: JobState): string {
+  if (job.error) return job.error
+  if (job.status === 'awaiting_input') {
+    return job.progress.message || 'Waiting for external input'
+  }
+  if (job.status === 'queued' && job.queue_position > 0) {
+    return `Queue position ${job.queue_position}`
+  }
+  return job.progress.message || job.progress.stage || jobStatusLabel(job.status)
+}
+
 function errorMessage(error: unknown, fallback: string): string {
   return error instanceof Error ? error.message : fallback
 }
@@ -184,7 +260,6 @@ export function useJobCenter(
   options: UseJobCenterOptions = {},
 ): UseJobCenterReturn {
   const isOpen = ref(false)
-  const activeTab = ref<JobsStatusTrayTab>('active')
   const isLoading = ref(false)
   const error = shallowRef<string | null>(null)
   const pendingJobIds = ref(new Set<string>())
@@ -200,6 +275,103 @@ export function useJobCenter(
   const historyJobs = computed(() => jobs.value.filter(job => !isActiveJobStatus(job.status)))
   const deletableJobs = computed(() => historyJobs.value.filter(job => job.can_delete))
   const featuredJob = computed(() => activeJobs.value[0] ?? historyJobs.value[0] ?? null)
+  const completedCount = computed(() => jobs.value.filter(job => job.status === 'completed').length)
+
+  // Top-bar run slot: the viewer's own jobs only. Standalone or with auth off
+  // (no signed-in user), every job is the viewer's.
+  const { integrated, user, plugin, isAdmin } = usePlatform()
+  const isOwnJob = (job: JobState) => {
+    if (!integrated.value) return true
+    // With no user, isAdmin is true only with auth off.
+    if (user.value == null) return isAdmin.value
+    return (job.owner_user_id ?? job.user_id) === String(user.value.id)
+  }
+  const ownActiveJobs = computed(() => activeJobs.value.filter(isOwnJob))
+  const justFinished = shallowRef<JobState | null>(null)
+  // The live held job; it drops out once the job leaves the list.
+  const heldJob = computed(() => {
+    const held = justFinished.value
+    return held ? jobs.value.find(job => job.job_id === held.job_id) ?? null : null
+  })
+  let finishedTimer: ReturnType<typeof setTimeout> | undefined
+  // Compare active jobs within one source only: a replaced source starts over.
+  watch([source, ownActiveJobs], ([currentSource, now], [previousSource, before]) => {
+    if (currentSource !== previousSource) {
+      justFinished.value = null
+      return
+    }
+    const nowIds = new Set(now.map(job => job.job_id))
+    const left = new Set(before.filter(job => !nowIds.has(job.job_id)).map(job => job.job_id))
+    const finished = jobs.value.find(job => left.has(job.job_id) && job.status === 'completed')
+    if (!finished) return
+    justFinished.value = finished
+    clearTimeout(finishedTimer)
+    finishedTimer = setTimeout(() => { justFinished.value = null }, FINISHED_HOLD_MS)
+  })
+  // ponytail: the seen set only grows; prune to listed jobs if the stored array ever matters.
+  const seenFailedKey = `mint.jobs.${plugin.value?.id ?? 'standalone'}.seen-failed`
+  const storedSeenFailed = readSeenFailed(seenFailedKey)
+  const seenFailed = shallowRef(storedSeenFailed ?? new Set<string>())
+  const unseenFailedJobs = computed(() => historyJobs.value.filter(job => (
+    job.status === 'failed' && isOwnJob(job) && !seenFailed.value.has(job.job_id)
+  )))
+  function markFailedSeen(): void {
+    seenFailed.value = new Set([...seenFailed.value, ...unseenFailedJobs.value.map(job => job.job_id)])
+    writeSeenFailed(seenFailedKey, seenFailed.value)
+  }
+  // Nothing stored (new browser, cleared or blocked storage): the failures at the
+  // initial load are the baseline, so only later failures alert. Without a load
+  // step, the first non-empty list stands in for it.
+  let hasBaseline = storedSeenFailed !== null
+  let awaitingLoad = options.loadOnMount !== false && Boolean(source.value?.refresh)
+  function takeBaseline(): void {
+    if (hasBaseline || !active) return
+    hasBaseline = true
+    markFailedSeen()
+  }
+  watch(jobs, (list) => {
+    if (!awaitingLoad && list.length > 0) takeBaseline()
+  }, { immediate: true })
+  // The open tray shows every failure, including one that happens while it is open.
+  watch([isOpen, unseenFailedJobs], ([open, unseen]) => {
+    if (open && unseen.length > 0) markFailedSeen()
+  })
+  const topBarJob = computed<TopBarJob | null>(() => {
+    const own = ownActiveJobs.value
+    const shown = own.find(job => job.status === 'awaiting_input') ?? own[0]
+    if (shown) {
+      return options.topBarJob?.(shown) ?? {
+        status: shown.status,
+        label: shown.progress.message || `${shown.name} ${jobStatusLabel(shown.status).toLowerCase()}`,
+        percent: shown.status === 'running' ? normalizeJobPercent(shown.progress.percent) : null,
+      }
+    }
+    const held = heldJob.value
+    if (held) return options.topBarJob?.(held) ?? { status: 'completed', label: `${held.name} completed` }
+    const failed = unseenFailedJobs.value.length
+    return failed > 0 ? { status: 'failed', label: `${failed} failed` } : null
+  })
+
+  function rowView(job: JobState): JobRowView {
+    const override = options.rowJob?.(job) ?? {}
+    const status = override.status ?? job.status
+    // Only an explicit percent changes the bar; a status override keeps the job's own.
+    const percent = override.percent !== undefined
+      ? override.percent
+      : job.status === 'running' ? job.progress.percent : null
+    return {
+      status,
+      percent: percent == null ? null : Math.round(normalizeJobPercent(percent)),
+      message: override.message ?? jobMessage(job),
+    }
+  }
+
+  function handleTopBarClick(onSelect: (job: JobState) => void): void {
+    const finished = heldJob.value
+    if (!isOpen.value && ownActiveJobs.value.length === 0 && finished) onSelect(finished)
+    else isOpen.value = !isOpen.value
+  }
+
   const canRefresh = computed(() => Boolean(source.value?.refresh))
   const canCancel = computed(() => Boolean(source.value?.cancel))
   const canDelete = computed(() => Boolean(source.value?.delete))
@@ -290,14 +462,20 @@ export function useJobCenter(
   }
 
   onMounted(() => {
-    if (options.loadOnMount !== false) void refresh()
+    if (options.loadOnMount === false) return
+    void refresh().then((loaded) => {
+      awaitingLoad = false
+      if (loaded || jobs.value.length > 0) takeBaseline()
+    })
   })
   onUnmounted(() => {
     active = false
     requestGeneration += 1
+    clearTimeout(finishedTimer)
   })
 
   return {
+    source,
     jobs,
     activeJobs,
     historyJobs,
@@ -307,14 +485,18 @@ export function useJobCenter(
     canCancel,
     canDelete,
     canClearFinished,
+    panelId: `mint-jobs-tray-${useId()}`,
+    rowView,
+    topBarJob,
+    completedCount,
     isOpen,
-    activeTab,
     isLoading,
     error,
     pendingJobIds,
     open: () => { isOpen.value = true },
     close: () => { isOpen.value = false },
     toggle: () => { isOpen.value = !isOpen.value },
+    handleTopBarClick,
     refresh,
     cancelJob,
     deleteJob,