Skip to content

feat(biochem): enlarge compound structure on hover or focus in reaction equation - #234

Merged
samseaver merged 3 commits into
ModelSEED:stagingfrom
VibhavSetlur:feat/reaction-compound-structure-preview
Aug 29, 2026
Merged

feat(biochem): enlarge compound structure on hover or focus in reaction equation#234
samseaver merged 3 commits into
ModelSEED:stagingfrom
VibhavSetlur:feat/reaction-compound-structure-preview

Conversation

@VibhavSetlur

Copy link
Copy Markdown
Collaborator

Summary

Sam noted on /biochem/reactions/rxn02005 that the atom mapping looks great but larger
compounds are hard to read at thumbnail size. This adds an enlarged structure preview:
hovering or keyboard-focusing a compound in the reaction equation pops up a 360px
render of that same structure, reusing the existing MoleculeRenderer and the exact same
atom-mapping colours as the thumbnail.

Behaviour

  • Opens on mouseenter / focus, closes on mouseleave / blur / Escape.
  • Uses MUI Popper (placement="top", pointerEvents: 'none') so the popup can never
    steal the pointer and cause hover flicker, and never traps focus.
  • Preview receives the same smiles, atomColors, bondColors, showAllAtomLabels and
    fallbackSvg as the inline thumbnail, so atom-mapping colours are identical — just bigger.
  • Deliberately does not pass onInventory / onGraph to the preview renderer, so the
    parent's colour-plan state is untouched by opening a preview.
  • No preview for compounds with no drawn structure (e.g. H+ / cpd00067).
  • role="tooltip" + aria-label="Enlarged structure of <name>", wired to the compound link
    via aria-describedby while open.
  • Card is maxWidth: 90vw / maxHeight: 90vh with overflow: hidden so it stays contained
    on small viewports.

Tests

Four new focused tests in tests/unit/components/ReactionStructureEquation.test.tsx:
closed by default + opens on pointer enter (asserts 360px size, no onInventory/onGraph,
aria-describedby lifecycle, compound link href unchanged); opens on focus / closes on blur /
closes on Escape; preview reuses the thumbnail's atom-mapping colours (deep equality);
no preview for a compound without a drawn structure.

Verification (CI mirror, all exit 0)

npm run lint · npx tsc --noEmit · npm run test:run (33 files, 351 passed / 4 skipped) ·
npm run build · npm audit --omit=dev --audit-level=high (0 vulnerabilities) · git diff --check

Notes

…on equation

Hovering or keyboard-focusing a compound thumbnail opens a 360px preview rendered by the existing MoleculeRenderer with the same atom-mapping colors.
The preview is pointer-transparent and closes on mouse leave, blur, or Escape.
The enlarged instance deliberately does not receive onInventory/onGraph, so the atom-orbit color plan is unaffected.
Release bumped to 3.5.0.
…ound structure preview

Conflicts were release metadata only (VERSION.md, package.json, package-lock.json, CHANGELOG.md). Retain the 3.5.0 bump over 3.4.1.
…ging base

Fix a pre-existing semantic conflict where PR ModelSEED#233 merged after PR ModelSEED#235 (e788d98) without it, leaving expectations naming staging.modelseed.org/solr. The reactions_staging collection name is unchanged because the shared instance serves both core sets.
@VibhavSetlur

Copy link
Copy Markdown
Collaborator Author

Updated against current `staging` (825fd56), which now contains #235 (shared Solr base URL) and #233 (Solr 9 nested stoichiometry).

3216782 — `git merge --no-ff upstream/staging`. Conflicts were release metadata only (`VERSION.md`, `package.json`, `package-lock.json`, `CHANGELOG.md`); resolved to 3.5.0 over the released 3.4.1 (feat → minor, per CONTRIBUTING), with `[3.5.0]` inserted above the unaltered `[3.4.1]` and `[Unreleased]` sections. No dependency drift in the lockfile (only the two version strings). No source or Solr-config conflicts — @samseaver's e788d98 comes through from staging byte-identical and appears exactly once.

9902ede — 3-line test fix in `tests/unit/api/biochemStoichiometry.test.ts` (93/98/101). This is a pre-existing semantic conflict on `staging`, not something this branch introduced: #233 branched from 4a11bb0 and merged after #235 without containing it, so its expected URLs still named `staging.modelseed.org/solr`. Confirmed failing on a pristine `staging` checkout. Only the host changed; paths, query strings, encoding, and the `reactions_staging` collection name are byte-identical, since the shared instance serves both core sets.

Full CI mirror green locally and in Verify: lint, tsc --noEmit, test:run (358 passed / 4 skipped), build, audit (0 vulns).

@samseaver
samseaver merged commit b94ff12 into ModelSEED:staging Aug 29, 2026
2 checks passed
@samseaver
samseaver deleted the feat/reaction-compound-structure-preview branch August 29, 2026 05:50
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants