This commit is contained in:
EthanHealy01 2025-10-16 14:47:01 +01:00
parent d38b230d85
commit 8e5f3c2896
5 changed files with 74 additions and 38 deletions

View File

@ -46,7 +46,7 @@ const PageEditor = ({
// Prefer IDs + selectors to avoid array identity churn
const activeFileIds = state.files.ids;
const filesSignature = selectors.getFilesSignature();
const activeFilesSignature = selectors.getFilesSignature();
// UI state
const globalProcessing = state.ui.isProcessing;
@ -72,7 +72,7 @@ const PageEditor = ({
useEffect(() => {
setCsvInput('');
}, [filesSignature]);
}, [activeFilesSignature]);
// Grid container ref for positioning split indicators
const gridContainerRef = useRef<HTMLDivElement>(null);

View File

@ -0,0 +1,59 @@
import { ActionIcon, Popover } from '@mantine/core';
import LocalIcon from '../shared/LocalIcon';
import { Tooltip } from '../shared/Tooltip';
import BulkSelectionPanel from './BulkSelectionPanel';
interface PageSelectByNumberButtonProps {
disabled: boolean;
totalPages: number;
label: string;
csvInput: string;
setCsvInput: (value: string) => void;
selectedPageIds: string[];
displayDocument?: { pages: { id: string; pageNumber: number }[] };
updatePagesFromCSV: (override?: string) => void;
}
export default function PageSelectByNumberButton({
disabled,
totalPages,
label,
csvInput,
setCsvInput,
selectedPageIds,
displayDocument,
updatePagesFromCSV,
}: PageSelectByNumberButtonProps) {
return (
<Tooltip content={label} position="left" offset={12} arrow portalTarget={document.body}>
<div className={`right-rail-fade enter`}>
<Popover position="left" withArrow shadow="md" offset={8}>
<Popover.Target>
<div style={{ display: 'inline-flex' }}>
<ActionIcon
variant="subtle"
radius="md"
className="right-rail-icon"
disabled={disabled || totalPages === 0}
aria-label={label}
>
<LocalIcon icon="pin-end" width="1.5rem" height="1.5rem" />
</ActionIcon>
</div>
</Popover.Target>
<Popover.Dropdown>
<div style={{ minWidth: '24rem', maxWidth: '32rem' }}>
<BulkSelectionPanel
csvInput={csvInput}
setCsvInput={setCsvInput}
selectedPageIds={selectedPageIds}
displayDocument={displayDocument}
onUpdatePagesFromCSV={updatePagesFromCSV}
/>
</div>
</Popover.Dropdown>
</Popover>
</div>
</Tooltip>
);
}

View File

@ -21,7 +21,7 @@ export function usePageDocument(): PageDocumentHook {
const primaryFileId = activeFileIds[0] ?? null;
// Stable signature for effects (prevents loops)
const filesSignature = selectors.getFilesSignature();
const activeFilesSignature = selectors.getFilesSignature();
// UI state
const globalProcessing = state.ui.isProcessing;
@ -156,7 +156,7 @@ export function usePageDocument(): PageDocumentHook {
};
return mergedDoc;
}, [activeFileIds, primaryFileId, primaryStirlingFileStub, processedFilePages, processedFileTotalPages, selectors, filesSignature]);
}, [activeFileIds, primaryFileId, primaryStirlingFileStub, processedFilePages, processedFileTotalPages, selectors, activeFilesSignature]);
// Large document detection for smart loading
const isVeryLargeDocument = useMemo(() => {

View File

@ -1,10 +1,8 @@
import { useMemo } from 'react';
import { ActionIcon, Popover } from '@mantine/core';
import { useTranslation } from 'react-i18next';
import { Tooltip } from '../shared/Tooltip';
import { useRightRailButtons, RightRailButtonWithAction } from '../../hooks/useRightRailButtons';
import LocalIcon from '../shared/LocalIcon';
import BulkSelectionPanel from './BulkSelectionPanel';
import PageSelectByNumberButton from './PageSelectByNumberButton';
interface PageEditorRightRailButtonsParams {
totalPages: number;
@ -84,36 +82,16 @@ export function usePageEditorRightRailButtons(params: PageEditorRightRailButtons
disabled: totalPages === 0,
visible: totalPages > 0,
render: ({ disabled }) => (
<Tooltip content={selectByNumberLabel} position="left" offset={12} arrow portalTarget={document.body}>
<div className={`right-rail-fade enter`}>
<Popover position="left" withArrow shadow="md" offset={8}>
<Popover.Target>
<div style={{ display: 'inline-flex' }}>
<ActionIcon
variant="subtle"
radius="md"
className="right-rail-icon"
disabled={disabled || totalPages === 0}
aria-label={selectByNumberLabel}
>
<LocalIcon icon="pin-end" width="1.5rem" height="1.5rem" />
</ActionIcon>
</div>
</Popover.Target>
<Popover.Dropdown>
<div style={{ minWidth: '24rem', maxWidth: '32rem' }}>
<BulkSelectionPanel
csvInput={csvInput}
setCsvInput={setCsvInput}
selectedPageIds={selectedPageIds}
displayDocument={displayDocument}
onUpdatePagesFromCSV={updatePagesFromCSV}
/>
</div>
</Popover.Dropdown>
</Popover>
</div>
</Tooltip>
<PageSelectByNumberButton
disabled={disabled}
totalPages={totalPages}
label={selectByNumberLabel}
csvInput={csvInput}
setCsvInput={setCsvInput}
selectedPageIds={selectedPageIds}
displayDocument={displayDocument}
updatePagesFromCSV={updatePagesFromCSV}
/>
),
},
{

View File

@ -45,7 +45,6 @@ export default function RightRail() {
const disableForFullscreen = toolPanelMode === 'fullscreen' && leftPanelView === 'toolPicker';
const { workbench: currentView } = useNavigationState();
const isCustomWorkbench = typeof currentView === 'string' && currentView.startsWith('custom:');
const { selectors } = useFileState();
const { selectedFiles, selectedFileIds } = useFileSelection();