@jbrowse/plugin-jobs-management 4.2.1 → 5.0.0-beta.1

package/esm/JobsListWidget/components/CurrentJobCard.d.ts

@@ -1,5 +1,5 @@
-import type { NewJob } from '../model.ts';
+import type { JobModel } from '../jobModel.ts';
 declare const CurrentJobCard: ({ job, }: {
-    job: NewJob;
-}) => import("react/jsx-runtime").JSX.Element;
+    job: JobModel;
+}) => import("react").JSX.Element;
 export default CurrentJobCard;

package/esm/JobsListWidget/components/CurrentJobCard.js

@@ -1,19 +1,21 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState } from 'react';
-import { Box, Button, Card, CardActions, CardContent, LinearProgress, Typography, } from '@mui/material';
+import { StatusProgressBar } from '@jbrowse/core/ui';
+import { Box, Button, Card, CardActions, CardContent, Typography, } from '@mui/material';
 import { observer } from 'mobx-react';
 const CurrentJobCard = observer(function CurrentJobCard({ job, }) {
     const [clicked, setClicked] = useState(false);
-    return (_jsxs(Card, { variant: "outlined", children: [_jsxs(CardContent, { children: [_jsxs(Typography, { variant: "body1", children: [_jsx("strong", { children: 'Name: ' }), job.name] }), _jsxs(Typography, { variant: "body1", children: [_jsx("strong", { children: 'Message: ' }), job.statusMessage || 'No message provided'] }), _jsx(Box, { sx: {
+    const { progressPct } = job;
+    return (_jsxs(Card, { variant: "outlined", children: [_jsxs(CardContent, { children: [_jsxs(Typography, { variant: "body1", children: [_jsx("strong", { children: 'Name: ' }), job.name] }), _jsxs(Typography, { variant: "body1", children: [_jsx("strong", { children: 'Message: ' }), job.statusMessage || 'No message provided'] }), _jsxs(Box, { sx: {
                             display: 'flex',
                             alignItems: 'center',
-                            marginTop: 10,
-                            marginBottom: 10,
-                            marginLeft: 10,
-                        }, children: job.progressPct === 0 || job.progressPct === 100 ? (_jsx(Box, { sx: { width: '100%' }, children: _jsx(LinearProgress, { variant: "indeterminate" }) })) : (_jsxs(_Fragment, { children: [_jsx(Box, { sx: { width: '100%' }, children: _jsx(LinearProgress, { variant: "determinate", value: job.progressPct }) }), _jsx(Box, { sx: { m: 1 }, children: _jsx(Typography, { children: `${Math.round(job.progressPct || 0)}%` }) })] })) })] }), _jsx(CardActions, { children: _jsx(Button, { variant: "contained", color: "inherit", disabled: clicked || job.progressPct === 0, onClick: () => {
-                        job.setStatusMessage('Aborted via cancel button');
+                            marginTop: 1,
+                            marginBottom: 1,
+                            marginLeft: 1,
+                        }, children: [_jsx(Box, { sx: { width: '100%' }, "data-testid": "job-progress", children: _jsx(StatusProgressBar, { fraction: progressPct === undefined ? undefined : progressPct / 100 }) }), progressPct === undefined ? null : (_jsx(Box, { sx: { m: 1 }, children: _jsx(Typography, { children: `${Math.round(progressPct)}%` }) }))] })] }), _jsx(CardActions, { children: _jsx(Button, { variant: "contained", color: "inherit", disabled: clicked, onClick: () => {
+                        job.update({ statusMessage: 'Cancelling…' });
                         job.cancelCallback();
                         setClicked(true);
-                    }, children: "Cancel" }) })] }));
+                    }, children: clicked ? 'Cancelling…' : 'Cancel' }) })] }));
 });
 export default CurrentJobCard;

package/esm/JobsListWidget/components/JobCard.d.ts

@@ -1,5 +1,5 @@
-import type { NewJob } from '../model.ts';
+import type { JobModel } from '../jobModel.ts';
 declare const JobCard: ({ job }: {
-    job: NewJob;
-}) => import("react/jsx-runtime").JSX.Element;
+    job: JobModel;
+}) => import("react").JSX.Element;
 export default JobCard;

package/esm/JobsListWidget/components/JobsListWidget.d.ts

@@ -1,5 +1,5 @@
 import type { JobsListModel } from '../model.ts';
 declare const JobsListWidget: ({ model, }: {
     model: JobsListModel;
-}) => import("react/jsx-runtime").JSX.Element;
+}) => import("react").JSX.Element;
 export default JobsListWidget;

package/esm/JobsListWidget/components/JobsListWidget.js

@@ -1,21 +1,21 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { makeStyles } from '@jbrowse/core/util/tss-react';
-import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
-import { Accordion, AccordionSummary, Card, CardContent, Typography, } from '@mui/material';
 import { observer } from 'mobx-react';
