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

fix issue with nav item highlighting

Browse Source
This commit is contained in:
EthanHealy01 2025-08-14 10:26:13 +01:00
parent 30c92ec49c
commit 568daeff02
2 changed files with 11 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
frontend/src/components/shared/QuickAccessBar.tsx
View File

@ -22,7 +22,7 @@ const QuickAccessBar = forwardRef<HTMLDivElement>(({
}, ref) => { }, ref) => {
const { isRainbowMode } = useRainbowThemeContext(); const { isRainbowMode } = useRainbowThemeContext();
const { openFilesModal, isFilesModalOpen } = useFilesModalContext(); const { openFilesModal, isFilesModalOpen } = useFilesModalContext();
const { handleReaderToggle, selectedTool, leftPanelView } = useToolWorkflow(); const { handleReaderToggle, selectedTool, selectedToolKey, leftPanelView } = useToolWorkflow();
const [configModalOpen, setConfigModalOpen] = useState(false); const [configModalOpen, setConfigModalOpen] = useState(false);
const [activeButton, setActiveButton] = useState<string>('tools'); const [activeButton, setActiveButton] = useState<string>('tools');
const scrollableRef = useRef<HTMLDivElement>(null); const scrollableRef = useRef<HTMLDivElement>(null);
@ -31,7 +31,7 @@ const QuickAccessBar = forwardRef<HTMLDivElement>(({
// Sync left nav highlight with selected tool when appropriate // Sync left nav highlight with selected tool when appropriate
useEffect(() => { useEffect(() => {
if (leftPanelView === 'toolContent' && selectedTool) { if (leftPanelView === 'toolContent' && selectedTool) {
const target = getTargetNavButton(selectedTool); const target = getTargetNavButton(selectedTool, selectedToolKey);
if (target && activeButton !== target) { if (target && activeButton !== target) {
setActiveButton(target); setActiveButton(target);
@ -46,7 +46,7 @@ const QuickAccessBar = forwardRef<HTMLDivElement>(({
if (leftPanelView !== 'toolContent') { if (leftPanelView !== 'toolContent') {
setActiveButton('tools'); setActiveButton('tools');
} }
}, [leftPanelView, selectedTool?.view, selectedTool?.subcategory]); }, [leftPanelView, selectedTool, selectedToolKey]);
const handleFilesButtonClick = () => { const handleFilesButtonClick = () => {
openFilesModal(); openFilesModal();

14
frontend/src/components/shared/quickAccessBar/QuickAccessBar.ts
View File

@ -58,13 +58,15 @@ export const getNavButtonStyle = (
/** /**
* Determine which nav button should be highlighted based on selected tool * Determine which nav button should be highlighted based on selected tool
*/ */
export const getTargetNavButton = (selectedTool: any): string | null => { export const getTargetNavButton = (selectedTool: any, selectedToolKey: string | null): string | null => {
if (!selectedTool) return null; if (!selectedTool || !selectedToolKey) return null;
// Map tool.view to nav button ids // Map specific tool keys to nav button ids
if (selectedTool.view === 'sign') return 'sign'; if (selectedToolKey === 'sign') return 'sign';
if (selectedTool.view === 'view') return 'read'; if (selectedToolKey === 'read') return 'read';
// Use subcategory to infer Automate group if (selectedToolKey === 'automate') return 'automate';
// Fallback: use subcategory for automation tools
if (selectedTool.subcategory === 'Automation') return 'automate'; if (selectedTool.subcategory === 'Automation') return 'automate';
return null; return null;