From caec2ca309b6a3df32be2eaf3779f053f99ffca9 Mon Sep 17 00:00:00 2001
From: Wolfie <32025746+Wolfkid200444@users.noreply.github.com>
Date: Sun, 10 Mar 2024 08:17:04 -0400
Subject: [PATCH] Update imports and add sort menu to NoteModal component

---
 .../holynotes/components/modals/Notebook.tsx        | 13 +++++++++----
 1 file changed, 9 insertions(+), 4 deletions(-)

diff --git a/src/plugins/holynotes/components/modals/Notebook.tsx b/src/plugins/holynotes/components/modals/Notebook.tsx
index 8b6a9a49f..a04dea3ac 100644
--- a/src/plugins/holynotes/components/modals/Notebook.tsx
+++ b/src/plugins/holynotes/components/modals/Notebook.tsx
@@ -8,7 +8,7 @@ import ErrorBoundary from "@components/ErrorBoundary";
 import { classes } from "@utils/misc";
 import { ModalCloseButton, ModalContent, ModalFooter, ModalHeader, ModalProps, ModalRoot, ModalSize, openModal } from "@utils/modal";
 import { findByProps } from "@webpack";
-import { ContextMenuApi, Flex, Menu, React, TabBar, Text, TextInput } from "@webpack/common";
+import { ContextMenuApi, Flex, FluxDispatcher, Menu, React, TabBar, Text, TextInput } from "@webpack/common";
 import noteHandler from "plugins/holynotes/noteHandler";
 import { HolyNotes } from "plugins/holynotes/types";
 
@@ -72,7 +72,7 @@ export const NoteModal = (props: ModalProps & { onClose: () => void; }) => {
 
     return (
         <ErrorBoundary>
-            <ModalRoot {...props} className={classes("vc-notebook")} size={ModalSize.LARGE} style={{ borderRadius: "8px" }}>
+            <ModalRoot {...props} className={classes("vc-notebook")} size={ModalSize.LARGE}>
                 <Flex className={classes("vc-notebook-flex")} direction={Flex.Direction.VERTICAL} style={{ width: "100%" }}>
                     <div className={classes("vc-notebook-top-section")}>
                         <ModalHeader className={classes("vc-notebook-header-main")}>
@@ -131,7 +131,11 @@ export const NoteModal = (props: ModalProps & { onClose: () => void; }) => {
                             className={quickSelect}
                             onClick={(event: React.MouseEvent<HTMLDivElement>) => {
                                 ContextMenuApi.openContextMenu(event, () => (
-                                    <>
+                                    <Menu.Menu
+                                        navId="sort-menu"
+                                        onClose={() => FluxDispatcher.dispatch({ type: "CONTEXT_MENU_CLOSE" })}
+                                        aria-label="Sort Menu"
+                                    >
                                         <Menu.MenuItem
                                             label="Ascending / Date Added"
                                             id="ada"
@@ -157,7 +161,8 @@ export const NoteModal = (props: ModalProps & { onClose: () => void; }) => {
                                                 setSortDirection(false);
                                                 setSortType(false);
                                             }} />
-                                    </>
+                                    </Menu.Menu>
+
                                 ));
                             }}
                         >