Commit b522e4ba authored by Imran Salam's avatar Imran Salam
Browse files

hide chr region in genome selector and also hide main tracks when user inputs only chr

parent 2175ab83
......@@ -32,6 +32,7 @@ const BrowserGenomeSelector: FunctionComponent<BrowserGenomeSelectorProps> = (
const [chrLocationInput, setChrLocationInput] = useState('');
const [chrCode, chrStart, chrEnd] = props.defaultChrLocation;
const displayChrRegion = chrStart === 0 && chrEnd === 0 ? false : true;
useEffect(() => {
setChrLocationPlaceholder(chrLocationStr);
......@@ -116,11 +117,13 @@ const BrowserGenomeSelector: FunctionComponent<BrowserGenomeSelectorProps> = (
) : (
<div className={styles.chrLocationView} onClick={activateForm}>
<div className={styles.chrCode}>{chrCode}</div>
<div className={styles.chrRegion}>
<span>{chrStart}</span>
<span className={styles.chrSeparator}> - </span>
<span>{chrEnd}</span>
</div>
{displayChrRegion ? (
<div className={styles.chrRegion}>
<span>{chrStart}</span>
<span className={styles.chrSeparator}> - </span>
<span>{chrEnd}</span>
</div>
) : null}
</div>
)}
</dd>
......
......@@ -30,9 +30,10 @@ import {
getSelectedBrowserTab,
getTrackCategories,
getObjectInfo,
getExampleObjects
getExampleObjects,
getDefaultChrLocation
} from '../browserSelectors';
import { ChrLocation } from '../browserState';
import { getLaunchbarExpanded } from 'src/header/headerSelectors';
import { getBreakpointWidth } from 'src/globalSelectors';
import { BreakpointWidth } from 'src/globalConfig';
......@@ -43,6 +44,7 @@ import styles from './TrackPanel.scss';
type StateProps = {
breakpointWidth: BreakpointWidth;
browserActivated: boolean;
defaultChrLocation: ChrLocation;
drawerOpened: boolean;
drawerView: string;
exampleObjects: any;
......@@ -99,6 +101,7 @@ const TrackPanel: FunctionComponent<TrackPanelProps> = (
<Fragment>
<TrackPanelList
browserRef={props.browserRef}
defaultChrLocation={props.defaultChrLocation}
drawerOpened={props.drawerOpened}
drawerView={props.drawerView}
launchbarExpanded={props.launchbarExpanded}
......@@ -127,6 +130,7 @@ const TrackPanel: FunctionComponent<TrackPanelProps> = (
const mapStateToProps = (state: RootState): StateProps => ({
breakpointWidth: getBreakpointWidth(state),
browserActivated: getBrowserActivated(state),
defaultChrLocation: getDefaultChrLocation(state),
drawerOpened: getDrawerOpened(state),
drawerView: getDrawerView(state),
exampleObjects: getExampleObjects(state),
......
......@@ -7,16 +7,19 @@ import React, {
} from 'react';
import TrackPanelListItem from './TrackPanelListItem';
import {
TrackPanelCategory,
TrackPanelItem,
TrackType
} from '../trackPanelConfig';
import { ChrLocation } from '../../browserState';
import styles from './TrackPanelList.scss';
type TrackPanelListProps = {
browserRef: RefObject<HTMLDivElement>;
defaultChrLocation: ChrLocation;
drawerOpened: boolean;
drawerView: string;
launchbarExpanded: boolean;
......@@ -64,8 +67,13 @@ const TrackPanelList: FunctionComponent<TrackPanelListProps> = (
return `${styles.trackPanelList} ${heightClass}`;
};
const getMainTracks = () => {
const { objectInfo } = props;
const getMainTracks = (): TrackPanelItem | null => {
const { defaultChrLocation, objectInfo } = props;
const [, chrStart, chrEnd] = defaultChrLocation;
if (chrStart === 0 && chrEnd === 0) {
return null;
}
let geneLabel = objectInfo.obj_symbol;
let transcriptLabel = objectInfo.associated_object.stable_id;
......@@ -93,21 +101,27 @@ const TrackPanelList: FunctionComponent<TrackPanelListProps> = (
};
};
const getTrackListItem = (track: TrackPanelItem) => (
<TrackPanelListItem
browserRef={props.browserRef}
drawerOpened={props.drawerOpened}
drawerView={props.drawerView}
key={track.id}
track={track}
updateDrawerView={changeDrawerView}
>
{track.childTrackList &&
track.childTrackList.map((childTrack: TrackPanelItem) =>
getTrackListItem(childTrack)
)}
</TrackPanelListItem>
);
const getTrackListItem = (track: TrackPanelItem | null) => {
if (!track) {
return;
}
return (
<TrackPanelListItem
browserRef={props.browserRef}
drawerOpened={props.drawerOpened}
drawerView={props.drawerView}
key={track.id}
track={track}
updateDrawerView={changeDrawerView}
>
{track.childTrackList &&
track.childTrackList.map((childTrack: TrackPanelItem) =>
getTrackListItem(childTrack)
)}
</TrackPanelListItem>
);
};
return (
<div className={getTrackPanelListClasses()}>
......
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