diff --git a/.github/workflows/push_tests.yml b/.github/workflows/push_tests.yml index d843f500..0e84a43b 100644 --- a/.github/workflows/push_tests.yml +++ b/.github/workflows/push_tests.yml @@ -4,7 +4,7 @@ on: push: branches: master pull_request: - branches: * + branches: '*' env: JEST_ENV: prod @@ -32,7 +32,7 @@ jobs: run: | pip install flake8 cd client - npm i "eslint" "eslint-config-airbnb" "eslint-config-prettier" "eslint-loader" "eslint-plugin-filenames" "eslint-plugin-import" "eslint-plugin-jest" "eslint-plugin-jsx-a11y" "eslint-plugin-react" "eslint-plugin-react-hooks" + npm i "eslint" "eslint-config-airbnb" "eslint-config-prettier" "eslint-loader" "eslint-plugin-filenames" "eslint-plugin-import" "eslint-plugin-jest" "eslint-plugin-jsx-a11y" "eslint-plugin-react" "eslint-plugin-react-hooks" "eslint-plugin-prettier" - name: Lint with flake8 run: | make lint-server diff --git a/client/package-lock.json b/client/package-lock.json index 3cac3c26..8a1d16c6 100644 --- a/client/package-lock.json +++ b/client/package-lock.json @@ -14581,6 +14581,12 @@ "integrity": "sha1-1PRWKwzjaW5BrFLQ4ALlemNdxtw=", "dev": true }, + "prettier": { + "version": "2.0.5", + "resolved": "https://registry.npmjs.org/prettier/-/prettier-2.0.5.tgz", + "integrity": "sha512-7PtVymN48hGcO4fGjybyBSIWDsLU4H4XlvOHfq91pz9kkGlonzwTfYkaIEwiRg/dAJF9YlbsduBAgtYLi+8cFg==", + "dev": true + }, "prettier-linter-helpers": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/prettier-linter-helpers/-/prettier-linter-helpers-1.0.0.tgz", diff --git a/client/package.json b/client/package.json index 215a14b8..545ddadb 100644 --- a/client/package.json +++ b/client/package.json @@ -99,6 +99,7 @@ "lint-staged": "^10.2.4", "mini-css-extract-plugin": "^0.9.0", "optimize-css-assets-webpack-plugin": "^5.0.3", + "prettier": "^2.0.5", "puppeteer": "^2.1.1", "rimraf": "^3.0.2", "serve-favicon": "^2.5.0", diff --git a/client/src/components/app.js b/client/src/components/app.js index ad949228..14ea5dc2 100644 --- a/client/src/components/app.js +++ b/client/src/components/app.js @@ -21,7 +21,6 @@ import actions from "../actions"; graphRenderCounter: state.controls.graphRenderCounter, })) class App extends React.Component { - componentDidMount() { const { dispatch } = this.props; @@ -68,22 +67,21 @@ class App extends React.Component { error loading ) : null} - {loading ? null : - - {viewportRef => - <> - - - - - - - } - - } + {loading ? null : ( + + + {(viewportRef) => ( + <> + + + + + + + )} + + + )} ); } diff --git a/client/src/components/continuousLegend/index.js b/client/src/components/continuousLegend/index.js index 217c4233..e13d63eb 100644 --- a/client/src/components/continuousLegend/index.js +++ b/client/src/components/continuousLegend/index.js @@ -105,10 +105,12 @@ const continuous = (selectorId, colorscale, colorAccessor) => { colorScale: state.colors.scale, })) class ContinuousLegend extends React.Component { - componentDidUpdate(prevProps) { const { colorAccessor, colorScale } = this.props; - if (prevProps.colorAccessor !== colorAccessor || prevProps.colorScale !== colorScale) { + if ( + prevProps.colorAccessor !== colorAccessor || + prevProps.colorScale !== colorScale + ) { /* always remove it, if it's not continuous we don't put it back. */ d3.select("#continuous_legend").selectAll("*").remove(); } @@ -130,7 +132,9 @@ class ContinuousLegend extends React.Component { return (
{this.ref = ref}} + ref={(ref) => { + this.ref = ref; + }} style={{ display: colorAccessor ? "inherit" : "none", position: "absolute", diff --git a/client/src/components/framework/container.js b/client/src/components/framework/container.js index 7b80bb2e..a5e161f6 100644 --- a/client/src/components/framework/container.js +++ b/client/src/components/framework/container.js @@ -2,19 +2,21 @@ import React from "react"; function Container(props) { - const {children} = props; - return
- {children} -
+ const { children } = props; + return ( +
+ {children} +
+ ); } export default Container; diff --git a/client/src/components/framework/layout.js b/client/src/components/framework/layout.js index 83f2eb5a..6b0edb29 100644 --- a/client/src/components/framework/layout.js +++ b/client/src/components/framework/layout.js @@ -2,9 +2,7 @@ import React from "react"; import * as globals from "../../globals"; - class Layout extends React.Component { - /* Layout - this react component contains all the layout style and logic for the application once it has loaded. @@ -26,60 +24,66 @@ class Layout extends React.Component { render() { const { children } = this.props; - const [ leftSidebar, renderGraph, rightSidebar ] = children; - return
-
- {leftSidebar} +
+ {leftSidebar} +
+
{ + this.viewportRef = ref; + }} + > + {this.viewportRef ? renderGraph(this.viewportRef) : null} +
+
+ {rightSidebar} +
-
{ this.viewportRef = ref; }} - > - {this.viewportRef ? renderGraph(this.viewportRef) : null} -
-
- {rightSidebar} -
-
; + ); } } diff --git a/client/src/components/graph/setupSVGandBrush.js b/client/src/components/graph/setupSVGandBrush.js index aa228bfa..4351bdcf 100644 --- a/client/src/components/graph/setupSVGandBrush.js +++ b/client/src/components/graph/setupSVGandBrush.js @@ -14,7 +14,7 @@ export default ( handleDragAction, handleEndAction, handleCancelAction, - viewport, + viewport ) => { const svg = d3.select("#graph-wrapper").select("#lasso-layer"); @@ -23,7 +23,7 @@ export default ( .brush() .extent([ [0, 0], - [viewport.width, viewport.height] + [viewport.width, viewport.height], ]) .on("start", handleStartAction) .on("brush", handleDragAction) diff --git a/client/src/components/leftSidebar/index.js b/client/src/components/leftSidebar/index.js index f2cd9f94..4cc60658 100644 --- a/client/src/components/leftSidebar/index.js +++ b/client/src/components/leftSidebar/index.js @@ -11,7 +11,6 @@ import TopLeftLogoAndTitle from "./topLeftLogoAndTitle"; scatterplotYYaccessor: state.controls.scatterplotYYaccessor, })) class LeftSideBar extends React.Component { - render() { const { scatterplotXXaccessor, scatterplotYYaccessor } = this.props; return ( diff --git a/client/src/components/menubar/clip.js b/client/src/components/menubar/clip.js index 0017ba5c..729d0dbc 100644 --- a/client/src/components/menubar/clip.js +++ b/client/src/components/menubar/clip.js @@ -35,9 +35,7 @@ function Clip(props) { : ""; return ( -
+
+
diff --git a/client/src/components/menubar/menubar.css b/client/src/components/menubar/menubar.css index 1a935f4b..72b1ac34 100644 --- a/client/src/components/menubar/menubar.css +++ b/client/src/components/menubar/menubar.css @@ -1,4 +1,4 @@ :local(.menubarButton) { - margin-top: 8px; - margin-left: 8px; -} \ No newline at end of file + margin-top: 8px; + margin-left: 8px; +} diff --git a/client/src/components/menubar/subset.js b/client/src/components/menubar/subset.js index 42a9b78d..270ef205 100644 --- a/client/src/components/menubar/subset.js +++ b/client/src/components/menubar/subset.js @@ -12,9 +12,7 @@ function Subset(props) { } = props; return ( - + + /> +
({ +@connect((state) => ({ scatterplotXXaccessor: state.controls.scatterplotXXaccessor, scatterplotYYaccessor: state.controls.scatterplotYYaccessor, })) class RightSidebar extends React.Component { - render() { return (
diff --git a/client/src/util/stateManager/controlsHelpers.js b/client/src/util/stateManager/controlsHelpers.js index 14e22f09..176edeb5 100644 --- a/client/src/util/stateManager/controlsHelpers.js +++ b/client/src/util/stateManager/controlsHelpers.js @@ -203,8 +203,9 @@ export function pruneVarDataCache(varData, needed) { export function subsetAndResetGeneLists(state) { const { userDefinedGenes, diffexpGenes } = state; - const newUserDefinedGenes = _.uniq([].concat(userDefinedGenes, diffexpGenes)) - .slice(0, globals.maxGenes); + const newUserDefinedGenes = _.uniq( + [].concat(userDefinedGenes, diffexpGenes) + ).slice(0, globals.maxGenes); const newDiffExpGenes = []; return [newUserDefinedGenes, newDiffExpGenes]; }