@apollo-annotation/jbrowse-plugin-apollo 0.3.7 → 0.3.9

package/src/components/ViewChangeLog.tsx

@@ -26,6 +26,10 @@ import React, { useEffect, useState } from 'react'
 import { makeStyles } from 'tss-react/mui'
 
 import { type ApolloInternetAccountModel } from '../ApolloInternetAccount/model'
+import {
+  type ApolloInternetAccount,
+  type CollaborationServerDriver,
+} from '../BackendDrivers'
 import { type ApolloSessionModel } from '../session'
 import { type ApolloRootModel } from '../types'
 import { createFetchErrorMessage } from '../util'
@@ -37,11 +41,6 @@ interface ViewChangeLogProps {
   handleClose(): void
 }
 
-interface AssemblyDocument {
-  _id: string
-  name: string
-}
-
 const useStyles = makeStyles()((theme) => ({
   changeTextarea: {
     fontFamily: 'monospace',
@@ -63,12 +62,18 @@ export function ViewChangeLog({ handleClose, session }: ViewChangeLogProps) {
   const { baseURL } = apolloInternetAccount
   const { classes } = useStyles()
   const [errorMessage, setErrorMessage] = useState<string>()
-  const [assemblyCollection, setAssemblyCollection] = useState<
-    AssemblyDocument[]
-  >([])
-  const [assemblyId, setAssemblyId] = useState<string>('')
   const [displayGridData, setDisplayGridData] = useState<GridRowsProp[]>([])
 
+  const { collaborationServerDriver } = session.apolloDataStore as {
+    collaborationServerDriver: CollaborationServerDriver
+    getInternetAccount(
+      assemblyName?: string,
+      internetAccountId?: string,
+    ): ApolloInternetAccount
+  }
+  const assemblies = collaborationServerDriver.getAssemblies()
+  const [selectedAssembly, setSelectedAssembly] = useState(assemblies.at(0))
+
   const gridColumns: GridColDef[] = [
     { field: 'sequence' },
     {
@@ -90,7 +95,6 @@ export function ViewChangeLog({ handleClose, session }: ViewChangeLogProps) {
           readOnly
         />
       ),
-      valueFormatter: ({ value }) => JSON.stringify(value),
     },
     { field: 'user', headerName: 'User', width: 140 },
     {
@@ -102,47 +106,17 @@ export function ViewChangeLog({ handleClose, session }: ViewChangeLogProps) {
     },
   ]
 
-  useEffect(() => {
-    async function getAssemblies() {
-      const uri = new URL('assemblies', baseURL).href
-      const apolloFetch = apolloInternetAccount?.getFetcher({
-        locationType: 'UriLocation',
-        uri,
-      })
-      if (apolloFetch) {
-        const response = await apolloFetch(uri, { method: 'GET' })
-        if (!response.ok) {
-          const newErrorMessage = await createFetchErrorMessage(
-            response,
-            'Error when retrieving assemblies from server',
-          )
-          setErrorMessage(newErrorMessage)
-          return
-        }
-        const data = (await response.json()) as AssemblyDocument[]
-        setAssemblyCollection(data)
-      }
-    }
-    getAssemblies().catch((error) => {
-      setErrorMessage(String(error))
-    })
-  }, [apolloInternetAccount, baseURL])
-
-  useEffect(() => {
-    if (!assemblyId && assemblyCollection.length > 0) {
-      setAssemblyId(assemblyCollection[0]._id)
-    }
-  }, [assemblyId, assemblyCollection])
-
   useEffect(() => {
     async function getGridData() {
-      if (!assemblyId) {
+      if (!selectedAssembly) {
         return
       }
 
       // Get changes
       const url = new URL('changes', baseURL)
-      const searchParams = new URLSearchParams({ assembly: assemblyId })
+      const searchParams = new URLSearchParams({
+        assembly: selectedAssembly.name,
+      })
       url.search = searchParams.toString()
       const uri = url.toString()
       const apolloFetch = apolloInternetAccount?.getFetcher({
@@ -168,10 +142,11 @@ export function ViewChangeLog({ handleClose, session }: ViewChangeLogProps) {
     getGridData().catch((error) => {
       setErrorMessage(String(error))
     })
-  }, [assemblyId, apolloInternetAccount, baseURL])
+  }, [apolloInternetAccount, baseURL, selectedAssembly])
 
   function handleChangeAssembly(e: SelectChangeEvent) {
-    setAssemblyId(e.target.value)
+    const newAssembly = assemblies.find((asm) => asm.name === e.target.value)
+    setSelectedAssembly(newAssembly)
   }
 
   return (
@@ -184,12 +159,12 @@ export function ViewChangeLog({ handleClose, session }: ViewChangeLogProps) {
     >
       <Select
         style={{ width: 200, marginLeft: 40 }}
-        value={assemblyId}
+        value={selectedAssembly?.name ?? ''}
         onChange={handleChangeAssembly}
       >
-        {assemblyCollection.map((option) => (
-          <MenuItem key={option._id} value={option._id}>
-            {option.name}
+        {assemblies.map((option) => (
+          <MenuItem key={option.name} value={option.name}>
+            {option.displayName || option.name}
           </MenuItem>
         ))}
       </Select>

package/src/components/ViewCheckResults.tsx

@@ -4,7 +4,6 @@
 /* eslint-disable @typescript-eslint/no-unsafe-argument */
 /* eslint-disable @typescript-eslint/no-unsafe-member-access */
 /* eslint-disable @typescript-eslint/no-unsafe-return */
-import { type Assembly } from '@jbrowse/core/assemblyManager/assembly'
 import {
   Button,
   DialogActions,
@@ -49,7 +48,6 @@ export function ViewCheckResults({
   }
   const { baseURL } = apolloInternetAccount
   const [errorMessage, setErrorMessage] = useState<string>()
-  const [selectedAssembly, setSelectedAssembly] = useState<Assembly>()
   const [displayGridData, setDisplayGridData] = useState<GridRowsProp[]>([])
 
   const gridColumns: GridColDef[] = [
@@ -65,11 +63,7 @@ export function ViewCheckResults({
   ]
 
   const assemblies = collaborationServerDriver.getAssemblies()
-  useEffect(() => {
-    if (!selectedAssembly && assemblies.length > 0) {
-      setSelectedAssembly(assemblies[0])
-    }
-  }, [assemblies, selectedAssembly])
+  const [selectedAssembly, setSelectedAssembly] = useState(assemblies.at(0))
 
   useEffect(() => {
     async function getGridData() {
@@ -127,7 +121,7 @@ export function ViewCheckResults({
       >
         {assemblies.map((option) => (
           <MenuItem key={option.name} value={option.name}>
-            {option.displayName ?? option.name}
+            {option.displayName}
           </MenuItem>
         ))}
       </Select>

package/src/components/index.ts

@@ -1,4 +1,5 @@
 export * from './AddAssembly'
+export * from './AddAssemblyAliases'
 export * from './AddChildFeature'
 export * from './AddFeature'
 export * from './CopyFeature'

package/src/config.ts

@@ -15,6 +15,12 @@ const ApolloPluginConfigurationSchema = ConfigurationSchema('ApolloPlugin', {
     type: 'boolean',
     defaultValue: false,
   },
+  geneBackgroundColor: {
+    description: 'Color for feature background',
+    type: 'string',
+    defaultValue: 'jexl:geneBackgroundColor(featureType)',
+    contextVariable: ['featureType'],
+  },
 })
 
 export default ApolloPluginConfigurationSchema

package/src/index.ts

@@ -6,6 +6,7 @@ import {
   CDSCheck,
   CoreValidation,
   ParentChildValidation,
+  TranscriptCheck,
   changes,
   validationRegistry,
 } from '@apollo-annotation/shared'
@@ -30,6 +31,7 @@ import {
 } from '@jbrowse/core/util'
 import { type LinearGenomeViewStateModel } from '@jbrowse/plugin-linear-genome-view'
 import AddIcon from '@mui/icons-material/Add'
+import { alpha } from '@mui/material'
 
 import { version } from '../package.json'
 
@@ -40,7 +42,6 @@ import {
 import { installApolloRefNameAliasAdapter } from './ApolloRefNameAliasAdapter'
 import { installApolloSequenceAdapter } from './ApolloSequenceAdapter'
 import { installApolloTextSearchAdapter } from './ApolloTextSearchAdapter'
-import { type BackendDriver } from './BackendDrivers'
 import {
   ApolloFeatureDetailsWidget,
   ApolloFeatureDetailsWidgetModel,
@@ -51,19 +52,16 @@ import {
   configSchema as linearApolloDisplayConfigSchema,
   stateModelFactory as LinearApolloDisplayStateModelFactory,
 } from './LinearApolloDisplay'
+import {
+  LinearApolloReferenceSequenceDisplay,
+  configSchema as linearApolloReferenceSequenceDisplayConfigSchema,
+  stateModelFactory as LinearApolloReferenceSequenceDisplayStateModelFactory,
+} from './LinearApolloReferenceSequenceDisplay'
 import {
   configSchema as linearApolloSixFrameDisplayConfigSchema,
   stateModelFactory as LinearApolloSixFrameDisplayStateModelFactory,
 } from './LinearApolloSixFrameDisplay'
-import {
-  AddFeature,
-  DownloadGFF3,
-  LogOut,
-  ManageChecks,
-  OpenLocalFile,
-  ViewChangeLog,
-  ViewCheckResults,
-} from './components'
+import { AddFeature } from './components'
 import ApolloPluginConfigurationSchema from './config'
 import {
   annotationFromJBrowseFeature,
@@ -73,6 +71,7 @@ import {
   LinearApolloDisplayComponent,
   LinearApolloSixFrameDisplayComponent,
 } from './makeDisplayComponent'
+import { addTopLevelMenus } from './menus'
 import { type ApolloSessionModel, extendSession } from './session'
 
 interface RpcHandle {
@@ -106,6 +105,10 @@ for (const [changeName, change] of Object.entries(changes)) {
 
 const cdsCheck = new CDSCheck()
 checkRegistry.registerCheck(cdsCheck.name, cdsCheck)
+
+const transcriptCheck = new TranscriptCheck()
+checkRegistry.registerCheck(transcriptCheck.name, transcriptCheck)
+
 validationRegistry.registerValidation(new CoreValidation())
 validationRegistry.registerValidation(new ParentChildValidation())
 
@@ -201,6 +204,22 @@ export default class ApolloPlugin extends Plugin {
       })
     })
 
+    pluginManager.addDisplayType(() => {
+      const configSchema = linearApolloReferenceSequenceDisplayConfigSchema
+      return new DisplayType({
+        name: 'LinearApolloReferenceSequenceDisplay',
+        configSchema,
+        stateModel: LinearApolloReferenceSequenceDisplayStateModelFactory(
+          pluginManager,
+          configSchema,
+        ),
+        displayName: 'Apollo reference sequence display',
+        trackType: 'ReferenceSequenceTrack',
+        viewType: 'LinearGenomeView',
+        ReactComponent: LinearApolloReferenceSequenceDisplay,
+      })
+    })
+
     pluginManager.addToExtensionPoint(
       'Core-extendSession',
       // @ts-expect-error not sure how to deal with snapshot model types
@@ -289,9 +308,10 @@ export default class ApolloPlugin extends Plugin {
                 if (!dataStore) {
                   break
                 }
-                const backendDriver = dataStore.getBackendDriver(
-                  assemblyName,
-                ) as BackendDriver
+                const backendDriver = dataStore.getBackendDriver(assemblyName)
+                if (!backendDriver) {
+                  break
+                }
                 const { seq: sequence } =
                   await backendDriver.getSequence(region)
                 handle.workers[0].postMessage({
@@ -311,9 +331,10 @@ export default class ApolloPlugin extends Plugin {
                 if (!dataStore) {
                   break
                 }
-                const backendDriver = dataStore.getBackendDriver(
-                  assembly,
-                ) as BackendDriver
+                const backendDriver = dataStore.getBackendDriver(assembly)
+                if (!backendDriver) {
+                  break
+                }
                 const regions = await backendDriver.getRegions(assembly)
                 handle.workers[0].postMessage({
                   apollo,
@@ -332,9 +353,10 @@ export default class ApolloPlugin extends Plugin {
                 if (!dataStore) {
                   break
                 }
-                const backendDriver = dataStore.getBackendDriver(
-                  assembly,
-                ) as BackendDriver
+                const backendDriver = dataStore.getBackendDriver(assembly)
+                if (!backendDriver) {
+                  break
+                }
                 const refNameAliases =
                   await backendDriver.getRefNameAliases(assembly)
                 handle.workers[0].postMessage({
@@ -357,103 +379,19 @@ export default class ApolloPlugin extends Plugin {
 
   configure(pluginManager: PluginManager) {
     if (isAbstractMenuManager(pluginManager.rootModel)) {
-      pluginManager.rootModel.appendToMenu('Apollo', {
-        label: 'Download GFF3',
-        onClick: (session: ApolloSessionModel) => {
-          ;(session as unknown as AbstractSessionModel).queueDialog(
-            (doneCallback) => [
-              DownloadGFF3,
-              {
-                session,
-                handleClose: () => {
-                  doneCallback()
-                },
-              },
-            ],
-          )
-        },
-      })
-      pluginManager.rootModel.appendToMenu('Apollo', {
-        label: 'Manage Checks',
-        onClick: (session: ApolloSessionModel) => {
-          ;(session as unknown as AbstractSessionModel).queueDialog(
-            (doneCallback) => [
-              ManageChecks,
-              {
-                session,
-                handleClose: () => {
-                  doneCallback()
-                },
-              },
-            ],
-          )
-        },
-      })
-      pluginManager.rootModel.appendToMenu('Apollo', {
-        label: 'View Change Log',
-        onClick: (session: ApolloSessionModel) => {
-          ;(session as unknown as AbstractSessionModel).queueDialog(
-            (doneCallback) => [
-              ViewChangeLog,
-              {
-                session,
-                handleClose: () => {
-                  doneCallback()
-                },
-              },
-            ],
-          )
-        },
-      })
-      pluginManager.rootModel.appendToMenu('Apollo', {
-        label: 'Open local GFF3 file',
-        onClick: (session: ApolloSessionModel) => {
-          ;(session as unknown as AbstractSessionModel).queueDialog(
-            (doneCallback) => [
-              OpenLocalFile,
-              {
-                session,
-                handleClose: () => {
-                  doneCallback()
-                },
-                inMemoryFileDriver: session.apolloDataStore.inMemoryFileDriver,
-              },
-            ],
-          )
-        },
-      })
-      pluginManager.rootModel.appendToMenu('Apollo', {
-        label: 'View check results',
-        onClick: (session: ApolloSessionModel) => {
-          ;(session as unknown as AbstractSessionModel).queueDialog(
-            (doneCallback) => [
-              ViewCheckResults,
-              {
-                session,
-                handleClose: () => {
-                  doneCallback()
-                },
-              },
-            ],
-          )
-        },
-      })
-      pluginManager.rootModel.appendToMenu('Apollo', {
-        label: 'Log out',
-        onClick: (session: ApolloSessionModel) => {
-          ;(session as unknown as AbstractSessionModel).queueDialog(
-            (doneCallback) => [
-              LogOut,
-              {
-                session,
-                handleClose: () => {
-                  doneCallback()
-                },
-              },
-            ],
-          )
+      pluginManager.jexl.addFunction(
+        'geneBackgroundColor',
+        (featureType: string) => {
+          if (featureType === 'pseudogene') {
+            return alpha('rgb(148, 203, 236)', 0.6)
+          }
+          if (featureType === 'ncRNA_gene') {
+            return alpha('rgb(194, 106, 119)', 0.6)
+          }
+          return
         },
-      })
+      )
+      addTopLevelMenus(pluginManager.rootModel)
     }
   }
 }

package/src/makeDisplayComponent.tsx

@@ -19,7 +19,6 @@ const accordionControlHeight = 12
 const useStyles = makeStyles()((theme) => ({
   shading: {
     background: alpha(theme.palette.primary.main, 0.2),
-    overflowY: 'scroll',
     overflowX: 'hidden',
   },
   details: {
@@ -88,25 +87,21 @@ const ResizeHandle = ({
     },
     [onResize],
   )
-  const cancelDrag: (event: MouseEvent) => void = useCallback(
-    (event: MouseEvent) => {
-      event.stopPropagation()
-      event.preventDefault()
-      globalThis.removeEventListener('mousemove', mouseMove)
-      globalThis.removeEventListener('mouseup', cancelDrag)
-      globalThis.removeEventListener('mouseleave', cancelDrag)
-    },
-    [mouseMove],
-  )
+
   return (
     // TODO: a11y
     // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions
     <div
       onMouseDown={(event: React.MouseEvent) => {
         event.stopPropagation()
-        globalThis.addEventListener('mousemove', mouseMove)
-        globalThis.addEventListener('mouseup', cancelDrag)
-        globalThis.addEventListener('mouseleave', cancelDrag)
+        const controller = new AbortController()
+        const { signal } = controller
+        function abortDrag() {
+          controller.abort()
+        }
+        globalThis.addEventListener('mousemove', mouseMove, { signal })
+        globalThis.addEventListener('mouseup', abortDrag, { signal })
+        globalThis.addEventListener('mouseleave', abortDrag, { signal })
       }}
       onClick={(e) => {
         e.stopPropagation()

package/src/menus/index.ts

@@ -0,0 +1 @@
+export { addTopLevelMenus } from './topLevelMenu'

package/src/{ApolloInternetAccount/addMenuItems.ts → menus/topLevelMenu.ts}

@@ -2,130 +2,139 @@ import {
   type AbstractMenuManager,
   type AbstractSessionModel,
 } from '@jbrowse/core/util'
+import DownloadIcon from '@mui/icons-material/Download'
+import FactCheckIcon from '@mui/icons-material/FactCheck'
+import FileOpenIcon from '@mui/icons-material/FileOpen'
+import LogoutIcon from '@mui/icons-material/Logout'
+import RedoIcon from '@mui/icons-material/Redo'
+import TrackChangesIcon from '@mui/icons-material/TrackChanges'
+import UndoIcon from '@mui/icons-material/Undo'
 
 import {
-  AddAssembly,
-  AddRefSeqAliases,
-  DeleteAssembly,
-  ImportFeatures,
-  ManageUsers,
+  DownloadGFF3,
+  LogOut,
+  OpenLocalFile,
+  ViewChangeLog,
+  ViewCheckResults,
 } from '../components'
-import { AddAssemblyAliases } from '../components/AddAssemblyAliases'
 import { type ApolloSessionModel } from '../session'
 
-export function addMenuItems(rootModel: AbstractMenuManager) {
+export function addTopLevelMenus(rootModel: AbstractMenuManager) {
+  rootModel.insertInMenu(
+    'Apollo',
+    {
+      label: 'Redo',
+      icon: RedoIcon,
+      onClick(session: ApolloSessionModel) {
+        const { apolloDataStore } = session
+        void apolloDataStore.changeManager.redoLastChange()
+      },
+    },
+    0,
+  )
+  rootModel.insertInMenu(
+    'Apollo',
+    {
+      label: 'Undo',
+      icon: UndoIcon,
+      onClick(session: ApolloSessionModel) {
+        const { apolloDataStore } = session
+        void apolloDataStore.changeManager.undoLastChange()
+      },
+    },
+    0,
+  )
+
   rootModel.appendToMenu('Apollo', {
-    label: 'Add Assembly',
+    label: 'Download GFF3',
+    icon: DownloadIcon,
     onClick: (session: ApolloSessionModel) => {
       ;(session as unknown as AbstractSessionModel).queueDialog(
         (doneCallback) => [
-          AddAssembly,
+          DownloadGFF3,
           {
             session,
             handleClose: () => {
               doneCallback()
             },
-            changeManager: session.apolloDataStore.changeManager,
           },
         ],
       )
     },
   })
   rootModel.appendToMenu('Apollo', {
-    label: 'Delete Assembly',
+    label: 'View Change Log',
+    icon: TrackChangesIcon,
     onClick: (session: ApolloSessionModel) => {
       ;(session as unknown as AbstractSessionModel).queueDialog(
         (doneCallback) => [
-          DeleteAssembly,
+          ViewChangeLog,
           {
             session,
             handleClose: () => {
               doneCallback()
             },
-            changeManager: session.apolloDataStore.changeManager,
           },
         ],
       )
     },
   })
   rootModel.appendToMenu('Apollo', {
-    label: 'Import Features',
+    label: 'Open local GFF3 file',
+    icon: FileOpenIcon,
     onClick: (session: ApolloSessionModel) => {
       ;(session as unknown as AbstractSessionModel).queueDialog(
         (doneCallback) => [
-          ImportFeatures,
+          OpenLocalFile,
           {
             session,
             handleClose: () => {
               doneCallback()
             },
-            changeManager: session.apolloDataStore.changeManager,
+            inMemoryFileDriver: session.apolloDataStore.inMemoryFileDriver,
           },
         ],
       )
     },
   })
   rootModel.appendToMenu('Apollo', {
-    label: 'Add reference sequence aliases',
+    label: 'View check results',
+    icon: FactCheckIcon,
     onClick: (session: ApolloSessionModel) => {
       ;(session as unknown as AbstractSessionModel).queueDialog(
         (doneCallback) => [
-          AddRefSeqAliases,
+          ViewCheckResults,
           {
             session,
             handleClose: () => {
               doneCallback()
             },
-            changeManager: session.apolloDataStore.changeManager,
           },
         ],
       )
     },
   })
   rootModel.appendToMenu('Apollo', {
-    label: 'Add Assembly aliases',
+    label: 'Lock/Unlock session',
     onClick: (session: ApolloSessionModel) => {
-      ;(session as unknown as AbstractSessionModel).queueDialog(
-        (doneCallback) => [
-          AddAssemblyAliases,
-          {
-            session,
-            handleClose: () => {
-              doneCallback()
-            },
-            changeManager: session.apolloDataStore.changeManager,
-          },
-        ],
-      )
+      session.toggleLocked()
     },
   })
   rootModel.appendToMenu('Apollo', {
-    label: 'Manage Users',
+    label: 'Log out',
+    icon: LogoutIcon,
     onClick: (session: ApolloSessionModel) => {
       ;(session as unknown as AbstractSessionModel).queueDialog(
         (doneCallback) => [
-          ManageUsers,
+          LogOut,
           {
             session,
             handleClose: () => {
               doneCallback()
             },
-            changeManager: session.apolloDataStore.changeManager,
           },
         ],
       )
     },
   })
-  rootModel.appendToMenu('Apollo', {
-    label: 'Undo',
-    onClick: (session: ApolloSessionModel) => {
-      const { apolloDataStore } = session
-      const { notify } = session as unknown as AbstractSessionModel
-      if (apolloDataStore.changeManager.recentChanges.length > 0) {
-        void apolloDataStore.changeManager.revertLastChange()
-      } else {
-        notify('No changes to undo', 'info')
-      }
-    },
-  })
 }