Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Backport 2024.01.xx] Fix #10371 TOC - Open on map initialization options does not work as expected (#10387) #10393

Merged
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
21 changes: 8 additions & 13 deletions web/client/plugins/TOC/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -44,7 +44,6 @@ import localizedProps from '../../components/misc/enhancers/localizedProps';
import { registerCustomSaveHandler } from '../../selectors/mapsave';
import toc from './reducers/toc';
import { setControlProperty } from '../../actions/controls';
import { updateTOCConfig } from './actions/toc';
import Message from '../../components/I18N/Message';
const Button = tooltip(ButtonRB);
const FormControl = localizedProps('placeholder')(FormControlRB);
Expand Down Expand Up @@ -364,8 +363,7 @@ function TOC({
visualizationMode,
toolbarButtonProps,
init,
onOpen,
onResetInit
onOpen
}, context) {
const activateParameter = (allow, activate) => {
const isUserAdmin = user && user.role === 'ADMIN' || false;
Expand Down Expand Up @@ -431,13 +429,8 @@ function TOC({
// automatically open the toc
// when default open is true
useEffect(() => {
if (init) {
if (defaultOpen) {
onOpen();
// we need to reset init to false
// so if we navigate to a new map we can initialize it again
onResetInit();
}
if (init && defaultOpen) {
onOpen();
}
}, [init]);

Expand Down Expand Up @@ -566,8 +559,11 @@ const getResolutionsProps = (state) => {
const getTOCConfig = (state, props) => {
const config = state?.toc?.config || {};
const layers = layersSelector(state).filter(({ group }) => group !== 'background');
const mapLoadedCount = state?.toc?.mapLoadedCount;
const defaultOpen = config.defaultOpen ?? props?.defaultOpen;
return {
init: config.init,
// use the mapLoadedCount as trigger for the toc initialization
init: mapLoadedCount ? `${mapLoadedCount}:${!!defaultOpen}` : false,
defaultOpen: config.defaultOpen ?? props?.defaultOpen,
theme: config.theme ?? props?.theme,
hideOpacitySlider: config.hideOpacitySlider ?? props?.hideOpacitySlider ?? props?.activateOpacityTool,
Expand Down Expand Up @@ -621,8 +617,7 @@ const ConnectedTOC = connect(tocSelector, {
onSort: moveNode,
onChange: updateNode,
onSelectNode: selectNode,
onOpen: setControlProperty.bind(null, 'drawer', 'enabled', true),
onResetInit: updateTOCConfig.bind(null, { init: false })
onOpen: setControlProperty.bind(null, 'drawer', 'enabled', true)
})(TOC);

export default createPlugin('TOC', {
Expand Down
6 changes: 3 additions & 3 deletions web/client/plugins/TOC/reducers/__tests__/toc-test.js
Original file line number Diff line number Diff line change
Expand Up @@ -15,10 +15,10 @@ import toc from '../toc';
describe('toc reducer', () => {
it('should init with configureMap', () => {
const state = toc({}, configureMap());
expect(state.config.init).toBe(true);
expect(state.mapLoadedCount).toBe(1);
});
it('should update config with updateTOCConfig', () => {
const state = toc({ config: { init: true }}, updateTOCConfig({ init: false }));
expect(state.config.init).toBe(false);
const state = toc({ config: { defaultOpen: true }}, updateTOCConfig({ defaultOpen: false }));
expect(state.config.defaultOpen).toBe(false);
});
});
4 changes: 2 additions & 2 deletions web/client/plugins/TOC/reducers/toc.js
Original file line number Diff line number Diff line change
Expand Up @@ -14,9 +14,9 @@ function toc(state = {}, action) {
case MAP_CONFIG_LOADED: {
return {
...state,
mapLoadedCount: (state.mapLoadedCount || 0) + 1,
config: {
...action?.config?.toc,
init: true
...action?.config?.toc
}
};
}
Expand Down
3 changes: 2 additions & 1 deletion web/client/product/plugins.js
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,7 @@ import RulesManagerFooter from "../plugins/RulesManagerFooter";
import UserSession from "../plugins/UserSession";
import FeatureEditor from '../plugins/FeatureEditor';
import MetadataInfo from '../plugins/MetadataInfo';
import TOC from '../plugins/TOC';

import {toModulePlugin} from "../utils/ModulePluginsUtils";

Expand All @@ -47,6 +48,7 @@ export const plugins = {
UserSessionPlugin: UserSession,
FeatureEditorPlugin: FeatureEditor,
MetadataInfoPlugin: MetadataInfo,
TOCPlugin: TOC,

// ### DYNAMIC PLUGINS ### //
// product plugins
Expand Down Expand Up @@ -145,7 +147,6 @@ export const plugins = {
StyleEditor: toModulePlugin('StyleEditor', () => import(/* webpackChunkName: 'plugins/styleEditor' */ '../plugins/StyleEditor')),
SwipePlugin: toModulePlugin('Swipe', () => import(/* webpackChunkName: 'plugins/swipe' */ '../plugins/Swipe')),
TOCItemsSettingsPlugin: toModulePlugin('TOCItemsSettings', () => import(/* webpackChunkName: 'plugins/TOCItemsSettings' */ '../plugins/TOCItemsSettings')),
TOCPlugin: toModulePlugin('TOC', () => import(/* webpackChunkName: 'plugins/TOC' */ '../plugins/TOC')),
ThematicLayerPlugin: toModulePlugin('ThematicLayer', () => import(/* webpackChunkName: 'plugins/thematicLayer' */ '../plugins/ThematicLayer')),
ThemeSwitcherPlugin: toModulePlugin('ThemeSwitcher', () => import(/* webpackChunkName: 'plugins/themeSwitcher' */ '../plugins/ThemeSwitcher')),
TimelinePlugin: toModulePlugin('Timeline', () => import(/* webpackChunkName: 'plugins/timeline' */ '../plugins/Timeline')),
Expand Down
Loading