- Import `useUiStore` into `main-layout.tsx` to access the global sidebar state.
- Add an `onClick` event listener to the main content wrapper.
- Automatically close the sidebar if it is expanded and the user clicks outside of it.
- Enhance overall UX by providing a more intuitive, frictionless way to dismiss the navigation menu.
- Update the `onClick` handler for navigation links in `sidebar.tsx` to use `!isSidebarOpen` instead of a hardcoded boolean.
- Enable navigation items to act as smart toggles: expanding the sidebar when clicked in collapsed mode, and collapsing it when clicked in expanded mode.
- Improve overall user experience by reducing the need to manually click the main toggle button.
- Move `isSidebarOpen` state from local component (`useState`) to global Zustand store (`ui-store.ts`).
- Fix an issue where the sidebar would incorrectly reset to its default closed state when navigating between routes (e.g., to the Telemetry page) due to component remounting.
- Ensure consistent sidebar toggle behavior across the entire dashboard application.
- Update `isSidebarOpen` initial state from true to false in `sidebar.tsx`.
- Ensure the sidebar starts in a mini/collapsed mode when the dashboard is first loaded to provide more space for the main content.
- Import `Date` object to dynamically fetch the current year for the copyright notice.
- Ensure the footer always displays the correct year without manual updates.
- Sync `MobileNav` items and icons with desktop `Sidebar` for consistency.
- Standardize menu icons using `lucide-react` across all navigation components.
- Add a spacer div in `main-layout.tsx` to ensure proper bottom spacing between content and the fixed footer.
- Remove redundant 'aria-hidden' attribute in `MobileNav` to fix accessibility warnings.
- Fix 'Logout' button layout in mobile menu for better responsiveness.
- Create a new `Sidebar` component for desktop with collapse/mini-sidebar feature.
- Rename `navbar.tsx` to `mobile-header.tsx` to better reflect its mobile-specific purpose.
- Synchronize icons (from lucide-react) and menu labels between desktop `Sidebar` and touch-based `MobileNav`.
- Fix 'Logout' button sizing in the mobile menu by removing forced margins for better responsiveness on narrow screens.
- Remove conflicting 'aria-hidden' attribute in MobileNav to resolve browser accessibility (a11y) warnings.
- Add a spacer in `main-layout.tsx` to prevent the bottom content from being overlapped by the fixed Footer.
- Add LogoutProses function in app.tsx to destroy session via apiClient.logout() and clear user state
- Apply <AuthGuard> to private routes (/dashboard, /scan, /expert/reviews, etc.) to prevent unauthorized access
- Update the "Logout" button design in Navbar and MobileNav with a red accent and LogOut icon
- Fix vulnerability allowing direct URL access to the dashboard by bypassing login
- mobile-nav: add 'review' path to NAV_ITEMS array to ensure the menu is accessible on mobile screens.
- scan-page: update background color and border radius of the guidelines card in the right sidebar.
- app & navbar: comment out login, register, and logout features.
- scan-page: align info cards vertically and reduce upload area padding.
- mobile-nav: implement React Portal to fix overlapping menu issue.
- Remove userRole prop, read user directly from auth store
- Add user info section (avatar, name, email) when logged in
- Add Masuk/Daftar buttons at bottom when unauthenticated
- Add Keluar button with loading state when authenticated
- Add tagline under logo in sidebar header
- Add backdrop blur effect for better visual depth
- Use flex-col layout for consistent spacing at any height
- Fix auth system: remove redirect bugs in login/register pages, register
routes, wrap protected routes with AuthGuard, add AuthInitializer
- Add missing navbar links (Diagnosa, Pustaka, expert Review)
- Fix DiagnosesPage status filter to match DB DiagnosisStatus enum,
support URL params (?status=, ?risk=) from dashboard links
- Replace hardcoded disease data on Dashboard with API-driven data,
fix layout bugs (invalid gap-57 class, empty Button)
- Rewrite LibraryPage to use API instead of mock-diseases.ts
- Indonesian-ize Expert Reviews page labels and text
- Wrap DiagnosisDetailPage with MainLayout for consistent layout
- Improve ScanPage UX: image preview before upload, lucide icons,
proper disease names in result modal, file size validation
- Delete dead code: mock-diseases.ts, unused form components,
tailwind.config.ts (Tailwind v4 does not read v3 config)
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
- Refactor landing page content and links for better user experience.
- Introduce a new library page to display disease information with filtering and modal details.
- Add a scan page for users to upload images for diagnosis with a preview modal.
- Enhance login and registration pages with automatic navigation to the dashboard.
- Integrate vite-tsconfig-paths for improved path resolution in Vite configuration.