Skip to content

Commit

Permalink
Refactor ResultsViewPage with new URLWrapper
Browse files Browse the repository at this point in the history
  • Loading branch information
@alisman
alisman committed Oct 11, 2019
1 parent 346ed01 commit 1db3f28
Show file tree
Hide file tree
Showing 15 changed files with 547 additions and 389 deletions.
9 changes: 5 additions & 4 deletions .circleci/config.yml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -35,6 +35,7 @@ run_e2e_and_save_artifacts: &run_e2e_and_save_artifacts
(curl --insecure https://localhost:3000 || curl http://localhost:3000) > /dev/null && \
sleep 1s && \
cd end-to-end-test && \
echo "CBIOPORTAL_URL=$CBIOPORTAL_URL"
yarn run e2e
when: always
environment:
Expand Down Expand Up @@ -198,14 +199,14 @@ jobs:
./setup_environment.sh && ./setup_environment.sh >> $BASH_ENV
- run:
name: Generate checksum of data that populates the test database
command: |
command: |
$TEST_HOME/local/runtime-config/db_content_fingerprint.sh > /tmp/db_data_md5key
- restore_cache:
keys:
- v4-e2e-database-files-{{ checksum "/tmp/db_data_md5key" }}
- run:
name: Create MySQL data directory when no cache found
command: |
command: |
mkdir -p $DB_DATA_DIR
- run:
name: Setup docker images and containers
Expand All @@ -219,7 +220,7 @@ jobs:
fi
- run:
name: Change owner of MySQL database files (needed by cache)
command: |
command: |
sudo chmod -R 777 $DB_DATA_DIR && \
sudo chown -R circleci:circleci $DB_DATA_DIR
- save_cache:
Expand All @@ -228,7 +229,7 @@ jobs:
key: v4-e2e-database-files-{{ checksum "/tmp/db_data_md5key" }}
- run:
name: Run end-2-end tests with studies in local database
command: |
command: |
cd $PORTAL_SOURCE_DIR && $TEST_HOME/local/runtime-config/run_container_screenshot_test.sh
- run:
name: "Make sure all screenshots are tracked (otherwise the test will always be successful)"
Expand Down
6 changes: 5 additions & 1 deletion src/pages/home/HomePage.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@ import getBrowserWindow from "../../public-lib/lib/getBrowserWindow";
// tslint:disable-next-line:no-import-side-effect
import "./homePage.scss";
import autobind from "autobind-decorator";
import {ResultsViewTab} from "pages/resultsView/ResultsViewPageHelpers";

(Chart as any).plugins.register({
beforeDraw: function (chartInstance: any) {
Expand Down Expand Up @@ -41,7 +42,10 @@ export function createQueryStore(currentQuery?:any) {
query.cancer_study_list = query.cancer_study_list || query.cancer_study_id;
delete query.cancer_study_id;

win.routingStore.updateRoute(query, "results", true);
const tab = (queryStore.physicalStudyIdsInSelection.length > 1 && queryStore.geneIds.length === 1) ?
ResultsViewTab.CANCER_TYPES_SUMMARY : ResultsViewTab.ONCOPRINT;

win.routingStore.updateRoute(query, `results/${tab}`, true);

};

Expand Down
240 changes: 112 additions & 128 deletions src/pages/resultsView/ResultsViewPage.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -38,117 +38,117 @@ import {
doesQueryHaveCNSegmentData,
} from './ResultsViewPageStoreUtils';
import { AppStore } from '../../AppStore';
import { updateResultsViewQuery } from './ResultsViewQuery';
import { trackQuery } from '../../shared/lib/tracking';
import { onMobxPromise } from '../../shared/lib/onMobxPromise';
import QueryAndDownloadTabs from 'shared/components/query/QueryAndDownloadTabs';
import { createQueryStore } from 'pages/home/HomePage';
import ExtendedRouterStore from 'shared/lib/ExtendedRouterStore';
import { CancerStudyQueryUrlParams } from '../../shared/components/query/QueryStore';
import GeneSymbolValidationError from 'shared/components/query/GeneSymbolValidationError';
import ResultsViewURLWrapper from 'pages/resultsView/ResultsViewURLWrapper';
import setWindowVariable from 'shared/lib/setWindowVariable';

function initStore(appStore: AppStore) {
function initStore(appStore: AppStore, urlWrapper: ResultsViewURLWrapper) {
const resultsViewPageStore = new ResultsViewPageStore(
appStore,
getBrowserWindow().globalStores.routing
getBrowserWindow().globalStores.routing,
urlWrapper
);

resultsViewPageStore.tabId = getTabId(
getBrowserWindow().globalStores.routing.location.pathname
);

let lastQuery: any;
let lastPathname: string;

const queryReactionDisposer = reaction(
reaction(
() => [resultsViewPageStore.studyIds, resultsViewPageStore.oqlText],
() => {
return [
getBrowserWindow().globalStores.routing.query,
getBrowserWindow().globalStores.routing.location.pathname,
];
},
(x: any) => {
const query = x[0] as CancerStudyQueryUrlParams;
const pathname = x[1];

// escape from this if queryies are deeply equal
// TODO: see if we can figure out why query is getting changed and
// if there's any way to do shallow equality check to avoid this expensive operation
const queryChanged = !_.isEqual(lastQuery, query);
const pathnameChanged = pathname !== lastPathname;
if (!queryChanged && !pathnameChanged) {
return;
} else {
if (
!getBrowserWindow().globalStores.routing.location.pathname.includes(
'/results'
)
) {
return;
}
runInAction(() => {
// set query and pathname separately according to which changed, to avoid unnecessary
// recomputation by updating the query if only the pathname changed
if (queryChanged) {
// update query
// normalize cancer_study_list this handles legacy sessions/urls where queries with single study had different param name
const cancer_study_list =
query.cancer_study_list || query.cancer_study_id;

const cancerStudyIds: string[] = cancer_study_list.split(
','
);

const oql = decodeURIComponent(query.gene_list);

let samplesSpecification = parseSamplesSpecifications(
query,
cancerStudyIds
);

const changes = updateResultsViewQuery(
resultsViewPageStore.rvQuery,
query,
samplesSpecification,
cancerStudyIds,
oql
);
if (changes.cohortIdsList) {
resultsViewPageStore.initDriverAnnotationSettings();
}

onMobxPromise(resultsViewPageStore.studyIds, () => {
try {
trackQuery(
resultsViewPageStore.studyIds.result!,
oql,
resultsViewPageStore.hugoGeneSymbols,
resultsViewPageStore.queriedVirtualStudies
.result!.length > 0
);
} catch {}
});

lastQuery = query;
}
if (pathnameChanged) {
// need to set tab like this instead of with injected via params.tab because we need to set the tab
// at the same time as we set the query parameters, otherwise we get race conditions where the tab
// we're on at the time we update the query doesnt get unmounted because we change the query, causing
// MSKTabs unmounting, THEN change the tab.
const tabId = getTabId(pathname);
if (resultsViewPageStore.tabId !== tabId) {
resultsViewPageStore.tabId = tabId;
}
lastPathname = pathname;
}
});
if (resultsViewPageStore.studyIds.isComplete) {
trackQuery(
resultsViewPageStore.studyIds.result!,
resultsViewPageStore.oqlText,
resultsViewPageStore.hugoGeneSymbols,
resultsViewPageStore.queriedVirtualStudies.result!.length >
0
);
}
},
{ fireImmediately: true }
}
);

resultsViewPageStore.queryReactionDisposer = queryReactionDisposer;
// whenever study list changes, reinit driver annotation settings
// const driverAnnotationsReactionDisposer = reaction(
// ()=>urlWrapper.query.cancer_study_list,
// ()=>{
// resultsViewPageStore.initDriverAnnotationSettings();
// },
// { fireImmediately:true }
// );

// let lastQuery:any;
// let lastPathname:string;
//
// const queryReactionDisposer = reaction(
// () => {
// return [getBrowserWindow().globalStores.routing.query, getBrowserWindow().globalStores.routing.location.pathname];
// },
// (x:any) => {
//
// const query = x[0] as CancerStudyQueryUrlParams;
// const pathname = x[1];
//
// // escape from this if queryies are deeply equal
// // TODO: see if we can figure out why query is getting changed and
// // if there's any way to do shallow equality check to avoid this expensive operation
// const queryChanged = !_.isEqual(lastQuery, query);
// const pathnameChanged = (pathname !== lastPathname);
// if (!queryChanged && !pathnameChanged) {
// return;
// } else {
//
// if (!getBrowserWindow().globalStores.routing.location.pathname.includes("/results")) {
// return;
// }
// runInAction(()=>{
// // set query and pathname separately according to which changed, to avoid unnecessary
// // recomputation by updating the query if only the pathname changed
// if (queryChanged) {
// // update query
// // normalize cancer_study_list this handles legacy sessions/urls where queries with single study had different param name
// // const cancer_study_list = query.cancer_study_list || query.cancer_study_id;
// //
// // const cancerStudyIds: string[] = cancer_study_list.split(",");
// //
// // const oql = decodeURIComponent(query.gene_list);
//
// //let samplesSpecification = parseSamplesSpecifications(query, cancerStudyIds);
//
// //const changes = updateResultsViewQuery(resultsViewPageStore.rvQuery, query, [], cancerStudyIds, oql);
//
// console.log("MUST RESTORE INIT DRIVER ANNOTATION SETTINGS");
//
// // if (changes.cohortIdsList) {
// // resultsViewPageStore.initDriverAnnotationSettings();
// // }
//
// // onMobxPromise(resultsViewPageStore.studyIds, ()=>{
// // try {
// // trackQuery(resultsViewPageStore.studyIds.result!, oql, resultsViewPageStore.hugoGeneSymbols, resultsViewPageStore.queriedVirtualStudies.result!.length > 0);
// // } catch {};
// // });
//
// //lastQuery = query;
// }
// // if (pathnameChanged) {
// // // need to set tab like this instead of with injected via params.tab because we need to set the tab
// // // at the same time as we set the query parameters, otherwise we get race conditions where the tab
// // // we're on at the time we update the query doesnt get unmounted because we change the query, causing
// // // MSKTabs unmounting, THEN change the tab.
// // const tabId = getTabId(pathname);
// // if (resultsViewPageStore.tabId !== tabId) {
// // resultsViewPageStore.tabId = tabId;
// // }
// // lastPathname = pathname;
// // }
// });
// }
// },
// {fireImmediately: true}
// );
//
// //resultsViewPageStore.queryReactionDisposer = queryReactionDisposer;

return resultsViewPageStore;
}
Expand All @@ -171,14 +171,20 @@ export default class ResultsViewPage extends React.Component<
> {
private resultsViewPageStore: ResultsViewPageStore;

private urlWrapper: ResultsViewURLWrapper;

@observable showTabs = true;

constructor(props: IResultsViewPageProps) {
super(props);

this.resultsViewPageStore = initStore(props.appStore);
this.urlWrapper = new ResultsViewURLWrapper(props.routing);

getBrowserWindow().resultsViewPageStore = this.resultsViewPageStore;
setWindowVariable('urlWrapper', this.urlWrapper);

this.resultsViewPageStore = initStore(props.appStore, this.urlWrapper);

setWindowVariable('resultsViewPageStore', this.resultsViewPageStore);
}

private handleTabChange(id: string, replace?: boolean) {
Expand All @@ -201,7 +207,7 @@ export default class ResultsViewPage extends React.Component<
}

componentWillUnmount() {
this.resultsViewPageStore.queryReactionDisposer();
this.resultsViewPageStore.destroy();
}

@computed
Expand All @@ -222,7 +228,6 @@ export default class ResultsViewPage extends React.Component<
divId={'oncoprintDiv'}
store={store}
key={store.hugoGeneSymbols.join(',')}
routing={this.props.routing}
addOnBecomeVisibleListener={
addOnBecomeVisibleListener
}
Expand Down Expand Up @@ -438,8 +443,7 @@ export default class ResultsViewPage extends React.Component<
<Network
genes={store.genes.result!}
profileIds={
store.rvQuery
.selectedMolecularProfileIds
store.selectedMolecularProfileIds
}
cancerStudyId={
store.studies.result.length > 0
Expand All @@ -448,7 +452,7 @@ export default class ResultsViewPage extends React.Component<
: ''
}
zScoreThreshold={
store.rvQuery.zScoreThreshold
store.zScoreThreshold
}
caseSetId={
store.sampleLists.result!.length > 0
Expand Down Expand Up @@ -571,25 +575,6 @@ export default class ResultsViewPage extends React.Component<
return isRoutedTo || (!isExcludedInList && !isExcluded);
}

public currentTab(tabId: string | undefined): string {
// if we have no tab defined (query submission, no tab click)
// we need to evaluate which should be the default tab
// this can only be determined by know the count of physical studies in the query
// (for virtual studies we need to fetch data determine constituent physical studies)
if (tabId === undefined) {
if (
this.resultsViewPageStore.studies.result!.length > 1 &&
this.resultsViewPageStore.hugoGeneSymbols.length === 1
) {
return ResultsViewTab.CANCER_TYPES_SUMMARY; // cancer type study
} else {
return ResultsViewTab.ONCOPRINT; // this will resolve to first tab
}
} else {
return tabId;
}
}

@autobind
private getTabHref(tabId: string) {
return URL.format({
Expand Down Expand Up @@ -667,12 +652,11 @@ export default class ResultsViewPage extends React.Component<
!this.resultsViewPageStore.isQueryInvalid && (
<MSKTabs
key={
this.resultsViewPageStore.rvQuery
.hash
this.urlWrapper.hash
}
activeTabId={this.currentTab(
activeTabId={
this.resultsViewPageStore.tabId
)}
}
unmountOnHide={false}
onTabClick={(id: string) =>
this.handleTabChange(id)
Expand All @@ -697,7 +681,7 @@ export default class ResultsViewPage extends React.Component<
) {
setTimeout(() => {
this.handleTabChange(
this.currentTab(this.resultsViewPageStore.tabId),
this.resultsViewPageStore.tabId,
true
);
});
Expand Down
Loading

0 comments on commit 1db3f28

Please sign in to comment.