Adjust page headers and cross-reference sections in all entity pages

[andrewhercules]

To promote consistency with the Genetics Portal -- and more broadly with the Platform -- I have redesigned the header components for the Genetics Portal entity pages.

The redesigned headers reuse much of the existing content already displayed and available from the GraphQL API.

[andrewhercules]

Gene page

Notes:

• [x] Use the FontAwesome dna icon in Open Targets blue #3489ca

• [x] Please remove the existing content and card-based style

• [x] For the cross-references section, please use the following link constructs:

Ensembl: https://identifiers.org/ensembl: + geneInfo.id gnomAD: http://gnomad.broadinstitute.org/gene/ + geneInfo.id GTEx: https://identifiers.org/gtex: + geneInfo.symbol GeneCards: https://identifiers.org/genecards: + geneInfo.symbol

• [x] Beside the location of the gene, please display a link to the locus plot labelled "(view locus)"

• [x] For the link to the Platform, please link to the target profile page using the following https://platform.opentargets.org/target/ + geneInfo.id construct

[andrewhercules]

Variant page

• [x] Use the FontAwesome map-pin icon in Open Targets blue #3489ca

• [x] For the cross-references section, please use the link construct logic found in the existing links to Ensembl (line 56) and gnomAD (line 140)

• [x] Please remove the External References section (lines 53-64)

[andrewhercules]

Study page

• [x] Use the FontAwesome chart-bar icon in Open Targets blue #3489ca

• [x] Please create a new section called "Study summary" that lists the Author (studyInfo.pubAuthor), Year (studyInfo.pubDate formatted to only show the year), Publication (studyInfo.pubJournal), and PubMed (studyInfo.pmid with a link to EuropePMC using the http://europepmc.org/article/MED/ + `studyInfo.pmid link construct). If these fields are not available, please display "N/A"

• For the "Has summary stats" field in the "Study summary" section, display "Yes" if studyInfo.hasSumstats == true, otherwise display "No"

• [x] The "Study size" section can stay as-is

• [x] For the cross-references section, please reuse the logic already used in the StudySummary.js section as it accounts for studies from GWAS Catalog, UK Biobank (NEALE and SAIGE), and FinnGen and shows the correct cross-reference link depending on the studyInfo.studyId field. With the SAIGE link, instead of showing "Homepage", please display the studyInfo.studyId field, formatted to remove the SAIGE_ prefix

Below are sample GraphQL queries for each different study source:

• SAIGE: 740_1
• GWAS Catalog: GCST90012110
• FinnGen: RX_STATIN
• UK Biobank: 23108

[andrewhercules]

Study-locus page

• [x] Use the FontAwesome project-diagram icon in Open Targets blue #3489ca

• [x] In the cross-references section, add two entries:

1. "Study ID:" that shows the studyInfo.studyId value and links to the study page (https://genetics.opentargets.org/study/ + studyInfo.studyId)
2. "Variant ID:" that shows the variantInfo.chromosome + _ + variantInfo.position + _ + variantInfo.refAllele + _ and variantInfo.altAllele (e.g. 2_21041028_GA) and links to the variant page (https://genetics.opentargets.org/variant/ +variantInfo.chromosome + `+variantInfo.position++variantInfo.refAllele+andvariantInfo.altAllele`)

• [x] Reuse the existing "Association summary" section and content, but add a new "Study-variant associations" label to the existing p-value, beta, and beta 95% confidence interval entries

• [x] In a new section called "Study details", use the studyInfo endpoint to display Author (studyInfo.pubAuthor), Year (studyInfo.pubDate formatted to show the year only), and Publication (studyInfo.pubJournal)

• [x] In a new section called "Variant details", using the variantInfo endpoint to display GRCh38 (variantInfo.chromosome:variantInfo.position), GRCh37 (variantInfo.chromosomeB37:variantInfo.positionB37), and RSID (variantInfo.rsId)

• If the variantInfo.rsId is null or blank, display N/A

[d0choa]

Minor things to take into account:

• I like the title in the study-locus page but we should be prepared to have some pressure in the UI in very long trait names, as opposed to the current implementation that contains the variant in a second row.
• Remember the "Association summary" in the study-locus page has some fields that depend on whether it's a quantitative trait (beta) or not (odds ratio). This is an alternative example

[ktsirigos]

work completed