saulteafarmer/Stirling-PDF
1
0
Fork 0
mirror of https://github.com/Stirling-Tools/Stirling-PDF.git synced 2025-08-26 22:29:24 +00:00
Code Issues Packages Projects Releases Wiki Activity

Updated new tools

Browse Source
This commit is contained in:
Connor Yoh 2025-08-14 15:05:28 +01:00
parent 3f0a91df54
commit 675718f7cd
2 changed files with 78 additions and 219 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

154
frontend/src/tools/AddPassword.tsx
View File

@ -1,16 +1,10 @@
import { useEffect, useMemo, useState } from "react"; import React, { useEffect, useState } from "react";
import { Box, Button, Stack, Text } from "@mantine/core";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import DownloadIcon from "@mui/icons-material/Download";
import { useEndpointEnabled } from "../hooks/useEndpointConfig"; import { useEndpointEnabled } from "../hooks/useEndpointConfig";
import { useFileContext } from "../contexts/FileContext"; import { useFileContext } from "../contexts/FileContext";
import { useToolFileSelection } from "../contexts/FileSelectionContext"; import { useToolFileSelection } from "../contexts/FileSelectionContext";
import ToolStep, { ToolStepContainer } from "../components/tools/shared/ToolStep"; import { createToolFlow } from "../components/tools/shared/createToolFlow";
import OperationButton from "../components/tools/shared/OperationButton";
import ErrorNotification from "../components/tools/shared/ErrorNotification";
import FileStatusIndicator from "../components/tools/shared/FileStatusIndicator";
import ResultsPreview from "../components/tools/shared/ResultsPreview";
import AddPasswordSettings from "../components/tools/addPassword/AddPasswordSettings"; import AddPasswordSettings from "../components/tools/addPassword/AddPasswordSettings";
import ChangePermissionsSettings from "../components/tools/changePermissions/ChangePermissionsSettings"; import ChangePermissionsSettings from "../components/tools/changePermissions/ChangePermissionsSettings";
@ -37,7 +31,7 @@ const AddPassword = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
useEffect(() => { useEffect(() => {
addPasswordOperation.resetResults(); addPasswordOperation.resetResults();
onPreviewFile?.(null); onPreviewFile?.(null);
}, [addPasswordParams.parameters, selectedFiles]); }, [addPasswordParams.parameters]);
const handleAddPassword = async () => { const handleAddPassword = async () => {
try { try {
@ -69,121 +63,57 @@ const AddPassword = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
const hasFiles = selectedFiles.length > 0; const hasFiles = selectedFiles.length > 0;
const hasResults = addPasswordOperation.files.length > 0 || addPasswordOperation.downloadUrl !== null; const hasResults = addPasswordOperation.files.length > 0 || addPasswordOperation.downloadUrl !== null;
const filesCollapsed = hasFiles; const passwordsCollapsed = !hasFiles || hasResults;
const passwordsCollapsed = hasResults;
const permissionsCollapsed = collapsedPermissions || hasResults; const permissionsCollapsed = collapsedPermissions || hasResults;
const previewResults = useMemo(() => return createToolFlow({
addPasswordOperation.files?.map((file, index) => ({ files: {
file, selectedFiles,
thumbnail: addPasswordOperation.thumbnails[index] isCollapsed: hasFiles && !hasResults,
})) || [], },
[addPasswordOperation.files, addPasswordOperation.thumbnails] steps: [
); {
title: t('addPassword.passwords.stepTitle', 'Passwords & Encryption'),
return ( isVisible: hasFiles,
<ToolStepContainer> isCollapsed: passwordsCollapsed,
<Stack gap="sm" h="94vh" p="sm" style={{ overflow: 'auto' }}> onCollapsedClick: hasResults ? handleSettingsReset : undefined,
{/* Files Step */} tooltip: addPasswordTips,
<ToolStep content: (
title={t('files.title', 'Files')}
isVisible={true}
isCollapsed={filesCollapsed}
isCompleted={filesCollapsed}
completedMessage={hasFiles ?
selectedFiles.length === 1
? t('files.selected.single', 'Selected: {{filename}}', { filename: selectedFiles[0].name })
: t('files.selected.multiple', 'Selected: {{count}} files', { count: selectedFiles.length })
: undefined}
>
<FileStatusIndicator
selectedFiles={selectedFiles}
placeholder={t('files.placeholder', 'Select a PDF file in the main view to get started')}
/>
</ToolStep>
{/* Passwords & Encryption Step */}
<ToolStep
title={t('addPassword.passwords.stepTitle', 'Passwords & Encryption')}
isVisible={hasFiles}
isCollapsed={passwordsCollapsed}
isCompleted={passwordsCollapsed}
onCollapsedClick={hasResults ? handleSettingsReset : undefined}
completedMessage={passwordsCollapsed ? t('addPassword.passwords.completed', 'Passwords configured') : undefined}
tooltip={addPasswordTips}
>
<AddPasswordSettings <AddPasswordSettings
parameters={addPasswordParams.parameters} parameters={addPasswordParams.parameters}
onParameterChange={addPasswordParams.updateParameter} onParameterChange={addPasswordParams.updateParameter}
disabled={endpointLoading} disabled={endpointLoading}
/> />
</ToolStep> )
},
{/* Permissions Step */} {
<ToolStep title: t('addPassword.permissions.stepTitle', 'Document Permissions'),
title={t('addPassword.permissions.stepTitle', 'Document Permissions')} isVisible: hasFiles,
isVisible={hasFiles} isCollapsed: permissionsCollapsed,
isCollapsed={permissionsCollapsed} onCollapsedClick: hasResults ? handleSettingsReset : () => setCollapsedPermissions(!collapsedPermissions),
isCompleted={permissionsCollapsed} content: (
onCollapsedClick={hasResults ? handleSettingsReset : () => setCollapsedPermissions(!collapsedPermissions)}
>
<ChangePermissionsSettings <ChangePermissionsSettings
parameters={addPasswordParams.permissions.parameters} parameters={addPasswordParams.permissions.parameters}
onParameterChange={addPasswordParams.permissions.updateParameter} onParameterChange={addPasswordParams.permissions.updateParameter}
disabled={endpointLoading} disabled={endpointLoading}
/> />
</ToolStep> )
}
<Box mt="md"> ],
<OperationButton executeButton: {
onClick={handleAddPassword} text: t('addPassword.submit', 'Encrypt'),
isLoading={addPasswordOperation.isLoading} isVisible: !hasResults,
disabled={!addPasswordParams.validateParameters() || !hasFiles || !endpointEnabled} loadingText: t('loading'),
loadingText={t('loading')} onClick: handleAddPassword,
submitText={t('addPassword.submit', 'Encrypt')} disabled: !addPasswordParams.validateParameters() || !hasFiles || !endpointEnabled
/> },
</Box> review: {
isVisible: hasResults,
{/* Results Step */} operation: addPasswordOperation,
<ToolStep title: t('addPassword.results.title', 'Encrypted PDFs'),
title={t('results.title', 'Results')} onFileClick: handleThumbnailClick
isVisible={hasResults} }
> });
<Stack gap="sm">
{addPasswordOperation.status && (
<Text size="sm" c="dimmed">{addPasswordOperation.status}</Text>
)}
<ErrorNotification
error={addPasswordOperation.errorMessage}
onClose={addPasswordOperation.clearError}
/>
{addPasswordOperation.downloadUrl && (
<Button
component="a"
href={addPasswordOperation.downloadUrl}
download={addPasswordOperation.downloadFilename}
leftSection={<DownloadIcon />}
color="green"
fullWidth
mb="md"
>
{t("download", "Download")}
</Button>
)}
<ResultsPreview
files={previewResults}
onFileClick={handleThumbnailClick}
isGeneratingThumbnails={addPasswordOperation.isGeneratingThumbnails}
title={t('addPassword.results.title', 'Encrypted PDFs')}
/>
</Stack>
</ToolStep>
</Stack>
</ToolStepContainer>
);
} }
export default AddPassword; export default AddPassword;

133
frontend/src/tools/ChangePermissions.tsx
View File

@ -1,16 +1,10 @@
import { useEffect, useMemo } from "react"; import React, { useEffect } from "react";
import { Button, Stack, Text } from "@mantine/core";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import DownloadIcon from "@mui/icons-material/Download";
import { useEndpointEnabled } from "../hooks/useEndpointConfig"; import { useEndpointEnabled } from "../hooks/useEndpointConfig";
import { useFileContext } from "../contexts/FileContext"; import { useFileContext } from "../contexts/FileContext";
import { useToolFileSelection } from "../contexts/FileSelectionContext"; import { useToolFileSelection } from "../contexts/FileSelectionContext";
import ToolStep, { ToolStepContainer } from "../components/tools/shared/ToolStep"; import { createToolFlow } from "../components/tools/shared/createToolFlow";
import OperationButton from "../components/tools/shared/OperationButton";
import ErrorNotification from "../components/tools/shared/ErrorNotification";
import FileStatusIndicator from "../components/tools/shared/FileStatusIndicator";
import ResultsPreview from "../components/tools/shared/ResultsPreview";
import ChangePermissionsSettings from "../components/tools/changePermissions/ChangePermissionsSettings"; import ChangePermissionsSettings from "../components/tools/changePermissions/ChangePermissionsSettings";
@ -34,7 +28,7 @@ const ChangePermissions = ({ onPreviewFile, onComplete, onError }: BaseToolProps
useEffect(() => { useEffect(() => {
changePermissionsOperation.resetResults(); changePermissionsOperation.resetResults();
onPreviewFile?.(null); onPreviewFile?.(null);
}, [changePermissionsParams.parameters, selectedFiles]); }, [changePermissionsParams.parameters]);
const handleChangePermissions = async () => { const handleChangePermissions = async () => {
try { try {
@ -66,105 +60,40 @@ const ChangePermissions = ({ onPreviewFile, onComplete, onError }: BaseToolProps
const hasFiles = selectedFiles.length > 0; const hasFiles = selectedFiles.length > 0;
const hasResults = changePermissionsOperation.files.length > 0 || changePermissionsOperation.downloadUrl !== null; const hasResults = changePermissionsOperation.files.length > 0 || changePermissionsOperation.downloadUrl !== null;
const filesCollapsed = hasFiles; const settingsCollapsed = !hasFiles || hasResults;
const settingsCollapsed = hasResults;
const previewResults = useMemo(() => return createToolFlow({
changePermissionsOperation.files?.map((file, index) => ({ files: {
file, selectedFiles,
thumbnail: changePermissionsOperation.thumbnails[index] isCollapsed: hasFiles && !hasResults,
})) || [], },
[changePermissionsOperation.files, changePermissionsOperation.thumbnails] steps: [{
); title: t('settings.title', 'Settings'),
isCollapsed: settingsCollapsed,
return ( onCollapsedClick: settingsCollapsed ? handleSettingsReset : undefined,
<ToolStepContainer> tooltip: changePermissionsTips,
<Stack gap="sm" h="94vh" p="sm" style={{ overflow: 'auto' }}> content: (
{/* Files Step */}
<ToolStep
title={t('files.title', 'Files')}
isVisible={true}
isCollapsed={filesCollapsed}
isCompleted={filesCollapsed}
completedMessage={hasFiles ?
selectedFiles.length === 1
? t('files.selected.single', 'Selected: {{filename}}', { filename: selectedFiles[0].name })
: t('files.selected.multiple', 'Selected: {{count}} files', { count: selectedFiles.length })
: undefined}
>
<FileStatusIndicator
selectedFiles={selectedFiles}
placeholder={t('files.placeholder', 'Select a PDF file in the main view to get started')}
/>
</ToolStep>
{/* Settings Step */}
<ToolStep
title={t('settings.title', 'Settings')}
isVisible={hasFiles}
isCollapsed={settingsCollapsed}
isCompleted={settingsCollapsed}
onCollapsedClick={settingsCollapsed ? handleSettingsReset : undefined}
completedMessage={settingsCollapsed ? t('changePermissions.completed', 'Permissions changed') : undefined}
tooltip={changePermissionsTips}
>
<Stack gap="sm">
<ChangePermissionsSettings <ChangePermissionsSettings
parameters={changePermissionsParams.parameters} parameters={changePermissionsParams.parameters}
onParameterChange={changePermissionsParams.updateParameter} onParameterChange={changePermissionsParams.updateParameter}
disabled={endpointLoading} disabled={endpointLoading}
/> />
)
<OperationButton }],
onClick={handleChangePermissions} executeButton: {
isLoading={changePermissionsOperation.isLoading} text: t('changePermissions.submit', 'Change Permissions'),
disabled={!changePermissionsParams.validateParameters() || !hasFiles || !endpointEnabled} isVisible: !hasResults,
loadingText={t('loading')} loadingText: t('loading'),
submitText={t('changePermissions.submit', 'Change Permissions')} onClick: handleChangePermissions,
/> disabled: !changePermissionsParams.validateParameters() || !hasFiles || !endpointEnabled
</Stack> },
</ToolStep> review: {
isVisible: hasResults,
{/* Results Step */} operation: changePermissionsOperation,
<ToolStep title: t('changePermissions.results.title', 'Modified PDFs'),
title={t('results.title', 'Results')} onFileClick: handleThumbnailClick
isVisible={hasResults} }
> });
<Stack gap="sm">
{changePermissionsOperation.status && (
<Text size="sm" c="dimmed">{changePermissionsOperation.status}</Text>
)}
<ErrorNotification
error={changePermissionsOperation.errorMessage}
onClose={changePermissionsOperation.clearError}
/>
{changePermissionsOperation.downloadUrl && (
<Button
component="a"
href={changePermissionsOperation.downloadUrl}
download={changePermissionsOperation.downloadFilename}
leftSection={<DownloadIcon />}
color="green"
fullWidth
mb="md"
>
{t("download", "Download")}
</Button>
)}
<ResultsPreview
files={previewResults}
onFileClick={handleThumbnailClick}
isGeneratingThumbnails={changePermissionsOperation.isGeneratingThumbnails}
title={t('changePermissions.results.title', 'Modified PDFs')}
/>
</Stack>
</ToolStep>
</Stack>
</ToolStepContainer>
);
} }
export default ChangePermissions; export default ChangePermissions;