feat: add quick search UI

packages/app/src/providers/global-modal-provider.tsx

@@ -2,16 +2,18 @@ import { createContext, useContext, useState } from 'react';
 import type { PropsWithChildren } from 'react';
 import ShortcutsModal from '@/components/shortcuts-modal';
 import ContactModal from '@/components/contact-modal';
-
+import QuickSearch from '@/components/quick-search';
 type ModalContextValue = {
   shortcutsModalHandler: (visible: boolean) => void;
   triggerContactModal: (visible: boolean) => void;
+  triggerQuickSearchModal: (visible: boolean) => void;
 };
 type ModalContextProps = PropsWithChildren<{}>;
 
 export const ModalContext = createContext<ModalContextValue>({
   shortcutsModalHandler: () => {},
   triggerContactModal: () => {},
+  triggerQuickSearchModal: () => {},
 });
 
 export const useModal = () => useContext(ModalContext);
@@ -21,6 +23,7 @@ export const ModalProvider = ({
 }: PropsWithChildren<ModalContextProps>) => {
   const [openContactModal, setOpenContactModal] = useState(false);
   const [openShortcutsModal, setOpenShortcutsModal] = useState(false);
+  const [openQuickSearchModal, setOpenQuickSearchModal] = useState(false);
 
   return (
     <ModalContext.Provider
@@ -31,6 +34,9 @@ export const ModalProvider = ({
         triggerContactModal: visible => {
           setOpenContactModal(visible);
         },
+        triggerQuickSearchModal: visible => {
+          setOpenQuickSearchModal(visible);
+        },
       }}
     >
       <ContactModal
@@ -45,6 +51,12 @@ export const ModalProvider = ({
           setOpenShortcutsModal(false);
         }}
       ></ShortcutsModal>
+      <QuickSearch
+        open={openQuickSearchModal}
+        onClose={() => {
+          setOpenQuickSearchModal(false);
+        }}
+      ></QuickSearch>
       {children}
     </ModalContext.Provider>
   );