mirror of
https://github.com/Frooodle/Stirling-PDF.git
synced 2025-12-18 20:04:17 +01:00
lint tsc hell
This commit is contained in:
Reece
parent
d34e552f2b
commit
200a53c27b
@ -1,6 +1,5 @@
|
||||
import { useEffect, useState, useContext, useCallback, useRef } from 'react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { alert as showToast, updateToast } from '@app/components/toast';
|
||||
|
||||
import { createToolFlow } from '@app/components/tools/shared/createToolFlow';
|
||||
import { useNavigation } from '@app/contexts/NavigationContext';
|
||||
@ -63,7 +62,6 @@ const Annotate = (_props: BaseToolProps) => {
|
||||
const [stampImageData, setStampImageData] = useState<string | undefined>();
|
||||
const [stampImageSize, setStampImageSize] = useState<{ width: number; height: number } | null>(null);
|
||||
const [historyAvailability, setHistoryAvailability] = useState({ canUndo: false, canRedo: false });
|
||||
const [isSavingCopy, setIsSavingCopy] = useState(false);
|
||||
const manualToolSwitch = useRef<boolean>(false);
|
||||
|
||||
// Zoom tracking for stamp size conversion
|
||||
@ -122,53 +120,11 @@ const Annotate = (_props: BaseToolProps) => {
|
||||
} = useAnnotationStyleState(cssToPdfSize);
|
||||
|
||||
const {
|
||||
inkColor,
|
||||
inkWidth,
|
||||
highlightColor,
|
||||
highlightOpacity,
|
||||
freehandHighlighterWidth,
|
||||
underlineColor,
|
||||
underlineOpacity,
|
||||
strikeoutColor,
|
||||
strikeoutOpacity,
|
||||
squigglyColor,
|
||||
squigglyOpacity,
|
||||
textColor,
|
||||
textSize,
|
||||
textAlignment,
|
||||
textBackgroundColor,
|
||||
noteBackgroundColor,
|
||||
shapeStrokeColor,
|
||||
shapeFillColor,
|
||||
shapeOpacity,
|
||||
shapeStrokeOpacity,
|
||||
shapeFillOpacity,
|
||||
shapeThickness,
|
||||
} = styleState;
|
||||
|
||||
const {
|
||||
setInkColor,
|
||||
setInkWidth,
|
||||
setHighlightColor,
|
||||
setHighlightOpacity,
|
||||
setFreehandHighlighterWidth,
|
||||
setUnderlineColor,
|
||||
setUnderlineOpacity,
|
||||
setStrikeoutColor,
|
||||
setStrikeoutOpacity,
|
||||
setSquigglyColor,
|
||||
setSquigglyOpacity,
|
||||
setShapeThickness,
|
||||
setTextColor,
|
||||
setTextSize,
|
||||
setTextAlignment,
|
||||
setTextBackgroundColor,
|
||||
setNoteBackgroundColor,
|
||||
setShapeStrokeColor,
|
||||
setShapeFillColor,
|
||||
setShapeOpacity,
|
||||
setShapeStrokeOpacity,
|
||||
setShapeFillOpacity,
|
||||
setShapeThickness,
|
||||
} = styleActions;
|
||||
|
||||
useEffect(() => {
|
||||
@ -223,64 +179,6 @@ const Annotate = (_props: BaseToolProps) => {
|
||||
annotationApiRef?.current?.activateAnnotationTool?.(activeTool, toolOptions);
|
||||
}, [viewerContext?.isAnnotationMode, signatureApiRef, activeTool, buildToolOptions, stampImageData, stampImageSize]);
|
||||
|
||||
const handleSaveCopy = useCallback(async () => {
|
||||
if (!viewerContext?.exportActions?.saveAsCopy) {
|
||||
return;
|
||||
}
|
||||
|
||||
setIsSavingCopy(true);
|
||||
const toastId = showToast({
|
||||
alertType: 'neutral',
|
||||
title: t('annotation.savingCopy', 'Preparing download...'),
|
||||
progressBarPercentage: 15,
|
||||
isPersistentPopup: true,
|
||||
});
|
||||
|
||||
try {
|
||||
const buffer = await viewerContext.exportActions.saveAsCopy();
|
||||
if (!buffer) {
|
||||
updateToast(toastId, {
|
||||
alertType: 'error',
|
||||
title: t('annotation.saveFailed', 'Unable to save copy'),
|
||||
durationMs: 4000,
|
||||
isPersistentPopup: false,
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
const blob = new Blob([buffer], { type: 'application/pdf' });
|
||||
const url = URL.createObjectURL(blob);
|
||||
const baseName = selectedFiles[0]?.name;
|
||||
const filename = baseName
|
||||
? `${baseName.replace(/\.pdf$/i, '')}-annotated.pdf`
|
||||
: 'annotated.pdf';
|
||||
|
||||
const anchor = document.createElement('a');
|
||||
anchor.href = url;
|
||||
anchor.download = filename;
|
||||
anchor.click();
|
||||
setTimeout(() => URL.revokeObjectURL(url), 4000);
|
||||
|
||||
updateToast(toastId, {
|
||||
alertType: 'success',
|
||||
title: t('annotation.saveReady', 'Download ready'),
|
||||
progressBarPercentage: 100,
|
||||
durationMs: 2500,
|
||||
isPersistentPopup: false,
|
||||
});
|
||||
} catch (error: any) {
|
||||
updateToast(toastId, {
|
||||
alertType: 'error',
|
||||
title: t('annotation.saveFailed', 'Unable to save copy'),
|
||||
body: error?.message,
|
||||
durationMs: 4500,
|
||||
isPersistentPopup: false,
|
||||
});
|
||||
} finally {
|
||||
setIsSavingCopy(false);
|
||||
}
|
||||
}, [viewerContext?.exportActions, selectedFiles, t]);
|
||||
|
||||
const activateAnnotationTool = (toolId: AnnotationToolId) => {
|
||||
// If leaving stamp tool, clean up placement mode
|
||||
if (activeTool === 'stamp' && toolId !== 'stamp') {
|
||||
@ -460,6 +358,8 @@ const Annotate = (_props: BaseToolProps) => {
|
||||
executeOperation: async () => {},
|
||||
resetResults: () => {},
|
||||
clearError: () => {},
|
||||
cancelOperation: () => {},
|
||||
undoOperation: async () => {},
|
||||
},
|
||||
title: '',
|
||||
onFileClick: () => {},
|
||||
|
||||
@ -7,7 +7,58 @@ import { ColorPicker, ColorSwatchButton } from '@app/components/annotation/share
|
||||
import { ImageUploader } from '@app/components/annotation/shared/ImageUploader';
|
||||
import { SuggestedToolsSection } from '@app/components/tools/shared/SuggestedToolsSection';
|
||||
import type { AnnotationToolId, AnnotationAPI } from '@app/components/viewer/viewerTypes';
|
||||
import type { BuildToolOptionsFn, AnnotationStyleStateReturn } from './useAnnotationStyleState';
|
||||
|
||||
interface StyleState {
|
||||
inkColor: string;
|
||||
inkWidth: number;
|
||||
highlightColor: string;
|
||||
highlightOpacity: number;
|
||||
freehandHighlighterWidth: number;
|
||||
underlineColor: string;
|
||||
underlineOpacity: number;
|
||||
strikeoutColor: string;
|
||||
strikeoutOpacity: number;
|
||||
squigglyColor: string;
|
||||
squigglyOpacity: number;
|
||||
textColor: string;
|
||||
textSize: number;
|
||||
textAlignment: 'left' | 'center' | 'right';
|
||||
textBackgroundColor: string;
|
||||
noteBackgroundColor: string;
|
||||
shapeStrokeColor: string;
|
||||
shapeFillColor: string;
|
||||
shapeOpacity: number;
|
||||
shapeStrokeOpacity: number;
|
||||
shapeFillOpacity: number;
|
||||
shapeThickness: number;
|
||||
}
|
||||
|
||||
interface StyleActions {
|
||||
setInkColor: (value: string) => void;
|
||||
setInkWidth: (value: number) => void;
|
||||
setHighlightColor: (value: string) => void;
|
||||
setHighlightOpacity: (value: number) => void;
|
||||
setFreehandHighlighterWidth: (value: number) => void;
|
||||
setUnderlineColor: (value: string) => void;
|
||||
setUnderlineOpacity: (value: number) => void;
|
||||
setStrikeoutColor: (value: string) => void;
|
||||
setStrikeoutOpacity: (value: number) => void;
|
||||
setSquigglyColor: (value: string) => void;
|
||||
setSquigglyOpacity: (value: number) => void;
|
||||
setTextColor: (value: string) => void;
|
||||
setTextSize: (value: number) => void;
|
||||
setTextAlignment: (value: 'left' | 'center' | 'right') => void;
|
||||
setTextBackgroundColor: (value: string) => void;
|
||||
setNoteBackgroundColor: (value: string) => void;
|
||||
setShapeStrokeColor: (value: string) => void;
|
||||
setShapeFillColor: (value: string) => void;
|
||||
setShapeOpacity: (value: number) => void;
|
||||
setShapeStrokeOpacity: (value: number) => void;
|
||||
setShapeFillOpacity: (value: number) => void;
|
||||
setShapeThickness: (value: number) => void;
|
||||
}
|
||||
|
||||
type BuildToolOptionsFn = (toolId: AnnotationToolId, extras?: any) => Record<string, unknown>;
|
||||
|
||||
type ColorTarget =
|
||||
| 'ink'
|
||||
@ -26,9 +77,9 @@ type ColorTarget =
|
||||
interface AnnotationPanelProps {
|
||||
activeTool: AnnotationToolId;
|
||||
activateAnnotationTool: (toolId: AnnotationToolId) => void;
|
||||
styleState: AnnotationStyleStateReturn['styleState'];
|
||||
styleActions: AnnotationStyleStateReturn['styleActions'];
|
||||
getActiveColor: AnnotationStyleStateReturn['getActiveColor'];
|
||||
styleState: StyleState;
|
||||
styleActions: StyleActions;
|
||||
getActiveColor: (tool: AnnotationToolId) => string;
|
||||
buildToolOptions: BuildToolOptionsFn;
|
||||
deriveToolFromAnnotation: (annotation: any) => AnnotationToolId | undefined;
|
||||
selectedAnn: any | null;
|
||||
@ -73,14 +124,12 @@ export function AnnotationPanel(props: AnnotationPanelProps) {
|
||||
selectedFontSize,
|
||||
setSelectedFontSize,
|
||||
annotationApiRef,
|
||||
signatureApiRef,
|
||||
viewerContext,
|
||||
setPlacementMode,
|
||||
setSignatureConfig,
|
||||
computeStampDisplaySize,
|
||||
stampImageData,
|
||||
setStampImageData,
|
||||
stampImageSize,
|
||||
setStampImageSize,
|
||||
setPlacementPreviewSize,
|
||||
undo,
|
||||
@ -163,7 +212,7 @@ export function AnnotationPanel(props: AnnotationPanelProps) {
|
||||
{ id: 'stamp', label: t('annotation.stamp', 'Add Image'), icon: 'add-photo-alternate' },
|
||||
];
|
||||
|
||||
const activeColor = useMemo(() => getActiveColor(colorPickerTarget), [colorPickerTarget, getActiveColor]);
|
||||
const activeColor = useMemo(() => colorPickerTarget ? getActiveColor(colorPickerTarget as AnnotationToolId) : '#000000', [colorPickerTarget, getActiveColor]);
|
||||
|
||||
const renderToolButtons = (tools: { id: AnnotationToolId; label: string; icon: string }[]) => (
|
||||
<Group gap="xs">
|
||||
@ -1131,7 +1180,7 @@ export function AnnotationPanel(props: AnnotationPanelProps) {
|
||||
|
||||
{colorPickerComponent}
|
||||
|
||||
<SuggestedToolsSection currentTool="annotate" />
|
||||
<SuggestedToolsSection />
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user