Fix headerbar start-dragging events

apps/readest-app/src/app/library/components/LibraryHeader.tsx

@@ -42,7 +42,7 @@ const LibraryHeader: React.FC<LibraryHeaderProps> = ({
       )}
     >
       <div className='flex items-center justify-between space-x-6'>
-        <div className='sm:w relative flex w-full items-center pl-4'>
+        <div className='exclude-title-bar-mousedown sm:w relative flex w-full items-center pl-4'>
           <span className='absolute left-8 text-gray-500'>
             <FaSearch className='h-4 w-4' />
           </span>

apps/readest-app/src/app/library/page.tsx

@@ -27,7 +27,7 @@ const LibraryPage = () => {
   const { setSettings } = useSettingsStore();
   const [loading, setLoading] = useState(false);
   const isInitiating = useRef(false);
-  const libraryLoaded = useRef(false);
+  const [libraryLoaded, setLibraryLoaded] = useState(false);
   const [isSelectMode, setIsSelectMode] = useState(false);
 
   const processOpenWithFiles = React.useCallback(
@@ -68,8 +68,7 @@ const LibraryPage = () => {
         setLibrary(libraryBooks);
       }
 
-      libraryLoaded.current = true;
-
+      setLibraryLoaded(true);
       if (loadingTimeout) clearTimeout(loadingTimeout);
       setLoading(false);
     };
@@ -152,7 +151,7 @@ const LibraryPage = () => {
           <Spinner loading />
         </div>
       )}
-      {libraryLoaded.current &&
+      {libraryLoaded &&
         (libraryBooks.length > 0 ? (
           <div className='mt-12 flex-grow overflow-auto px-2'>
             <Bookshelf

apps/readest-app/src/app/reader/components/HeaderBar.tsx

@@ -67,7 +67,7 @@ const HeaderBar: React.FC<HeaderBarProps> = ({
       <div className='flex h-full items-center space-x-2'>
         <NotebookToggler bookKey={bookKey} />
         <Dropdown
-          className='dropdown-bottom dropdown-end'
+          className='exclude-title-bar-mousedown dropdown-bottom dropdown-end'
           buttonClassName='btn btn-ghost h-8 min-h-8 w-8 p-0'
           toggleButton={<PiDotsThreeVerticalBold size={16} />}
           onToggle={handleToggleDropdown}

apps/readest-app/src/app/reader/components/ViewMenu.tsx

@@ -86,7 +86,6 @@ const ViewMenu: React.FC<ViewMenuProps> = ({
 
   return (
     <div
-      id='exclude-title-bar-mousedown'
       tabIndex={0}
       className='view-menu dropdown-content dropdown-right no-triangle border-base-100 z-20 mt-1 w-72 border shadow-2xl'
     >

apps/readest-app/src/components/WindowButtons.tsx

@@ -48,7 +48,7 @@ const WindowButtons: React.FC<WindowButtonsProps> = ({
     if (
       target.closest('.btn') ||
       target.closest('.window-button') ||
-      target.closest('#exclude-title-bar-mousedown')
+      target.closest('.exclude-title-bar-mousedown')
     ) {
       return;
     }