-import CurrentJobCard from "./CurrentJobCard.js";
-import JobCard from "./JobCard.js";
+import CurrentJobCard from './CurrentJobCard.js';
+import JobCard from './JobCard.js';
+import JobsSection from './JobsSection.js';
 const useStyles = makeStyles()(theme => ({
     root: {
         margin: theme.spacing(1),
     },
-    expandIcon: {
-        color: theme.palette.tertiary.contrastText,
-    },
 }));
 const JobsListWidget = observer(function JobsListWidget({ model, }) {
     const { classes } = useStyles();
-    const { jobs, finished, queued, aborted } = model;
-    return (_jsxs("div", { className: classes.root, children: [_jsxs(Accordion, { defaultExpanded: true, children: [_jsx(AccordionSummary, { expandIcon: _jsx(ExpandMoreIcon, { className: classes.expandIcon }), children: _jsx(Typography, { variant: "h5", children: "Running jobs" }) }), jobs.length ? (jobs.map((job, index) => (_jsx(CurrentJobCard, { job: job }, `${JSON.stringify(job)}-${index}`)))) : (_jsx(Card, { variant: "outlined", children: _jsx(CardContent, { children: _jsx(Typography, { variant: "body1", children: "No running jobs" }) }) }))] }), _jsxs(Accordion, { defaultExpanded: true, children: [_jsx(AccordionSummary, { expandIcon: _jsx(ExpandMoreIcon, { className: classes.expandIcon }), children: _jsx(Typography, { variant: "h5", children: "Queued jobs" }) }), queued.length ? (queued.map((job, index) => (_jsx(JobCard, { job: job }, `${JSON.stringify(job)}-${index}`)))) : (_jsx(Card, { variant: "outlined", children: _jsx(CardContent, { children: _jsx(Typography, { variant: "body1", children: "No queued jobs" }) }) }))] }), _jsxs(Accordion, { defaultExpanded: true, children: [_jsx(AccordionSummary, { expandIcon: _jsx(ExpandMoreIcon, { className: classes.expandIcon }), children: _jsx(Typography, { variant: "h5", children: "Completed jobs" }) }), finished.length ? (finished.map((job, index) => (_jsx(JobCard, { job: job }, `${JSON.stringify(job)}-${index}`)))) : (_jsx(Card, { variant: "outlined", children: _jsx(CardContent, { children: _jsx(Typography, { variant: "body1", children: "No completed jobs" }) }) }))] }), _jsxs(Accordion, { defaultExpanded: true, children: [_jsx(AccordionSummary, { expandIcon: _jsx(ExpandMoreIcon, { className: classes.expandIcon }), children: _jsx(Typography, { variant: "h5", children: "Aborted jobs" }) }), aborted.length ? (aborted.map((job, index) => (_jsx(JobCard, { job: job }, `${JSON.stringify(job)}-${index}`)))) : (_jsx(Card, { variant: "outlined", children: _jsx(CardContent, { children: _jsx(Typography, { variant: "body1", children: "No aborted jobs" }) }) }))] })] }));
+    const { jobs } = model;
+    return (_jsxs("div", { className: classes.root, children: [_jsx(JobsSection, { title: "Running jobs", jobs: jobs.filter(j => j.state === 'running'), emptyText: "No running jobs", renderCard: job => _jsx(CurrentJobCard, { job: job }, job.name) }), _jsx(JobsSection, { title: "Queued jobs", jobs: jobs.filter(j => j.state === 'queued'), emptyText: "No queued jobs", renderCard: job => _jsx(JobCard, { job: job }, job.name) }), _jsx(JobsSection, { title: "Completed jobs", jobs: jobs.filter(j => j.state === 'finished'), emptyText: "No completed jobs", renderCard: job => _jsx(JobCard, { job: job }, job.name), onClear: () => {
+                    model.clearJobs('finished');
+                } }), _jsx(JobsSection, { title: "Aborted jobs", jobs: jobs.filter(j => j.state === 'aborted'), emptyText: "No aborted jobs", renderCard: job => _jsx(JobCard, { job: job }, job.name), onClear: () => {
+                    model.clearJobs('aborted');
+                } })] }));
 });
 export default JobsListWidget;

package/esm/JobsListWidget/components/JobsSection.d.ts

@@ -0,0 +1,10 @@
+import type { JobModel } from '../jobModel.ts';
+import type { ReactNode } from 'react';
+declare const JobsSection: ({ title, jobs, emptyText, renderCard, onClear, }: {
+    title: string;
+    jobs: JobModel[];
+    emptyText: string;
+    renderCard: (job: JobModel) => ReactNode;
+    onClear?: () => void;
+}) => import("react").JSX.Element;
+export default JobsSection;

package/esm/JobsListWidget/components/JobsSection.js

