diff --git a/frontend/src/Editor/Header/HeaderActions.jsx b/frontend/src/Editor/Header/HeaderActions.jsx index 5f341f39f3..1eae87f904 100644 --- a/frontend/src/Editor/Header/HeaderActions.jsx +++ b/frontend/src/Editor/Header/HeaderActions.jsx @@ -14,6 +14,14 @@ function HeaderActions({ handleUndo, canUndo, handleRedo, canRedo }) { }), shallow ); + + const clearSelectionBorder = () => { + const selectedElems = document.getElementsByClassName('resizer-select'); + for (const element of selectedElems) { + element.classList.remove('resizer-select'); + } + }; + return (
@@ -34,7 +42,10 @@ function HeaderActions({ handleUndo, canUndo, handleRedo, canRedo }) { type="button" aria-selected="true" tabIndex="0" - onClick={() => toggleCurrentLayout('desktop')} + onClick={() => { + clearSelectionBorder(); + toggleCurrentLayout('desktop'); + }} data-cy={`button-change-layout-to-desktop`} > toggleCurrentLayout('mobile')} + onClick={() => { + clearSelectionBorder(); + toggleCurrentLayout('mobile'); + }} data-cy={`button-change-layout-to-mobile`} > + toggleCurrentLayout: (currentLayout) => { + set({ selectedComponents: EMPTY_ARRAY }); set({ currentLayout }, false, { type: ACTIONS.TOGGLE_CURRENT_LAYOUT, currentLayout, - }), + }); + }, setIsEditorActive: (isEditorActive) => set(() => ({ isEditorActive })), updateEditorState: (state) => set((prev) => ({ ...prev, ...state })), updateQueryConfirmationList: (queryConfirmationList) => set({ queryConfirmationList }),