Unverified Commit afaaebb2 authored by Jyothish's avatar Jyothish Committed by GitHub
Browse files

Genome browser zmenu should use thoas instead of REST (#555)

parent 5bd9d046
Pipeline #193614 passed with stages
in 6 minutes and 42 seconds
......@@ -44,7 +44,6 @@ export type ZmenuProps = ZmenuData & {
const Zmenu = (props: ZmenuProps) => {
const anchorRef = useRefWithRerender<HTMLDivElement>(null);
const onOutsideClick = () =>
browserMessagingService.send('bpane', {
id: props.id,
......
......@@ -15,14 +15,15 @@
*/
import React from 'react';
import { gql, useQuery } from '@apollo/client';
import { Pick2 } from 'ts-multipick';
import useApiService from 'src/shared/hooks/useApiService';
import { parseFeatureId } from '../browserHelper';
import { InstantDownloadTranscript } from 'src/shared/components/instant-download';
import { CircleLoader } from 'src/shared/components/loader/Loader';
import { TranscriptInResponse } from 'src/content/app/entity-viewer/shared/rest/rest-data-fetchers/transcriptData';
import { LoadingState } from 'src/shared/types/loading-state';
import { FullTranscript } from 'src/shared/types/thoas/transcript';
import styles from './Zmenu.scss';
......@@ -30,20 +31,37 @@ type Props = {
id: string;
};
const TRANSCRIPT_QUERY = gql`
query Transcript($genomeId: String!, $transcriptId: String!) {
transcript(byId: { genome_id: $genomeId, stable_id: $transcriptId }) {
metadata {
biotype {
value
}
}
gene {
stable_id
}
}
}
`;
type Transcript = Pick2<FullTranscript, 'metadata', 'biotype'> &
Pick2<FullTranscript, 'gene', 'stable_id'>;
const ZmenuInstantDownload = (props: Props) => {
const genomeId = getGenomeId(props.id);
const transcriptId = getStableId(props.id);
const params = {
endpoint: `/lookup/id/${transcriptId}?content-type=application/json;expand=1`,
host: 'https://rest.ensembl.org'
};
const { loadingState, data, error } =
useApiService<TranscriptInResponse>(params);
const { genomeId, objectId: transcriptId } = parseFeatureId(props.id);
const { data, loading } = useQuery<{
transcript: Transcript;
}>(TRANSCRIPT_QUERY, {
variables: {
genomeId,
transcriptId
}
});
if (
loadingState === LoadingState.NOT_REQUESTED ||
loadingState === LoadingState.LOADING
) {
if (loading) {
return (
<div className={styles.zmenuInstantDowloadLoading}>
<CircleLoader />
......@@ -51,38 +69,27 @@ const ZmenuInstantDownload = (props: Props) => {
);
}
if (error) {
// TODO: decide how we handle errors in this case
if (!data) {
return null;
}
return (
<InstantDownloadTranscript
genomeId={genomeId}
{...preparePayload(data as TranscriptInResponse)}
layout="vertical"
/>
);
};
// TODO: we may want to move this to a common helper file that deals with messaging with Genome Browser
const getGenomeId = (id: string) => id.split(':').shift();
const getStableId = (id: string) => id.split(':').pop();
const preparePayload = (transcript: TranscriptInResponse) => {
const geneId = transcript.Parent;
const transcriptId = transcript.id;
const biotype = transcript.biotype;
return {
const payload = {
transcript: {
id: transcriptId,
biotype
biotype: data.transcript.metadata.biotype.value
},
gene: {
id: geneId
id: data.transcript.gene.stable_id
}
};
return (
<InstantDownloadTranscript
genomeId={genomeId}
{...payload}
layout="vertical"
/>
);
};
export default ZmenuInstantDownload;
......@@ -199,6 +199,7 @@ const TranscriptSection = (props: TranscriptSectionProps) => {
transcriptOptionsOrder,
Object.keys(options)
);
const checkboxes = orderedOptionKeys.map((key) => (
<Checkbox
key={key}
......
......@@ -20,6 +20,7 @@ import { FullProductGeneratingContext } from './productGeneratingContext';
import { LocationWithinRegion } from './location';
import { ExternalReference } from './externalReference';
import { TranscriptMetadata } from './metadata';
import { FullGene } from './gene';
export type FullTranscript = {
type: 'Transcript';
......@@ -33,4 +34,5 @@ export type FullTranscript = {
product_generating_contexts: FullProductGeneratingContext[];
external_references: ExternalReference[];
metadata: TranscriptMetadata;
gene: FullGene;
};
......@@ -19,14 +19,20 @@ import times from 'lodash/times';
import { scaleLinear } from 'd3';
import { createSlice } from './slice';
import { createTranscript } from './transcript';
import { createTranscript, ProteinCodingTranscript } from './transcript';
import { FullGene } from 'src/shared/types/thoas/gene';
import { TicksAndScale } from 'src/content/app/entity-viewer/gene-view/components/base-pairs-ruler/BasePairsRuler';
export const createGene = (fragment: Partial<FullGene> = {}): FullGene => {
type GeneFixture = Omit<FullGene, 'transcripts'> & {
transcripts: ProteinCodingTranscript[];
};
export const createGene = (
fragment: Partial<GeneFixture> = {}
): GeneFixture => {
const geneSlice = createSlice();
const transcript = createTranscript();
const transcripts = fragment.transcripts || [createTranscript()];
const unversionedStableId = faker.datatype.uuid();
const version = 1;
......@@ -40,7 +46,7 @@ export const createGene = (fragment: Partial<FullGene> = {}): FullGene => {
symbol: faker.lorem.word(),
name: faker.lorem.words(),
slice: geneSlice,
transcripts: [transcript],
transcripts,
alternative_symbols: [],
external_references: [],
metadata: {
......
......@@ -37,8 +37,8 @@ type ProteinCodingProductGeneratingContext = Omit<
'cds'
> & { cds: FullCDS };
type ProteinCodingTranscript = Omit<
FullTranscript,
export type ProteinCodingTranscript = Omit<
Omit<FullTranscript, 'gene'>,
'product_generating_contexts'
> & {
product_generating_contexts: ProteinCodingProductGeneratingContext[];
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment