chore: LEAP-221: Remove Taxonomy flags (#1489)

* fix: LSDV-1476: Fix selected=true for Taxonomy

First try, not fully working.
Now `<Choice selected="true">` will work inside Taxonomy as well.

* Fix example; typo in FFs; list of taxonomy FFs

- fix example for classifications
- fix typo in FF link
- add list of all Taxonomy and Choices related FFs

* Add test for preselected Taxonomy; with 3617 FF off

* fix work with shared store (FF_DEV_3617)

* Add tests for static/dynamic + on/off cases

* Linting + remove unused alert

* Remove FF_DEV_2007 flag

* Remove FF_DEV_2007_DEV_2008 FF

* Actually use ffState in test

* Remove FF_DEV_2100_A

* Remove FF_DEV_2244

* Linting from prev commits

* Add missing required flags

* Fix TS recognition of cypress globals

* Remove unused FF groupping

Not the best way to do it anyway

* It does work with FF_DEV_3617 after the fix!

* Add comment about fixed updateValue()

* Update ls-frontend-test to have hasNoSelected()

* Fix tests

* Add FF to fix init order

Children should be init before other processes like setDefaultValues()

* Make it safe to `updateValue()` without task

This case can happen during store init in Label Stream,
task will be loaded later.

* Update ls-frontend-test

* Remove flags from tests

* Small fixes for test data

* Connect updated test helpers

* Get rid of unused FF list

* Update ls-frontend-test

---------

Co-authored-by: hlomzik <hlomzik@users.noreply.github.com>

Author: hlomzik

e2e/tests/nested-choices.test.js

@@ -30,12 +30,6 @@ Scenario('Switching states at nested choices', async ({ I, LabelStudio })=>{
 
   I.amOnPage('/');
 
-  LabelStudio.setFeatureFlags({
-    ff_dev_2007_rework_choices_280322_short: true,
-    ff_dev_2100_preselected_choices_250422_short: true,
-    ff_front_dev_2244_nested_choices_des_107_160522_short: true,
-  });
-
   LabelStudio.init(params);
 
   {
@@ -100,12 +94,6 @@ Scenario('Nested choices states from the annotation', async ({ I, LabelStudio })
 
   I.amOnPage('/');
 
-  LabelStudio.setFeatureFlags({
-    ff_dev_2007_rework_choices_280322_short: true,
-    ff_dev_2100_preselected_choices_250422_short: true,
-    ff_front_dev_2244_nested_choices_des_107_160522_short: true,
-  });
-
   // Load annotation with each type of selection for branches (fully checked, fully unchecked, partly checked)
   LabelStudio.init({
     ...params,

e2e/tests/regression-tests/dynamic-choices.test.js

@@ -3,13 +3,6 @@ const assert = require('assert');
 Feature('Dynamic choices').tag('@regress');
 
 Scenario('Hotkeys for dynamic choices', async ({ I, LabelStudio })=>{
-  LabelStudio.setFeatureFlags({
-    ff_dev_2007_rework_choices_280322_short: true,
-    ff_dev_2007_dev_2008_dynamic_tag_children_250322_short: true,
-    ff_dev_2100_preselected_choices_250422_short: true,
-    ff_front_dev_2244_nested_choices_des_107_160522_short: true,
-  });
-
   const params = {
     config: `
 <View>

e2e/tests/regression-tests/preselected-choices.test.js

@@ -33,9 +33,6 @@ Scenario('Make a duplicate of annotation with preselected choices', async ({ I,
   };
 
   I.amOnPage('/');
-  LabelStudio.setFeatureFlags({
-    ff_dev_2100_preselected_choices_250422_short: true,
-  });
   LabelStudio.init(params);
   // Try to create copy of current annotation
   AtTopbar.click('[aria-label="Copy Annotation"]');
@@ -75,9 +72,6 @@ Scenario('Make a duplicate of empty annotation with preselected choices', async
   };
 
   I.amOnPage('/');
-  LabelStudio.setFeatureFlags({
-    ff_dev_2100_preselected_choices_250422_short: true,
-  });
   LabelStudio.init(params);
   // Try to create copy of current annotation
   AtTopbar.click('[aria-label="Copy Annotation"]');

e2e/tests/taxonomy.test.js

@@ -6,7 +6,6 @@ Feature('Taxonomy');
 Before(({ LabelStudio }) => {
   LabelStudio.setFeatureFlags({
     fflag_feat_front_lsdv_5451_async_taxonomy_110823_short: false,
-    ff_dev_2007_dev_2008_dynamic_tag_children_250322_short: true,
     fflag_fix_front_dev_3617_taxonomy_memory_leaks_fix: true,
     ff_front_dev_1536_taxonomy_user_labels_150222_long: true,
     ff_front_1170_outliner_030222_short: true,

src/stores/Annotation/Annotation.js

@@ -15,7 +15,6 @@ import {
   FF_DEV_1284,
   FF_DEV_1598,
   FF_DEV_2100,
-  FF_DEV_2100_A,
   FF_DEV_2432,
   FF_DEV_3391, FF_LLM_EPIC,
   FF_LSDV_3009,
@@ -596,7 +595,6 @@ export const Annotation = types
     },
 
     setDefaultValues() {
-      if (!isFF(FF_DEV_2100_A)) return;
       self.names.forEach(tag => {
         if (['choices', 'taxonomy'].includes(tag?.type) && tag.preselectedValues?.length) {
           // <Choice selected="true"/>
@@ -752,13 +750,6 @@ export const Annotation = types
         // may come handy when you have a tag that acts or depends
         // on other elements in the tree.
         if (node.annotationAttached) node.annotationAttached();
-
-
-        // @todo special place to init such predefined values; `afterAttach` of the tag?
-        // preselected choices
-        if (!isFF(FF_DEV_2100_A) && !self.pk && node?.type === 'choices' && node.preselectedValues?.length) {
-          self.createResult({}, { choices: node.preselectedValues }, node, node.toname);
-        }
       });
 
       self.history.onUpdate(self.updateObjects);

src/tags/control/Choice.js

@@ -1,6 +1,5 @@
-import React, { Component, useCallback, useState } from 'react';
+import React, { useCallback, useState } from 'react';
 import Button from 'antd/lib/button/index';
-import Form from 'antd/lib/form/index';
 import Radio from 'antd/lib/radio/index';
 import Checkbox from 'antd/lib/checkbox/index';
 import { inject, observer } from 'mobx-react';
@@ -13,7 +12,7 @@ import Tree from '../../core/Tree';
 import Types from '../../core/Types';
 import { AnnotationMixin } from '../../mixins/AnnotationMixin';
 import { TagParentMixin } from '../../mixins/TagParentMixin';
-import { FF_DEV_2007, FF_DEV_2244, FF_DEV_3391, FF_PROD_309, isFF } from '../../utils/feature-flags';
+import { FF_DEV_3391, FF_PROD_309, isFF } from '../../utils/feature-flags';
 import { Block, Elem } from '../../utils/bem';
 import './Choice/Choice.styl';
 import { LsChevron } from '../../assets/icons';
@@ -22,7 +21,6 @@ import { HintTooltip } from '../../components/Taxonomy/Taxonomy';
 /**
  * The `Choice` tag represents a single choice for annotations. Use with the `Choices` tag or `Taxonomy` tag to provide specific choice options.
  *
- * [^FF_DEV_2007]: `ff_dev_2007_rework_choices_280322_short` should be enabled to use `html` attribute
  * [^FF_PROD_309]: The `hint` attribute works only when `fflag_feat_front_prod_309_choice_hint_080523_short` is enabled
  *
  * @example
@@ -44,7 +42,7 @@ import { HintTooltip } from '../../components/Taxonomy/Taxonomy';
  * @param {string} [alias]     - Alias for the choice. If used, the alias replaces the choice value in the annotation results. Alias does not display in the interface.
  * @param {style} [style]      - CSS style of the checkbox element
  * @param {string} [hotkey]    - Hotkey for the selection
- * @param {string} [html]      - Can be used to show enriched content[^FF_DEV_2007], it has higher priority than `value`, however `value` will be used in the exported result (should be properly escaped)
+ * @param {string} [html]      - Can be used to show enriched content, it has higher priority than `value`, however `value` will be used in the exported result (should be properly escaped)
  * @param {string} [hint]      - Hint for choice on hover[^FF_PROD_309]
  * @param {string} [color]     - Color for Taxonomy item
  */
@@ -55,8 +53,8 @@ const TagAttrs = types.model({
   value: types.maybeNull(types.string),
   hotkey: types.maybeNull(types.string),
   style: types.maybeNull(types.string),
+  html: types.maybeNull(types.string),
   color: types.maybeNull(types.string),
-  ...(isFF(FF_DEV_2007) ? { html: types.maybeNull(types.string) } : {}),
   ...(isFF(FF_PROD_309) ? { hint: types.maybeNull(types.string) } : {}),
 });
 
@@ -92,11 +90,11 @@ const Model = types
     },
 
     get sel() {
-      return !isFF(FF_DEV_2244) || self.isLeaf ? self._sel : self.children.every(child => child.sel === true);
+      return self.isLeaf ? self._sel : self.children.every(child => child.sel === true);
     },
 
     get indeterminate() {
-      return isFF(FF_DEV_2244) && (self.isLeaf ? false : !self.sel && self.children.some(child => child.sel === true));
+      return self.isLeaf ? false : !self.sel && self.children.some(child => child.sel === true);
     },
 
     get parentChoice() {
@@ -106,13 +104,13 @@ const Model = types
       return !self.nestedResults && !!self.parentChoice;
     },
     get nestedResults() {
-      return isFF(FF_DEV_2007) && self.parent?.allownested !== false;
+      return self.parent?.allownested !== false;
     },
     get _resultValue() {
       return self.alias ?? self._value;
     },
     get resultValue() {
-      if (isFF(FF_DEV_2007) && self.nestedResults) {
+      if (self.nestedResults) {
         const value = [];
         let choice = self;
 
@@ -171,65 +169,6 @@ const Model = types
 
 const ChoiceModel = types.compose('ChoiceModel', TagParentMixin, TagAttrs, ProcessAttrsMixin, Model, AnnotationMixin);
 
-function triggerElementGetter(el) {
-  return el?.input?.parentNode?.parentNode;
-}
-
-class HtxChoiceView extends Component {
-  render() {
-    const { item, store } = this.props;
-
-    let style = {};
-
-    if (item.style) style = Tree.cssConverter(item.style);
-
-    if (!item.visible) {
-      style['display'] = 'none';
-    }
-
-    const showHotkey =
-      (store.settings.enableTooltips || store.settings.enableLabelTooltips) &&
-      store.settings.enableHotkeys &&
-      item.hotkey;
-
-    const props = {
-      checked: item.sel,
-      disabled: item.parent?.isReadOnly(),
-      onChange: ev => {
-        if (item.isReadOnly()) return;
-        item.toggleSelected();
-        ev.nativeEvent.target.blur();
-      },
-    };
-
-    if (item.isCheckbox) {
-      const cStyle = Object.assign({ display: 'flex', alignItems: 'center', marginBottom: 0 }, style);
-
-      return (
-        <Form.Item style={cStyle}>
-          <HintTooltip title={item.hint} triggerElementGetter={triggerElementGetter}>
-            <Checkbox name={item._value} {...props} disabled={item.isReadOnly()}>
-              {item._value}
-              {showHotkey && <Hint>[{item.hotkey}]</Hint>}
-            </Checkbox>
-          </HintTooltip>
-        </Form.Item>
-      );
-    } else {
-      return (
-        <div style={style}>
-          <HintTooltip title={item.hint} triggerElementGetter={triggerElementGetter}>
-            <Radio value={item._value} style={{ display: 'inline-block', marginBottom: '0.5em' }} {...props}>
-              {item._value}
-              {showHotkey && <Hint>[{item.hotkey}]</Hint>}
-            </Radio>
-          </HintTooltip>
-        </div>
-      );
-    }
-  }
-}
-
 // `name` can't be passed into bem components
 const nameWrapper = (Component, name) => {
   return props => <Component {...props} name={name} />;
@@ -287,14 +226,7 @@ const HtxNewChoiceView = ({ item, store }) => {
   );
 };
 
-const HtxOldChoice = inject('store')(observer(HtxChoiceView));
-const HtxNewChoice = inject('store')(observer(HtxNewChoiceView));
-
-const HtxChoice = (props) => {
-  const HtxChoiceComponent = !isFF(FF_DEV_2007) ? HtxOldChoice : HtxNewChoice;
-
-  return <HtxChoiceComponent {...props} />;
-};
+const HtxChoice = inject('store')(observer(HtxNewChoiceView));
 
 Registry.addTag('choice', ChoiceModel, HtxChoice);
 

src/tags/control/Choices.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Form, Select } from 'antd';
+import { Select } from 'antd';
 import { observer } from 'mobx-react';
 import { types } from 'mobx-state-tree';
 
@@ -19,7 +19,7 @@ import './Choices/Choises.styl';
 
 import './Choice';
 import DynamicChildrenMixin from '../../mixins/DynamicChildrenMixin';
-import { FF_DEV_2007, FF_DEV_2007_DEV_2008, FF_LSDV_4583, isFF } from '../../utils/feature-flags';
+import { FF_LSDV_4583, isFF } from '../../utils/feature-flags';
 import { ReadOnlyControlMixin } from '../../mixins/ReadOnlyMixin';
 import SelectedChoiceMixin from '../../mixins/SelectedChoiceMixin';
 import { HintTooltip } from '../../components/Taxonomy/Taxonomy';
@@ -37,8 +37,6 @@ const { Option } = Select;
  * The `Choices` tag can be used with any data types.
  *
  * [^FF_LSDV_4583]: `fflag_feat_front_lsdv_4583_multi_image_segmentation_short` should be enabled for `perItem` functionality.
- * [^FF_DEV_2007_DEV_2008]: `ff_dev_2007_dev_2008_dynamic_tag_children_250322_short` should be enabled to use dynamic options.
- * [^FF_DEV_2007]: `ff_dev_2007_rework_choices_280322_short` should be enabled to use `html` attribute
  *
  * @example
  * <!--Basic text classification labeling configuration-->
@@ -54,8 +52,8 @@ const { Option } = Select;
  *
  * @example <caption>This config with dynamic labels</caption>
  * <!--
- *   `Choice`s can be loaded dynamically from task data[^FF_DEV_2007_DEV_2008]. It should be an array of objects with attributes.
- *   `html` can be used to show enriched content[^FF_DEV_2007], it has higher priority than `value`, however `value` will be used in the exported result.
+ *   `Choice`s can be loaded dynamically from task data. It should be an array of objects with attributes.
+ *   `html` can be used to show enriched content, it has higher priority than `value`, however `value` will be used in the exported result.
  * -->
  * <View>
  *   <Audio name="audio" value="$audio" />
@@ -97,20 +95,15 @@ const { Option } = Select;
  * @param {string} [whenChoiceValue]   - Use with visibleWhen ("choice-selected" or "choice-unselected") and whenTagName, both are required. Narrow down visibility by choice value
  * @param {boolean} [perRegion]        - Use this tag to select a choice for a specific region instead of the entire task
  * @param {boolean} [perItem]          - Use this tag to select a choice for a specific item inside the object instead of the whole object[^FF_LSDV_4583]
- * @param {string} [value]             - Task data field containing a list of dynamically loaded choices (see example below)[^FF_DEV_2007_DEV_2008]
+ * @param {string} [value]             - Task data field containing a list of dynamically loaded choices (see example below)
  * @param {boolean} [allowNested]      - Allow to use `children` field in dynamic choices to nest them. Submitted result will contain array of arrays, every item is a list of values from topmost parent choice down to selected one.
  */
 const TagAttrs = types.model({
   toname: types.maybeNull(types.string),
-
   showinline: types.maybeNull(types.boolean),
-
   choice: types.optional(types.enumeration(['single', 'single-radio', 'multiple']), 'single'),
-
   layout: types.optional(types.enumeration(['select', 'inline', 'vertical']), 'vertical'),
-
-  ...(isFF(FF_DEV_2007_DEV_2008) ? { value: types.optional(types.string, '') } : {}),
-
+  value: types.optional(types.string, ''),
   allownested: types.optional(types.boolean, false),
 });
 
@@ -252,7 +245,7 @@ const ChoicesModel = types.compose(
   ReadOnlyControlMixin,
   SelectedChoiceMixin,
   VisibilityMixin,
-  ...(isFF(FF_DEV_2007_DEV_2008) ? [DynamicChildrenMixin] : []),
+  DynamicChildrenMixin,
   AnnotationMixin,
   TagAttrs,
   Model,
@@ -296,9 +289,7 @@ const HtxChoices = observer(({ item }) => {
       {item.layout === 'select' ? (
         <ChoicesSelectLayout item={item} />
       ) : (
-        !isFF(FF_DEV_2007)
-          ? <Form layout={item.layout}>{Tree.renderChildren(item, item.annotation)}</Form>
-          : Tree.renderChildren(item, item.annotation)
+        Tree.renderChildren(item, item.annotation)
       )}
     </Block>
   );

src/tags/control/Labels/Labels.js

@@ -13,7 +13,6 @@ import DynamicChildrenMixin from '../../../mixins/DynamicChildrenMixin';
 import LabelMixin from '../../../mixins/LabelMixin';
 import SelectedModelMixin from '../../../mixins/SelectedModel';
 import { Block } from '../../../utils/bem';
-import { FF_DEV_2007_DEV_2008, isFF } from '../../../utils/feature-flags';
 import ControlBase from '../Base';
 import '../Label';
 import './Labels.styl';
@@ -85,7 +84,7 @@ const TagAttrs = types.model({
   fillopacity: types.maybeNull(customTypes.range()),
   allowempty: types.optional(types.boolean, false),
 
-  ...(isFF(FF_DEV_2007_DEV_2008) ? { value: types.optional(types.string, '') } : {}),
+  value: types.optional(types.string, ''),
 });
 
 /**
@@ -141,7 +140,7 @@ const LabelsModel = types.compose(
   ModelAttrs,
   TagAttrs,
   AnnotationMixin,
-  ...(isFF(FF_DEV_2007_DEV_2008) ? [DynamicChildrenMixin] : []),
+  DynamicChildrenMixin,
   Model,
   SelectedModelMixin.props({ _child: 'LabelModel' }),
 );

src/tags/control/Taxonomy/Taxonomy.js

@@ -21,7 +21,6 @@ import { SharedStoreMixin } from '../../../mixins/SharedChoiceStore/mixin';
 import VisibilityMixin from '../../../mixins/Visibility';
 import { parseValue } from '../../../utils/data';
 import {
-  FF_DEV_2007_DEV_2008,
   FF_DEV_3617,
   FF_LSDV_4583,
   FF_TAXONOMY_ASYNC,
@@ -102,7 +101,7 @@ const TagAttrs = types.model({
   maxwidth: types.maybeNull(types.string),
   dropdownwidth: types.maybeNull(types.string),
   maxusages: types.maybeNull(types.string),
-  ...(isFF(FF_DEV_2007_DEV_2008) ? { value: types.optional(types.string, '') } : {}),
+  value: types.optional(types.string, ''),
 });
 
 function traverse(root) {
@@ -135,7 +134,7 @@ function traverse(root) {
   };
 
   if (!root) return [];
-  if (isFF(FF_DEV_2007_DEV_2008) && !Array.isArray(root)) return visitUnique([root]);
+  if (!Array.isArray(root)) return visitUnique([root]);
   return visitUnique(root);
 }
 
@@ -573,7 +572,7 @@ const TaxonomyModel = types.compose('TaxonomyModel',
   ControlBase,
   ClassificationBase,
   TagAttrs,
-  ...(isFF(FF_DEV_2007_DEV_2008) ? [DynamicChildrenMixin] : []),
+  DynamicChildrenMixin,
   AnnotationMixin,
   RequiredMixin,
   Model,