Fix [Filter] Add default "Apply" button 1.5.x (#2010)

mlrun · Oct 6, 2023 · 406d61c · 406d61c
1 parent c9de438
commit 406d61c
Show file tree

Hide file tree

Showing 4 changed files with 8 additions and 15 deletions.
diff --git a/src/components/ArtifactsActionBar/ArtifactsActionBar.js b/src/components/ArtifactsActionBar/ArtifactsActionBar.js
@@ -142,9 +142,7 @@ function ArtifactsActionBar({
           <div className="action-bar__filters">
             <NameFilter applyChanges={value => applyChanges(value, filterMenuModal.values)} />
             <FilterMenuModal
-              applyButton={{ label: 'Apply', variant: 'secondary' }}
               applyChanges={filterMenuModal => applyChanges(formState.values.name, filterMenuModal)}
-              cancelButton={{ label: 'Clear', variant: 'tertiary' }}
               filterMenuName={filterMenuName}
               initialValues={filtersInitialState}
               restartFormTrigger={tab ?? page}

diff --git a/src/components/FilterMenuModal/FilterMenuModal.js b/src/components/FilterMenuModal/FilterMenuModal.js
@@ -47,6 +47,7 @@ const FilterMenuModal = ({
   initialValues,
   restartFormTrigger,
   values,
+  withoutApplyButton,
   wizardClassName
 }) => {
   const [filtersWizardIsShown, setFiltersWizardIsShown] = useState(false)
@@ -186,7 +187,7 @@ const FilterMenuModal = ({
                           variant={cancelButton.variant}
                         />
                       )}
-                      {applyButton && (
+                      {applyButton && !withoutApplyButton && (
                         <Button
                           disabled={isEqual(filtersData.values, formState.values)}
                           variant={applyButton.variant}
@@ -208,10 +209,11 @@ const FilterMenuModal = ({
 
 FilterMenuModal.defaultProps = {
   applyChanges: null,
-  applyButton: null,
-  cancelButton: null,
+  applyButton: { label: 'Apply', variant: 'secondary' },
+  cancelButton: { label: 'Clear', variant: 'tertiary' },
   header: 'Filter by',
   restartFormTrigger: null,
+  withoutApplyButton: false,
   wizardClassName: ''
 }
 
@@ -230,6 +232,7 @@ FilterMenuModal.propTypes = {
   initialValues: PropTypes.shape({}).isRequired,
   restartFormTrigger: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),
   values: PropTypes.shape({}).isRequired,
+  withoutApplyButton: PropTypes.bool,
   wizardClassName: PropTypes.string
 }
 

diff --git a/src/components/FilterMenuModal/HubCategoriesFilter/HubCategoriesFilter.js b/src/components/FilterMenuModal/HubCategoriesFilter/HubCategoriesFilter.js
@@ -21,19 +21,17 @@ import React, { useContext, useEffect } from 'react'
 import PropTypes from 'prop-types'
 import { OnChange } from 'react-final-form-listeners'
 import { isEqual, pickBy } from 'lodash'
-import { useDispatch, useSelector } from 'react-redux'
+import { useSelector } from 'react-redux'
 import { useForm } from 'react-final-form'
 
 import { FilterMenuWizardContext } from '../FilterMenuModal'
 import { FormCheckBox } from 'igz-controls/components'
 
 import { FILTER_MENU_MODAL, HUB_CATEGORIES_FILTER } from '../../../constants'
-import { setModalFiltersValues } from '../../../reducers/filtersReducer'
 
 import './hubCategoriesFilter.scss'
 
 const HubCategoriesFilter = ({ templates }) => {
-  const dispatch = useDispatch()
   const form = useForm()
   const filtersContext = useContext(FilterMenuWizardContext)
   const filtersStoreHubCategories = useSelector(
@@ -64,12 +62,7 @@ const HubCategoriesFilter = ({ templates }) => {
             const hubCategories = pickBy(next, value => value)
 
             if (!isEqual(hubCategories, filtersStoreHubCategories)) {
-              dispatch(
-                setModalFiltersValues({
-                  name: filtersContext.filterMenuName,
-                  value: { [HUB_CATEGORIES_FILTER]: hubCategories }
-                })
-              )
+              form.change(HUB_CATEGORIES_FILTER, hubCategories)
             }
           }
         }}

diff --git a/...ponents/JobWizard/JobWizardSteps/JobWizardFunctionSelection/JobWizardFunctionSelection.js b/...ponents/JobWizard/JobWizardSteps/JobWizardFunctionSelection/JobWizardFunctionSelection.js
@@ -411,7 +411,6 @@ const JobWizardFunctionSelection = ({
               setMatches={setFilterMatches}
             />
             <FilterMenuModal
-              cancelButton={{ label: 'Clear', variant: 'tertiary' }}
               header="Filter by category"
               wizardClassName="hub-filter"
               filterMenuName={JOB_WIZARD_FILTERS}