From e1c30edddb7537798d584a67bbe376034f175432 Mon Sep 17 00:00:00 2001
From: Reece Browne <you@example.com>
Date: Sun, 24 Aug 2025 00:28:31 +0100
Subject: [PATCH] Decent baseline

---
 .../src/components/pageEditor/PageEditor.tsx  |  6 +--
 .../components/pageEditor/PageThumbnail.tsx   | 46 +++++++++++++++++--
 frontend/src/services/pdfExportService.ts     |  3 +-
 3 files changed, 45 insertions(+), 10 deletions(-)

diff --git a/frontend/src/components/pageEditor/PageEditor.tsx b/frontend/src/components/pageEditor/PageEditor.tsx
index 02f7186e9..bb14ed4de 100644
--- a/frontend/src/components/pageEditor/PageEditor.tsx
+++ b/frontend/src/components/pageEditor/PageEditor.tsx
@@ -999,7 +999,7 @@ const PageEditor = ({
         });
         
         const zipBlob = await zip.generateAsync({ type: 'blob' });
-        const zipFilename = displayDocument.name.replace(/\.pdf$/i, '_split.zip');
+        const zipFilename = displayDocument.name.replace(/\.pdf$/i, '.zip');
         
         pdfExportService.downloadFile(zipBlob, zipFilename);
       } else {
@@ -1094,7 +1094,7 @@ const PageEditor = ({
   const displayedPages = displayDocument?.pages || [];
 
   return (
-    <Box pos="relative" h="100vh" style={{ overflow: 'auto' }} data-scrolling-container="true">
+    <Box pos="relative" h="100vh" pt={40} style={{ overflow: 'auto' }} data-scrolling-container="true">
       <LoadingOverlay visible={globalProcessing && !mergedPdfDocument} />
 
       {!mergedPdfDocument && !globalProcessing && activeFileIds.length === 0 && (
@@ -1178,7 +1178,7 @@ const PageEditor = ({
                     left: leftPosition,
                     top: topPosition,
                     width: '1px',
-                    height: '320px', // Match item height
+                    height: '20rem', // Match item height
                     borderLeft: '1px dashed #3b82f6'
                   }}
                 />
diff --git a/frontend/src/components/pageEditor/PageThumbnail.tsx b/frontend/src/components/pageEditor/PageThumbnail.tsx
index fa5e8e9df..ac2655da0 100644
--- a/frontend/src/components/pageEditor/PageThumbnail.tsx
+++ b/frontend/src/components/pageEditor/PageThumbnail.tsx
@@ -69,6 +69,8 @@ const PageThumbnail: React.FC<PageThumbnailProps> = ({
 }: PageThumbnailProps) => {
   const [thumbnailUrl, setThumbnailUrl] = useState<string | null>(page.thumbnail);
   const [isDragging, setIsDragging] = useState(false);
+  const [isMouseDown, setIsMouseDown] = useState(false);
+  const [mouseStartPos, setMouseStartPos] = useState<{x: number, y: number} | null>(null);
   const dragElementRef = useRef<HTMLDivElement>(null);
   const { getThumbnailFromCache } = useThumbnailGeneration();
 
@@ -194,6 +196,40 @@ const PageThumbnail: React.FC<PageThumbnailProps> = ({
     onSetStatus(`Split marker ${action} after position ${index + 1}`);
   }, [index, splitPositions, onExecuteCommand, onSetStatus, ToggleSplitCommand]);
 
+  // Handle click vs drag differentiation
+  const handleMouseDown = useCallback((e: React.MouseEvent) => {
+    if (!selectionMode) return;
+    
+    setIsMouseDown(true);
+    setMouseStartPos({ x: e.clientX, y: e.clientY });
+  }, [selectionMode]);
+
+  const handleMouseUp = useCallback((e: React.MouseEvent) => {
+    if (!selectionMode || !isMouseDown || !mouseStartPos) {
+      setIsMouseDown(false);
+      setMouseStartPos(null);
+      return;
+    }
+
+    // Calculate distance moved
+    const deltaX = Math.abs(e.clientX - mouseStartPos.x);
+    const deltaY = Math.abs(e.clientY - mouseStartPos.y);
+    const distance = Math.sqrt(deltaX * deltaX + deltaY * deltaY);
+
+    // If mouse moved less than 5 pixels, consider it a click (not a drag)
+    if (distance < 5 && !isDragging) {
+      onTogglePage(page.pageNumber);
+    }
+
+    setIsMouseDown(false);
+    setMouseStartPos(null);
+  }, [selectionMode, isMouseDown, mouseStartPos, isDragging, page.pageNumber, onTogglePage]);
+
+  const handleMouseLeave = useCallback(() => {
+    setIsMouseDown(false);
+    setMouseStartPos(null);
+  }, []);
+
   return (
     <div
       ref={pageElementRef}
@@ -202,7 +238,7 @@ const PageThumbnail: React.FC<PageThumbnailProps> = ({
       className={`
         ${styles.pageContainer}
         !rounded-lg
-        cursor-grab
+        ${selectionMode ? 'cursor-pointer' : 'cursor-grab'}
         select-none
         w-[20rem]
         h-[20rem]
@@ -222,6 +258,9 @@ const PageThumbnail: React.FC<PageThumbnailProps> = ({
         transition: isAnimating ? 'none' : 'transform 0.2s ease-in-out'
       }}
       draggable={false}
+      onMouseDown={handleMouseDown}
+      onMouseUp={handleMouseUp}
+      onMouseLeave={handleMouseLeave}
     >
       {selectionMode && (
         <div
@@ -240,14 +279,11 @@ const PageThumbnail: React.FC<PageThumbnailProps> = ({
             cursor: 'pointer'
           }}
           onMouseDown={(e) => e.stopPropagation()}
+          onMouseUp={(e) => e.stopPropagation()}
           onDragStart={(e) => {
             e.preventDefault();
             e.stopPropagation();
           }}
-          onClick={(e) => {
-            e.stopPropagation();
-            onTogglePage(page.pageNumber);
-          }}
         >
           <Checkbox
             checked={Array.isArray(selectedPages) ? selectedPages.includes(page.pageNumber) : false}
diff --git a/frontend/src/services/pdfExportService.ts b/frontend/src/services/pdfExportService.ts
index cf0cdd8c2..b4f02bd5d 100644
--- a/frontend/src/services/pdfExportService.ts
+++ b/frontend/src/services/pdfExportService.ts
@@ -82,8 +82,7 @@ export class PDFExportService {
    */
   private generateFilename(originalName: string, selectedOnly: boolean): string {
     const baseName = originalName.replace(/\.pdf$/i, '');
-    const suffix = selectedOnly ? '_selected' : '_edited';
-    return `${baseName}${suffix}.pdf`;
+    return `${baseName}.pdf`;
   }