mirror of
https://github.com/Stirling-Tools/Stirling-PDF.git
synced 2025-08-22 04:09:22 +00:00
simplify QuickAccessBar
This commit is contained in:
parent
808aae186e
commit
d664666ff8
@ -16,7 +16,7 @@ import TopToolIndicator from './quickAccessBar/TopToolIndicator';
|
||||
import {
|
||||
isNavButtonActive,
|
||||
getNavButtonStyle,
|
||||
getActiveNavButton
|
||||
getActiveNavButton,
|
||||
} from './quickAccessBar/QuickAccessBar';
|
||||
|
||||
const QuickAccessBar = forwardRef<HTMLDivElement>(({
|
||||
@ -24,15 +24,15 @@ const QuickAccessBar = forwardRef<HTMLDivElement>(({
|
||||
const { t } = useTranslation();
|
||||
const { isRainbowMode } = useRainbowThemeContext();
|
||||
const { openFilesModal, isFilesModalOpen } = useFilesModalContext();
|
||||
const { handleReaderToggle, handleBackToTools, selectedTool, selectedToolKey, leftPanelView } = useToolWorkflow();
|
||||
const { handleReaderToggle, handleBackToTools, handleToolSelect, selectedTool, selectedToolKey, leftPanelView, toolRegistry, readerMode } = useToolWorkflow();
|
||||
const [configModalOpen, setConfigModalOpen] = useState(false);
|
||||
const [activeButton, setActiveButton] = useState<string>('tools');
|
||||
const scrollableRef = useRef<HTMLDivElement>(null);
|
||||
const isOverflow = useIsOverflowing(scrollableRef);
|
||||
|
||||
useEffect(() => {
|
||||
setActiveButton(getActiveNavButton(leftPanelView, selectedTool, selectedToolKey));
|
||||
}, [leftPanelView, selectedTool, selectedToolKey]);
|
||||
setActiveButton(getActiveNavButton(leftPanelView, selectedToolKey, toolRegistry as any, readerMode));
|
||||
}, [leftPanelView, selectedToolKey, toolRegistry, readerMode]);
|
||||
|
||||
const handleFilesButtonClick = () => {
|
||||
openFilesModal();
|
||||
@ -49,9 +49,7 @@ const QuickAccessBar = forwardRef<HTMLDivElement>(({
|
||||
type: 'navigation',
|
||||
onClick: () => {
|
||||
setActiveButton('read');
|
||||
// Clear any selected tool and return to picker so the top tool indicator hides
|
||||
handleBackToTools();
|
||||
// Then enter reader mode
|
||||
handleReaderToggle();
|
||||
}
|
||||
},
|
||||
@ -67,8 +65,7 @@ const QuickAccessBar = forwardRef<HTMLDivElement>(({
|
||||
type: 'navigation',
|
||||
onClick: () => {
|
||||
setActiveButton('sign');
|
||||
// Ensure any previously selected tool is cleared so indicator hides
|
||||
handleBackToTools();
|
||||
handleToolSelect('sign');
|
||||
}
|
||||
},
|
||||
{
|
||||
@ -83,8 +80,7 @@ const QuickAccessBar = forwardRef<HTMLDivElement>(({
|
||||
type: 'navigation',
|
||||
onClick: () => {
|
||||
setActiveButton('automate');
|
||||
// Ensure any previously selected tool is cleared so indicator hides
|
||||
handleBackToTools();
|
||||
handleToolSelect('automate');
|
||||
}
|
||||
},
|
||||
{
|
||||
|
@ -59,11 +59,7 @@ export const getTargetNavButton = (
|
||||
): string | null => {
|
||||
if (!selectedToolKey) return null;
|
||||
|
||||
const toolEntry = registry[selectedToolKey];
|
||||
if (!toolEntry) return null;
|
||||
|
||||
// Use the tool's view as the nav button id
|
||||
return toolEntry.view || null;
|
||||
return selectedToolKey;
|
||||
};
|
||||
|
||||
/**
|
||||
@ -72,8 +68,13 @@ export const getTargetNavButton = (
|
||||
export const getActiveNavButton = (
|
||||
leftPanelView: 'toolPicker' | 'toolContent',
|
||||
selectedToolKey: string | null,
|
||||
registry: ReturnType<typeof useFlatToolRegistry>
|
||||
registry: ReturnType<typeof useFlatToolRegistry>,
|
||||
readerMode: boolean
|
||||
): string => {
|
||||
// Reader mode takes precedence and should highlight the Read nav item
|
||||
if (readerMode) {
|
||||
return 'read';
|
||||
}
|
||||
if (leftPanelView !== 'toolContent' || !selectedToolKey) {
|
||||
return 'tools';
|
||||
}
|
||||
|
@ -142,13 +142,22 @@ export function ToolWorkflowProvider({ children, onViewChange }: ToolWorkflowPro
|
||||
|
||||
// Workflow actions (compound actions that coordinate multiple state changes)
|
||||
const handleToolSelect = useCallback((toolId: string) => {
|
||||
// Special-case: if tool is a dedicated reader tool, enter reader mode and do not go to toolContent
|
||||
if (toolId === 'read' || toolId === 'view-pdf') {
|
||||
setReaderMode(true);
|
||||
setLeftPanelView('toolPicker');
|
||||
clearToolSelection();
|
||||
setSearchQuery('');
|
||||
return;
|
||||
}
|
||||
|
||||
selectTool(toolId);
|
||||
onViewChange?.('fileEditor');
|
||||
setLeftPanelView('toolContent');
|
||||
setReaderMode(false);
|
||||
// Clear search so the tool content becomes visible immediately
|
||||
setSearchQuery('');
|
||||
}, [selectTool, onViewChange, setLeftPanelView, setReaderMode, setSearchQuery]);
|
||||
}, [selectTool, onViewChange, setLeftPanelView, setReaderMode, setSearchQuery, clearToolSelection]);
|
||||
|
||||
const handleBackToTools = useCallback(() => {
|
||||
setLeftPanelView('toolPicker');
|
||||
|
@ -670,15 +670,6 @@ export function useFlatToolRegistry(): ToolRegistry {
|
||||
category: "Recommended Tools",
|
||||
subcategory: null
|
||||
},
|
||||
"view-pdf": {
|
||||
icon: <span className="material-symbols-rounded">article</span>,
|
||||
name: t("home.viewPdf.title", "View/Edit PDF"),
|
||||
component: null,
|
||||
view: "view",
|
||||
description: t("home.viewPdf.desc", "View, annotate, draw, add text or images"),
|
||||
category: "Recommended Tools",
|
||||
subcategory: null
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
|
Loading…
x
Reference in New Issue
Block a user