@@ -0,0 +1,24 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { makeStyles } from '@jbrowse/core/util/tss-react';
+import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
+import { Accordion, AccordionDetails, AccordionSummary, Button, Card, CardContent, Typography, } from '@mui/material';
+import { observer } from 'mobx-react';
+const useStyles = makeStyles()(theme => ({
+    expandIcon: {
+        color: theme.palette.tertiary.contrastText,
+    },
+    summaryTitle: {
+        flexGrow: 1,
+    },
+    clearRow: {
+        display: 'flex',
+        justifyContent: 'flex-end',
+    },
+}));
+const JobsSection = observer(function JobsSection({ title, jobs, emptyText, renderCard, onClear, }) {
+    const { classes } = useStyles();
+    return (_jsxs(Accordion, { defaultExpanded: true, children: [_jsx(AccordionSummary, { expandIcon: _jsx(ExpandMoreIcon, { className: classes.expandIcon }), children: _jsx(Typography, { variant: "h5", className: classes.summaryTitle, children: title }) }), _jsxs(AccordionDetails, { children: [onClear && jobs.length ? (_jsx("div", { className: classes.clearRow, children: _jsx(Button, { size: "small", onClick: () => {
+                                onClear();
+                            }, children: "Clear" }) })) : null, jobs.length ? (jobs.map(job => renderCard(job))) : (_jsx(Card, { variant: "outlined", children: _jsx(CardContent, { children: _jsx(Typography, { variant: "body1", children: emptyText }) }) }))] })] }));
+});
+export default JobsSection;

package/esm/JobsListWidget/index.js

@@ -1,7 +1,7 @@
 import { lazy } from 'react';
 import { ConfigurationSchema } from '@jbrowse/core/configuration';
 import { WidgetType } from '@jbrowse/core/pluggableElementTypes';
-import { stateModelFactory } from "./model.js";
+import { stateModelFactory } from './model.js';
 export const configSchema = ConfigurationSchema('JobsListWidget', {});
 export default function JobsListWidgetF(pluginManager) {
     pluginManager.addWidgetType(() => {
@@ -10,7 +10,7 @@ export default function JobsListWidgetF(pluginManager) {
             heading: 'Jobs list',
             configSchema,
             stateModel: stateModelFactory(pluginManager),
-            ReactComponent: lazy(() => import("./components/JobsListWidget.js")),
+            ReactComponent: lazy(() => import('./components/JobsListWidget.js')),
         });
     });
 }

package/esm/JobsListWidget/jobModel.d.ts

@@ -1,11 +1,30 @@
+import type { Instance } from '@jbrowse/mobx-state-tree';
+export type JobState = 'running' | 'queued' | 'finished' | 'aborted';
+export interface JobFields {
+    state: JobState;
+    statusMessage?: string;
+    progressPct?: number;
+    cancelCallback: () => void;
+}
+/**
+ * #stateModel
+ * #internal desktop text-indexing queue internals — kept out of the website docs
+ * #category widget
+ *
+ * Created standalone by `JobsListModel` and held in its volatile list rather
+ * than attached under it — nothing here belongs in a saved session.
+ */
 export declare const Job: import("@jbrowse/mobx-state-tree").IModelType<{
+    /**
+     * #property
+     */
     name: import("@jbrowse/mobx-state-tree").ISimpleType<string>;
-    statusMessage: import("@jbrowse/mobx-state-tree").IMaybe<import("@jbrowse/mobx-state-tree").ISimpleType<string>>;
-    progressPct: import("@jbrowse/mobx-state-tree").ISimpleType<number>;
-}, {
-    cancelCallback(): void;
-} & {
-    setCancelCallback(cancelCallback: () => void): void;
-    setStatusMessage(message?: string): void;
-    setProgressPct(pct: number): void;
+}, JobFields & {
+    /**
+     * #action
+     * A key that is present is written, so `{statusMessage: undefined}` clears
+     * the message and `{}` touches nothing.
+     */
+    update(fields: Partial<JobFields>): void;
 }, import("@jbrowse/mobx-state-tree")._NotCustomized, import("@jbrowse/mobx-state-tree")._NotCustomized>;
+export type JobModel = Instance<typeof Job>;

package/esm/JobsListWidget/jobModel.js

@@ -1,21 +1,48 @@
 import { types } from '@jbrowse/mobx-state-tree';
