Icon Dataset Linkouts for Gene and Variant annotations within the header

[SeriousHorncat]

First Check

• I added a very descriptive title to this issue.
• Check that there isn't already an proposed enhancement that accomplishes the same thing.
• Follow our Code of Conduct
• Read the Contributing Guidelines.

Description

As a user, I would like linkouts to the Decipher, Geno2MP, and SMART to have easy access to deep dive into those datasets for insight into the genes and variants.

• Update the Genomic Unit Annotation Configuration that is in the database to create linkout annotations for each of the datasets.

  • Once the fixtures have been updated in etc/fixtures/initial-seed/annotations-config.json, if you are not doing a clean deploy, the collection in the MongoDB database needs to be updated. I created a shell script alias locally to run the command easily

  seed_db () {
    docker compose exec rosalution-db  mongosh /tmp/fixtures/seed.js
  }

  • To update the existing annotations in the test database for a deploying Rosalution, a script needs to be run using the API auth credentials. These crednetials can get generated from the user's account page after logging in. The account page can be accessed by clicking the username in the top right of the header. Then you can run the bash shell script /etc/api/annotate-all-existing-analyses.sh with client id and secret.

• Update the Annotation Rendering Configuration to include IconLinkoutDatasets within the frontend (this is hardcoded, and will be migrated to the MongoDB database really soon)

  • This will require you locating and saving the Dataset's Logo as an image in the frontend/src/assets directory. We have used svg's or png's for these.

Suggested Solution below will have instructions on how to implement this.

Suggested solution

Genomic Unit Annotation Configuration

A new entry in JSON with the following schema in this file etc/fixtures/initial-seed/annotations-config.json

Example

{
  "data_set": "Decipher_Gene_url",
  "data_source": "Rosalution",
  "genomic_unit_type": "gene",
  "annotation_source_type": "forge", 
  "base_string": "https://www.deciphergenomics.org/gene/{gene}/overview/clinical-info",
  "attribute": "{ \"Decipher_Gene_url\": .Decipher_Gene_url }"
}

data_set: the name that the dataset is identified in rosalution, this will also be used to match what is in the Annotation Rendering Configuration for the frontend and within the "attribute" field below when forming the JSON for the annotation to be saved.

data_source: where the dataset is sourced from, for the linkout datasets, these are generated within Rosalution, so will say Rosalution.

genomic_unit_type: Either "hgvs_variant" or "gene" right now.
Note: We are only annotating variants that are using the HGVS nomenclature and with a RefSeq transcript.

base_string: The base string that will be used as a base to replace the notated items to create the new string.

attribute: The jq query that will be used to extract the data from the REST API call JSON returned, sometimes there needs to be some filtering and restructuring and the final part of the jq query is forming it to save into the resulting annotation entry for the genomic unit.

** data_set**	data_source	genomic_unit_type	annotation_source_type	base_string	attribute	****
Decipher_Gene_url	Rosalution	gene	forge	https://www.deciphergenomics.org/gene/{gene}/overview/clinical-info	{"Decipher_Gene_url": .Decipher_Gene_url}
Geno2MP_Gene_url	Rosalution	gene	forge	https://geno2mp.gs.washington.edu/Geno2MP/#/gene/{gene}/gene/0/0/0	{"Geno2MP_Gene_url": .Geno2MP_Gene_url}
UniProt_SwissProt_Gene_url	Rosalution	gene	forge	https://www.uniprot.org/uniprotkb/{gene}_HUMAN/entry	{"UniProt_SwissProt_Gene_url": .UniProt_SwissProt_Gene_url}
SMART_Gene_url	Rosalution	gene	forge	https://smart.embl.de/smart/show_motifs.pl?ID={gene}_HUMAN	{"SMART_Gene_url": .SMART_Gene_url}
Decipher_variant_clinical_info_url	Rosalution	hgvs_variant	forge	https://www.deciphergenomics.org/search?q={hgvs_variant}	{"Decipher_variant_clinical_info_url": .Decipher_variant_clinical_info_url}

Annotation Rendering Configuration

Two Steps

1. Update the annotation rendering configuration in the frontend/src/models/analyses.js in the frontend service.
2. Save the logo image in the following frontend directory ./frontend/src/assets , you will see lots of other examples in there

Rendering Configuration example for an individual IconLinkoutDataset

{
  "dataset": "gnomAD_gene_url",
  "type": "icon-linkout-dataset",
  "props": {
    "imageFilename": "gnomad-logo.png",
    "altText": "Genome Aggregation Database (gnomAD) from Broad Institute"
}

dataset: this will directly map to the annotation saved for that genomic unit in the database, it will be the value that was indicated in the "data_set" name
type:the name of the VueJS component that will be rendered
props: the VueJS props that will be passed into the component, these will change according to the type of component.
For the icon linkout datasets props
imageFilename: The name of the logo of the icon within the ./frontend/src/assets directory
altText: the alternate text image that can be used for accessibility readers or if images are not loading

New Icons in the section with the header 'gene'

• Ordering in the configuration (ClinGen, NCBI, gnomAD, Decipher(new), Geno2MP(new), UniProt(new), SMART(new))

Datasets:

• Decipher_Gene_url
• Geno2MP_Gene_url
• UniProt_SwissProt_Gene_url
• SMART_SwissProt_Gene_url

New Icons in the section with the header 'variant'

• Ordering in the configuration (Decipher (new))

Datasets

• Decipher_variant_clinical_info_url

Alternative

No response

Additional context

No response

Code of Conduct

• I agree to follow this project's Code of Conduct