Skip to content

Commit cc25a21

Browse files
committed
Updates
1 parent 6c5da58 commit cc25a21

14 files changed

Lines changed: 361 additions & 276 deletions

package.json

Lines changed: 9 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -32,7 +32,8 @@
3232
"postversion": "git push --follow-tags"
3333
},
3434
"dependencies": {
35-
"@jbrowse/plugin-linear-genome-view": "^4.1.1",
35+
"@jbrowse/app-core": "^4.1.3",
36+
"@jbrowse/plugin-linear-genome-view": "^4.1.3",
3637
"@mui/icons-material": "^7.0.1",
3738
"clustal-js": "^2.0.11",
3839
"g2p_mapper": "^2.0.0",
@@ -44,12 +45,12 @@
4445
"@eslint/compat": "^2.0.0",
4546
"@eslint/js": "^9.39.2",
4647
"@fal-works/esbuild-plugin-global-externals": "^2.1.2",
47-
"@jbrowse/core": "^4.1.1",
48+
"@jbrowse/core": "^4.1.3",
4849
"@jbrowse/mobx-state-tree": "^5.4.2",
4950
"@mui/material": "^7.0.1",
5051
"@mui/system": "^7.0.1",
51-
"@types/node": "^24.10.1",
52-
"@types/react": "^19.2.9",
52+
"@types/node": "^25.1.0",
53+
"@types/react": "^19.2.10",
5354
"esbuild": "^0.27.0",
5455
"eslint": "^9.0.0",
5556
"eslint-plugin-import": "^2.31.0",
@@ -61,15 +62,15 @@
6162
"mobx-react": "^9.0.1",
6263
"prettier": "^3.8.1",
6364
"pretty-bytes": "^7.0.0",
64-
"puppeteer": "^24.36.0",
65-
"react": "^19.0.0",
66-
"react-dom": "^19.0.0",
65+
"puppeteer": "^24.36.1",
66+
"react": "^19.2.4",
67+
"react-dom": "^19.2.4",
6768
"rimraf": "^6.1.2",
6869
"rxjs": "^7.0.0",
6970
"serve": "^14.2.5",
7071
"tss-react": "^4.9.4",
7172
"typescript": "^5.3.3",
72-
"typescript-eslint": "^8.53.1",
73+
"typescript-eslint": "^8.54.0",
7374
"vitest": "^4.0.18"
7475
},
7576
"author": "Colin <colin.diesh@gmail.com>",

src/LaunchProteinView/components/AlphaFoldDBSearch.tsx

