Don't show highlight/alignment if exact match

GMOD · Jul 12, 2024 · 8856770 · 8856770
1 parent 1534717
commit 8856770
Show file tree

Hide file tree

Showing 6 changed files with 236 additions and 172 deletions.
diff --git a/package.json b/package.json
@@ -28,7 +28,7 @@
     "pako": "^2.1.0"
   },
   "devDependencies": {
-    "@eslint/compat": "^1.1.0",
+    "@eslint/compat": "^1.1.1",
     "@fal-works/esbuild-plugin-global-externals": "^2.1.2",
     "@jbrowse/core": "^2.0.0",
     "@jbrowse/plugin-linear-genome-view": "^2.4.2",

diff --git a/src/LaunchProteinView/components/AlphaFoldDBSearch.tsx b/src/LaunchProteinView/components/AlphaFoldDBSearch.tsx
@@ -63,7 +63,7 @@ const AlphaFoldDBSearch = observer(function ({
     feature,
     view,
   })
-  const protein = isoformSequences?.[userSelection ?? '']
+  const userSelectedProteinSequence = isoformSequences?.[userSelection ?? '']
   const {
     uniprotId,
     isLoading: isMyGeneLoading,
@@ -116,6 +116,20 @@ const AlphaFoldDBSearch = observer(function ({
             variant="h6"
             message="Looking up UniProt ID from mygene.info"
           />
+        ) : !uniprotId ? (
+          <div>
+            UniProt ID not found. Search sequence on AlphaFoldDB{' '}
+            <a
+              href={`https://alphafold.ebi.ac.uk/search/sequence/${userSelectedProteinSequence?.seq.replaceAll('*', '')}`}
+              target="_blank"
+              rel="noreferrer"
+            >
+              here
+            </a>{' '}
+            <br />
+            After visiting the above link, then paste the structure URL into the
+            Manual tab
+          </div>
         ) : null}
         {isIsoformProteinSequencesLoading ? (
           <LoadingEllipses
@@ -153,14 +167,15 @@ const AlphaFoldDBSearch = observer(function ({
         <Button
           variant="contained"
           color="primary"
-          disabled={!uniprotId || !protein || !selectedTranscript}
+          disabled={
+            !uniprotId || !userSelectedProteinSequence || !selectedTranscript
+          }
           onClick={() => {
             session.addView('ProteinView', {
               type: 'ProteinView',
               url,
-              seq2: protein?.seq,
+              seq2: userSelectedProteinSequence?.seq,
               feature: selectedTranscript?.toJSON(),
-              completeMatch:
               connectedViewId: view.id,
               displayName: `Protein view ${getGeneDisplayName(feature)} - ${getTranscriptDisplayName(selectedTranscript)}`,
             })

diff --git a/src/LaunchProteinView/index.ts b/src/LaunchProteinView/index.ts
@@ -26,7 +26,7 @@ function extendStateModel(stateModel: IAnyModelType) {
           ...(feature
             ? [
                 {
-                  label: 'Launch protein view',
+                  label: 'Launch 3-D protein view',
                   icon: AddIcon,
                   onClick: () => {
                     getSession(track).queueDialog(handleClose => [

diff --git a/src/ProteinView/components/Header.tsx b/src/ProteinView/components/Header.tsx
@@ -20,11 +20,13 @@ const ProteinViewHeader = observer(function ({
   return (
     <div>
       <InformativeHeaderArea model={model} />
-      {showAlignment && alignment ? (
-        <ProteinAlignment model={model} />
-      ) : (
-        <LoadingEllipses message="Loading pairwise alignment" />
-      )}
+      {showAlignment ? (
+        alignment ? (
+          <ProteinAlignment model={model} />
+        ) : (
+          <LoadingEllipses message="Loading pairwise alignment" />
+        )
+      ) : null}
     </div>
   )
 })

diff --git a/src/ProteinView/model.ts b/src/ProteinView/model.ts
@@ -93,15 +93,15 @@ function stateModelFactory() {
         /**
          * #property
          */
-        showHighlight: true,
+        showHighlight: false,
         /**
          * #property
          */
-        zoomToBaseLevel: false,
+        zoomToBaseLevel: true,
         /**
          * #property
          */
-        showAlignment: true,
+        showAlignment: false,
       }),
     )
     .volatile(() => ({
@@ -317,6 +317,12 @@ function stateModelFactory() {
       get structureSeqHoverPos(): number | undefined {
         return self.hoverPosition?.structureSeqPos
       },
+
+      get exactMatch() {
+        const r1 = self.seq1?.replaceAll('*', '')
+        const r2 = self.seq2?.replaceAll('*', '')
+        return r1 === r2
+      },
     }))
     .actions(self => ({
       afterAttach() {
@@ -325,20 +331,24 @@ function stateModelFactory() {
           self,
           autorun(async () => {
             try {
-              const { seq1, seq2 } = self
+              const { seq1, seq2, exactMatch } = self
               if (!!self.alignment || !seq1 || !seq2) {
                 return
               }
               const r1 = seq1.replaceAll('*', '')
               const r2 = seq2.replaceAll('*', '')
-              if (r1 !== r2) {
+              if (!exactMatch) {
                 const alignment = await launchPairwiseAlignment({
                   seq1: r1,
                   seq2: r2,
                   algorithm: 'emboss_needle',
                   onProgress: arg => self.setProgress(arg),
                 })
                 self.setAlignment(alignment.alignment)
+
+                // showHighlight when we are
+                self.setShowHighlight(true)
+                self.setShowAlignment(true)
               } else {
                 let consensus = ''
                 // eslint-disable-next-line @typescript-eslint/prefer-for-of