From 4ec8fadf9f014f22f3e90b1c92c0009eb767db28 Mon Sep 17 00:00:00 2001 From: azeeee05 Date: Wed, 10 Jun 2026 15:16:20 +0530 Subject: [PATCH 1/6] done overall ui enhnace --- frontend/index.html | 6 +- frontend/src/App.tsx | 49 ++- frontend/src/components/InspectorPanel.tsx | 120 ++++--- frontend/src/components/SignatureModal.tsx | 33 +- frontend/src/components/Thumbnail.tsx | 33 +- frontend/src/components/ToolRail.tsx | 33 +- frontend/src/components/Toolbar.tsx | 33 +- frontend/src/components/TopBar.tsx | 81 ++--- frontend/src/components/WasmInspector.tsx | 5 +- .../src/components/custom/CustomButton.tsx | 67 ++++ .../custom/CustomConfirmationModal.tsx | 79 +++++ frontend/src/components/ui.tsx | 97 ++---- frontend/src/index.css | 301 +----------------- frontend/src/viewer/AnnotationLayer.tsx | 8 +- frontend/src/viewer/OverlayLayer.tsx | 27 +- frontend/src/viewer/PDFViewer.tsx | 12 +- frontend/src/viewer/RedactionLayer.tsx | 2 +- frontend/src/viewer/SelectionLayer.tsx | 6 +- 18 files changed, 428 insertions(+), 564 deletions(-) create mode 100644 frontend/src/components/custom/CustomButton.tsx create mode 100644 frontend/src/components/custom/CustomConfirmationModal.tsx diff --git a/frontend/index.html b/frontend/index.html index 5dae465..9a8a311 100644 --- a/frontend/index.html +++ b/frontend/index.html @@ -1,13 +1,13 @@ - + PDF Editor - -
+ +
diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx index 0581f17..aacea67 100644 --- a/frontend/src/App.tsx +++ b/frontend/src/App.tsx @@ -5,8 +5,9 @@ import { Toolbar } from './components/Toolbar'; import { InspectorPanel } from './components/InspectorPanel'; import type { InspectorTab } from './components/InspectorPanel'; import { SignatureModal } from './components/SignatureModal'; -import { ToastViewport, ConfirmDialog } from './components/ui'; -import type { ConfirmOptions } from './components/ui'; +import { ToastViewport } from './components/ui'; +import { CustomConfirmationModal } from './components/custom/CustomConfirmationModal'; +import type { CustomConfirmationOptions } from './components/custom/CustomConfirmationModal'; import { PDFViewer } from './viewer/PDFViewer'; import type { PDFViewerRef } from './viewer/PDFViewer'; import type { Annotation } from './viewer/AnnotationLayer'; @@ -55,7 +56,7 @@ function App() { const [pendingSignature, setPendingSignature] = useState<{ url: string; aspect: number } | null>(null); const [signatureModalOpen, setSignatureModalOpen] = useState(false); const [activeStamp, setActiveStamp] = useState<{ label: string; color: string } | null>(null); - const [confirmState, setConfirmState] = useState<(ConfirmOptions & { onConfirm: () => void }) | null>(null); + const [confirmState, setConfirmState] = useState<(CustomConfirmationOptions & { onConfirm: () => void }) | null>(null); // Search const [searchQuery, setSearchQuery] = useState(''); @@ -350,6 +351,33 @@ function App() { } }; + const handlePrint = async () => { + if (!activeDoc) return; + try { + toast('Preparing print...', 'info'); + const bytes = await gatewayService.fetchDocumentBytes(selectedDocId); + const blob = new Blob([bytes], { type: 'application/pdf' }); + const url = URL.createObjectURL(blob); + + const iframe = document.createElement('iframe'); + iframe.style.display = 'none'; + iframe.src = url; + + iframe.onload = () => { + setTimeout(() => { + iframe.contentWindow?.focus(); + iframe.contentWindow?.print(); + // Optional: cleanup after a delay + // setTimeout(() => document.body.removeChild(iframe), 10000); + }, 100); + }; + document.body.appendChild(iframe); + } catch (e) { + console.error('Print failed', e); + toast('Print failed', 'error'); + } + }; + const toggleInspector = () => { setIsInspectorOpen((prev) => { const next = !prev; @@ -376,7 +404,7 @@ function App() { /* -------------------------------------------------------------- render */ return ( -
+
1} onRotate={handleRotate} onExport={handleExport} + onPrint={handlePrint} onUpload={handleUpload} isInspectorOpen={isInspectorOpen} onToggleInspector={toggleInspector} @@ -423,7 +452,7 @@ function App() { {isLoading && !activeDoc ? (
-

Loading…

+

Loading…

) : activeDoc ? ( ) : ( -
-
+
+
-

No document open

+

No document open

Open a PDF to start editing.

-
); diff --git a/frontend/src/components/InspectorPanel.tsx b/frontend/src/components/InspectorPanel.tsx index 3e2c3ee..c005e74 100644 --- a/frontend/src/components/InspectorPanel.tsx +++ b/frontend/src/components/InspectorPanel.tsx @@ -1,3 +1,4 @@ +import { CustomButton } from './custom/CustomButton'; import React from 'react'; import type { DocumentInfo, SearchResult, DocumentMetadata, FontInfo } from '../lib/gatewayService'; import type { Annotation } from '../viewer/AnnotationLayer'; @@ -61,63 +62,63 @@ export const InspectorPanel: React.FC = (p) => { const activeDef = TABS.find((t) => t.id === p.activeTab)!; return ( -