chore: Add ESLint no-floating-promise

2026-09-15 12:47:56 +08:00 · 2024-09-12 13:36:26 -07:00
parent fd8b47b78e
commit 151c28d119
24 changed files with 822 additions and 716 deletions
--- a/client/tests/e2e/config.js
+++ b/client/tests/e2e/config.js
@@ -1,4 +1,4 @@
-import * as ENV_DEFAULT from "../../../environment.default.json";
+import * as ENV_DEFAULT from "Code/cellxgene/environment.default.json";

 export const jestEnv = process.env.JEST_ENV || ENV_DEFAULT.JEST_ENV;
 export const appUrlBase =
--- a/client/tests/e2e/puppeteer.setup.js
+++ b/client/tests/e2e/puppeteer.setup.js
@@ -5,8 +5,8 @@
 */

 import { setDefaultOptions } from "expect-puppeteer";
+import * as ENV_DEFAULT from "Code/cellxgene/environment.default.json";
 import { isDebug, isDev } from "./config";
-import * as ENV_DEFAULT from "../../../environment.default.json";

 // (thuang): This is the max time a test can take to run.
 // Since when debugging, we run slowMo and !headless, this means
--- a/client/configuration/eslint/eslint.js
+++ b/client/configuration/eslint/eslint.js
@@ -82,13 +82,14 @@ module.exports = {
      },
      // Can't extend in overrides: https://github.com/eslint/eslint/issues/8813
      // "extends": ["plugin:jest/recommended"]
-      plugins: ["jest"],
+      plugins: ["jest", "no-floating-promise"],
      rules: {
        "jest/no-disabled-tests": "warn",
        "jest/no-focused-tests": "error",
        "jest/no-identical-title": "error",
        "jest/prefer-to-have-length": "warn",
        "jest/valid-expect": "error",
+        "no-floating-promise/no-floating-promise": 2,
      },
    },
  ],
--- a/client/package-lock.json
+++ b/client/package-lock.json
--- a/client/package.json
+++ b/client/package.json
@@ -92,7 +92,7 @@
    "@babel/preset-react": "^7.13.13",
    "@babel/register": "^7.13.16",
    "@babel/runtime": "^7.13.16",
-    "@blueprintjs/eslint-plugin": "^0.3.0",
+    "@blueprintjs/eslint-plugin": "^6.1.4",
    "@sentry/webpack-plugin": "^1.15.0",
    "babel-jest": "^26.1.0",
    "babel-loader": "^8.1.0",
@@ -104,15 +104,16 @@
    "codecov": "^3.7.1",
    "css-loader": "^5.2.4",
    "css-minimizer-webpack-plugin": "^4.0.0",
-    "eslint": "^7.24.0",
-    "eslint-config-airbnb": "^18.2.0",
+    "eslint": "^8.56.0",
+    "eslint-config-airbnb": "^19.0.4",
    "eslint-config-prettier": "^8.2.0",
    "eslint-plugin-compat": "^4.2.0",
    "eslint-plugin-eslint-comments": "^3.2.0",
    "eslint-plugin-filenames": "^1.3.2",
    "eslint-plugin-import": "^2.24.2",
-    "eslint-plugin-jest": "^24.3.5",
+    "eslint-plugin-jest": "^28.8.3",
    "eslint-plugin-jsx-a11y": "^6.3.1",
+    "eslint-plugin-no-floating-promise": "^2.0.0",
    "eslint-plugin-react": "^7.23.2",
    "eslint-plugin-react-hooks": "^4.0.8",
    "expect-puppeteer": "^5.0.0",
--- a/client/src/components/brushableHistogram/error.js
+++ b/client/src/components/brushableHistogram/error.js
@@ -1,8 +1,8 @@
 import React from "react";
 import * as globals from "../../globals";

