diff --git a/src/bundle/ui-dev/src/modules/universal-discovery/components/breadcrumbs/breadcrumbs.helpers.js b/src/bundle/ui-dev/src/modules/universal-discovery/components/breadcrumbs/breadcrumbs.helpers.js new file mode 100644 index 0000000000..6e4ddc66c7 --- /dev/null +++ b/src/bundle/ui-dev/src/modules/universal-discovery/components/breadcrumbs/breadcrumbs.helpers.js @@ -0,0 +1,9 @@ +export const getLoadedLocationsLimitedMap = (loadedLocationsFullMap, activeLocationId) => { + const itemIndex = loadedLocationsFullMap.findIndex(({ parentLocationId }) => parentLocationId === activeLocationId); + + if (itemIndex === -1) { + return []; + } + + return loadedLocationsFullMap.slice(0, itemIndex + 1); +}; diff --git a/src/bundle/ui-dev/src/modules/universal-discovery/components/breadcrumbs/breadcrumbs.js b/src/bundle/ui-dev/src/modules/universal-discovery/components/breadcrumbs/breadcrumbs.js index e2a2feafd1..8e89b6e312 100644 --- a/src/bundle/ui-dev/src/modules/universal-discovery/components/breadcrumbs/breadcrumbs.js +++ b/src/bundle/ui-dev/src/modules/universal-discovery/components/breadcrumbs/breadcrumbs.js @@ -2,13 +2,17 @@ import React, { useContext, useState, useMemo, useEffect, useCallback } from 're import Icon from '../../../common/icon/icon'; -import { createCssClassNames } from '../../../common/helpers/css.class.names'; -import { LoadedLocationsMapContext } from '../../universal.discovery.module'; import { getTranslator } from '@ibexa-admin-ui/src/bundle/Resources/public/js/scripts/helpers/context.helper'; +import { createCssClassNames } from '../../../common/helpers/css.class.names'; +import { getLoadedLocationsLimitedMap } from './breadcrumbs.helpers'; +import { LoadedLocationsMapContext, MarkedLocationIdContext, GridActiveLocationIdContext } from '../../universal.discovery.module'; const Breadcrumbs = () => { const Translator = getTranslator(); - const [loadedLocationsMap, dispatchLoadedLocationsAction] = useContext(LoadedLocationsMapContext); + const [, setMarkedLocationId] = useContext(MarkedLocationIdContext); + const [gridActiveLocationId, setGridActiveLocationId] = useContext(GridActiveLocationIdContext); + const [loadedLocationsFullMap, dispatchLoadedLocationsAction] = useContext(LoadedLocationsMapContext); + const loadedLocationsMap = getLoadedLocationsLimitedMap(loadedLocationsFullMap, gridActiveLocationId); const [hiddenListVisible, setHiddenListVisible] = useState(false); const { visibleItems, hiddenItems } = useMemo(() => { return loadedLocationsMap.reduce( @@ -31,6 +35,8 @@ const Breadcrumbs = () => { updatedLoadedLocations[updatedLoadedLocations.length - 1].subitems = []; dispatchLoadedLocationsAction({ type: 'SET_LOCATIONS', data: updatedLoadedLocations }); + setMarkedLocationId(locationId); + setGridActiveLocationId(locationId); }; const toggleHiddenListVisible = useCallback(() => { setHiddenListVisible(!hiddenListVisible); diff --git a/src/bundle/ui-dev/src/modules/universal-discovery/components/grid-view/grid.view.item.js b/src/bundle/ui-dev/src/modules/universal-discovery/components/grid-view/grid.view.item.js index 4a51298967..8752c8c1ad 100644 --- a/src/bundle/ui-dev/src/modules/universal-discovery/components/grid-view/grid.view.item.js +++ b/src/bundle/ui-dev/src/modules/universal-discovery/components/grid-view/grid.view.item.js @@ -13,6 +13,7 @@ import { MultipleConfigContext, ContainersOnlyContext, AllowedContentTypesContext, + GridActiveLocationIdContext, } from '../../universal.discovery.module'; const isSelectionButtonClicked = (event) => { @@ -20,6 +21,7 @@ const isSelectionButtonClicked = (event) => { }; const GridViewItem = ({ location, version }) => { + const [, setGridActiveLocationId] = useContext(GridActiveLocationIdContext); const [markedLocationId, setMarkedLocationId] = useContext(MarkedLocationIdContext); const [, dispatchLoadedLocationsAction] = useContext(LoadedLocationsMapContext); const contentTypesMap = useContext(ContentTypesMapContext); @@ -44,6 +46,8 @@ const GridViewItem = ({ location, version }) => { } setMarkedLocationId(location.id); + dispatchLoadedLocationsAction({ type: 'CUT_LOCATIONS', locationId: location.id }); + dispatchLoadedLocationsAction({ type: 'UPDATE_LOCATIONS', data: { parentLocationId: location.id, subitems: [] } }); if (!multiple) { dispatchSelectedLocationsAction({ type: 'CLEAR_SELECTED_LOCATIONS' }); @@ -59,6 +63,7 @@ const GridViewItem = ({ location, version }) => { } dispatchLoadedLocationsAction({ type: 'UPDATE_LOCATIONS', data: { parentLocationId: location.id, subitems: [] } }); + setGridActiveLocationId(location.id); }; const renderToggleSelection = () => { return ( diff --git a/src/bundle/ui-dev/src/modules/universal-discovery/components/grid-view/grid.view.js b/src/bundle/ui-dev/src/modules/universal-discovery/components/grid-view/grid.view.js index e343cf052a..3eecedda41 100644 --- a/src/bundle/ui-dev/src/modules/universal-discovery/components/grid-view/grid.view.js +++ b/src/bundle/ui-dev/src/modules/universal-discovery/components/grid-view/grid.view.js @@ -5,7 +5,13 @@ import GridViewItem from './grid.view.item'; import Breadcrumbs from '../breadcrumbs/breadcrumbs'; import { useFindLocationsByParentLocationIdFetch } from '../../hooks/useFindLocationsByParentLocationIdFetch'; -import { SORTING_OPTIONS, LoadedLocationsMapContext, SortingContext, SortOrderContext } from '../../universal.discovery.module'; +import { + SORTING_OPTIONS, + LoadedLocationsMapContext, + SortingContext, + SortOrderContext, + GridActiveLocationIdContext, +} from '../../universal.discovery.module'; const SCROLL_OFFSET = 200; @@ -14,10 +20,12 @@ const GridView = ({ itemsPerPage }) => { const [loadedLocationsMap, dispatchLoadedLocationsAction] = useContext(LoadedLocationsMapContext); const [sorting] = useContext(SortingContext); const [sortOrder] = useContext(SortOrderContext); + const [gridActiveLocationId] = useContext(GridActiveLocationIdContext); const sortingOptions = SORTING_OPTIONS.find((option) => option.sortClause === sorting); - const locationData = loadedLocationsMap.length ? loadedLocationsMap[loadedLocationsMap.length - 1] : { subitems: [] }; + const locationData = loadedLocationsMap.find(({ parentLocationId }) => parentLocationId === gridActiveLocationId); + const locationDataToLoad = loadedLocationsMap.length ? loadedLocationsMap[loadedLocationsMap.length - 1] : { subitems: [] }; const [loadedLocations, isLoading] = useFindLocationsByParentLocationIdFetch( - locationData, + locationDataToLoad, { sortClause: sortingOptions.sortClause, sortOrder }, itemsPerPage, offset, @@ -56,7 +64,7 @@ const GridView = ({ itemsPerPage }) => {