Mirrors/Stirling-PDF
Mirrors/Stirling-PDF
1
0
Fork 0
mirror of https://github.com/Frooodle/Stirling-PDF.git synced 2025-12-18 20:04:17 +01:00
Code Issues Packages Projects Releases Wiki Activity

Fixes from self-review

Browse Source
This commit is contained in:
James Brunton 2025-12-18 16:14:11 +00:00
parent f35069acce
commit 796f4d20c0
3 changed files with 69 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
frontend/src/core/hooks/useFileActionIcons.tsx
View File

@ -1,13 +1,33 @@
import React from 'react';
import LocalIcon from '@app/components/shared/LocalIcon';
// Type for icon wrapper props (matches MUI fontSize convention)
interface FileActionIconProps {
fontSize?: 'small' | 'medium' | 'large';
width?: string | number;
height?: string | number;
style?: React.CSSProperties;
className?: string;
}
// Type for icon wrapper component
type FileActionIconComponent = React.FC<FileActionIconProps>;
/**
* File action icons for web builds
* Desktop builds override this with different icons
*/
export function useFileActionIcons() {
// Create wrapper components for LocalIcon that match the MUI icon interface
const UploadIcon = (props: any) => <LocalIcon icon="upload-rounded" width={props.fontSize === 'small' ? 20 : 24} height={props.fontSize === 'small' ? 20 : 24} {...props} />;
const DownloadIcon = (props: any) => <LocalIcon icon="download-rounded" width={props.fontSize === 'small' ? 20 : 24} height={props.fontSize === 'small' ? 20 : 24} {...props} />;
const UploadIcon: FileActionIconComponent = (props) => {
const size = props.fontSize === 'small' ? 20 : 24;
return <LocalIcon icon="upload-rounded" width={size} height={size} {...props} />;
};
const DownloadIcon: FileActionIconComponent = (props) => {
const size = props.fontSize === 'small' ? 20 : 24;
return <LocalIcon icon="download-rounded" width={size} height={size} {...props} />;
};
return {
upload: UploadIcon,

39
frontend/src/core/hooks/useSuggestedTools.tsx
View File

@ -1,21 +1,32 @@
import { useMemo } from 'react';
import React, { useMemo } from 'react';
import { useNavigationState } from '@app/contexts/NavigationContext';
import { useToolNavigation } from '@app/hooks/useToolNavigation';
import { useToolWorkflow } from '@app/contexts/ToolWorkflowContext';
import { ToolId } from '@app/types/toolId';
import LocalIcon from '@app/components/shared/LocalIcon';
// Icon wrapper components
const CompressIcon = (props: any) => <LocalIcon icon="compress-rounded" width={24} height={24} {...props} />;
const SwapHorizIcon = (props: any) => <LocalIcon icon="swap-horiz-rounded" width={24} height={24} {...props} />;
const CleaningServicesIcon = (props: any) => <LocalIcon icon="cleaning-services-rounded" width={24} height={24} {...props} />;
const CropIcon = (props: any) => <LocalIcon icon="crop-rounded" width={24} height={24} {...props} />;
const TextFieldsIcon = (props: any) => <LocalIcon icon="text-fields-rounded" width={24} height={24} {...props} />;
// Type for the props that icon wrapper components accept
interface IconWrapperProps {
width?: string | number;
height?: string | number;
style?: React.CSSProperties;
className?: string;
}
// Type for an icon wrapper component
type IconWrapperComponent = React.FC<IconWrapperProps>;
// Factory function to create icon wrapper components
function createIconComponent(iconName: string): IconWrapperComponent {
return (props: IconWrapperProps) => (
<LocalIcon icon={iconName} width={24} height={24} {...props} />
);
}
export interface SuggestedTool {
id: ToolId;
title: string;
icon: React.ComponentType<any>;
icon: IconWrapperComponent;
href: string;
onClick: (e: React.MouseEvent) => void;
}
@ -24,27 +35,27 @@ const ALL_SUGGESTED_TOOLS: Omit<SuggestedTool, 'href' | 'onClick'>[] = [
{
id: 'compress',
title: 'Compress',
icon: CompressIcon
icon: createIconComponent('compress-rounded'),
},
{
id: 'convert',
title: 'Convert',
icon: SwapHorizIcon
icon: createIconComponent('swap-horiz-rounded'),
},
{
id: 'sanitize',
title: 'Sanitize',
icon: CleaningServicesIcon
icon: createIconComponent('cleaning-services-rounded'),
},
{
id: 'split',
title: 'Split',
icon: CropIcon
icon: createIconComponent('crop-rounded'),
},
{
id: 'ocr',
title: 'OCR',
icon: TextFieldsIcon
icon: createIconComponent('text-fields-rounded'),
}
];
@ -68,7 +79,7 @@ export function useSuggestedTools(): SuggestedTool[] {
onClick: (e: React.MouseEvent) => { e.preventDefault(); }
};
}
const navProps = getToolNavigation(tool.id, toolRegistryEntry);
return {
...tool,

24
frontend/src/desktop/hooks/useFileActionIcons.tsx
View File

@ -1,13 +1,33 @@
import React from 'react';
import LocalIcon from '@app/components/shared/LocalIcon';
// Type for icon wrapper props (matches MUI fontSize convention)
interface FileActionIconProps {
fontSize?: 'small' | 'medium' | 'large';
width?: string | number;
height?: string | number;
style?: React.CSSProperties;
className?: string;
}
// Type for icon wrapper component
type FileActionIconComponent = React.FC<FileActionIconProps>;
/**
* File action icons for desktop builds
* Overrides core implementation with desktop-appropriate icons
*/
export function useFileActionIcons() {
// Create wrapper components for LocalIcon that match the MUI icon interface
const FolderOpenIcon = (props: any) => <LocalIcon icon="folder-open-rounded" width={props.fontSize === 'small' ? 20 : 24} height={props.fontSize === 'small' ? 20 : 24} {...props} />;
const SaveIcon = (props: any) => <LocalIcon icon="save-rounded" width={props.fontSize === 'small' ? 20 : 24} height={props.fontSize === 'small' ? 20 : 24} {...props} />;
const FolderOpenIcon: FileActionIconComponent = (props) => {
const size = props.fontSize === 'small' ? 20 : 24;
return <LocalIcon icon="folder-open-rounded" width={size} height={size} {...props} />;
};
const SaveIcon: FileActionIconComponent = (props) => {
const size = props.fontSize === 'small' ? 20 : 24;
return <LocalIcon icon="save-rounded" width={size} height={size} {...props} />;
};
return {
upload: FolderOpenIcon,