import { Box, FormControlLabel, Switch, Typography } from '@mui/material'; import React, { useEffect, useState } from 'react'; import ToolContent from '@components/ToolContent'; import { ToolComponentProps } from '@tools/defineTool'; import ToolPdfInput from '@components/input/ToolPdfInput'; import ToolFileResult from '@components/result/ToolFileResult'; import { CardExampleType } from '@components/examples/ToolExamples'; import { PDFDocument } from 'pdf-lib'; import { InitialValuesType, RotationAngle } from './types'; import { parsePageRanges, rotatePdf } from './service'; import SimpleRadio from '@components/options/SimpleRadio'; import TextFieldWithDesc from '@components/options/TextFieldWithDesc'; import { isArray } from 'lodash'; const initialValues: InitialValuesType = { rotationAngle: 90, applyToAllPages: true, pageRanges: '' }; const exampleCards: CardExampleType[] = [ { title: 'Rotate All Pages 90°', description: 'Rotate all pages in the document 90 degrees clockwise', sampleText: '', sampleResult: '', sampleOptions: { rotationAngle: 90, applyToAllPages: true, pageRanges: '' } }, { title: 'Rotate Specific Pages 180°', description: 'Rotate only pages 1 and 3 by 180 degrees', sampleText: '', sampleResult: '', sampleOptions: { rotationAngle: 180, applyToAllPages: false, pageRanges: '1,3' } }, { title: 'Rotate Page Range 270°', description: 'Rotate pages 2 through 5 by 270 degrees', sampleText: '', sampleResult: '', sampleOptions: { rotationAngle: 270, applyToAllPages: false, pageRanges: '2-5' } } ]; export default function RotatePdf({ title, longDescription }: ToolComponentProps) { const [input, setInput] = useState(null); const [result, setResult] = useState(null); const [isProcessing, setIsProcessing] = useState(false); const [totalPages, setTotalPages] = useState(0); const [pageRangePreview, setPageRangePreview] = useState(''); // Get the total number of pages when a PDF is uploaded useEffect(() => { const getPdfInfo = async () => { if (!input) { setTotalPages(0); return; } try { const arrayBuffer = await input.arrayBuffer(); const pdf = await PDFDocument.load(arrayBuffer); setTotalPages(pdf.getPageCount()); } catch (error) { console.error('Error getting PDF info:', error); setTotalPages(0); } }; getPdfInfo(); }, [input]); const onValuesChange = (values: InitialValuesType) => { const { pageRanges, applyToAllPages } = values; if (applyToAllPages) { setPageRangePreview( totalPages > 0 ? `All ${totalPages} pages will be rotated` : '' ); return; } if (!totalPages || !pageRanges?.trim()) { setPageRangePreview(''); return; } try { const count = parsePageRanges(pageRanges, totalPages).length; setPageRangePreview( `${count} page${count !== 1 ? 's' : ''} will be rotated` ); } catch (error) { setPageRangePreview(''); } }; const compute = async (values: InitialValuesType, input: File | null) => { if (!input) return; try { setIsProcessing(true); const rotatedPdf = await rotatePdf(input, values); setResult(rotatedPdf); } catch (error) { throw new Error('Error rotating PDF: ' + error); } finally { setIsProcessing(false); } }; const angleOptions: { value: RotationAngle; label: string }[] = [ { value: 90, label: '90° Clockwise' }, { value: 180, label: '180° (Upside down)' }, { value: 270, label: '270° (90° Counter-clockwise)' } ]; return ( } resultComponent={ } getGroups={({ values, updateField }) => [ { title: 'Rotation Settings', component: ( Rotation Angle {angleOptions.map((angleOption) => ( { updateField('rotationAngle', angleOption.value); }} /> ))} { updateField('applyToAllPages', e.target.checked); }} /> } label="Apply to all pages" /> {!values.applyToAllPages && ( {totalPages > 0 && ( PDF has {totalPages} page{totalPages !== 1 ? 's' : ''} )} { updateField('pageRanges', val); }} description={ 'Enter page numbers or ranges separated by commas (e.g., 1,3,5-7)' } placeholder={'e.g., 1,5-8'} /> {pageRangePreview && ( {pageRangePreview} )} )} ) } ]} onValuesChange={onValuesChange} toolInfo={{ title: 'How to Use the Rotate PDF Tool', description: `This tool allows you to rotate pages in a PDF document. You can rotate all pages or specify individual pages to rotate. Choose a rotation angle: - 90° Clockwise - 180° (Upside down) - 270° (90° Counter-clockwise) To rotate specific pages: 1. Uncheck "Apply to all pages" 2. Enter page numbers or ranges separated by commas (e.g., 1,3,5-7) Examples: - "1,5,9" rotates pages 1, 5, and 9 - "1-5" rotates pages 1 through 5 - "1,3-5,8-10" rotates pages 1, 3, 4, 5, 8, 9, and 10 ${longDescription}` }} /> ); }