jbrowse-plugin-protein3d 0.4.12 → 0.4.13

package/dist/version.d.ts

@@ -1 +1 @@
-export declare const version = "0.4.12";
+export declare const version = "0.4.13";

package/dist/version.js

@@ -1 +1 @@
-export const version = '0.4.12';
+export const version = '0.4.13';

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "0.4.12",
+  "version": "0.4.13",
   "name": "jbrowse-plugin-protein3d",
   "repository": {
     "type": "git",
@@ -88,7 +88,7 @@
     "lint": "eslint src --report-unused-disable-directives --max-warnings 0",
     "pretest": "test -d .test-jbrowse-nightly || jbrowse create .test-jbrowse-nightly --nightly",
     "preversion": "pnpm lint",
-    "version": "node scripts/sync-version.mjs && git add src/version.ts distconfig.json",
+    "version": "node scripts/sync-version.mjs && git add src/version.ts",
     "postversion": "git push --follow-tags"
   }
 }

package/src/LaunchProteinView/components/LaunchSettingsDialog.tsx

@@ -0,0 +1,63 @@
+import React, { useState } from 'react'
+
+import {
+  Button,
+  Checkbox,
+  Dialog,
+  DialogActions,
+  DialogContent,
+  DialogTitle,
+  FormControlLabel,
+  FormGroup,
+  Typography,
+} from '@mui/material'
+
+import { getLaunchSideBySide, setLaunchSideBySide } from '../utils/sideBySide'
+
+// Small, self-contained launch settings (NOT the global preferences dialog):
+// just the options that affect how this protein view opens.
+export default function LaunchSettingsDialog({
+  open,
+  onClose,
+}: {
+  open: boolean
+  onClose: () => void
+}) {
+  const [sideBySide, setSideBySide] = useState(() => getLaunchSideBySide())
+  return (
+    <Dialog
+      open={open}
+      onClose={() => {
+        onClose()
+      }}
+    >
+      <DialogTitle>Launch settings</DialogTitle>
+      <DialogContent>
+        <FormGroup>
+          <FormControlLabel
+            control={<Checkbox checked={sideBySide} />}
+            label="Open protein view side-by-side with the genome view"
+            onChange={(_, checked) => {
+              setSideBySide(checked)
+              setLaunchSideBySide(checked)
+            }}
+          />
+        </FormGroup>
+        <Typography variant="body2" color="text.secondary">
+          When enabled, launching a protein view places it to the right of the
+          connected genome view in a split layout instead of stacking it below.
+        </Typography>
+      </DialogContent>
+      <DialogActions>
+        <Button
+          variant="contained"
+          onClick={() => {
+            onClose()
+          }}
+        >
+          Close
+        </Button>
+      </DialogActions>
+    </Dialog>
+  )
+}

package/src/LaunchProteinView/components/ProteinViewActions.tsx

@@ -2,9 +2,11 @@ import React, { useState } from 'react'
 
 import { ErrorMessage } from '@jbrowse/core/ui'
 import ArrowDropDownIcon from '@mui/icons-material/ArrowDropDown'
-import { Button, ButtonGroup, Typography } from '@mui/material'
+import SettingsIcon from '@mui/icons-material/Settings'
+import { Button, ButtonGroup, IconButton, Tooltip, Typography } from '@mui/material'
 
 import LaunchOptionsDialog from './LaunchOptionsDialog'
