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 }),