improve UI handling by the prop component ActionButton

Author: Blue-B-code

src/components/generics/SearcherActionButton.jsx

@@ -22,4 +22,4 @@ const SearcherActionButton = ({ onClick, startIcon, label }) => {
   );
 };
 
-export default SearcherActionButton;
+export default SearcherActionButton;

src/components/generics/SearcherPane.jsx

@@ -103,6 +103,7 @@ class SearcherPane extends Component {
       appliedFiltersRowStructure = null,
       setAppliedFiltersRowStructure = null,
       applyNumberCircle = null,
+      ActionButton = SearcherActionButton,
     } = this.props;
     return (
       <StyledSearcherPane>
@@ -135,23 +136,23 @@ class SearcherPane extends Component {
                     )}
                     {!!actions &&
                       actions.map((a, idx) => (
-                        <SearcherActionButton
+                        <ActionButton
                           key={`action-${idx}`}
                           onClick={a.action}
                           startIcon={a.icon}
                           label={a.label || ""}
                         />
                       ))}
                     {!!reset && (
-                      <SearcherActionButton
+                      <ActionButton
                         key="action-reset"
                         startIcon={<ResetFilterIcon />}
                         onClick={this.debouncedReset}
                         label={formatMessage(this.props.intl, module, "resetFilterTooltip")}
                       />
                     )}
                     {!!refresh && (
-                      <SearcherActionButton
+                      <ActionButton
                         key="action-refresh"
                         startIcon={<DefaultSearchIcon />}
                         onClick={this.debouncedRefresh}