BUGFIX: Prevent rendering of SearchBox

When the displaySearchBox property is false, we should not render the SelectBox that is responsible for the search. Fixes: #3673
neos · Dec 18, 2023 · c229a79 · c229a79
1 parent f5c3c50
commit c229a79
Show file tree

Hide file tree

Showing 2 changed files with 3 additions and 18 deletions.
diff --git a/packages/react-ui-components/src/MultiSelectBox/__snapshots__/multiSelectBox.spec.js.snap b/packages/react-ui-components/src/MultiSelectBox/__snapshots__/multiSelectBox.spec.js.snap
@@ -22,21 +22,5 @@ exports[`<MultiSelectBox/> should render correctly. 1`] = `
       values={Array []}
     />
   </ul>
-  <Component
-    IconButtonComponent={[Function]}
-    IconComponent={[Function]}
-    ListPreviewElement={[Function]}
-    MultiSelectBox_ListPreviewSortable={[Function]}
-    SelectBox={[Function]}
-    allowEmpty={true}
-    dndType="multiselect-box-value"
-    onCreateNew={[MockFunction]}
-    onValueChange={[Function]}
-    onValuesChange={[MockFunction]}
-    optionValueField="value"
-    options={Array []}
-    value=""
-    values={Array []}
-  />
 </div>
 `;
diff --git a/packages/react-ui-components/src/MultiSelectBox/multiSelectBox.js b/packages/react-ui-components/src/MultiSelectBox/multiSelectBox.js
@@ -185,6 +185,7 @@ class MultiSelectBox extends PureComponent {
     render() {
         const {
             searchOptions,
+            displaySearchBox,
             values,
             optionValueField,
             theme,
@@ -217,13 +218,13 @@ class MultiSelectBox extends PureComponent {
                         disabled={disabled}
                         />
                 </ul>
-                <SelectBox
+                {displaySearchBox && (<SelectBox
                     {...omit(this.props, ['theme', 'className'])}
                     options={filteredSearchOptions}
                     value=""
                     onValueChange={this.handleNewValueSelected}
                     disabled={disabled}
-                    />
+                />)}
             </div>
         );
     }