V2 results flow (#4196)

Better tool flow for reusability
Pinning 
Styling of tool flow
consumption of files after tooling

---------

Co-authored-by: Connor Yoh <connor@stirlingpdf.com>
Co-authored-by: James Brunton <jbrunton96@gmail.com>
This commit is contained in:
ConnorYoh
2025-08-15 14:43:30 +01:00
committed by GitHub
parent 1468df3e21
commit 4c17c520d7
40 changed files with 1474 additions and 1274 deletions

View File

@@ -4,9 +4,12 @@ import { useTranslation } from 'react-i18next';
import CloseIcon from '@mui/icons-material/Close';
import VisibilityIcon from '@mui/icons-material/Visibility';
import HistoryIcon from '@mui/icons-material/History';
import PushPinIcon from '@mui/icons-material/PushPin';
import PushPinOutlinedIcon from '@mui/icons-material/PushPinOutlined';
import DragIndicatorIcon from '@mui/icons-material/DragIndicator';
import styles from './PageEditor.module.css';
import FileOperationHistory from '../history/FileOperationHistory';
import { useFileContext } from '../../contexts/FileContext';
interface FileItem {
id: string;
@@ -66,6 +69,10 @@ const FileThumbnail = ({
}: FileThumbnailProps) => {
const { t } = useTranslation();
const [showHistory, setShowHistory] = useState(false);
const { pinnedFiles, pinFile, unpinFile, isFilePinned, activeFiles } = useFileContext();
// Find the actual File object that corresponds to this FileItem
const actualFile = activeFiles.find(f => f.name === file.name && f.size === file.size);
const formatFileSize = (bytes: number) => {
if (bytes === 0) return '0 B';
@@ -301,6 +308,32 @@ const FileThumbnail = ({
</ActionIcon>
</Tooltip>
{actualFile && (
<Tooltip label={isFilePinned(actualFile) ? "Unpin File" : "Pin File"}>
<ActionIcon
size="md"
variant="subtle"
c={isFilePinned(actualFile) ? "yellow" : "white"}
onClick={(e) => {
e.stopPropagation();
if (isFilePinned(actualFile)) {
unpinFile(actualFile);
onSetStatus(`Unpinned ${file.name}`);
} else {
pinFile(actualFile);
onSetStatus(`Pinned ${file.name}`);
}
}}
>
{isFilePinned(actualFile) ? (
<PushPinIcon style={{ fontSize: 20 }} />
) : (
<PushPinOutlinedIcon style={{ fontSize: 20 }} />
)}
</ActionIcon>
</Tooltip>
)}
<Tooltip label="Close File">
<ActionIcon
size="md"