Skip to content

Portal pages in the app's style, the lab's plot controls, and a gene query dialog (prototype) - #46

Merged
alisman merged 3 commits into
masterfrom
session/page
Oct 20, 2026
Merged

Portal pages in the app's style, the lab's plot controls, and a gene query dialog (prototype)#46
alisman merged 3 commits into
masterfrom
session/page

Conversation

@alisman

@alisman alisman commented Oct 20, 2026

Copy link
Copy Markdown
Contributor

The portal Results and Comparison pages restyled to match the rest of the app, the Plots tab given the lab's controls, and a prototype of one gene/OQL entry dialog for every place a page asks for genes.

What changes for a researcher

  • Results and Comparison pages look like the lab.
    • The app's own header, then a summary card: the study, the query, the headline altered count with its share of queried patients, and the groups with their figure colour and size.
    • The page tabs are the lab's tabs, and sub-tabs and the Mutations gene choice are segmented tabs.
    • Every card has the lab's view header: title, the groups it draws, help, timing and data-source badge.
    • Skeletons while loading.
    • Works at phone width.
  • Plots tab has the lab's plot controls: x/y axis with log, colour/ring on a box plot, highlight, unit, swap. A fix along the way: the tab drew only the Altered patients (a plot draws its first cohort and was handed Altered + Unaltered). It now plots every queried patient with Altered highlighted, as cBioPortal does.
  • Modify query shows Explore's study list (search and capability filters, one study chosen) beside the gene query.
  • Gene query dialog (prototype), one dialog for entering genes:
    • Search over genes, aliases and gene sets.
    • The query as text, checked line by line as it is typed: what each entry selects, in words, or what is wrong. Symbols are checked against the warehouse's gene / gene_alias tables: an alias (p53 → TP53, HER2 → ERBB2) is fixed in one click. An unknown symbol, unsupported OQL (GAIN, HETLOSS, …) or a count past the place's limit blocks Apply, and Apply says why.
    • Recent and saved lists, and clickable OQL help.
    • Used by the Results page query (OQL), the lab's gene views (compare, oncoprint, co-occurrence, co-expression, lollipop) and the oncoprint card's genes button. It replaces the chip editor there.
  • The Results page reads ?genes= as OQL, so KRAS: G12C, ERBB2: AMP etc. decide who is Altered. Genes split by spaces or commas as on the portal, so existing genes=KRAS,NRAS,BRAF links mean what they did. The page says that OQL decides the groups while the oncoprint and gene tabs draw every alteration of the genes.

How

  • app/portal/portal-chrome.tsx (header, summary card) and app/portal/query-editor.tsx. PortalTabs renders cards through ViewHead and draws figures through figureView, as the lab's kind cards do. The lab's page-tab class is shared as PAGE_TAB in app/_ui/toolbar.ts. The legacy .portal-* CSS is removed and the new chrome is Tailwind (data-tw).
  • app/lab/plot-controls.tsx: the plot toolbar, moved out of the lab's PlotCard so the lab and the portal render the same one.
  • app/_studies/study-list.tsx: Explore's study search, filters and rows, now shared by Explore's picker and the Results query. The portal layout gets the lab's query cache.
  • app/_genes/GeneQueryDialog.tsx, with lib/gene-query.ts (the pure line-by-line checker) and lib/oql-parse.ts (the OQL parser, split out of lib/oql.ts so it runs in the browser; lib/oql.ts re-exports it).
  • POST /api/genes (lib/genes.ts): symbol checks, gene and gene-set search, gene-set members. Reference data only, no patient rows.
  • Recent and saved gene lists are per browser (localStorage) in this prototype.

Not in this PR

  • Single-gene fields (mutation table, co-expression gene), Explore's "Add chart › Gene status", the plot's OQL axis and the split-by-OQL editor still use their own inputs.
  • Saved gene lists are not yet stored server-side per user.
  • Link length (the ?doc= a portal page writes) is a known issue, left for separate work.

Verification

GATE_PORT=4109 scripts/gate.sh passes on this branch rebased onto current master: lint (eslint, knip, ruff), build, 1,325 unit, 47 Postgres, 6/6 planted access bugs, 465/465 portal comparisons, 266 e2e checks. The three e2e checks that drove the old chip editor now edit the dialog's text and Apply; there are 9 new unit tests for the query checker. Checked by hand against the live warehouse:

  • brca_tcga KRAS/NRAS/BRAF: Plots draws 526 of 1,101 patients (529 of 1,108 samples by sample).
  • KRAS: G12C / TP53 / ERBB2: AMP gives 381 altered patients.
  • The dialog fixes aliases and blocks FOOBAR1 and GAIN.
  • The old comma link shows 94 KRAS mutations on coadread_tcga_pub.
  • Explore's study picker is unchanged.
  • No console errors.

Preview

No deploy preview: this repo deploys to Vercel from master. Try it on a branch checkout at /portal/results?study=brca_tcga&genes=KRAS,NRAS,BRAF.

🤖 Generated with Claude Code

https://claude.ai/code/session_01TyVfAhLnjshk2kWewGnLum

alisman and others added 3 commits October 20, 2026 06:58
@alisman @claude
Portal pages: the lab's header, a summary card, the lab's tabs and Vi…
2e82f3a 
…ewHead

