From d826af7b5547b19838fc1c51558da06379bb960c Mon Sep 17 00:00:00 2001
From: Antonella Sgarlatta <antonella@standardnotes.org>
Date: Thu, 20 May 2021 15:36:58 -0300
Subject: [PATCH] fix: tags menu not opening

---
 .../components/NotesContextMenu.tsx           |  4 +-
 .../javascripts/components/NotesOptions.tsx   |  2 +-
 .../ui_models/app_state/notes_state.ts        |  6 ---
 .../javascripts/views/notes/notes_view.ts     | 40 +++++--------------
 4 files changed, 12 insertions(+), 40 deletions(-)

diff --git a/app/assets/javascripts/components/NotesContextMenu.tsx b/app/assets/javascripts/components/NotesContextMenu.tsx
index 0582deb85..17aa46cb4 100644
--- a/app/assets/javascripts/components/NotesContextMenu.tsx
+++ b/app/assets/javascripts/components/NotesContextMenu.tsx
@@ -31,8 +31,8 @@ const NotesContextMenu = observer(({ appState }: Props) => {
   return appState.notes.contextMenuOpen ? (
     <div
       ref={contextMenuRef}
-      className="sn-dropdown max-w-80 flex flex-col py-2 overflow-y-scroll absolute"
-      style={{ ...appState.notes.contextMenuPosition, maxHeight: appState.notes.contextMenuMaxHeight }}
+      className="sn-dropdown max-w-80 flex flex-col py-2 absolute"
+      style={{ ...appState.notes.contextMenuPosition }}
     >
       <NotesOptions
         appState={appState}
diff --git a/app/assets/javascripts/components/NotesOptions.tsx b/app/assets/javascripts/components/NotesOptions.tsx
index 5bca358e1..b6a05f96f 100644
--- a/app/assets/javascripts/components/NotesOptions.tsx
+++ b/app/assets/javascripts/components/NotesOptions.tsx
@@ -161,7 +161,7 @@ export const NotesOptions = observer(
                 ...tagsMenuPosition,
                 maxHeight: tagsMenuMaxHeight,
               }}
-              className="sn-dropdown sn-dropdown-anchor-right flex flex-col py-2 max-h-80 overflow-y-scroll"
+              className="sn-dropdown sn-dropdown-anchor-right flex flex-col py-2 max-h-80 absolute overflow-y-scroll"
             >
               {appState.tags.tags.map((tag) => (
                 <button
diff --git a/app/assets/javascripts/ui_models/app_state/notes_state.ts b/app/assets/javascripts/ui_models/app_state/notes_state.ts
index 4108661c7..7570d0262 100644
--- a/app/assets/javascripts/ui_models/app_state/notes_state.ts
+++ b/app/assets/javascripts/ui_models/app_state/notes_state.ts
@@ -27,7 +27,6 @@ export class NotesState {
     top: 0,
     left: 0,
   };
-  contextMenuMaxHeight: number | 'auto' = 'auto';
   showProtectedWarning = false;
 
   constructor(
@@ -46,7 +45,6 @@ export class NotesState {
 
       setContextMenuOpen: action,
       setContextMenuPosition: action,
-      setContextMenuMaxHeight: action,
       setShowProtectedWarning: action,
       unselectNotes: action,
     });
@@ -183,10 +181,6 @@ export class NotesState {
     this.contextMenuPosition = position;
   }
 
-  setContextMenuMaxHeight(height: number | 'auto'): void {
-    this.contextMenuMaxHeight = height;
-  }
-
   async changeSelectedNotes(
     mutate: (mutator: NoteMutator) => void
   ): Promise<void> {
diff --git a/app/assets/javascripts/views/notes/notes_view.ts b/app/assets/javascripts/views/notes/notes_view.ts
index f77fd6b9a..fc8c8b15c 100644
--- a/app/assets/javascripts/views/notes/notes_view.ts
+++ b/app/assets/javascripts/views/notes/notes_view.ts
@@ -314,10 +314,6 @@ class NotesViewCtrl extends PureViewCtrl<unknown, NotesCtrlState> {
       ).fontSize;
       const maxContextMenuHeight = parseFloat(defaultFontSize) * 20;
       const footerHeight = 32;
-
-      // Open up-bottom is default behavior
-      let openUpBottom = true;
-
       const bottomSpace = clientHeight - footerHeight - e.clientY;
       const upSpace = e.clientY;
 
@@ -325,41 +321,23 @@ class NotesViewCtrl extends PureViewCtrl<unknown, NotesCtrlState> {
       if (maxContextMenuHeight > bottomSpace) {
         // If there's enough space, open bottom-up
         if (upSpace > maxContextMenuHeight) {
-          openUpBottom = false;
-          this.appState.notes.setContextMenuMaxHeight(
-            'auto'
-          );
-        // Else, reduce max height (menu will be scrollable) and open in whichever direction there's more space
+          this.appState.notes.setContextMenuPosition({
+            bottom: clientHeight - e.clientY,
+            left: e.clientX,
+          });
+        // Else, open on top of screen
         } else {
-          if (upSpace > bottomSpace) {
-            this.appState.notes.setContextMenuMaxHeight(
-              upSpace - 2
-            );
-            openUpBottom = false;
-          } else {
-            this.appState.notes.setContextMenuMaxHeight(
-              bottomSpace - 2
-            );
-          }
+          this.appState.notes.setContextMenuPosition({
+            top: 2,
+            left: e.clientX,
+          });
         }
       } else {
-        this.appState.notes.setContextMenuMaxHeight(
-          'auto'
-        );
-      }
-
-      if (openUpBottom) {
         this.appState.notes.setContextMenuPosition({
           top: e.clientY,
           left: e.clientX,
         });
-      } else {
-        this.appState.notes.setContextMenuPosition({
-          bottom: clientHeight - e.clientY,
-          left: e.clientX,
-        });
       }
-
       this.appState.notes.setContextMenuOpen(true);
     }
   }