VariantTrack VCF format

packages/core/pluggableElementTypes/models/components/SaveTrackData.tsx

@@ -71,10 +71,11 @@ const SaveTrackDataDialog = observer(function ({
   }
   handleClose: () => void
 }) {
+  const options = model.saveTrackFileFormatOptions()
   const { classes } = useStyles()
   const [error, setError] = useState<unknown>()
   const [features, setFeatures] = useState<Feature[]>()
-  const [type, setType] = useState('gff3')
+  const [type, setType] = useState(Object.keys(options)[0])
   const [str, setStr] = useState('')
 
   useEffect(() => {
@@ -91,8 +92,6 @@ const SaveTrackDataDialog = observer(function ({
     })()
   }, [model])
 
-  const options = model.saveTrackFileFormatOptions()
-
   useEffect(() => {
     // eslint-disable-next-line @typescript-eslint/no-floating-promises
     ;(async () => {

plugins/variants/src/VariantTrack/index.ts

@@ -3,14 +3,28 @@ import TrackType from '@jbrowse/core/pluggableElementTypes/TrackType'
 import { createBaseTrackModel } from '@jbrowse/core/pluggableElementTypes/models'
 import configSchemaF from './configSchema'
 
+import { stringifyVCF } from './saveTrackFormats/vcf'
+
 export default (pm: PluginManager) => {
   pm.addTrackType(() => {
     const configSchema = configSchemaF(pm)
     return new TrackType({
       name: 'VariantTrack',
       displayName: 'Variant track',
       configSchema,
-      stateModel: createBaseTrackModel(pm, 'VariantTrack', configSchema),
+      stateModel: createBaseTrackModel(pm, 'VariantTrack', configSchema).views(
+        () => ({
+          saveTrackFileFormatOptions() {
+            return {
+              vcf: {
+                name: 'VCF',
+                extension: 'vcf',
+                callback: stringifyVCF,
+              },
+            }
+          },
+        }),
+      ),
     })
   })
 }

plugins/variants/src/VariantTrack/saveTrackFormats/vcf.ts

@@ -0,0 +1,9 @@
+import { Feature } from '@jbrowse/core/util'
+
+export function stringifyVCF({ features }: { features: Feature[] }) {
+  return features
+    .map(feature => {
+      return `hello ${feature.get('name')}`
+    })
+    .join('\n')
+}