diff --git a/geonode_mapstore_client/client/js/actions/gnsearch.js b/geonode_mapstore_client/client/js/actions/gnsearch.js index d4092af029..fa93bc7ea8 100644 --- a/geonode_mapstore_client/client/js/actions/gnsearch.js +++ b/geonode_mapstore_client/client/js/actions/gnsearch.js @@ -21,6 +21,7 @@ export const GET_FACET_ITEMS = 'GEONODE:GET_FACET_ITEMS'; export const SET_FACET_ITEMS = 'GEONODE:SET_FACET_ITEMS'; export const GET_FACET_FILTERS = 'GEONODE:GET_FACET_FILTERS'; export const SET_FILTERS = "SET_FILTERS"; +export const SHOW_FILTER_FORM = "GEONODE:SHOW_FILTER_FORM"; /** * Actions for GeoNode resource featured items @@ -140,6 +141,13 @@ export function setFilters(filters) { }; } +export function showFilterForm(show) { + return { + type: SHOW_FILTER_FORM, + show + }; +} + export default { SEARCH_RESOURCES, searchResources, @@ -151,5 +159,7 @@ export default { requestResource, setFeaturedResources, SET_SEARCH_CONFIG, - setSearchConfig + setSearchConfig, + SHOW_FILTER_FORM, + showFilterForm }; diff --git a/geonode_mapstore_client/client/js/plugins/ResourcesGrid.jsx b/geonode_mapstore_client/client/js/plugins/ResourcesGrid.jsx index 911fb7b755..9abfbb7db5 100644 --- a/geonode_mapstore_client/client/js/plugins/ResourcesGrid.jsx +++ b/geonode_mapstore_client/client/js/plugins/ResourcesGrid.jsx @@ -30,8 +30,8 @@ import { import { withResizeDetector } from 'react-resize-detector'; import { userSelector } from '@mapstore/framework/selectors/security'; import ConnectedCardGrid from '@js/plugins/resourcesgrid/ConnectedCardGrid'; -import { getTotalResources, getFacetsItems } from '@js/selectors/search'; -import { searchResources, setSearchConfig, getFacetItems, setFilters as setFiltersAction } from '@js/actions/gnsearch'; +import { getTotalResources, getFacetsItems, getShowFilterForm } from '@js/selectors/search'; +import { searchResources, setSearchConfig, getFacetItems, setFilters as setFiltersAction, showFilterForm as showFilterFormAction } from '@js/actions/gnsearch'; import gnsearch from '@js/reducers/gnsearch'; import gnresource from '@js/reducers/gnresource'; @@ -541,9 +541,14 @@ function ResourcesGrid({ onGetFacets, facets, filters, - setFilters + setFilters, + showFilterForm: showFilterFormProp, + setShowFilterForm }, context) { + const showDetail = !isEmpty(resource); + const showFilterForm = showFilterFormProp && !showDetail; + const [_cardLayoutStyleState, setCardLayoutStyle] = useLocalStorage('layoutCardsStyle', defaultCardLayoutStyle); const cardLayoutStyleState = cardLayoutStyle || _cardLayoutStyleState; // Force style when `cardLayoutStyle` is configured @@ -591,10 +596,6 @@ function ResourcesGrid({ excludeQueryKeys: [] }); - const [_showFilterForm, setShowFilterForm] = useState(false); - const showDetail = !isEmpty(resource); - const showFilterForm = _showFilterForm && !showDetail; - const handleShowFilterForm = (show) => { if (!isEmpty(resource)) { const href = closeDetailPanelHref(); @@ -858,8 +859,9 @@ const ResourcesGridPlugin = connect( state => getMonitoredState(state, getConfigProp('monitorState')), state => state?.gnsearch?.error, getFacetsItems, - state => state?.gnsearch?.filters - ], (params, user, totalResources, loading, location, resource, monitoredState, error, facets, filters) => ({ + state => state?.gnsearch?.filters, + getShowFilterForm + ], (params, user, totalResources, loading, location, resource, monitoredState, error, facets, filters, showFilterForm) => ({ params, user, totalResources, @@ -869,13 +871,15 @@ const ResourcesGridPlugin = connect( monitoredState, error, facets, - filters + filters, + showFilterForm })), { onSearch: searchResources, onInit: setSearchConfig, onGetFacets: getFacetItems, - setFilters: setFiltersAction + setFilters: setFiltersAction, + setShowFilterForm: showFilterFormAction } )(withResizeDetector(withPageConfig(ResourcesGrid))); diff --git a/geonode_mapstore_client/client/js/reducers/gnsearch.js b/geonode_mapstore_client/client/js/reducers/gnsearch.js index 112fbf968a..db818c4196 100644 --- a/geonode_mapstore_client/client/js/reducers/gnsearch.js +++ b/geonode_mapstore_client/client/js/reducers/gnsearch.js @@ -18,7 +18,8 @@ import { INCREASE_TOTAL_COUNT, SET_SEARCH_CONFIG, SET_FACET_ITEMS, - SET_FILTERS + SET_FILTERS, + SHOW_FILTER_FORM } from '@js/actions/gnsearch'; import { UPDATE_SINGLE_RESOURCE } from '@js/actions/gnresource'; @@ -132,6 +133,11 @@ function gnsearch(state = defaultState, action) { ...state, filters: {...state.filters, ...action.filters} }; + case SHOW_FILTER_FORM: + return { + ...state, + showFilterForm: !!action.show + }; default: return state; } diff --git a/geonode_mapstore_client/client/js/selectors/search.js b/geonode_mapstore_client/client/js/selectors/search.js index db3aab14fe..b35428be9c 100644 --- a/geonode_mapstore_client/client/js/selectors/search.js +++ b/geonode_mapstore_client/client/js/selectors/search.js @@ -42,3 +42,4 @@ export const getTotalResources = (state) => { }; export const getFacetsItems = state => state?.gnsearch?.facetItems; +export const getShowFilterForm = state => state?.gnsearch?.showFilterForm; diff --git a/geonode_mapstore_client/templates/index.html b/geonode_mapstore_client/templates/index.html index 7086939dc1..6542675f41 100644 --- a/geonode_mapstore_client/templates/index.html +++ b/geonode_mapstore_client/templates/index.html @@ -57,22 +57,24 @@ {% endblock %} - + {% block ms_scripts %} {% endblock %}