The Results and Comparison pages now look like the rest of the app while keeping
cBioPortal's tab layout. The page header is the lab's own app header. A summary card
holds the study, the query (genes as chips), the headline altered count with its share
of queried patients, and the groups with their figure swatch and size, plus what the page
left out for this study. On the Results page, "Modify query" opens the study/genes form
in that card. The page tabs use the lab's tab style, now shared as PAGE_TAB in toolbar.ts.
Sub-tabs and the Mutations tab's gene choice are segmented tabs in a toolbar row. Every
card renders through ViewHead (title, groups drawn, help, timing, participation). Loading
shows skeletons. The legacy .portal-* rules are removed and the new chrome is Tailwind
(data-tw).

Verified: screenshots of the Oncoprint, Mutations and Survival tabs, the comparison page,
the open query form and a 390px viewport (no horizontal scroll, no console errors);
scripts/gate.sh green, including the Results page's table and lollipop e2e checks.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01TyVfAhLnjshk2kWewGnLum
@alisman @claude
Results page Plots tab: the lab's plot controls, over every queried p…
5a3b708 
…atient

The plot view's settings bar (both axes with log, a box plot's colour and ring, highlight,
unit, swap) moves out of the lab's PlotCard into app/lab/plot-controls.tsx. The lab's card and
the portal pages' plot view now render the same toolbar, and each edit goes into the document,
so a link reproduces it.

The Results page's Plots tab handed the plot [Altered, Unaltered], but a plot draws only its
first cohort, so the tab showed the altered patients alone. As on cBioPortal, it now plots
every queried patient ("All patients"), with Altered highlighted. Its card is titled "Plot",
since a fixed "<gene> copy number vs mRNA" was wrong as soon as an axis changed.

Verified: on brca_tcga KRAS/NRAS/BRAF the tab draws 526 of 1,101 patients with the 33 altered
ones highlighted; switching unit to samples re-ran once (529 of 1,108 samples) and wrote the
document to the URL; the lab's plot card renders unchanged; no page errors; scripts/gate.sh
green.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01TyVfAhLnjshk2kWewGnLum
@alisman @claude
Gene query dialog (prototype), and the Results page's query on Explor…
41a652a 
…e's study list

One dialog for entering genes, meant to become the standard everywhere a page asks for them
(app/_genes/GeneQueryDialog.tsx):
- Search over genes, their aliases and the warehouse's gene sets (a set over 30 genes is
  offered disabled, with the reason).
- The query as text, checked line by line as it is typed: what each entry selects, in words, or
  what is wrong with it. Symbols are checked against the gene and gene_alias tables: an alias
  (p53, HER2, MLL) is caught and replaced in one click; an unknown symbol, unsupported OQL
  (GAIN, HETLOSS, …) or a count outside the place's limits blocks Apply, and Apply's title says
  what it waits for.
- Recent and saved lists in this browser (app/_genes/gene-lists.ts, localStorage), and
  clickable OQL help.
- Two modes: "oql" (each entry a gene and what counts as altered in it) and "genes" (the
  portal's gene list; [A B] merged rows only where the oncoprint can draw them).

Used by:
- The lab's gene views (compare, oncoprint, co-occurrence, co-expression, lollipop) and the
  oncoprint card's genes button, in place of the chip editor (GeneListEditor, removed).
- The Results page's query (app/portal/query-editor.tsx): Explore's study list, single-select,
  beside the gene query. The page now reads ?genes= as OQL as the portal does (genes split by
  spaces or commas; "TP53 KRAS: MUT" is two entries), so old links mean what they did. Each
  entry decides the Altered/Unaltered groups; the page says that the oncoprint and gene tabs
  still draw every alteration of the genes.

Supporting changes:
- lib/oql-parse.ts: the OQL parser alone, browser-safe; lib/oql.ts re-exports it.
- lib/gene-query.ts: the pure line-by-line checker; POST /api/genes (lib/genes.ts) for symbol
  checks, search and gene-set members, reference data only.
- app/_studies/study-list.tsx: Explore's search, capability filters and rows, shared by its
  picker and the Results page; the portal layout gets the lab's query cache.
- e2e: the three checks that drove the chip editor now edit the dialog's text and Apply.

Verified: the dialog on brca_tcga (aliases fixed, FOOBAR1 and GAIN blocked, a list saved,
applied); KRAS: G12C / TP53 / ERBB2: AMP gives 381 altered patients; old comma links render;
Explore's picker unchanged; 9 unit tests; scripts/gate.sh green.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01TyVfAhLnjshk2kWewGnLum
@vercel

vercel Bot commented Oct 20, 2026 •
edited
Loading

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated
cohort-lab Ready Ready Preview Oct 20, 2026 4:13pm UTC

Request Review

@alisman
alisman merged commit 7fcafc4 into master Oct 20, 2026
5 checks passed
@alisman
alisman deleted the session/page branch October 20, 2026 16:38

This branch was successfully deployed

1 active deployment
Preview — 41a652a0 Deployed Oct 20, 2026 by vercel[bot]
View deployment
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

No reviews

Assignees

No one assigned

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

1 participant

@alisman