[WC-1769]: fix feedback (#456)

r0b1n · web-flow · commit 3451aca3d8a4 · 2023-03-20T14:04:40.000+01:00
diff --git a/packages/pluggableWidgets/datagrid-web/src/Datagrid.editorConfig.ts b/packages/pluggableWidgets/datagrid-web/src/Datagrid.editorConfig.ts
@@ -78,9 +78,6 @@ export function getProperties(
     if (values.showEmptyPlaceholder === "none") {
         hidePropertyIn(defaultProperties, values, "emptyPlaceholder");
     }
-    if (!values.showHeaderFilters) {
-        hidePropertyIn(defaultProperties, values, "filterList");
-    }
 
     hideSelectionProperties(defaultProperties, values);
 
@@ -127,7 +124,6 @@ export function getProperties(
                 "columnsHidable",
                 "configurationAttribute",
                 "onConfigurationChange",
-                "showHeaderFilters",
                 "filterList",
                 "filtersPlaceholder",
                 "filterSectionTitle"
@@ -229,7 +225,7 @@ export const getPreview = (
         borders: true
     })(
         dropzone(
-            dropzone.placeholder("Place filter widget(s) here"),
+            dropzone.placeholder("Place widgets like filter widget(s) and action button(s) here"),
             dropzone.hideDataSourceHeaderIf(canHideDataSourceHeader)
         )(values.filtersPlaceholder)
     );
@@ -296,7 +292,7 @@ export const getPreview = (
     return container()(
         titleHeader,
         ...(canHideDataSourceHeader ? [datasource(values.datasource)()] : []),
-        ...(values.showHeaderFilters && values.filterList.length > 0 ? [headerFilters] : []),
+        headerFilters,
         headers,
         ...Array.from({ length: 5 }).map(() => columns),
         ...footer
diff --git a/packages/pluggableWidgets/datagrid-web/src/Datagrid.editorPreview.tsx b/packages/pluggableWidgets/datagrid-web/src/Datagrid.editorPreview.tsx
@@ -122,11 +122,9 @@ export function preview(props: DatagridPreviewProps): ReactElement {
             )}
             hasMoreItems={false}
             headerFilters={
-                props.showHeaderFilters ? (
-                    <props.filtersPlaceholder.renderer caption="Place filter widget(s) here">
-                        <div />
-                    </props.filtersPlaceholder.renderer>
-                ) : null
+                <props.filtersPlaceholder.renderer caption="Place widgets like filter widget(s) and action button(s) here">
+                    <div />
+                </props.filtersPlaceholder.renderer>
             }
             headerWrapperRenderer={selectableWrapperRenderer}
             numberOfItems={5}
diff --git a/packages/pluggableWidgets/datagrid-web/src/Datagrid.tsx b/packages/pluggableWidgets/datagrid-web/src/Datagrid.tsx
@@ -173,33 +173,25 @@ export default function Datagrid(props: DatagridContainerProps): ReactElement {
             hasMoreItems={props.datasource.hasMoreItems ?? false}
             headerWrapperRenderer={useCallback((_columnIndex: number, header: ReactElement) => header, [])}
             headerFilters={useMemo(
-                () =>
-                    props.showHeaderFilters ? (
-                        <FilterContext.Provider
-                            value={{
-                                filterDispatcher: prev => {
-                                    if (prev.filterType) {
-                                        const [, filterDispatcher] = multipleFilteringState[prev.filterType];
-                                        filterDispatcher(prev);
-                                        setFiltered(true);
-                                    }
-                                    return prev;
-                                },
-                                multipleAttributes: filterList,
-                                multipleInitialFilters
-                            }}
-                        >
-                            {props.filtersPlaceholder}
-                        </FilterContext.Provider>
-                    ) : null,
-                [
-                    FilterContext,
-                    filterList,
-                    multipleInitialFilters,
-                    props.filtersPlaceholder,
-                    multipleFilteringState,
-                    props.showHeaderFilters
-                ]
+                () => (
+                    <FilterContext.Provider
+                        value={{
+                            filterDispatcher: prev => {
+                                if (prev.filterType) {
+                                    const [, filterDispatcher] = multipleFilteringState[prev.filterType];
+                                    filterDispatcher(prev);
+                                    setFiltered(true);
+                                }
+                                return prev;
+                            },
+                            multipleAttributes: filterList,
+                            multipleInitialFilters
+                        }}
+                    >
+                        {props.filtersPlaceholder}
+                    </FilterContext.Provider>
+                ),
+                [FilterContext, filterList, multipleInitialFilters, props.filtersPlaceholder, multipleFilteringState]
             )}
             id={id.current}
             numberOfItems={props.datasource.totalCount}
diff --git a/packages/pluggableWidgets/datagrid-web/src/Datagrid.xml b/packages/pluggableWidgets/datagrid-web/src/Datagrid.xml
@@ -258,13 +258,9 @@
         </propertyGroup>
         <propertyGroup caption="Grid wide filtering">
             <propertyGroup caption="Grid wide filtering">
-                <property key="showHeaderFilters" type="boolean" defaultValue="false">
-                    <caption>Grid wide filters</caption>
-                    <description>When enabled and at least one filter is configured below, there is a dropzone available above the grid. Filter widgets can be added here to filter over multiple attributes/columns instead of a single column. To filter per column, check the column configuration.</description>
-                </property>
                 <property key="filterList" type="object" isList="true" required="false">
                     <caption>Filters</caption>
-                    <description>The list of attributes that are used by the filter widgets placed in the grid wide dropzone. Filtering over associations it not supported.</description>
+                    <description>The list of attributes is used by the filter widgets that are placed in the placeholder above the data grid. This enables filtering across multiple attributes or columns instead of limiting to a single column.</description>
                     <properties>
                         <propertyGroup caption="General">
                             <property key="filter" type="attribute" dataSource="../datasource">
diff --git a/packages/pluggableWidgets/datagrid-web/typings/DatagridProps.d.ts b/packages/pluggableWidgets/datagrid-web/typings/DatagridProps.d.ts
@@ -101,7 +101,6 @@ export interface DatagridContainerProps {
     columnsDraggable: boolean;
     columnsHidable: boolean;
     configurationAttribute?: EditableValue<string>;
-    showHeaderFilters: boolean;
     filterList: FilterListType[];
     filtersPlaceholder?: ReactNode;
     filterSectionTitle?: DynamicValue<string>;
@@ -138,7 +137,6 @@ export interface DatagridPreviewProps {
     columnsHidable: boolean;
     configurationAttribute: string;
     onConfigurationChange: {} | null;
-    showHeaderFilters: boolean;
     filterList: FilterListPreviewType[];
     filtersPlaceholder: { widgetCount: number; renderer: ComponentType<{ caption?: string }> };
     filterSectionTitle: string;
diff --git a/packages/pluggableWidgets/gallery-web/src/Gallery.editorConfig.ts b/packages/pluggableWidgets/gallery-web/src/Gallery.editorConfig.ts
@@ -26,10 +26,6 @@ export function getProperties(
         hidePropertyIn(defaultProperties, values, "emptyPlaceholder");
     }
 
-    if (!showHeader(values)) {
-        hidePropertyIn(defaultProperties, values, "filtersPlaceholder");
-    }
-
     if (values.itemSelection === "None") {
         hidePropertyIn(defaultProperties, values, "onSelectionChange");
     }
@@ -116,7 +112,7 @@ export function getPreview(values: GalleryPreviewProps, isDarkMode: boolean): St
             {
                 type: "DropZone",
                 property: values.filtersPlaceholder,
-                placeholder: "Gallery header: Place widgets here"
+                placeholder: "Place widgets like filter widget(s) and action button(s) here"
             } as DropZoneProps
         ]
     } as RowLayoutProps;
@@ -187,14 +183,10 @@ export function getPreview(values: GalleryPreviewProps, isDarkMode: boolean): St
 
     return {
         type: "Container",
-        children: [titleHeader, ...(showHeader(values) ? [filters] : []), content, ...footer]
+        children: [titleHeader, filters, content, ...footer]
     };
 }
 
 function getSingularPlural(word: string, elements: number): string {
     return elements > 1 ? word + "s" : word;
 }
-
-function showHeader(values: GalleryPreviewProps): boolean {
-    return values.filterList?.length > 0 || values.sortList?.length > 0 || values.itemSelection === "Multi";
-}
diff --git a/packages/pluggableWidgets/gallery-web/src/Gallery.editorPreview.tsx b/packages/pluggableWidgets/gallery-web/src/Gallery.editorPreview.tsx
@@ -8,7 +8,6 @@ function Preview(props: GalleryPreviewProps): ReactElement {
         id: String(index) as GUID
     }));
 
-    const showHeader = props.filterList.length > 0 || props.sortList.length > 0 || props.itemSelection === "Multi";
     return (
         <GalleryComponent
             className={props.class}
@@ -22,13 +21,11 @@ function Preview(props: GalleryPreviewProps): ReactElement {
                 [props.emptyPlaceholder]
             )}
             header={
-                showHeader ? (
-                    <props.filtersPlaceholder.renderer caption="Gallery header: Place widgets here">
-                        <div />
-                    </props.filtersPlaceholder.renderer>
-                ) : null
+                <props.filtersPlaceholder.renderer caption="Place widgets like filter widget(s) and action button(s) here">
+                    <div />
+                </props.filtersPlaceholder.renderer>
             }
-            showHeader={!!props.filterList.length}
+            showHeader
             hasMoreItems={false}
             items={items}
             itemRenderer={useCallback(
diff --git a/packages/pluggableWidgets/selection-helper-web/CHANGELOG.md b/packages/pluggableWidgets/selection-helper-web/CHANGELOG.md
@@ -8,4 +8,4 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 
 ### Added
 
--   We added Selection Helper widget.
+-   We added Selection helper widget.
diff --git a/packages/pluggableWidgets/selection-helper-web/README.md b/packages/pluggableWidgets/selection-helper-web/README.md
@@ -1,3 +1,3 @@
-# Selection Helper
+# Selection helper
 
-Please see [Selection Helper](https://docs.mendix.com/appstore/modules/gallery#selection-helper-widget) in the Mendix documentation for details.
+Please see [Selection helper](https://docs.mendix.com/appstore/modules/gallery#selection-helper-widget) in the Mendix documentation for details.
diff --git a/packages/pluggableWidgets/selection-helper-web/src/SelectionHelper.tsx b/packages/pluggableWidgets/selection-helper-web/src/SelectionHelper.tsx
@@ -10,7 +10,7 @@ export function SelectionHelper(props: SelectionHelperContainerProps): ReactElem
     if (contextValue.hasError) {
         return (
             <Alert bootstrapStyle="danger">
-                The Selection Helper widget must be placed inside the header of the Gallery widget with multi-selection.
+                The Selection helper widget must be placed inside the header of the Gallery widget with multi-selection.
             </Alert>
         );
     }
diff --git a/packages/pluggableWidgets/selection-helper-web/src/SelectionHelper.xml b/packages/pluggableWidgets/selection-helper-web/src/SelectionHelper.xml
@@ -1,6 +1,6 @@
 <?xml version="1.0" encoding="utf-8" ?>
 <widget id="com.mendix.widget.web.selectionhelper.SelectionHelper" pluginWidget="true" needsEntityContext="true" offlineCapable="true" supportedPlatform="Web" xmlns="http://www.mendix.com/widget/1.0/" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://www.mendix.com/widget/1.0/ ../node_modules/mendix/custom_widget.xsd">
-    <name>Selection Helper</name>
+    <name>Selection helper</name>
     <description />
     <studioProCategory>Data controls</studioProCategory>
     <studioCategory>Data Controls</studioCategory>
@@ -9,14 +9,14 @@
         <propertyGroup caption="General">
             <property key="renderStyle" type="enumeration" defaultValue="checkbox">
                 <caption>Style</caption>
-                <description />
+                <description>Custom enables placeholders for using widgets for the different states.</description>
                 <enumerationValues>
-                    <enumerationValue key="checkbox">Checkbox</enumerationValue>
+                    <enumerationValue key="checkbox">Check box</enumerationValue>
                     <enumerationValue key="custom">Custom</enumerationValue>
                 </enumerationValues>
             </property>
             <property key="checkboxCaption" type="textTemplate" required="false">
-                <caption>Checkbox caption</caption>
+                <caption>Check box caption</caption>
                 <description />
             </property>
             <property key="customAllSelected" type="widgets">

Original file line number	Diff line number	Diff line change
`@@ -26,10 +26,6 @@ export function getProperties(`
`26`	`26`	`hidePropertyIn(defaultProperties, values, "emptyPlaceholder");`
`27`	`27`	`}`
`28`	`28`
`29`		`- if (!showHeader(values)) {`
`30`		`- hidePropertyIn(defaultProperties, values, "filtersPlaceholder");`
`31`		`- }`
`32`		`-`
`33`	`29`	`if (values.itemSelection === "None") {`
`34`	`30`	`hidePropertyIn(defaultProperties, values, "onSelectionChange");`
`35`	`31`	`}`
`@@ -116,7 +112,7 @@ export function getPreview(values: GalleryPreviewProps, isDarkMode: boolean): St`
`116`	`112`	`{`
`117`	`113`	`type: "DropZone",`
`118`	`114`	`property: values.filtersPlaceholder,`
`119`		`- placeholder: "Gallery header: Place widgets here"`
	`115`	`+ placeholder: "Place widgets like filter widget(s) and action button(s) here"`
`120`	`116`	`} as DropZoneProps`
`121`	`117`	`]`
`122`	`118`	`} as RowLayoutProps;`
`@@ -187,14 +183,10 @@ export function getPreview(values: GalleryPreviewProps, isDarkMode: boolean): St`
`187`	`183`
`188`	`184`	`return {`
`189`	`185`	`type: "Container",`
`190`		`- children: [titleHeader, ...(showHeader(values) ? [filters] : []), content, ...footer]`
	`186`	`+ children: [titleHeader, filters, content, ...footer]`
`191`	`187`	`};`
`192`	`188`	`}`
`193`	`189`
`194`	`190`	`function getSingularPlural(word: string, elements: number): string {`
`195`	`191`	`return elements > 1 ? word + "s" : word;`
`196`	`192`	`}`
`197`		`-`
`198`		`-function showHeader(values: GalleryPreviewProps): boolean {`
`199`		`- return values.filterList?.length > 0 \|\| values.sortList?.length > 0 \|\| values.itemSelection === "Multi";`
`200`		`-}`
Original file line number	Diff line number	Diff line change
`@@ -8,4 +8,4 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),`
`8`	`8`
`9`	`9`	`### Added`
`10`	`10`
`11`		`-- We added Selection Helper widget.`
	`11`	`+- We added Selection helper widget.`
Original file line number	Diff line number	Diff line change
`@@ -10,7 +10,7 @@ export function SelectionHelper(props: SelectionHelperContainerProps): ReactElem`
`10`	`10`	`if (contextValue.hasError) {`
`11`	`11`	`return (`
`12`	`12`	`<Alert bootstrapStyle="danger">`
`13`		`- The Selection Helper widget must be placed inside the header of the Gallery widget with multi-selection.`
	`13`	`+ The Selection helper widget must be placed inside the header of the Gallery widget with multi-selection.`
`14`	`14`	`</Alert>`
`15`	`15`	`);`
`16`	`16`	`}`