diff --git a/frontend/src/proprietary/components/tools/pdfJsonEditor/PdfJsonEditorView.tsx b/frontend/src/proprietary/components/tools/pdfJsonEditor/PdfJsonEditorView.tsx index a6195ac24..c6ab8def9 100644 --- a/frontend/src/proprietary/components/tools/pdfJsonEditor/PdfJsonEditorView.tsx +++ b/frontend/src/proprietary/components/tools/pdfJsonEditor/PdfJsonEditorView.tsx @@ -28,6 +28,7 @@ import InfoOutlinedIcon from '@mui/icons-material/InfoOutlined'; import UploadIcon from '@mui/icons-material/Upload'; import ExpandMoreIcon from '@mui/icons-material/ExpandMore'; import ExpandLessIcon from '@mui/icons-material/ExpandLess'; +import CloseIcon from '@mui/icons-material/Close'; import { Rnd } from 'react-rnd'; import { @@ -235,6 +236,7 @@ const PdfJsonEditorView = ({ data }: PdfJsonEditorViewProps) => { onLoadJson, onSelectPage, onGroupEdit, + onGroupDelete, onImageTransform, onImageReset, onReset, @@ -749,6 +751,7 @@ const PdfJsonEditorView = ({ data }: PdfJsonEditorViewProps) => { const renderGroupContainer = ( groupId: string, + pageIndex: number, isActive: boolean, isChanged: boolean, content: React.ReactNode, @@ -757,8 +760,10 @@ const PdfJsonEditorView = ({ data }: PdfJsonEditorViewProps) => { { display: 'flex', alignItems: 'flex-start', justifyContent: 'flex-start', - padding: 0, + padding: '3px 2px 3px 2px', + position: 'relative', }} onClick={(event) => { event.stopPropagation(); @@ -787,6 +793,29 @@ const PdfJsonEditorView = ({ data }: PdfJsonEditorViewProps) => { }} > {content} + {isActive && editingGroupId !== groupId && ( + { + event.stopPropagation(); + onGroupDelete(pageIndex, groupId); + setActiveGroupId(null); + setEditingGroupId(null); + }} + > + + + )} ); @@ -1352,6 +1381,7 @@ const PdfJsonEditorView = ({ data }: PdfJsonEditorViewProps) => { {renderGroupContainer( group.id, + group.pageIndex, true, changed,
{ {renderGroupContainer( group.id, + group.pageIndex, isActive, changed,
{ ); }, []); + const handleGroupDelete = useCallback((pageIndex: number, groupId: string) => { + setGroupsByPage((previous) => + previous.map((groups, idx) => + idx !== pageIndex + ? groups + : groups.map((group) => (group.id === groupId ? { ...group, text: '' } : group)) + ) + ); + }, []); + const handleImageTransform = useCallback( ( pageIndex: number, @@ -913,8 +923,9 @@ const PdfJsonEditor = ({ onComplete, onError }: BaseToolProps) => { try { const textContent = await page.getTextContent(); - const maskMarginX = Math.max(0.45 * scale, 0.45); - const maskMarginY = Math.max(0.85 * scale, 0.85); + const maskMarginX = 0; + const maskMarginTop = 0; + const maskMarginBottom = Math.max(3 * scale, 3); context.save(); context.globalCompositeOperation = 'destination-out'; context.fillStyle = '#000000'; @@ -931,8 +942,8 @@ const PdfJsonEditor = ({ onComplete, onError }: BaseToolProps) => { const width = (item.width || 0) * viewport.scale + maskMarginX * 2; const fontHeight = Math.hypot(c, d); const rawHeight = item.height ? item.height * viewport.scale : fontHeight; - const height = Math.max(rawHeight + maskMarginY * 2, fontHeight + maskMarginY * 2); - const baselineOffset = height - maskMarginY; + const height = Math.max(rawHeight + maskMarginTop + maskMarginBottom, fontHeight + maskMarginTop + maskMarginBottom); + const baselineOffset = height - maskMarginBottom; context.save(); context.translate(e, f); @@ -984,6 +995,7 @@ const PdfJsonEditor = ({ onComplete, onError }: BaseToolProps) => { onLoadJson: handleLoadFile, onSelectPage: handleSelectPage, onGroupEdit: handleGroupTextChange, + onGroupDelete: handleGroupDelete, onImageTransform: handleImageTransform, onImageReset: handleImageReset, onReset: handleResetEdits, @@ -1001,6 +1013,7 @@ const PdfJsonEditor = ({ onComplete, onError }: BaseToolProps) => { handleDownloadJson, handleGeneratePdf, handleGroupTextChange, + handleGroupDelete, handleImageReset, handleLoadFile, handleResetEdits, diff --git a/frontend/src/proprietary/tools/pdfJsonEditor/pdfJsonEditorTypes.ts b/frontend/src/proprietary/tools/pdfJsonEditor/pdfJsonEditorTypes.ts index 97d6c7423..fcb8aa83c 100644 --- a/frontend/src/proprietary/tools/pdfJsonEditor/pdfJsonEditorTypes.ts +++ b/frontend/src/proprietary/tools/pdfJsonEditor/pdfJsonEditorTypes.ts @@ -199,6 +199,7 @@ export interface PdfJsonEditorViewData { onLoadJson: (file: File | null) => Promise | void; onSelectPage: (pageIndex: number) => void; onGroupEdit: (pageIndex: number, groupId: string, value: string) => void; + onGroupDelete: (pageIndex: number, groupId: string) => void; onImageTransform: ( pageIndex: number, imageId: string,