Skip to main content

Add-track workflows

Register a React component in the "Add track" widget for tracks that need custom logic. The multi-row track does this, producing a textbox to paste a list of files.

The multi-row workflow is the whole registration:

import { lazy } from 'react'

import { AddTrackWorkflowType } from '@jbrowse/core/pluggableElementTypes'

import { MULTI_ROW_WORKFLOW } from './workflowName.ts'

import type PluginManager from '@jbrowse/core/PluginManager'

export default function MultiWiggleAddTrackWorkflowF(pm: PluginManager) {
  pm.addAddTrackWorkflowType(
    () =>
      new AddTrackWorkflowType({
        name: MULTI_ROW_WORKFLOW,
        displayName: 'Add multi-row track',
        ReactComponent: lazy(() => import('./AddTrackWorkflow.tsx')),
      }),
  )
}
  • ReactComponent is the form rendered inside the "Add track" widget, lazily imported so the form's code only loads when a user picks this workflow
  • category groups the workflow in the dropdown under "General" or "Specialized track types". An omitted category means 'specialized', which fits a workflow targeting one data type, as the multi-wiggle one does; pass category: 'general' for a workflow that accepts any track

The component is rendered with two props. model is the add-track widget's model, and switchWorkflow(name) moves the user to another workflow by name — what the built-in file/URL form uses to hand off to the bulk one. A component typed for model alone still compiles, since the extra prop is assignable, so nothing points this out at the call site.

Type model as AddTrackWorkflowModel from @jbrowse/core/util, and use two helpers from the same module:

  • workflowForm(model, name, initial) holds the form's fields on the widget model and returns { form, update }. The drawer unmounts the widget whenever it shows another one, which loses anything kept in useState; the model keeps it, and resets it after an add
  • addTrackFromWidget({ model, session, conf }) adds the track, shows it in the view the widget was opened from, and closes the widget. addTracksFromWidget takes a list of configs

Call MultiWiggleAddTrackWorkflowF(pm) from your plugin's install(), the same as any other pluggable element.

See also