Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fork query experience #2498

Merged
merged 1 commit into from
Jul 16, 2019
Merged

Fork query experience #2498

merged 1 commit into from
Jul 16, 2019

Conversation

alisman
Copy link
Collaborator

@alisman alisman commented Jun 25, 2019

Break homepage experience into two steps: 1. choose study, 2. if query by gene, show query criteria UI
(hidden by default)

This will help users see the study page as a first-class citizen, sibling of results view. Right now, most users submit queries and don't visit study view, suggesting that perhaps they don't know how to navigate to it.

Also, make study chooser height responsive.

image.png

Fixes: cBioPortal/cbioportal#6363

@jjgao jjgao had a problem deploying to cbioportal-frontend-pr-2498 June 25, 2019 21:18 Failure
@jjgao jjgao temporarily deployed to cbioportal-frontend-pr-2498 June 26, 2019 15:00 Inactive
@jjgao jjgao had a problem deploying to cbioportal-frontend-pr-2498 June 28, 2019 18:17 Failure
@jjgao jjgao temporarily deployed to cbioportal-frontend-pr-2498 June 28, 2019 18:33 Inactive
@jjgao jjgao temporarily deployed to cbioportal-frontend-pr-2498 June 28, 2019 19:18 Inactive
@jjgao jjgao temporarily deployed to cbioportal-frontend-pr-2498 June 28, 2019 19:49 Inactive
@jjgao jjgao temporarily deployed to cbioportal-frontend-pr-2498 July 8, 2019 16:42 Inactive
@jjgao jjgao temporarily deployed to cbioportal-frontend-pr-2498 July 9, 2019 19:37 Inactive
@jjgao jjgao had a problem deploying to cbioportal-frontend-pr-2498 July 9, 2019 21:43 Failure
@jjgao jjgao had a problem deploying to cbioportal-frontend-pr-2498 July 9, 2019 22:02 Failure
@jjgao jjgao temporarily deployed to cbioportal-frontend-pr-2498 July 10, 2019 16:46 Inactive
@jjgao jjgao temporarily deployed to cbioportal-frontend-pr-2498 July 11, 2019 16:34 Inactive
@jjgao jjgao temporarily deployed to cbioportal-frontend-pr-2498 July 11, 2019 20:51 Inactive
@jjgao jjgao temporarily deployed to cbioportal-frontend-pr-2498 July 12, 2019 15:25 Inactive
@jjgao jjgao temporarily deployed to cbioportal-frontend-pr-2498 July 12, 2019 18:01 Inactive
@jjgao jjgao temporarily deployed to cbioportal-frontend-pr-2498 July 12, 2019 18:34 Inactive
@jjgao jjgao temporarily deployed to cbioportal-frontend-pr-2498 July 12, 2019 19:07 Inactive
@@ -78,12 +78,22 @@ export default class HomePage extends React.Component<IResultsViewPageProps, {}>

return (
<PageLayout className="homePageLayout" noMargin={true} rightBar={<RightBar queryStore={this.queryStore} />}>
{/*<div className={"headBlock"} dangerouslySetInnerHTML={{__html:AppConfig.serverConfig.skin_blurb!}}></div>*/}
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

i actually have to restore this to support other portals

<div className={"headBlock"} style={{paddingBottom:0}}>

<div className={"citationRule"}>
Please cite: <a href="http://cancerdiscovery.aacrjournals.org/content/2/5/401.abstract" target="_blank">Cerami et al., 2012</a> &amp; <a href="http://www.ncbi.nlm.nih.gov/pubmed/23550210" target="_blank">Gao et al., 2013</a>
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

this will become configurable

);
}
}
import * as React from "react";
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

finally changing newline style from days of Andy windows format

@alisman alisman marked this pull request as ready for review July 12, 2019 19:22
@@ -18,7 +22,7 @@ var searchInputSelector = ".autosuggest input[type=text]";

describe('homepage', function() {

this.retries(2);
this.retries(0);
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

delete line?

waitForNumberOfStudyCheckboxes,
clickModifyStudySelectionButton
} = require('./../specUtils');

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

much better

@adamabeshouse
Copy link
Contributor

adamabeshouse commented Jul 12, 2019

I'm seeing excess space on the bottom in firefox
image

this also causes the unpleasant UI of if you click on "query by gene" when all the way scrolled down, it doesnt scroll you back up when the study section collapses:
image

@adamabeshouse
Copy link
Contributor

the modify query screen should just fill the screen I think, right now it overshoots it

image

@@ -138,6 +138,7 @@ export default class QuerySummary extends React.Component<{ routingStore:Extende
@computed get queryForm(){
return <div style={{margin:"10px -20px 0 -20px"}}>
<QueryAndDownloadTabs onSubmit={this.onSubmit}
forkedExperience={false}
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I find it vague, can you rename this prop, maybe "bigStudyViewButtonMode" or something?

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

What about forkedMode? I actually think "forkedXXX" is more descriptive. It at least hints at the concept behind this mode. If we can come up with a better name than "forked" I'm open to it. I will change to mode because it's better than "experience" for sure.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

sure, that works for me

{/* <Observer>*/}
{/* {() => {*/}
{/* let hasSelection = this.store.selectableSelectedStudyIds.length > 0;*/}

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

still need this code?

{this.store.oqlMessages.map(msg => {
return (
<span className={styles.oqlMessage}>
<i className='fa fa-info-circle' style={{marginRight: 5}}/>
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

some formatting issues here? wouldnt necessarily mention it besides that you're doing a reformat

<a
onClick={() => {
if (numSelectedStudies)
props.store.showSelectedStudiesOnly = !props.store.showSelectedStudiesOnly;
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

a bit hard on the eye in this context, could you put it in brackets even though its just one line?

Copy link
Contributor

@adamabeshouse adamabeshouse left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

looks really cool! see comments in the code and in the PR

@jjgao jjgao temporarily deployed to cbioportal-frontend-pr-2498 July 15, 2019 17:34 Inactive
@jjgao jjgao temporarily deployed to cbioportal-frontend-pr-2498 July 15, 2019 17:38 Inactive
@jjgao jjgao had a problem deploying to cbioportal-frontend-pr-2498 July 15, 2019 18:10 Failure
@jjgao jjgao temporarily deployed to cbioportal-frontend-pr-2498 July 15, 2019 18:19 Inactive
@jjgao jjgao temporarily deployed to cbioportal-frontend-pr-2498 July 15, 2019 18:45 Inactive

}
a {
pointer-events:all !important;
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

👍

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
3 participants