fix: use portal to make sure ellipsis menu opens on top of note list

app/assets/javascripts/components/NotesOptionsPanel.tsx

@@ -6,6 +6,7 @@ import {
   DisclosureButton,
   DisclosurePanel,
 } from '@reach/disclosure';
+import { Portal } from '@reach/portal';
 import MoreIcon from '../../icons/ic-more.svg';
 import { useRef, useState } from 'preact/hooks';
 import { observer } from 'mobx-react-lite';
@@ -55,6 +56,8 @@ export const NotesOptionsPanel = observer(({ appState }: Props) => {
         <VisuallyHidden>Actions</VisuallyHidden>
         <MoreIcon className="fill-current block" />
       </DisclosureButton>
+      <Portal>
+        <div className="sn-component">
           <DisclosurePanel
             onKeyUp={(event) => {
               if (event.key === 'Escape' && !submenuOpen) {
@@ -66,7 +69,7 @@ export const NotesOptionsPanel = observer(({ appState }: Props) => {
             style={{
               ...position,
             }}
-        className="sn-dropdown sn-dropdown-anchor-right flex flex-col py-2"
+            className="sn-dropdown flex flex-col py-2"
           >
             {open && (
               <NotesOptions
@@ -76,6 +79,8 @@ export const NotesOptionsPanel = observer(({ appState }: Props) => {
               />
             )}
           </DisclosurePanel>
+        </div>
+      </Portal>
     </Disclosure>
   );
 });