-const ErrorLoading = ({ displayName, zebra }) => (
-    <div
+function ErrorLoading({ displayName, zebra }) {
+  return <div
      style={{
        backgroundColor: zebra ? globals.lightestGrey : "white",
        fontStyle: "italic",
@@ -10,6 +10,6 @@ const ErrorLoading = ({ displayName, zebra }) => (
    >
      <span>{`Failure loading ${displayName}`}</span>
    </div>
-  );
+}

 export default ErrorLoading;
--- a/client/src/components/brushableHistogram/histogram.js
+++ b/client/src/components/brushableHistogram/histogram.js
@@ -5,7 +5,7 @@ import * as d3 from "d3";
 import maybeScientific from "../../util/maybeScientific";
 import clamp from "../../util/clamp";

-const Histogram = ({
+function Histogram({
  field,
  fieldForId,
  display,
@@ -18,7 +18,7 @@ const Histogram = ({
  isColorBy,
  selectionRange,
  mini,
-}) => {
+}) {
  const svgRef = useRef(null);
  const [brush, setBrush] = useState(null);

@@ -186,6 +186,6 @@ const Histogram = ({
      ref={svgRef}
    />
  );
-};
+}

 export default Histogram;
--- a/client/src/components/brushableHistogram/loading.js
+++ b/client/src/components/brushableHistogram/loading.js
@@ -3,12 +3,8 @@ import { Button } from "@blueprintjs/core";

 import * as globals from "../../globals";

-const StillLoading = ({ zebra, displayName }) => 
-  /*
-    Render a loading indicator for the field.
-    */
-   (
-    <div
+function StillLoading({ zebra, displayName }) {
+  return <div
      data-testclass="gene-loading-spinner"
      style={{
        padding: globals.leftSidebarSectionPadding,
@@ -37,7 +33,6 @@ const StillLoading = ({ zebra, displayName }) =>
        </div>
      </div>
    </div>
-  )
-;
+}

 export default StillLoading;
--- a/client/src/components/categorical/category/annoDialogAddLabel.js
+++ b/client/src/components/categorical/category/annoDialogAddLabel.js
@@ -71,8 +71,7 @@ class Category extends React.PureComponent {
    const { metadataField, annotations, obsCrossfilter } = this.props;

    return (
-      <>
-        <AnnoDialog
+      <AnnoDialog
          isActive={
            annotations.isAddingNewLabel &&
            annotations.categoryAddingNewLabel === metadataField
@@ -105,7 +104,6 @@ class Category extends React.PureComponent {
            />
          }
        />
-      </>
    );
  }
 }
--- a/client/src/components/categorical/category/annoDialogEditCategoryName.js
+++ b/client/src/components/categorical/category/annoDialogEditCategoryName.js
@@ -105,8 +105,7 @@ class AnnoDialogEditCategoryName extends React.PureComponent {
    const { metadataField, annotations } = this.props;

    return (
-      <>
-        <AnnoDialog
+      <AnnoDialog
          isActive={
            annotations.isEditingCategoryName &&
            annotations.categoryBeingEdited === metadataField
@@ -141,7 +140,6 @@ class AnnoDialogEditCategoryName extends React.PureComponent {
            />
          }
        />
-      </>
    );
  }
 }
--- a/client/src/components/categorical/category/index.js
+++ b/client/src/components/categorical/category/index.js
@@ -288,11 +288,8 @@ class Category extends React.PureComponent {

 export default Category;

-const StillLoading = ({ metadataField, checkboxID }) => (
-  /*
-  We are still loading this category, so render a "busy" signal.
-  */
-  <div
+function StillLoading({ metadataField, checkboxID }) {
+  return <div
    style={{
      maxWidth: globals.maxControlsWidth,
    }}
@@ -335,8 +332,8 @@ const StillLoading = ({ metadataField, checkboxID }) => (
      </div>
    </div>
  </div>
-);
-const ErrorLoading = ({ metadataField, error }) => {
+}
+function ErrorLoading({ metadataField, error }) {
  console.error(error); // log error to console as it is unexpected.
  return (
    <div style={{ marginBottom: 10, marginTop: 4 }}>
@@ -352,7 +349,7 @@ const ErrorLoading = ({ metadataField, error }) => {
      </span>
    </div>
  );
-};
+}

 const CategoryHeader = React.memo(
  ({
--- a/client/src/components/categorical/value/index.js
+++ b/client/src/components/categorical/value/index.js
@@ -162,7 +162,7 @@ class CategoryValue extends React.Component {
    );
  };

-  shouldComponentUpdate = (nextProps, nextState) => {
+  shouldComponentUpdate(nextProps, nextState) {
    /*
    Checks to see if at least one of the following changed:
    * world state
--- a/client/src/components/embedding/index.js
+++ b/client/src/components/embedding/index.js
@@ -109,7 +109,7 @@ const loadAllEmbeddingCounts = async ({ annoMatrix, available }) => {
  }));
 };

-const EmbeddingChoices = ({ onChange, annoMatrix, layoutChoice }) => {
+function EmbeddingChoices({ onChange, annoMatrix, layoutChoice }) {
  const { available } = layoutChoice;
  const { data, error, isPending } = useAsync({
    promiseFn: loadAllEmbeddingCounts,
@@ -149,4 +149,4 @@ const EmbeddingChoices = ({ onChange, annoMatrix, layoutChoice }) => {
    );
  }
  return null;
-};
+}
--- a/client/src/components/framework/logo.js
+++ b/client/src/components/framework/logo.js
@@ -1,7 +1,7 @@
 import React from "react";
 import icon from "../../images/icon.png";

-const Logo = (props) => {
+function Logo(props) {
  const { size } = props;
  return (
    <img
@@ -11,6 +11,6 @@ const Logo = (props) => {
      alt="CELLxGENE Annotate Logo"
     />
  );
-};
+}

 export default Logo;
--- a/client/src/components/geneExpression/menus/addGeneToGenesetDialogue.js
+++ b/client/src/components/geneExpression/menus/addGeneToGenesetDialogue.js
@@ -53,8 +53,7 @@ class AddGeneToGenesetDialogue extends React.PureComponent {
    const { genesToAdd } = this.state;

    return (
-      <>
-        <AnnoDialog
+      <AnnoDialog
          isActive={genesetsUI.isAddingGenesToGeneset === geneset}
          inputProps={{ "data-testid": `${geneset}:create-label-dialog` }}
          primaryButtonProps={{
@@ -81,7 +80,6 @@ class AddGeneToGenesetDialogue extends React.PureComponent {
          handleSubmit={this.handleAddGeneToGeneSet}
          handleCancel={this.disableAddGeneMode}
        />
-      </>
    );
  }
 }
--- a/client/src/components/geneExpression/menus/createGenesetDialogue.js
+++ b/client/src/components/geneExpression/menus/createGenesetDialogue.js
@@ -125,8 +125,7 @@ class CreateGenesetDialogue extends React.PureComponent {
    const { genesetsUI, genesets } = this.props;

    return (
-      <>
-        <Dialog
+      <Dialog
          icon="tag"
          title="Create gene set"
          isOpen={genesetsUI.createGenesetModeActive}
@@ -210,7 +209,6 @@ class CreateGenesetDialogue extends React.PureComponent {
            </div>
          </form>
        </Dialog>
-      </>
    );
  }
 }
--- a/client/src/components/geneExpression/menus/editGenesetNameDialogue.js
+++ b/client/src/components/geneExpression/menus/editGenesetNameDialogue.js
@@ -109,8 +109,7 @@ class RenameGeneset extends React.PureComponent {
    } = this.props;

    return (
-      <>
-        <AnnoDialog
+      <AnnoDialog
          isActive={genesetsUI.isEditingGenesetName === originalGenesetName}
          inputProps={{
            "data-testid": `${genesetsUI.isEditingGenesetName}:rename-geneset-dialog`,
@@ -161,7 +160,6 @@ class RenameGeneset extends React.PureComponent {
          handleSubmit={this.renameGeneset}
          handleCancel={this.disableEditGenesetNameMode}
        />
-      </>
    );
  }
 }
--- a/client/src/components/graph/graph.js
+++ b/client/src/components/graph/graph.js
@@ -935,7 +935,7 @@ class Graph extends React.Component {
  }
 }

-const ErrorLoading = ({ displayName, error, width, height }) => {
+function ErrorLoading({ displayName, error, width, height }) {
  console.log(error); // log to console as this is an unepected error
  return (
    <div
@@ -949,14 +949,10 @@ const ErrorLoading = ({ displayName, error, width, height }) => {
      <span>{`Failure loading ${displayName}`}</span>
    </div>
  );
-};
+}

-const StillLoading = ({ displayName, width, height }) => 
-  /*
-  Render a busy/loading indicator
-  */
-   (
-    <div
+function StillLoading({ displayName, width, height }) {
+  return <div
      style={{
        position: "fixed",
        fontWeight: 500,
@@ -976,7 +972,6 @@ const StillLoading = ({ displayName, width, height }) =>
        <span style={{ fontStyle: "italic" }}>Loading {displayName}</span>
      </div>
    </div>
-  )
-;
+}

 export default Graph;
--- a/client/src/components/graph/overlays/centroidLabels.js
+++ b/client/src/components/graph/overlays/centroidLabels.js
@@ -167,7 +167,7 @@ class CentroidLabels extends PureComponent {
  }
 }

-const Label = ({
+function Label({
  label,
  dilatedValue,
  coords,
@@ -177,7 +177,7 @@ const Label = ({
  displayLabel,
  onMouseEnter,
  onMouseOut,
-}) => {
+}) {
  /*
  Render a label at a given coordinate.
  */
@@ -215,4 +215,4 @@ const Label = ({
      </text>
    </g>
  );
-};
+}
--- a/client/src/components/labelInput.js
+++ b/client/src/components/labelInput.js
@@ -159,8 +159,7 @@ export default class LabelInput extends React.PureComponent {
    };
    const { queryResults } = this.state;
    return (
-      <>
-        <Suggest
+      <Suggest
          fill
          inputValueRenderer={(i) => i.target}
          items={queryResults}
@@ -172,7 +171,6 @@ export default class LabelInput extends React.PureComponent {
          inputProps={inputProps}
          onKeyDown={this.handleKeyDown}
        />
-      </>
    );
  }
 }
--- a/client/src/components/miniHistogram/index.js
+++ b/client/src/components/miniHistogram/index.js
@@ -35,11 +35,11 @@ export default class MiniHistogram extends React.PureComponent {
    }
  };

-  componentDidMount = () => {
+  componentDidMount() {
    this.drawHistogram();
  };

-  componentDidUpdate = (prevProps) => {
+  componentDidUpdate(prevProps) {
    const { obsOrVarContinuousFieldDisplayName, bins } = this.props;
    if (
      prevProps.obsOrVarContinuousFieldDisplayName !==
--- a/client/src/components/miniStackedBar/index.js
+++ b/client/src/components/miniStackedBar/index.js
@@ -42,12 +42,12 @@ export default class MiniStackedBar extends React.PureComponent {
    }
  };

-  componentDidUpdate = (prevProps) => {
+  componentDidUpdate(prevProps) {
    const { occupancy } = this.props;
    if (occupancy !== prevProps.occupancy) this.drawStacks();
  };

-  componentDidMount = () => {
+  componentDidMount() {
    this.drawStacks();
  };

--- a/client/src/components/util/truncate.js
+++ b/client/src/components/util/truncate.js
@@ -32,7 +32,7 @@ const SECOND_HALF_INNER_STYLE = {
  right: 0,
 };

-export default (props) => {
+export default function(props) {
  const { children, isGenesetDescription, tooltipAddendum = "" } = props;
  // Truncate only support a single child with a text child

--- a/client/src/globals.js
+++ b/client/src/globals.js
@@ -1,6 +1,6 @@
 import { Colors } from "@blueprintjs/core";
+import ENV_DEFAULT from "Code/cellxgene/environment.default.json";
 import { dispatchNetworkErrorMessageToUser } from "./util/actionHelpers";
-import ENV_DEFAULT from "../../environment.default.json";

 /* overflow category values are created  using this string */
 export const overflowCategoryLabel = ": all other labels";