Gene sets UI, right sidebar refactor (#2097)

* prototyping

* render histos on open gene set

* prototyping

* render histos on open gene set

* factor out add genes to own component

* remove unused import

* mock reducer

* color by geneset stub

* menus and buttons

* geneset dialogue stub

* remove heatmap mock

* componetize histogram

* reenable add genes

* re-add isuserdefined

* test data

* remove have fetched

* add isExpanded state to gene, and pass to histogram

* expand button

* toggleable

* mini

* bump number of genes to 50

* don't clear diffexp on subset

* move create category to top

* render diffexp as geneset

* geneset show mean expression

* gene set reducer

* add geneset UI reducer

* wire e2e gene set loading prototype

* fix sniffing bug

* fix typo

* add gene modals

* client/src/actions/

* add autosave

* rename data-dir cli param

* add geneset, add gene, delete set

* prototype: remove csv upload placeholder

* handle delete gene from set

* prepopulate geneset with genes from modal

* add geneset: rename action

* icons, language consistency

* chevron after

* handle empty string case on genes for create geneset

* edit geneset

* fix language on create

* copy correction

* add popper2
upgrade react popper
upgrade react popper
adding popover2 package

* truncate uses tooltip2

* gene set button text typo

* remove logging

* moving server over

* remove test imports

* don't try to destructure map, use array.from

* fix add gene map datastructure error

* Revert "fix add gene map datastructure error"

This reverts commit b0eed45952.

* name --> genesetName, genes --> geneSymbols

* add gene to geneset, temporary format

* handle empty case, clear form input

* lint -- genesets wasn't passed via props

* userinfo

* move genes string to object conversion to action

* remove tmp gene description

* emptystring default for description

* remove empty string

* remove top level package json

* remove package lock as well

* remove flag for feature toggle

* remove comments in geneset

* comment cleanup

* remove comment

* revert diffexp genes to 10

* color by gene set

* disable color by gene set

* Gene menus are now inline, remove dead prototype code

* remove todo, magic number to variable

* remove jshint in rightsidebar

Co-authored-by: Severiano Badajoz <sbadajoz@chanzuckerberg.com>

* remove unused geneset validation code

* tmp format pending geneset description

* move magic number into variable

* reorganize genesetsUI reducer pending tests

* rewire edit given new action name

* add basic validation and feedback for geneset name uniqueness

* mv annoDialog

* mv label, repair paths

* Update client/src/components/brushableHistogram/header.js

Co-authored-by: Severiano Badajoz <sbadajoz@chanzuckerberg.com>

* add imports for icon in histo

* update jest snapshots given blueprint/tooltip2 usage of index -1

* ensure no empty paragraph

* intent from blueprint

* remove remainder of jshint references

* do not push undo when autosave fires

* fix autosave bugs

* remove todos

* clamp to util

* scient to util

* revert clearing diffexp

* rename value to be more specific stacked bar

* clean up logging and commetns

* remove gene entry tests pending rewrite

* tab index -1

* update jest snapshot, blueprint tooltip 2

* caret margin

* snapshot update

* ensure histogram is centered

* add geneset actions to config

* comment maybeScientific

* comment clamp

* comment ui reducer

* remove prototype code

* remove error log

* remove references to bl.ocks

* componetize parseBulkGeneString

* catch case where geneset rename same name

* genesetui reducer tests

* add geneset ui to index reducer config

Co-authored-by: bkmartinjr <bruce@chanzuckerberg.com>
Co-authored-by: Severiano Badajoz <sbadajoz@chanzuckerberg.com>

client/src/util/clamp.js

@@ -0,0 +1,13 @@
+/**
+ * The function will ensure a number is above or below given thresholds
+ * @param val - a number
+ * @param rng - an array of two numbers, a min and a max
+ * Ie., in the case of a histogram brush selection:
+ * const x0 = x(clamp(selectionRange[0], [min, max]));
+ * const x1 = x(clamp(selectionRange[1], [min, max]));
+ * @returns a number
+ */
+
+export default function clamp(val, rng) {
+  return Math.max(Math.min(val, rng[1]), rng[0]);
+}

client/src/util/maybeScientific.js

@@ -0,0 +1,27 @@
+import significantDigits from "./significantDigits";
+
+/**
+ * The function will conditionally convert a d3 axis label to scientific notation
+ * @param x - a d3 axis, ie:
+ *  d3
+ *    .axisBottom(x)
+ *    .ticks(4)
+ *    .tickFormat(d3.format(maybeScientific(x)))
+ * @returns - the number formatted as scientific, if it's big enough
+ */
+
+export default function maybeScientific(x) {
+  let format = ",";
+  const _ticks = x.ticks(4);
+
+  if (x.domain().some((n) => Math.abs(n) >= 10000)) {
+    /* 
+          heuristic: if the last tick d3 wants to render has one significant
+          digit ie., 2000, render 2e+3, but if it's anything else ie., 42000000 render
+          4.20e+n
+        */
+    format = significantDigits(_ticks[_ticks.length - 1]) === 1 ? ".0e" : ".2e";
+  }
+
+  return format;
+}

client/src/util/parseBulkGeneString.js

@@ -0,0 +1,10 @@
+/**
+ * The function will split string by comma or space, return unique non-empty strings
+ * @param geneString - a string of comma delimited genes
+ * @returns an array
+ */
+import _ from "lodash";
+
+export default function parseBulkGeneString(geneString) {
+  return _.pull(_.uniq(geneString.split(/[ ,]+/)), "");
+}

client/src/util/parseRGB.js

@@ -1,4 +1,3 @@
-// jshint esversion: 6
 import scaleRGB from "./scaleRGB";
 
 // maintain a cache of already parsed RGB names, as it is reasonably expensive

client/src/util/scaleLinear.js

@@ -1,5 +1,3 @@
-// jshint esversion: 6
-
 // Substitute for a d3 linear scale - less flexible, more performant.
 // Returns a function which will scale a value.
 //

client/src/util/scaleRGB.js

@@ -1,4 +1,3 @@
-// jshint esversion: 6
 export default (input) => {
   const outputMax = 1;
   const outputMin = 0;

client/src/util/typedCrossfilter/positiveIntervals.js

@@ -1,5 +1,3 @@
-// jshint esversion: 6
-
 // Interval operations - very simple version of interval set relationship
 // operators.   An interval is a multi-interval list of [min, max),
 // where min and max are mandatory.   Constraints:

client/src/util/typedCrossfilter/util.js

@@ -1,5 +1,3 @@
-// jshint esversion: 6
-
 import { sortIndex } from "./sort";
 import { rangeFill as fillRange } from "../range";