+/**
+ * #stateModel
+ * #internal desktop text-indexing queue internals — kept out of the website docs
+ * #category widget
+ *
+ * Created standalone by `JobsListModel` and held in its volatile list rather
+ * than attached under it — nothing here belongs in a saved session.
+ */
 export const Job = types
     .model('Job', {
+    /**
+     * #property
+     */
     name: types.string,
-    statusMessage: types.maybe(types.string),
-    progressPct: types.number,
 })
     .volatile(() => ({
-    cancelCallback() { },
+    /**
+     * #volatile
+     * which of the widget's four sections the job is filed under. One field
+     * rather than membership of one of four lists, so it cannot be in two.
+     */
+    state: 'queued',
+    /**
+     * #volatile
+     */
+    statusMessage: undefined,
+    /**
+     * #volatile
+     * undefined when the current phase has no fraction to report, which the
+     * card draws as an indeterminate bar
+     */
+    progressPct: undefined,
+    /**
+     * #volatile
+     */
+    cancelCallback: () => { },
 }))
     .actions(self => ({
-    setCancelCallback(cancelCallback) {
-        self.cancelCallback = cancelCallback;
-    },
-    setStatusMessage(message) {
-        self.statusMessage = message;
-    },
-    setProgressPct(pct) {
-        self.progressPct = pct;
+    /**
+     * #action
+     * A key that is present is written, so `{statusMessage: undefined}` clears
+     * the message and `{}` touches nothing.
+     */
+    update(fields) {
+        Object.assign(self, fields);
     },
 }));

package/esm/JobsListWidget/model.d.ts

@@ -1,186 +1,66 @@
-import { Job } from './jobModel.ts';
+import type { JobFields, JobState } from './jobModel.ts';
 import type PluginManager from '@jbrowse/core/PluginManager';
-import type { Instance, SnapshotIn } from '@jbrowse/mobx-state-tree';
-export interface NewJob extends SnapshotIn<typeof Job> {
-    cancelCallback(): void;
-    setStatusMessage(msg?: string): void;
+import type { Instance } from '@jbrowse/mobx-state-tree';
+export interface JobInput extends Partial<JobFields> {
+    name: string;
+    state: JobState;
 }
+/**
+ * #stateModel JobsListModel
+ * #internal desktop text-indexing queue internals — kept out of the website docs
+ * #category widget
+ */
 export declare function stateModelFactory(_pluginManager: PluginManager): import("@jbrowse/mobx-state-tree").IModelType<{
+    /**
+     * #property
+     */
     id: import("@jbrowse/mobx-state-tree").IOptionalIType<import("@jbrowse/mobx-state-tree").ISimpleType<string>, [undefined]>;
-    type: import("@jbrowse/mobx-state-tree").ISimpleType<"JobsListWidget">;
-    jobs: import("@jbrowse/mobx-state-tree").IArrayType<import("@jbrowse/mobx-state-tree").IModelType<{
-        name: import("@jbrowse/mobx-state-tree").ISimpleType<string>;
-        statusMessage: import("@jbrowse/mobx-state-tree").IMaybe<import("@jbrowse/mobx-state-tree").ISimpleType<string>>;
-        progressPct: import("@jbrowse/mobx-state-tree").ISimpleType<number>;
-    }, {
-        cancelCallback(): void;
-    } & {
-        setCancelCallback(cancelCallback: () => void): void;
-        setStatusMessage(message?: string): void;
-        setProgressPct(pct: number): void;
-    }, import("@jbrowse/mobx-state-tree")._NotCustomized, import("@jbrowse/mobx-state-tree")._NotCustomized>>;
-    finished: import("@jbrowse/mobx-state-tree").IArrayType<import("@jbrowse/mobx-state-tree").IModelType<{
-        name: import("@jbrowse/mobx-state-tree").ISimpleType<string>;
-        statusMessage: import("@jbrowse/mobx-state-tree").IMaybe<import("@jbrowse/mobx-state-tree").ISimpleType<string>>;
-        progressPct: import("@jbrowse/mobx-state-tree").ISimpleType<number>;
-    }, {
-        cancelCallback(): void;
-    } & {
-        setCancelCallback(cancelCallback: () => void): void;
-        setStatusMessage(message?: string): void;
-        setProgressPct(pct: number): void;
-    }, import("@jbrowse/mobx-state-tree")._NotCustomized, import("@jbrowse/mobx-state-tree")._NotCustomized>>;
-    queued: import("@jbrowse/mobx-state-tree").IArrayType<import("@jbrowse/mobx-state-tree").IModelType<{
-        name: import("@jbrowse/mobx-state-tree").ISimpleType<string>;
-        statusMessage: import("@jbrowse/mobx-state-tree").IMaybe<import("@jbrowse/mobx-state-tree").ISimpleType<string>>;
-        progressPct: import("@jbrowse/mobx-state-tree").ISimpleType<number>;
-    }, {
-        cancelCallback(): void;
-    } & {
-        setCancelCallback(cancelCallback: () => void): void;
-        setStatusMessage(message?: string): void;
-        setProgressPct(pct: number): void;
-    }, import("@jbrowse/mobx-state-tree")._NotCustomized, import("@jbrowse/mobx-state-tree")._NotCustomized>>;
-    aborted: import("@jbrowse/mobx-state-tree").IArrayType<import("@jbrowse/mobx-state-tree").IModelType<{
-        name: import("@jbrowse/mobx-state-tree").ISimpleType<string>;
-        statusMessage: import("@jbrowse/mobx-state-tree").IMaybe<import("@jbrowse/mobx-state-tree").ISimpleType<string>>;
-        progressPct: import("@jbrowse/mobx-state-tree").ISimpleType<number>;
-    }, {
-        cancelCallback(): void;
-    } & {
-        setCancelCallback(cancelCallback: () => void): void;
-        setStatusMessage(message?: string): void;
-        setProgressPct(pct: number): void;
-    }, import("@jbrowse/mobx-state-tree")._NotCustomized, import("@jbrowse/mobx-state-tree")._NotCustomized>>;
+    /**
+     * #property
+     */
+    type: import("@jbrowse/mobx-state-tree").ILiteralType<"JobsListWidget">;
 }, {
-    addJob(job: NewJob): {
-        name: string;
-        statusMessage: string | undefined;
-        progressPct: number;
-    } & import("@jbrowse/mobx-state-tree/dist/internal").NonEmptyObject & {
-        cancelCallback(): void;
-    } & {
-        setCancelCallback(cancelCallback: () => void): void;
-        setStatusMessage(message?: string): void;
-        setProgressPct(pct: number): void;
-    } & import("@jbrowse/mobx-state-tree").IStateTreeNode<import("@jbrowse/mobx-state-tree").IModelType<{
-        name: import("@jbrowse/mobx-state-tree").ISimpleType<string>;
-        statusMessage: import("@jbrowse/mobx-state-tree").IMaybe<import("@jbrowse/mobx-state-tree").ISimpleType<string>>;
-        progressPct: import("@jbrowse/mobx-state-tree").ISimpleType<number>;
-    }, {
-        cancelCallback(): void;
-    } & {
-        setCancelCallback(cancelCallback: () => void): void;
-        setStatusMessage(message?: string): void;
-        setProgressPct(pct: number): void;
-    }, import("@jbrowse/mobx-state-tree")._NotCustomized, import("@jbrowse/mobx-state-tree")._NotCustomized>>;
-    removeJob(jobName: string): ({
-        name: string;
-        statusMessage: string | undefined;
-        progressPct: number;
-    } & import("@jbrowse/mobx-state-tree/dist/internal").NonEmptyObject & {
-        cancelCallback(): void;
-    } & {
-        setCancelCallback(cancelCallback: () => void): void;
-        setStatusMessage(message?: string): void;
-        setProgressPct(pct: number): void;
-    } & import("@jbrowse/mobx-state-tree").IStateTreeNode<import("@jbrowse/mobx-state-tree").IModelType<{
+    /**
+     * #volatile
+     * Volatile like the `jobsQueue` it mirrors: persisted, a session saved
+     * mid-index came back with a permanent "Running" card whose Cancel called
+     * the default no-op, and a "Queued" card in no queue.
+     */
+    jobs: import("mobx").IObservableArray<import("@jbrowse/mobx-state-tree").ModelInstanceTypeProps<{
         name: import("@jbrowse/mobx-state-tree").ISimpleType<string>;
-        statusMessage: import("@jbrowse/mobx-state-tree").IMaybe<import("@jbrowse/mobx-state-tree").ISimpleType<string>>;
-        progressPct: import("@jbrowse/mobx-state-tree").ISimpleType<number>;
-    }, {
-        cancelCallback(): void;
-    } & {
-        setCancelCallback(cancelCallback: () => void): void;
-        setStatusMessage(message?: string): void;
-        setProgressPct(pct: number): void;
-    }, import("@jbrowse/mobx-state-tree")._NotCustomized, import("@jbrowse/mobx-state-tree")._NotCustomized>>) | undefined;
-    addFinishedJob(job: NewJob): ({
-        name: string;
-        statusMessage: string | undefined;
-        progressPct: number;
-    } & import("@jbrowse/mobx-state-tree/dist/internal").NonEmptyObject & {
-        cancelCallback(): void;
-    } & {
-        setCancelCallback(cancelCallback: () => void): void;
-        setStatusMessage(message?: string): void;
-        setProgressPct(pct: number): void;
+    }> & JobFields & {
+        update(fields: Partial<JobFields>): void;
     } & import("@jbrowse/mobx-state-tree").IStateTreeNode<import("@jbrowse/mobx-state-tree").IModelType<{
         name: import("@jbrowse/mobx-state-tree").ISimpleType<string>;
-        statusMessage: import("@jbrowse/mobx-state-tree").IMaybe<import("@jbrowse/mobx-state-tree").ISimpleType<string>>;
-        progressPct: import("@jbrowse/mobx-state-tree").ISimpleType<number>;
-    }, {
-        cancelCallback(): void;
-    } & {
-        setCancelCallback(cancelCallback: () => void): void;
-        setStatusMessage(message?: string): void;
-        setProgressPct(pct: number): void;
-    }, import("@jbrowse/mobx-state-tree")._NotCustomized, import("@jbrowse/mobx-state-tree")._NotCustomized>>) | undefined;
-    addQueuedJob(job: NewJob): ({
-        name: string;
-        statusMessage: string | undefined;
-        progressPct: number;
-    } & import("@jbrowse/mobx-state-tree/dist/internal").NonEmptyObject & {
-        cancelCallback(): void;
-    } & {
-        setCancelCallback(cancelCallback: () => void): void;
-        setStatusMessage(message?: string): void;
-        setProgressPct(pct: number): void;
-    } & import("@jbrowse/mobx-state-tree").IStateTreeNode<import("@jbrowse/mobx-state-tree").IModelType<{
-        name: import("@jbrowse/mobx-state-tree").ISimpleType<string>;
-        statusMessage: import("@jbrowse/mobx-state-tree").IMaybe<import("@jbrowse/mobx-state-tree").ISimpleType<string>>;
-        progressPct: import("@jbrowse/mobx-state-tree").ISimpleType<number>;
-    }, {
-        cancelCallback(): void;
-    } & {
-        setCancelCallback(cancelCallback: () => void): void;
-        setStatusMessage(message?: string): void;
-        setProgressPct(pct: number): void;
-    }, import("@jbrowse/mobx-state-tree")._NotCustomized, import("@jbrowse/mobx-state-tree")._NotCustomized>>) | undefined;
-    addAbortedJob(job: NewJob): ({
-        name: string;
-        statusMessage: string | undefined;
-        progressPct: number;
-    } & import("@jbrowse/mobx-state-tree/dist/internal").NonEmptyObject & {
-        cancelCallback(): void;
-    } & {
-        setCancelCallback(cancelCallback: () => void): void;
-        setStatusMessage(message?: string): void;
-        setProgressPct(pct: number): void;
-    } & import("@jbrowse/mobx-state-tree").IStateTreeNode<import("@jbrowse/mobx-state-tree").IModelType<{
+    }, JobFields & {
+        update(fields: Partial<JobFields>): void;
+    }, import("@jbrowse/mobx-state-tree")._NotCustomized, import("@jbrowse/mobx-state-tree")._NotCustomized>>>;
+} & {
+    /**
+     * #action
+     * Files a job under `state`, or moves the one already named that and
+     * refreshes whatever fields came with it. A job runs, finishes and is
+     * retried under one name, so this is the only way a card is filed.
+     */
+    addJob({ name, ...fields }: JobInput): import("@jbrowse/mobx-state-tree").ModelInstanceTypeProps<{
         name: import("@jbrowse/mobx-state-tree").ISimpleType<string>;
-        statusMessage: import("@jbrowse/mobx-state-tree").IMaybe<import("@jbrowse/mobx-state-tree").ISimpleType<string>>;
-        progressPct: import("@jbrowse/mobx-state-tree").ISimpleType<number>;
-    }, {
-        cancelCallback(): void;
-    } & {
-        setCancelCallback(cancelCallback: () => void): void;
-        setStatusMessage(message?: string): void;
-        setProgressPct(pct: number): void;
-    }, import("@jbrowse/mobx-state-tree")._NotCustomized, import("@jbrowse/mobx-state-tree")._NotCustomized>>) | undefined;
-    removeQueuedJob(jobName: string): ({
-        name: string;
-        statusMessage: string | undefined;
-        progressPct: number;
-    } & import("@jbrowse/mobx-state-tree/dist/internal").NonEmptyObject & {
-        cancelCallback(): void;
-    } & {
-        setCancelCallback(cancelCallback: () => void): void;
-        setStatusMessage(message?: string): void;
-        setProgressPct(pct: number): void;
+    }> & JobFields & {
+        update(fields: Partial<JobFields>): void;
     } & import("@jbrowse/mobx-state-tree").IStateTreeNode<import("@jbrowse/mobx-state-tree").IModelType<{
         name: import("@jbrowse/mobx-state-tree").ISimpleType<string>;
-        statusMessage: import("@jbrowse/mobx-state-tree").IMaybe<import("@jbrowse/mobx-state-tree").ISimpleType<string>>;
-        progressPct: import("@jbrowse/mobx-state-tree").ISimpleType<number>;
-    }, {
-        cancelCallback(): void;
-    } & {
-        setCancelCallback(cancelCallback: () => void): void;
-        setStatusMessage(message?: string): void;
-        setProgressPct(pct: number): void;
-    }, import("@jbrowse/mobx-state-tree")._NotCustomized, import("@jbrowse/mobx-state-tree")._NotCustomized>>) | undefined;
-    updateJobStatusMessage(jobName: string, message?: string): void;
-    updateJobProgressPct(jobName: string, pct: number): void;
+    }, JobFields & {
+        update(fields: Partial<JobFields>): void;
+    }, import("@jbrowse/mobx-state-tree")._NotCustomized, import("@jbrowse/mobx-state-tree")._NotCustomized>>;
+    /**
+     * #action
+     * A phase carrying no fraction clears the old one rather than leaving
+     * the bar where the last phase left it.
+     */
+    updateJobStatus(name: string, statusMessage?: string, pct?: number): void;
+    /**
+     * #action
+     */
+    clearJobs(state: JobState): void;
 }, import("@jbrowse/mobx-state-tree")._NotCustomized, import("@jbrowse/mobx-state-tree")._NotCustomized>;
 export type JobsListStateModel = ReturnType<typeof stateModelFactory>;
 export type JobsListModel = Instance<JobsListStateModel>;

package/esm/JobsListWidget/model.js

@@ -1,81 +1,65 @@
 import { ElementId } from '@jbrowse/core/util/types/mst';
 import { types } from '@jbrowse/mobx-state-tree';
-import { Job } from "./jobModel.js";
+import { observable } from 'mobx';
+import { Job } from './jobModel.js';
+/**
+ * #stateModel JobsListModel
+ * #internal desktop text-indexing queue internals — kept out of the website docs
+ * #category widget
+ */
 export function stateModelFactory(_pluginManager) {
     return types
         .model('JobsListModel', {
+        /**
+         * #property
+         */
         id: ElementId,
+        /**
+         * #property
+         */
         type: types.literal('JobsListWidget'),
-        jobs: types.array(Job),
-        finished: types.array(Job),
-        queued: types.array(Job),
-        aborted: types.array(Job),
     })
+        .volatile(() => ({
+        /**
+         * #volatile
+         * Volatile like the `jobsQueue` it mirrors: persisted, a session saved
+         * mid-index came back with a permanent "Running" card whose Cancel called
+         * the default no-op, and a "Queued" card in no queue.
+         */
+        jobs: observable.array([], { deep: false }),
+    }))
         .actions(self => ({
-        addJob(job) {
-            const { cancelCallback, name } = job;
-            const existing = self.jobs.find(job => job.name === name);
-            if (existing) {
-                return existing;
-            }
-            const length = self.jobs.push(job);
-            const addedJob = self.jobs[length - 1];
-            addedJob.setCancelCallback(cancelCallback);
-            return addedJob;
-        },
-        removeJob(jobName) {
-            const index = self.jobs.findIndex(job => job.name === jobName);
-            if (index === -1) {
-                return undefined;
-            }
-            const removed = self.jobs.splice(index, 1);
-            return removed[0];
-        },
-        addFinishedJob(job) {
-            const existing = self.finished.find(finishedJob => finishedJob.name === job.name);
-            if (existing) {
-                return existing;
-            }
-            const length = self.finished.push(job);
-            return self.finished[length - 1];
-        },
-        addQueuedJob(job) {
-            const existing = self.queued.find(queuedJob => queuedJob.name === job.name);
-            if (existing) {
-                return existing;
-            }
-            const length = self.queued.push(job);
-            return self.queued[length - 1];
-        },
-        addAbortedJob(job) {
-            const existing = self.aborted.find(abortedJob => abortedJob.name === job.name);
-            if (existing) {
-                return existing;
-            }
-            const length = self.aborted.push(job);
-            return self.aborted[length - 1];
-        },
-        removeQueuedJob(jobName) {
-            const index = self.queued.findIndex(job => job.name === jobName);
-            if (index === -1) {
-                return undefined;
-            }
-            const removed = self.queued.splice(index, 1);
-            return removed[0];
-        },
-        updateJobStatusMessage(jobName, message) {
-            const job = self.jobs.find(job => job.name === jobName);
+        /**
+         * #action
+         * Files a job under `state`, or moves the one already named that and
+         * refreshes whatever fields came with it. A job runs, finishes and is
+         * retried under one name, so this is the only way a card is filed.
+         */
+        addJob({ name, ...fields }) {
+            let job = self.jobs.find(j => j.name === name);
             if (!job) {
-                throw new Error(`No job found with name ${jobName}`);
+                job = Job.create({ name });
+                self.jobs.push(job);
             }
-            job.setStatusMessage(message);
+            job.update(fields);
+            return job;
         },
-        updateJobProgressPct(jobName, pct) {
-            const job = self.jobs.find(job => job.name === jobName);
-            if (!job) {
-                throw new Error(`No job found with name ${jobName}`);
-            }
-            job.setProgressPct(pct);
+        /**
+         * #action
+         * A phase carrying no fraction clears the old one rather than leaving
+         * the bar where the last phase left it.
+         */
+        updateJobStatus(name, statusMessage, pct) {
+            // absent if the widget was rebuilt while a status callback was in flight
+            self.jobs
+                .find(j => j.name === name)
+                ?.update({ statusMessage, progressPct: pct });
+        },
+        /**
+         * #action
+         */
+        clearJobs(state) {
+            self.jobs.replace(self.jobs.filter(j => j.state !== state));
         },
     }));
 }

package/esm/getOrCreateJobsListWidget.d.ts

@@ -0,0 +1,8 @@
+import type { JobsListModel } from './JobsListWidget/model.ts';
+import type { SessionWithWidgets } from '@jbrowse/core/util';
+/**
+ * Get the singleton JobsList widget for a session, creating it if absent. The
+ * widget map is untyped (`Widget`), so the result is cast to the concrete
+ * model that this plugin registers.
+ */
+export declare function getOrCreateJobsListWidget(session: SessionWithWidgets): JobsListModel;

package/esm/getOrCreateJobsListWidget.js

@@ -0,0 +1,10 @@
+/**
+ * Get the singleton JobsList widget for a session, creating it if absent. The
+ * widget map is untyped (`Widget`), so the result is cast to the concrete
+ * model that this plugin registers.
+ */
+export function getOrCreateJobsListWidget(session) {
+    const existing = session.widgets.get('JobsList');
+    return (existing ??
+        session.addWidget('JobsListWidget', 'JobsList'));
+}

package/esm/index.d.ts

@@ -1,6 +1,8 @@
 import Plugin from '@jbrowse/core/Plugin';
 import type PluginManager from '@jbrowse/core/PluginManager';
-export type { JobsListModel } from './JobsListWidget/model.ts';
+export { getOrCreateJobsListWidget } from './getOrCreateJobsListWidget.ts';
+export type { JobInput, JobsListModel } from './JobsListWidget/model.ts';
+export type { JobState } from './JobsListWidget/jobModel.ts';
 export default class JobsManagementPlugin extends Plugin {
     name: string;
     install(pluginManager: PluginManager): void;

package/esm/index.js

@@ -1,7 +1,9 @@
 import Plugin from '@jbrowse/core/Plugin';
 import { Indexing } from '@jbrowse/core/ui/Icons';
 import { isAbstractMenuManager, isSessionModelWithWidgets, } from '@jbrowse/core/util';
-import JobsListWidgetF from "./JobsListWidget/index.js";
+import JobsListWidgetF from './JobsListWidget/index.js';
+import { getOrCreateJobsListWidget } from './getOrCreateJobsListWidget.js';
+export { getOrCreateJobsListWidget } from './getOrCreateJobsListWidget.js';
 export default class JobsManagementPlugin extends Plugin {
     name = 'JobsManagementPlugin';
     install(pluginManager) {
@@ -11,18 +13,17 @@ export default class JobsManagementPlugin extends Plugin {
         if (isAbstractMenuManager(pluginManager.rootModel)) {
             pluginManager.rootModel.appendToMenu('Tools', {
                 label: 'Jobs list',
-                icon: Indexing,
+                icon: Indexing, // TODO: pick a better icon
+                // `unknown`, not SessionWithWidgets: MenuItemClickHandler is
+                // `(...args: any[]) => void`, so annotating the parameter asserts a
+                // shape rather than checking one, and it made the guard below read as
+                // redundant with its own signature. It is not — it is the only check
+                // there is. Every JBrowse app happens to pass an AppSession, which has
+                // widgets, but that is a fact about the app on the other side of a
+                // package boundary and an untyped callback contract.
                 onClick: (session) => {
                     if (isSessionModelWithWidgets(session)) {
-                        const { widgets } = session;
-                        let jobStatusWidget = widgets.get('JobsList');
-                        if (!jobStatusWidget) {
-                            jobStatusWidget = session.addWidget('JobsListWidget', 'JobsList');
-                            session.showWidget(jobStatusWidget);
-                        }
-                        else {
-                            session.showWidget(jobStatusWidget);
-                        }
+                        session.showWidget(getOrCreateJobsListWidget(session));
                     }
                 },
             });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jbrowse/plugin-jobs-management",
-  "version": "4.2.1",
+  "version": "5.0.0-beta.1",
   "type": "module",
   "description": "JBrowse 2 jobs management",
   "keywords": [
@@ -21,15 +21,15 @@
     "esm"
   ],
   "dependencies": {
-    "@jbrowse/mobx-state-tree": "^5.6.0",
-    "@mui/icons-material": "^7.3.10",
-    "@mui/material": "^7.3.10",
-    "mobx": "^6.15.0",
-    "mobx-react": "^9.2.1",
-    "@jbrowse/core": "^4.2.1"
+    "@jbrowse/mobx-state-tree": "^6.5.1",
+    "@mui/icons-material": "^9.3.1",
+    "@mui/material": "^9.3.1",
+    "mobx": "^7.0.3",
+    "mobx-react": "^10.0.2",
+    "@jbrowse/core": "^5.0.0-beta.1"
   },
   "peerDependencies": {
-    "react": ">=18.0.0"
+    "react": ">=19.0.0"
   },
   "publishConfig": {
     "access": "public"
@@ -39,14 +39,11 @@
     "build": "pnpm run /^build:/",
     "test": "cd ../..; jest --passWithNoTests plugins/jobs-management",
     "prebuild": "pnpm clean",
-    "build:esm": "tsc -p tsconfig.build.esm.json",
+    "build:esm": "node ../../node_modules/typescript7/bin/tsc --build tsconfig.build.esm.json",
     "clean": "rimraf esm *.tsbuildinfo"
   },
   "types": "esm/index.d.ts",
   "exports": {
-    ".": {
-      "types": "./esm/index.d.ts",
-      "import": "./esm/index.js"
-    }
+    ".": "./esm/index.js"
   }
 }