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) => {
const { isRainbowMode } = useRainbowThemeContext();
const { openFilesModal, isFilesModalOpen } = useFilesModalContext();
const { handleReaderToggle, selectedTool, leftPanelView } = useToolWorkflow();
const { handleReaderToggle, selectedTool, selectedToolKey, leftPanelView } = useToolWorkflow();
const [configModalOpen, setConfigModalOpen] = useState(false);
const [activeButton, setActiveButton] = useState<string>('tools');
const scrollableRef = useRef<HTMLDivElement>(null);
@ -31,7 +31,7 @@ const QuickAccessBar = forwardRef<HTMLDivElement>(({
// Sync left nav highlight with selected tool when appropriate
useEffect(() => {
if (leftPanelView === 'toolContent' && selectedTool) {
const target = getTargetNavButton(selectedTool);
const target = getTargetNavButton(selectedTool, selectedToolKey);
if (target && activeButton !== target) {
setActiveButton(target);
@ -46,7 +46,7 @@ const QuickAccessBar = forwardRef<HTMLDivElement>(({
if (leftPanelView !== 'toolContent') {
setActiveButton('tools');
}
}, [leftPanelView, selectedTool?.view, selectedTool?.subcategory]);
}, [leftPanelView, selectedTool, selectedToolKey]);
const handleFilesButtonClick = () => {
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
*/
export const getTargetNavButton = (selectedTool: any): string | null => {
if (!selectedTool) return null;
export const getTargetNavButton = (selectedTool: any, selectedToolKey: string | null): string | null => {
if (!selectedTool || !selectedToolKey) return null;
// Map tool.view to nav button ids
if (selectedTool.view === 'sign') return 'sign';
if (selectedTool.view === 'view') return 'read';
// Use subcategory to infer Automate group
// Map specific tool keys to nav button ids
if (selectedToolKey === 'sign') return 'sign';
if (selectedToolKey === 'read') return 'read';
if (selectedToolKey === 'automate') return 'automate';
// Fallback: use subcategory for automation tools
if (selectedTool.subcategory === 'Automation') return 'automate';
return null;