feat: close change editor menu once editor is selected (#907)

app/assets/javascripts/components/ChangeEditorButton.tsx

@@ -130,6 +130,9 @@ export const ChangeEditorButton: FunctionComponent<Props> = observer(
                 setSelectedEditor={setCurrentEditor}
                 note={note}
                 groups={editorMenuGroups}
+                closeMenu={() => {
+                  setOpen(false);
+                }}
               />
             )}
           </DisclosurePanel>

app/assets/javascripts/components/NotesOptions/ChangeEditorOption.tsx

@@ -148,6 +148,9 @@ export const ChangeEditorOption: FunctionComponent<ChangeEditorOptionProps> = ({
             note={note}
             groups={editorMenuGroups}
             isOpen={changeEditorMenuVisible}
+            closeMenu={() => {
+              setChangeEditorMenuOpen(false);
+            }}
           />
         )}
       </DisclosurePanel>

app/assets/javascripts/components/NotesOptions/changeEditor/ChangeEditorMenu.tsx

@@ -26,6 +26,7 @@ import { PLAIN_EDITOR_NAME } from './createEditorMenuGroups';
 type ChangeEditorMenuProps = {
   application: WebApplication;
   closeOnBlur: (event: { relatedTarget: EventTarget | null }) => void;
+  closeMenu: () => void;
   groups: EditorMenuGroup[];
   isOpen: boolean;
   currentEditor: SNComponent | undefined;
@@ -39,6 +40,7 @@ const getGroupId = (group: EditorMenuGroup) =>
 export const ChangeEditorMenu: FunctionComponent<ChangeEditorMenuProps> = ({
   application,
   closeOnBlur,
+  closeMenu,
   groups,
   isOpen,
   currentEditor,
@@ -169,6 +171,8 @@ export const ChangeEditorMenu: FunctionComponent<ChangeEditorMenuProps> = ({
     if (shouldSelectEditor) {
       selectComponent(itemToBeSelected.component ?? null, note);
     }
+
+    closeMenu();
   };
 
   return (