TS Revert (1) (#2402)

* revert all commits to before Typescript migration * update compat workflow to match latest deps (#2335) * update compat workflow to match latest deps * attempt to debug * attempt to debug * remove debugging code * typo * update deps to match desktop (#2340) * fix: don't run lint with `--fix` on push tests (#2273) * fix: don't run lint with `--fix` on push tests * npx Co-authored-by: maniarathi <mani.arathi@gmail.com> Co-authored-by: Madison Dunitz <madison.dunitz@chanzuckerberg.com> * rename X_approx_distribution to X_approximate_distribution (#2337) * Correctly handle non-finite numbers in heuristic determination of X distribution (#2342) * handle non-finites explicitly * improve and test edge case handling for distribution estimation * revert debugging changes * code readability * clean up type inferencing (#2332) * unit tests for 64 bit conversion * clean up type handling * type inference tests * more type inference fixes * use schema to determine user intent for data typing * stop using deprecated API * fbs type encoding test * add missing test * add more tests * correctly infer X type for CXG adaptor * lint * fix typo * ts migration * cleanup from PR review * lint * PR review changes * remove unused packages from client (#2359) * remove unused packages from client * add missing peer dep * fix: disable FE auth testing on compatibility tests (#2377) * update: release process (#2277) Co-authored-by: maniarathi <mani.arathi@gmail.com> * fix: remove spaces in param setup (#2380) * delete deploy workflow (#2396) * undo reformatting which now does not pass lint * fix snapshots which changed due to npm dep changes * add missing quoting to snapshot * another snapshot typo fix * TS Revert (2) - replay PR #2347 and #2354 (#2403) * replay edits from PR 2347 * TS Revert (3) - replay edits in PR #2327 (#2404) * replay edits in PR 2327 * TS Revert (4) - replay PR #2355 (#2405) * replay edits in PR 2355 * add additional babel config * reformat with new prettier config Co-authored-by: Severiano Badajoz <sbadajoz@chanzuckerberg.com> Co-authored-by: maniarathi <mani.arathi@gmail.com> Co-authored-by: Madison Dunitz <madison.dunitz@chanzuckerberg.com>
2026-10-06 20:28:12 +08:00 · 2021-08-23 15:01:36 -07:00
parent 295590a7c6
commit eaae6df5e3
253 changed files with 11175 additions and 22271 deletions
@@ -0,0 +1,235 @@
+import React from "react";
+import { AnchorButton, Tooltip, Position } from "@blueprintjs/core";
+import { connect } from "react-redux";
+import * as globals from "../../globals";
+import Category from "./category";
+import { AnnotationsHelpers, ControlsHelpers } from "../../util/stateManager";
+import AnnoDialog from "../annoDialog";
+import AnnoSelect from "./annoSelect";
+import LabelInput from "../labelInput";
+import { labelPrompt } from "./labelUtil";
+import actions from "../../actions";
+
+@connect((state) => ({
+  writableCategoriesEnabled: state.config?.parameters?.annotations ?? false,
+  schema: state.annoMatrix?.schema,
+  userInfo: state.userInfo,
+}))
+class Categories extends React.Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      createAnnoModeActive: false,
+      newCategoryText: "",
+      categoryToDuplicate: null,
+      expandedCats: new Set(),
+    };
+  }
+
+  handleCreateUserAnno = (e) => {
+    const { dispatch } = this.props;
+    const { newCategoryText, categoryToDuplicate } = this.state;
+    dispatch(
+      actions.annotationCreateCategoryAction(
+        newCategoryText,
+        categoryToDuplicate
+      )
+    );
+    this.setState({
+      createAnnoModeActive: false,
+      categoryToDuplicate: null,
+      newCategoryText: "",
+    });
+    e.preventDefault();
+  };
+
+  handleEnableAnnoMode = () => {
+    this.setState({ createAnnoModeActive: true });
+  };
+
+  handleDisableAnnoMode = () => {
+    this.setState({
+      createAnnoModeActive: false,
+      categoryToDuplicate: null,
+      newCategoryText: "",
+    });
+  };
+
+  handleModalDuplicateCategorySelection = (d) => {
+    this.setState({ categoryToDuplicate: d });
+  };
+
+  categoryNameError = (name) => {
+    /*
+    return false if this is a LEGAL/acceptable category name or NULL/empty string,
+    or return an error type.
+    */
+
+    /* allow empty string */
+    if (name === "") return false;
+
+    /*
+    test for uniqueness against *all* annotation names, not just the subset
+    we render as categorical.
+    */
+    const { schema } = this.props;
+    const allCategoryNames = schema.annotations.obs.columns.map((c) => c.name);
+
+    /* check category name syntax */
+    const error = AnnotationsHelpers.annotationNameIsErroneous(name);
+    if (error) {
+      return error;
+    }
+
+    /* disallow duplicates */
+    if (allCategoryNames.indexOf(name) !== -1) {
+      return "duplicate";
+    }
+
+    /* otherwise, no error */
+    return false;
+  };
+
+  handleChange = (name) => {
+    this.setState({ newCategoryText: name });
+  };
+
+  handleSelect = (name) => {
+    this.setState({ newCategoryText: name });
+  };
+
+  instruction = (name) => labelPrompt(
+      this.categoryNameError(name),
+      "New, unique category name",
+      ":"
+    );
+
+  onExpansionChange = (catName) => {
+    const { expandedCats } = this.state;
+    if (expandedCats.has(catName)) {
+      const _expandedCats = new Set(expandedCats);
+      _expandedCats.delete(catName);
+      this.setState({ expandedCats: _expandedCats });
+    } else {
+      const _expandedCats = new Set(expandedCats);
+      _expandedCats.add(catName);
+      this.setState({ expandedCats: _expandedCats });
+    }
+  };
+
+  render() {
+    const {
+      createAnnoModeActive,
+      categoryToDuplicate,
+      newCategoryText,
+      expandedCats,
+    } = this.state;
+    const { writableCategoriesEnabled, schema, userInfo } = this.props;
+    /* all names, sorted in display order.  Will be rendered in this order */
+    const allCategoryNames =
+      ControlsHelpers.selectableCategoryNames(schema).sort();
+
+    return (
+      <div
+        style={{
+          padding: globals.leftSidebarSectionPadding,
+        }}
+      >
+        <AnnoDialog
+          isActive={createAnnoModeActive}
+          title="Create new category"
+          instruction={this.instruction(newCategoryText)}
+          cancelTooltipContent="Close this dialog without creating a category."
+          primaryButtonText="Create new category"
+          primaryButtonProps={{ "data-testid": "submit-category" }}
+          text={newCategoryText}
+          validationError={this.categoryNameError(newCategoryText)}
+          handleSubmit={this.handleCreateUserAnno}
+          handleCancel={this.handleDisableAnnoMode}
+          annoInput={
+            <LabelInput
+              labelSuggestions={null}
+              onChange={this.handleChange}
+              onSelect={this.handleSelect}
+              inputProps={{
+                "data-testid": "new-category-name",
+                leftIcon: "tag",
+                intent: "none",
+                autoFocus: true,
+              }}
+              newLabelMessage="New category"
+            />
+          }
+          annoSelect={
+            <AnnoSelect
+              handleModalDuplicateCategorySelection={
+                this.handleModalDuplicateCategorySelection
+              }
+              categoryToDuplicate={categoryToDuplicate}
+              allCategoryNames={allCategoryNames}
+            />
+          }
+        />
+
+        {writableCategoriesEnabled ? (
+          <div style={{ marginBottom: 10 }}>
+            <Tooltip
+              content={
+                userInfo.is_authenticated
+                  ? "Create a new category"
+                  : "You must be logged in to create new categorical fields"
+              }
+              position={Position.RIGHT}
+              boundary="viewport"
+              hoverOpenDelay={globals.tooltipHoverOpenDelay}
+              modifiers={{
+                preventOverflow: { enabled: false },
+                hide: { enabled: false },
+              }}
+            >
+              <AnchorButton
+                type="button"
+                data-testid="open-annotation-dialog"
+                onClick={this.handleEnableAnnoMode}
+                intent="primary"
+                disabled={!userInfo.is_authenticated}
+              >
+                Create new <strong>category</strong>
+              </AnchorButton>
+            </Tooltip>
+          </div>
+        ) : null}
+
+        {/* READ ONLY CATEGORICAL FIELDS */}
+        {/* this is duplicative but flat, could be abstracted */}
+        {allCategoryNames.map((catName) =>
+          !schema.annotations.obsByName[catName].writable &&
+          (schema.annotations.obsByName[catName].categories?.length > 1 ||
+            !schema.annotations.obsByName[catName].categories) ? (
+            <Category
+              key={catName}
+              metadataField={catName}
+              onExpansionChange={this.onExpansionChange}
+              isExpanded={expandedCats.has(catName)}
+              createAnnoModeActive={createAnnoModeActive}
+            />
+          ) : null
+        )}
+        {/* WRITEABLE FIELDS */}
+        {allCategoryNames.map((catName) =>
+          schema.annotations.obsByName[catName].writable ? (
+            <Category
+              key={catName}
+              metadataField={catName}
+              onExpansionChange={this.onExpansionChange}
+              isExpanded={expandedCats.has(catName)}
+              createAnnoModeActive={createAnnoModeActive}
+            />
+          ) : null
+        )}
+      </div>
+    );
+  }
+}
+
+export default Categories;