prepopulate geneset with genes from modal

client/src/components/categorical/annoDialog.js

@@ -18,6 +18,8 @@ class AnnoDialog extends React.PureComponent {
       validationError,
       annoSelect,
       annoInput,
+      secondaryInstructions,
+      secondaryInput,
       handleCancel,
       handleSubmit,
       primaryButtonText,
@@ -46,6 +48,10 @@ class AnnoDialog extends React.PureComponent {
               >
                 {errorMessage}
               </p>
+              <p style={{ marginTop: secondaryInstructions ? 20 : 0 }}>
+                {secondaryInstructions || null}
+              </p>
+              {secondaryInput || null}
             </div>
             {annoSelect || null}
           </div>

client/src/components/geneExpression/gene.js

@@ -74,6 +74,7 @@ class Gene extends React.Component {
       isColorAccessor,
       isScatterplotXXaccessor,
       isScatterplotYYaccessor,
+      isDiffexp,
     } = this.props;
     const { geneIsExpanded } = this.state;
     return (
@@ -127,15 +128,17 @@ class Gene extends React.Component {
             ) : null}
           </span>
           <span>
-            <AnchorButton
+            {!isDiffexp ? (
-              minimal
+              <AnchorButton
-              small
+                minimal
-              data-testid={`delete-from-geneset-${gene}`}
+                small
-              onClick={this.handleDeleteGeneFromSet}
+                data-testid={`delete-from-geneset-${gene}`}
-              intent="danger"
+                onClick={this.handleDeleteGeneFromSet}
-              style={{ fontWeight: 700, marginRight: 2 }}
+                intent="danger"
-              icon={<Icon icon="trash" iconSize={10} />}
+                style={{ fontWeight: 700, marginRight: 2 }}
-            />
+                icon={<Icon icon="trash" iconSize={10} />}
+              />
+            ) : null}
             <AnchorButton
               minimal
               small

client/src/components/geneExpression/geneSet.js

@@ -102,7 +102,7 @@ class GeneSet extends React.Component {
   };
 
   render() {
-    const { setName, setGenes } = this.props;
+    const { setName, setGenes, isDiffexp } = this.props;
     const { isOpen, toggleSummaryHisto } = this.state;
     return (
       <div style={{ marginBottom: 3 }}>
@@ -181,7 +181,14 @@ class GeneSet extends React.Component {
 
         {isOpen && !toggleSummaryHisto
           ? _.map(setGenes, (gene) => {
-              return <Gene key={gene} gene={gene} geneset={setName} />;
+              return (
+                <Gene
+                  key={gene}
+                  gene={gene}
+                  geneset={setName}
+                  isDiffexp={isDiffexp}
+                />
+              );
             })
           : null}
       </div>

client/src/components/geneExpression/index.js

@@ -39,6 +39,7 @@ class GeneExpression extends React.Component {
       <GeneSet
         key="Temp DiffExp Set"
         setGenes={setGenes}
+        isDiffexp
         setName="Temp DiffExp Set"
       />
     ) : null;

client/src/components/geneExpression/menus/addGeneToGenesetDialogue.js

@@ -1,4 +1,5 @@
 import React from "react";
+import _ from "lodash";
 import { connect } from "react-redux";
 import AnnoDialog from "../../categorical/annoDialog";
 import LabelInput from "../../categorical/labelInput";
@@ -27,7 +28,7 @@ class AddGeneToGenesetDialogue extends React.PureComponent {
     dispatch({
       type: "geneset: add genes",
       name: geneset,
-      genes: genesToAdd.split(","),
+      genes: _.pull(_.uniq(genesToAdd.split(/[ ,]+/)), ""),
     });
     dispatch({
       type: "geneset: disable add new genes mode",

client/src/components/geneExpression/menus/createGenesetDialogue.js

@@ -1,3 +1,4 @@
+import _ from "lodash";
 import React from "react";
 import { connect } from "react-redux";
 import AnnoDialog from "../../categorical/annoDialog";
@@ -24,6 +25,7 @@ class CreateGenesetDialogue extends React.PureComponent {
     const { dispatch } = this.props;
     this.setState({
       genesetName: "",
+      genesToPopulateGeneset: "",
     });
     dispatch({
       type: "geneset: disable create geneset mode",
@@ -33,9 +35,13 @@ class CreateGenesetDialogue extends React.PureComponent {
 
   createGeneset = (e) => {
     const { dispatch } = this.props;
-    const { genesetName } = this.state;
+    const { genesetName, genesToPopulateGeneset } = this.state;
 
-    dispatch({ type: "geneset: create", name: genesetName });
+    dispatch({
+      type: "geneset: create",
+      name: genesetName,
+      genes: _.pull(_.uniq(genesToPopulateGeneset.split(/[ ,]+/)), "") || null,
+    });
     dispatch({
       type: "geneset: disable create geneset mode",
     });
@@ -51,6 +57,10 @@ class CreateGenesetDialogue extends React.PureComponent {
     this.setState({ genesetName: e });
   };
 
+  handleGenesetInputChange = (e) => {
+    this.setState({ genesToPopulateGeneset: e });
+  };
+
   instruction = () => {
     return "New, unique geneset";
     /* todo genesets */
@@ -80,7 +90,7 @@ class CreateGenesetDialogue extends React.PureComponent {
             <LabelInput
               onChange={this.handleChange}
               inputProps={{
-                "data-testid": "add-genes",
+                "data-testid": "create-geneset-modal",
                 leftIcon: "manually-entered-data",
                 intent: "none",
                 autoFocus: true,
@@ -88,6 +98,18 @@ class CreateGenesetDialogue extends React.PureComponent {
               newLabelMessage="New geneset"
             />
           }
+          secondaryInstructions="Optionally add a list of comma separated genes to populate the geneset"
+          secondaryInput={
+            <LabelInput
+              onChange={this.handleGenesetInputChange}
+              inputProps={{
+                "data-testid": "add-genes",
+                intent: "none",
+                autoFocus: false,
+              }}
+              newLabelMessage="populate geneset with genes"
+            />
+          }
           handleSubmit={this.createGeneset}
           handleCancel={this.disableCreateGenesetMode}
         />