AntDesign - Fix FieldSelect with 3+ level !struct nesting (#564)

* Fix AntDesign FieldSelect with 2+ level nesting

* lint fix

* chlog

* fix test

Author: ukrbublik

CHANGELOG.md

@@ -5,6 +5,7 @@
   - Fixed issue with frozen config (`Object.freeze`) by using `clone` (issue #345) (PR #490)
   - Fix: Filter value sources for func args correctly. LHS field can be used as arg in RHS function. (PR #490)
   - MUI - Support showSearch (autocomplete) for field select widget (issue #479 #521) (PR #563)
+  - AntDesign - Fix FieldSelect with 3+ level !struct nesting (issue #224) (PR #564)
 - 4.7.2
   - Fixed import of rule_group with `not` (issue #548) (PR #559)
 - 4.7.1

modules/components/widgets/antd/core/FieldSelect.jsx

@@ -77,19 +77,25 @@ export default class FieldSelect extends PureComponent {
     return res;
   }
 
-  renderSelectItems(fields) {
+  renderSelectItems(fields, level = 0) {
     return fields.map(field => {
       const {items, key, path, label, fullLabel, altLabel, tooltip, grouplabel, disabled} = field;
+      const groupPrefix = level > 0 ? "\u00A0\u00A0".repeat(level) : "";
+      const prefix = level > 1 ? "\u00A0\u00A0".repeat(level-1) : "";
       const pathKey = path || key;
       if (items) {
-        return <OptGroup
-          key={pathKey}
-          label={label}
-        >
-          {this.renderSelectItems(items)}
-        </OptGroup>;
+        const simpleItems = items.filter(it => !it.items);
+        const complexItems = items.filter(it => !!it.items);
+        const gr = simpleItems.length
+          ? [<OptGroup
+            key={pathKey}
+            label={groupPrefix+label}
+          >{this.renderSelectItems(simpleItems, level+1)}</OptGroup>]
+          : [];
+        const list = complexItems.length ? this.renderSelectItems(complexItems, level+1) : [];
+        return [...gr, ...list];
       } else {
-        const option = tooltip ? <Tooltip title={tooltip}>{label}</Tooltip> : label;
+        const option = tooltip ? <Tooltip title={tooltip}>{prefix+label}</Tooltip> : prefix+label;
         return <Option
           key={pathKey}
           value={pathKey}
@@ -101,7 +107,7 @@ export default class FieldSelect extends PureComponent {
           {option}
         </Option>;
       }
-    });
+    }).flat(Infinity);
   }
 
 }

tests/specs/WidgetsAntd.test.js

@@ -9,7 +9,7 @@ describe("antdesign widgets render", () => {
   it("should render select by default", () => {
     with_qb_ant(configs.with_struct, inits.with_nested, "JsonLogic", (qb) => {
       expect(qb.find(".query-builder")).to.have.length(1);
-      expect(qb.find(".ant-select-selection-item").at(0).text()).to.equal("user.info.firstName");
+      expect(qb.find(".ant-select-selection-item").at(0).text()).to.equal("  firstName");
     });
   });