[PR #7991] fix sidebar loading issues and navbar on mobile #7364

Open
opened 2025-11-20 08:05:29 -05:00 by saavagebueno · 0 comments
Owner

Original Pull Request: https://github.com/community-scripts/ProxmoxVE/pull/7991

State: closed
Merged: Yes


…on current pathname. Introduced temporary state for non-scripts pages and updated logic for last viewed script handling. Improved accessibility by ensuring proper aria attributes and class management.

✍️ Description

This pull request enhances the navigation experience on both desktop and mobile by improving state management and layout in the navbar and mobile sidebar components. It also fixes API endpoint paths for data fetching. The most important changes are grouped below:

Navigation and State Management Improvements:

  • Updated the MobileSidebar component to differentiate state management between the /scripts page (using query state) and other pages (using local state), ensuring correct sidebar behavior and selection persistence across navigation. [1] [2] [3]
  • Refined the layout of the navbar by adjusting flex properties to better distribute space and ensure responsive design. [1] [2]

Accessibility and UI Adjustments:

  • Made the SheetHeader in the mobile sidebar visually hidden except for screen readers to improve accessibility without affecting layout.

API Endpoint Fixes:

  • Updated API fetch paths in fetchCategories and fetchVersions to use the correct /ProxmoxVE/api/ prefix, ensuring data is loaded from the intended endpoints. [1] [2]

Link: #

Prerequisites (X in brackets)

  • Self-review completed – Code follows project standards.
  • Tested thoroughly – Changes work as expected.
  • No security risks – No hardcoded secrets, unnecessary privilege escalations, or permission issues.

🛠️ Type of Change (X in brackets)

  • 🐞 Bug fix – Resolves an issue without breaking functionality.
  • New feature – Adds new, non-breaking functionality.
  • 💥 Breaking change – Alters existing functionality in a way that may require updates.
  • 🆕 New script – A fully functional and tested script or script set.
  • 🌍 Website update – Changes to website-related JSON files or metadata.
  • 🔧 Refactoring / Code Cleanup – Improves readability or maintainability without changing functionality.
  • 📝 Documentation update – Changes to README, AppName.md, CONTRIBUTING.md, or other docs.
**Original Pull Request:** https://github.com/community-scripts/ProxmoxVE/pull/7991 **State:** closed **Merged:** Yes --- …on current pathname. Introduced temporary state for non-scripts pages and updated logic for last viewed script handling. Improved accessibility by ensuring proper aria attributes and class management.<!--🛑 New scripts must be submitted to [ProxmoxVED](https://github.com/community-scripts/ProxmoxVED) for testing. PRs without prior testing will be closed. --> ## ✍️ Description This pull request enhances the navigation experience on both desktop and mobile by improving state management and layout in the navbar and mobile sidebar components. It also fixes API endpoint paths for data fetching. The most important changes are grouped below: Navigation and State Management Improvements: * Updated the `MobileSidebar` component to differentiate state management between the `/scripts` page (using query state) and other pages (using local state), ensuring correct sidebar behavior and selection persistence across navigation. [[1]](diffhunk://#diff-04e3d0b0da1fbe574fa956c737a36d3734e48ab7964f94ba6ff170e55d619857R22-R35) [[2]](diffhunk://#diff-04e3d0b0da1fbe574fa956c737a36d3734e48ab7964f94ba6ff170e55d619857L43-R64) [[3]](diffhunk://#diff-04e3d0b0da1fbe574fa956c737a36d3734e48ab7964f94ba6ff170e55d619857L94-R123) * Refined the layout of the navbar by adjusting flex properties to better distribute space and ensure responsive design. [[1]](diffhunk://#diff-a46e916b69761c2f2f29b0d775c442cbcfb63938fb6aad68121cf4be53039749L45-R51) [[2]](diffhunk://#diff-a46e916b69761c2f2f29b0d775c442cbcfb63938fb6aad68121cf4be53039749R75) Accessibility and UI Adjustments: * Made the `SheetHeader` in the mobile sidebar visually hidden except for screen readers to improve accessibility without affecting layout. API Endpoint Fixes: * Updated API fetch paths in `fetchCategories` and `fetchVersions` to use the correct `/ProxmoxVE/api/` prefix, ensuring data is loaded from the intended endpoints. [[1]](diffhunk://#diff-91f1eab4877705959067eee4c10c86b95c2968ec6e79e395c922d6a4dc0e916fL4-R4) [[2]](diffhunk://#diff-91f1eab4877705959067eee4c10c86b95c2968ec6e79e395c922d6a4dc0e916fL13-R13) ## 🔗 Related PR / Issue Link: # ## ✅ Prerequisites (**X** in brackets) - [x] **Self-review completed** – Code follows project standards. - [x] **Tested thoroughly** – Changes work as expected. - [x] **No security risks** – No hardcoded secrets, unnecessary privilege escalations, or permission issues. --- ## 🛠️ Type of Change (**X** in brackets) - [x] 🐞 **Bug fix** – Resolves an issue without breaking functionality. - [ ] ✨ **New feature** – Adds new, non-breaking functionality. - [ ] 💥 **Breaking change** – Alters existing functionality in a way that may require updates. - [ ] 🆕 **New script** – A fully functional and tested script or script set. - [ ] 🌍 **Website update** – Changes to website-related JSON files or metadata. - [ ] 🔧 **Refactoring / Code Cleanup** – Improves readability or maintainability without changing functionality. - [ ] 📝 **Documentation update** – Changes to `README`, `AppName.md`, `CONTRIBUTING.md`, or other docs.
saavagebueno added the pull-request label 2025-11-20 08:05:29 -05:00
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: SVI/ProxmoxVE#7364