diff --git a/client/src/components/categorical/annoDialogAddLabel.js b/client/src/components/categorical/annoDialogAddLabel.js
index f8c3350b..d0ad62e6 100644
--- a/client/src/components/categorical/annoDialogAddLabel.js
+++ b/client/src/components/categorical/annoDialogAddLabel.js
@@ -9,7 +9,8 @@ import { labelPrompt, isLabelErroneous } from "./labelUtil";
categoricalSelection: state.categoricalSelection,
annotations: state.annotations,
universe: state.universe,
- ontology: state.ontology
+ ontology: state.ontology,
+ crossfilter: state.crossfilter
}))
class Category extends React.PureComponent {
constructor(props) {
@@ -73,7 +74,7 @@ class Category extends React.PureComponent {
render() {
const { newLabelText } = this.state;
- const { metadataField, annotations, ontology } = this.props;
+ const { metadataField, annotations, ontology, crossfilter } = this.props;
const ontologyEnabled = ontology?.enabled ?? false;
return (
@@ -91,7 +92,7 @@ class Category extends React.PureComponent {
instruction={this.instruction(newLabelText)}
cancelTooltipContent="Close this dialog without adding a label."
primaryButtonText="Add label"
- secondaryButtonText="Add label and assign currently selected cells"
+ secondaryButtonText={`Add label and assign ${crossfilter.countSelected()} currently selected cells`}
handleSecondaryButtonSubmit={this.addLabelAndAssignCells}
text={newLabelText}
validationError={this.labelNameError(newLabelText)}
diff --git a/client/src/components/categorical/categorical.js b/client/src/components/categorical/categorical.js
index da17ef8b..61f77728 100644
--- a/client/src/components/categorical/categorical.js
+++ b/client/src/components/categorical/categorical.js
@@ -22,7 +22,8 @@ class Categories extends React.Component {
this.state = {
createAnnoModeActive: false,
newCategoryText: "",
- categoryToDuplicate: null
+ categoryToDuplicate: null,
+ expandedCats: new Set()
};
}
@@ -105,15 +106,28 @@ class Categories extends React.Component {
);
};
+ 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
+ newCategoryText,
+ expandedCats
} = this.state;
const { writableCategoriesEnabled, schema, config, ontology } = this.props;
const ontologyEnabled = ontology?.enabled ?? false;
-
/* all names, sorted in display order. Will be rendered in this order */
const allCategoryNames = ControlsHelpers.selectableCategoryNames(
schema,
@@ -169,6 +183,8 @@ class Categories extends React.Component {
@@ -180,6 +196,8 @@ class Categories extends React.Component {
diff --git a/client/src/components/categorical/category.js b/client/src/components/categorical/category.js
index bd461f2f..9552086e 100644
--- a/client/src/components/categorical/category.js
+++ b/client/src/components/categorical/category.js
@@ -20,8 +20,7 @@ class Category extends React.Component {
constructor(props) {
super(props);
this.state = {
- isChecked: true,
- isExpanded: false
+ isChecked: true
};
}
@@ -142,13 +141,15 @@ class Category extends React.Component {
}
render() {
- const { isExpanded, isChecked } = this.state;
+ const { isChecked } = this.state;
const {
metadataField,
categoricalSelection,
colorAccessor,
isUserAnno,
- annotations
+ annotations,
+ isExpanded,
+ onExpansionChange
} = this.props;
const isStillLoading = !(categoricalSelection?.[metadataField] ?? false);
@@ -196,7 +197,7 @@ class Category extends React.Component {
annotations.isEditingCategoryName &&
annotations.categoryBeingEdited === metadataField;
if (!editingCategory) {
- this.setState({ isExpanded: !isExpanded });
+ onExpansionChange(metadataField)
}
}}
>