fork/cellxgene
1
0
Fork 0
mirror of https://github.com/chanzuckerberg/cellxgene.git synced 2026-09-29 18:48:11 +08:00
Code Issues Packages Projects Releases Wiki Activity

Warnings on anno textfields (#1023)

Browse Source 
*  Warning for creating new label with an existing name

* category dup

* italics
This commit is contained in:
Colin Megill
2019-11-07 18:57:15 -05:00
committed by GitHub
parent 4c3d783fc8
commit 84900bad0e
3 changed files with 85 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/src/components/categorical/categorical.js
+53 -20
View File
@@ -7,7 +7,8 @@ import {
InputGroup,
Dialog,
Classes,
MenuItem
MenuItem,
Colors
} from "@blueprintjs/core";
import { Select } from "@blueprintjs/select";
import { connect } from "react-redux";
@@ -57,7 +58,11 @@ class Categories extends React.Component {
};
render() {
const { createAnnoModeActive, categoryToDuplicate } = this.state;
const {
createAnnoModeActive,
categoryToDuplicate,
newCategoryText
} = this.state;
const {
categoricalSelection,
writableCategoriesEnabled,
@@ -76,26 +81,30 @@ class Categories extends React.Component {
>
{/* READ ONLY CATEGORICAL FIELDS */}
{/* this is duplicative but flat, could be abstracted */}
{_.map(allCategoryNames, catName =>
!schema.annotations.obsByName[catName].writable ? (
<Category
key={catName}
metadataField={catName}
createAnnoModeActive={createAnnoModeActive}
isUserAnno={false}
/>
) : null
{_.map(
allCategoryNames,
catName =>
!schema.annotations.obsByName[catName].writable ? (
<Category
key={catName}
metadataField={catName}
createAnnoModeActive={createAnnoModeActive}
isUserAnno={false}
/>
) : null
)}
{/* WRITEABLE FIELDS */}
{_.map(allCategoryNames, catName =>
schema.annotations.obsByName[catName].writable ? (
<Category
key={catName}
metadataField={catName}
createAnnoModeActive={createAnnoModeActive}
isUserAnno
/>
) : null
{_.map(
allCategoryNames,
catName =>
schema.annotations.obsByName[catName].writable ? (
<Category
key={catName}
metadataField={catName}
createAnnoModeActive={createAnnoModeActive}
isUserAnno
/>
) : null
)}
{writableCategoriesEnabled ? (
<div>
@@ -116,12 +125,33 @@ class Categories extends React.Component {
<p>New, unique category name:</p>
<InputGroup
autoFocus
intent={
allCategoryNames.indexOf(newCategoryText) !== -1
? "warning"
: "none"
}
onChange={e =>
this.setState({ newCategoryText: e.target.value })
}
leftIcon="tag"
/>
<p
style={{
marginTop: 7,
visibility:
allCategoryNames.indexOf(newCategoryText) !== -1
? "visible"
: "hidden",
color: Colors.ORANGE3
}}
>
<span style={{ fontStyle: "italic" }}>
{newCategoryText}
</span>{" "}
already exists
</p>
</div>
<p>
Optionally duplicate all labels & cell assignments from
existing category into new category:
@@ -157,6 +187,9 @@ class Categories extends React.Component {
</Tooltip>
<Button
onClick={this.handleCreateUserAnno}
disabled={
allCategoryNames.indexOf(newCategoryText) !== -1
}
intent="primary"
type="submit"
>
client/src/components/categorical/category.js
+30 -2
View File
@@ -2,7 +2,7 @@ import React from "react";
import _ from "lodash";
import { connect } from "react-redux";
import { FaChevronRight, FaChevronDown } from "react-icons/fa";
import { Flipper, Flipped, Spring } from "react-flip-toolkit";
import { Flipper, Flipped } from "react-flip-toolkit";
import {
Button,
Tooltip,
@@ -14,7 +14,8 @@ import {
Classes,
Icon,
Position,
PopoverInteractionKind
PopoverInteractionKind,
Colors
} from "@blueprintjs/core";
import * as globals from "../../globals";
@@ -345,11 +346,38 @@ class Category extends React.Component {
<p>New, unique label name:</p>
<InputGroup
autoFocus
intent={
universe.schema.annotations.obsByName[
metadataField
].categories.indexOf(newLabelText) !== -1
? "warning"
: "none"
}
onChange={e =>
this.setState({ newLabelText: e.target.value })
}
leftIcon="tag"
/>
<p
style={{
marginTop: 7,
visibility:
universe.schema.annotations.obsByName[
metadataField
].categories.indexOf(newLabelText) !== -1
? "visible"
: "hidden",
color: Colors.ORANGE3
}}
>
<span style={{ fontStyle: "italic" }}>
{newLabelText}
</span>{" "}
already exists within{" "}
<span style={{ fontStyle: "italic" }}>
{metadataField}
</span>
</p>
</div>
</div>
<div className={Classes.DIALOG_FOOTER}>
client/src/reducers/annotations.js
+2 -2
View File
@@ -5,7 +5,7 @@ const Annotations = (
state = {
isEditingCategoryName: false,
isEditingLabelName: false,
categoryBeingEdited: false,
categoryBeingEdited: null,
categoryAddingNewLabel: null,
labelEditable: { category: null, label: null }
},
@@ -46,7 +46,7 @@ const Annotations = (
case "annotation: category edited":
return {
...state,
isEditingCategoryName: true,
isEditingCategoryName: false,
categoryBeingEdited: null
};