Lines changed: 10 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -72,17 +72,18 @@ const AlphaFoldDBSearch = observer(function AlphaFoldDBSearch({
7272
hasProteinSequence={!!state.userSelectedProteinSequence?.seq}
7373
sequenceSearchType={state.sequenceSearchType}
7474
onSequenceSearchTypeChange={state.setSequenceSearchType}
75+
endContent={
76+
state.showIdentifierSelector ? (
77+
<IdentifierSelector
78+
recognizedIds={state.recognizedIds}
79+
geneName={state.geneName}
80+
selectedId={state.selectedQueryId}
81+
onSelectedIdChange={state.setSelectedQueryId}
82+
/>
83+
) : null
84+
}
7585
/>
7686

77-
{state.showIdentifierSelector && (
78-
<IdentifierSelector
79-
recognizedIds={state.recognizedIds}
80-
geneName={state.geneName}
81-
selectedId={state.selectedQueryId}
82-
onSelectedIdChange={state.setSelectedQueryId}
83-
/>
84-
)}
85-
8687
{state.loadingStatuses.map(status => (
8788
<LoadingEllipses key={status} variant="subtitle2" message={status} />
8889
))}

src/LaunchProteinView/components/ProteinViewActions.tsx

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -56,7 +56,6 @@ export default function ProteinViewActions({
5656
sequencesMatch,
5757
}: ProteinViewActionsProps) {
5858
const [dialogOpen, setDialogOpen] = useState(false)
59-
6059
const isLaunchDisabled =
6160
!uniprotId || !userSelectedProteinSequence || !selectedTranscript
6261

@@ -75,6 +74,7 @@ export default function ProteinViewActions({
7574
userProvidedTranscriptSequence: userSelectedProteinSequence?.seq,
7675
alignmentAlgorithm,
7776
})
77+
7878
handleClose()
7979
}
8080

@@ -111,6 +111,7 @@ export default function ProteinViewActions({
111111
selectedTranscript,
112112
uniprotId,
113113
})
114+
114115
handleClose()
115116
}
116117

@@ -129,6 +130,7 @@ export default function ProteinViewActions({
129130
userProvidedTranscriptSequence: userSelectedProteinSequence?.seq,
130131
alignmentAlgorithm,
131132
})
133+
132134
handleClose()
133135
}
134136

src/LaunchProteinView/components/UniProtIdInput.tsx

Lines changed: 33 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,7 @@ interface UniProtIdInputProps {
2424
hasProteinSequence?: boolean
2525
sequenceSearchType?: SequenceSearchType
2626
onSequenceSearchTypeChange?: (type: SequenceSearchType) => void
27+
endContent?: React.ReactNode
2728
}
2829

2930
/**
@@ -38,43 +39,47 @@ export default function UniProtIdInput({
3839
hasProteinSequence,
3940
sequenceSearchType,
4041
onSequenceSearchTypeChange,
42+
endContent,
4143
}: UniProtIdInputProps) {
4244
return (
4345
<>
44-
<FormControl component="fieldset">
45-
<RadioGroup
46-
row
47-
value={lookupMode}
48-
onChange={event => {
49-
onLookupModeChange(event.target.value as LookupMode)
50-
}}
51-
>
52-
{featureUniprotId && (
46+
<div style={{ display: 'flex', alignItems: 'center', flexWrap: 'wrap' }}>
47+
<FormControl component="fieldset">
48+
<RadioGroup
49+
row
50+
value={lookupMode}
51+
onChange={event => {
52+
onLookupModeChange(event.target.value as LookupMode)
53+
}}
54+
>
55+
{featureUniprotId && (
56+
<FormControlLabel
57+
value="feature"
58+
control={<Radio />}
59+
label={`From feature (${featureUniprotId})`}
60+
/>
61+
)}
5362
<FormControlLabel
54-
value="feature"
63+
value="auto"
5564
control={<Radio />}
56-
label={`From feature (${featureUniprotId})`}
65+
label="Auto-detect using UniProt ID mapping API"
5766
/>
58-
)}
59-
<FormControlLabel
60-
value="auto"
61-
control={<Radio />}
62-
label="Auto-detect using UniProt ID mapping API"
63-
/>
64-
<FormControlLabel
65-
value="manual"
66-
control={<Radio />}
67-
label="Enter manually"
68-
/>
69-
{hasProteinSequence && (
7067
<FormControlLabel
71-
value="sequence"
68+
value="manual"
7269
control={<Radio />}
73-
label="Search sequence against AlphaFoldDB API"
70+
label="Enter manually"
7471
/>
75-
)}
76-
</RadioGroup>
77-
</FormControl>
72+
{hasProteinSequence && (
73+
<FormControlLabel
74+
value="sequence"
75+
control={<Radio />}
76+
label="Search sequence against AlphaFoldDB API"
77+
/>
78+
)}
79+
</RadioGroup>
80+
</FormControl>
81+
{endContent}
82+
</div>
7883

7984
{lookupMode === 'manual' && (
8085
<div>

src/LaunchProteinView/utils/launchViewUtils.ts

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -97,7 +97,7 @@ export function launch3DProteinView({
9797
alignmentAlgorithm?: string
9898
displayName?: string
9999
}) {
100-
session.addView('ProteinView', {
100+
return session.addView('ProteinView', {
101101
type: 'ProteinView',
102102
isFloating: true,
103103
alignmentAlgorithm,
@@ -154,10 +154,10 @@ export function launchMsaView({
154154
uniprotId,
155155
}: LaunchViewParams) {
156156
if (!uniprotId) {
157-
return
157+
return undefined
158158
}
159159
const msaUrl = getAlphaFoldMsaUrl(uniprotId)
160-
session.addView('MsaView', {
160+
return session.addView('MsaView', {
161161
type: 'MsaView',
162162
displayName: [
163163
...new Set([
@@ -199,7 +199,7 @@ export function launch3DProteinViewWithMsa({
199199
displayName?: string
200200
}) {
201201
if (!uniprotId) {
202-
return
202+
return undefined
203203
}
204204

205205
const msaUrl = getAlphaFoldMsaUrl(uniprotId)
@@ -224,7 +224,7 @@ export function launch3DProteinViewWithMsa({
224224
})
225225

226226
// Launch 3D protein view with reference to MSA view
227-
session.addView('ProteinView', {
227+
return session.addView('ProteinView', {
228228
type: 'ProteinView',
229229
isFloating: true,
230230
alignmentAlgorithm,

src/ProteinView/components/ProteinAlignment.tsx

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ import {
1212
ProteinFeatureTrackContent,
1313
ProteinFeatureTrackLabels,
1414
} from './ProteinFeatureTrack'
15-
import SplitString from './SplitString'
15+
import SplitString, { AlignmentHighlights } from './SplitString'
1616

1717
const ProteinAlignment = observer(function ProteinAlignment({
1818
model,
@@ -151,7 +151,15 @@ const ProteinAlignment = observer(function ProteinAlignment({
151151
backgroundColor: 'white',
152152
}}
153153
>
154-
<div onMouseLeave={handleContainerMouseLeave}>
154+
<div
155+
onMouseLeave={handleContainerMouseLeave}
156+
style={{ position: 'relative' }}
157+
>
158+
<AlignmentHighlights
159+
model={model}
160+
strLength={a0.length}
161+
height={ROW_HEIGHT * 3}
162+
/>
155163
<div style={{ height: ROW_HEIGHT }}>
156164
<SplitString model={model} str={a0} />
157165
</div>

0 commit comments

Comments
 (0)