+import LaunchSettingsDialog from './LaunchSettingsDialog'
 import SequenceMismatchNotice from './SequenceMismatchNotice'
 import { getLaunchMissingReasons, safeLaunch } from '../utils/launchHelpers'
 import {
@@ -58,6 +60,7 @@ export default function ProteinViewActions({
   error,
 }: ProteinViewActionsProps) {
   const [dialogOpen, setDialogOpen] = useState(false)
+  const [settingsOpen, setSettingsOpen] = useState(false)
   const [launchError, setLaunchError] = useState<unknown>()
   // Disable launch while loading — SWR's keepPreviousData would otherwise let
   // a user click Launch on stale results (wrong UniProt ID) during a refetch.
@@ -155,6 +158,17 @@ export default function ProteinViewActions({
           onAlignmentAlgorithmChange={onAlignmentAlgorithmChange}
         />
       ) : null}
+      <Tooltip title="Launch settings">
+        <IconButton
+          size="small"
+          aria-label="Launch settings"
+          onClick={() => {
+            setSettingsOpen(true)
+          }}
+        >
+          <SettingsIcon fontSize="small" />
+        </IconButton>
+      </Tooltip>
       <Button
         variant="contained"
         color="secondary"
@@ -189,6 +203,12 @@ export default function ProteinViewActions({
         onClose={closeMenu}
         options={launchOptions}
       />
+      <LaunchSettingsDialog
+        open={settingsOpen}
+        onClose={() => {
+          setSettingsOpen(false)
+        }}
+      />
     </>
   )
 }

package/src/LaunchProteinView/utils/launchViewUtils.ts

@@ -6,6 +6,7 @@ declare global {
   }
 }
 
+import { getLaunchSideBySide, launchViewSideBySide } from './sideBySide'
 import { getGeneDisplayName, getTranscriptDisplayName } from './util'
 import { launchProteinAnnotationView } from '../components/launchProteinAnnotationView'
 
@@ -113,6 +114,7 @@ export function launch3DProteinView({
   alignmentAlgorithm,
   displayName,
   connectedMsaViewId,
+  sideBySide,
 }: LaunchViewParams & {
   url?: string
   data?: string
@@ -120,6 +122,9 @@ export function launch3DProteinView({
   alignmentAlgorithm?: string
   displayName?: string
   connectedMsaViewId?: string
+  // explicit override; when undefined the launch-dialog localStorage preference
+  // decides (left genome | right protein)
+  sideBySide?: boolean
 }) {
   const snap = {
     type: 'ProteinView',
@@ -138,7 +143,11 @@ export function launch3DProteinView({
       displayName ??
       formatViewName('Protein view', feature, selectedTranscript, uniprotId),
   }
-  return session.addView('ProteinView', snap)
+  const proteinView = session.addView('ProteinView', snap)
+  if (sideBySide ?? getLaunchSideBySide()) {
+    launchViewSideBySide(session, proteinView.id)
+  }
+  return proteinView
 }
 
 export async function launch1DProteinView({

package/src/LaunchProteinView/utils/sideBySide.ts

@@ -0,0 +1,55 @@
+import type { AbstractSessionModel } from '@jbrowse/core/util'
+
+// Self-contained launch preference (NOT the global/core preferences system):
+// whether a protein view launched from a genome feature opens side-by-side with
+// its connected genome view (left genome | right protein) instead of stacked.
+const SIDE_BY_SIDE_KEY = 'proteinView-launchSideBySide'
+
+// Default to side-by-side: a connected genome+protein pair reads best as a
+// left/right split. Users can turn it off in the launch dialog's settings.
+const DEFAULT_SIDE_BY_SIDE = true
+
+export function getLaunchSideBySide() {
+  const stored = localStorage.getItem(SIDE_BY_SIDE_KEY)
+  return stored === null ? DEFAULT_SIDE_BY_SIDE : stored === 'true'
+}
+
+export function setLaunchSideBySide(value: boolean) {
+  localStorage.setItem(SIDE_BY_SIDE_KEY, value ? 'true' : 'false')
+}
+
+// The workspaces split is driven by two session actions that only exist on the
+// web/desktop session (MultipleViews + DockviewLayout mixins). Embedded sessions
+// lack them, so feature-detect before using.
+interface SessionWithWorkspaces {
+  setUseWorkspaces: (useWorkspaces: boolean) => void
+  setPendingMove: (move: { type: 'splitRight'; viewId: string }) => void
+}
+
+function isSessionWithWorkspaces(
+  session: AbstractSessionModel,
+): session is AbstractSessionModel & SessionWithWorkspaces {
+  return (
+    'setUseWorkspaces' in session &&
+    typeof session.setUseWorkspaces === 'function' &&
+    'setPendingMove' in session &&
+    typeof session.setPendingMove === 'function'
+  )
+}
+
+/**
+ * Place a freshly-added view to the right of the others in a workspaces (tiled)
+ * layout. Mirrors the "Move to split view" view-menu action: queue a splitRight
+ * pending move for this view, then enable workspaces so TiledViewsContainer
+ * consumes the move on mount (other views land in the left panel, this one in a
+ * new right panel). No-op on sessions without workspaces support.
+ */
+export function launchViewSideBySide(
+  session: AbstractSessionModel,
+  viewId: string,
+) {
+  if (isSessionWithWorkspaces(session)) {
+    session.setPendingMove({ type: 'splitRight', viewId })
+    session.setUseWorkspaces(true)
+  }
+}

package/src/LaunchProteinViewExtensionPoint/index.ts

@@ -1,4 +1,8 @@
 import { type ConnectedViewSpec, resolveShortLaunch } from './resolveShortLaunch'
+import {
+  getLaunchSideBySide,
+  launchViewSideBySide,
+} from '../LaunchProteinView/utils/sideBySide'
 
 import type PluginManager from '@jbrowse/core/PluginManager'
 import type { AbstractSessionModel } from '@jbrowse/core/util'
@@ -28,6 +32,7 @@ export default function LaunchProteinViewExtensionPointF(
       showControls,
       showHighlight,
       zoomToBaseLevel,
+      sideBySide,
     }: {
       session: AbstractSessionModel
       url?: string
@@ -43,6 +48,10 @@ export default function LaunchProteinViewExtensionPointF(
       showControls?: boolean
       showHighlight?: boolean
       zoomToBaseLevel?: boolean
+      // when this launch creates its own connected genome view, place the
+      // protein view side-by-side (left genome | right protein). Explicit
+      // override; falls back to the launch-dialog localStorage preference.
+      sideBySide?: boolean
     }) => {
       // Short-URL form: `uniprotId` + `transcriptId` + `connectedView` (no
       // explicit `url`/`feature`/sequence). Derive the structure URL, the
@@ -77,6 +86,9 @@ export default function LaunchProteinViewExtensionPointF(
       // `connectedView` is supplied we create the LinearGenomeView here and wire
       // its id, letting a single spec entry produce a connected genome+protein
       // pair (e.g. hover a variant to highlight the residue).
+      // a connected view this launch created itself can be split beside the
+      // protein view; a pre-existing connectedViewId is left in place
+      const ownsConnectedView = !connectedViewId && !!connectedView
       const resolvedConnectedViewId =
         connectedViewId ??
         (connectedView
@@ -86,7 +98,7 @@ export default function LaunchProteinViewExtensionPointF(
             }).id
           : undefined)
 
-      session.addView('ProteinView', {
+      const proteinView = session.addView('ProteinView', {
         type: 'ProteinView',
         alignmentAlgorithm,
         displayName,
@@ -106,6 +118,10 @@ export default function LaunchProteinViewExtensionPointF(
           },
         ],
       })
+
+      if (ownsConnectedView && (sideBySide ?? getLaunchSideBySide())) {
+        launchViewSideBySide(session, proteinView.id)
+      }
     },
   )
 }

package/src/version.ts

@@ -1 +1 @@
-export const version = '0.4.12'
+export const version = '0.4.13'