fix: add Maintenance to mobile bottom-sheet More menu (#162) #164

Closed
opened 2026-02-13 22:22:08 +00:00 by egullickson · 2 comments
Owner

Relates to #162

Severity: Critical

Problem

The "More" bottom-sheet menu on mobile lists: Settings, Documents, Stations, Log Fuel, Vehicles, Dashboard -- but Maintenance is completely absent. There is no way to reach the Maintenance page from mobile navigation at all.

Acceptance Criteria

  • Maintenance appears in the mobile "More" bottom-sheet menu
  • Tapping Maintenance navigates to the Maintenance page
  • Menu item order is logical and consistent
  • Tested on mobile (320px, 768px)
Relates to #162 ## Severity: Critical ## Problem The "More" bottom-sheet menu on mobile lists: Settings, Documents, Stations, Log Fuel, Vehicles, Dashboard -- but Maintenance is completely absent. There is no way to reach the Maintenance page from mobile navigation at all. ## Acceptance Criteria - Maintenance appears in the mobile "More" bottom-sheet menu - Tapping Maintenance navigates to the Maintenance page - Menu item order is logical and consistent - Tested on mobile (320px, 768px)
egullickson added the
status
backlog
type
chore
labels 2026-02-13 22:22:24 +00:00
egullickson added this to the Sprint 2026-02-02 milestone 2026-02-13 22:22:33 +00:00
Author
Owner

Implementation Plan (from #162 -- Milestone 3)

Phase: 1 (Foundation) | Priority: Critical | Depends on: None | Blocks: None

Context

The mobile bottom-sheet "More" menu (hamburger drawer) does not include Maintenance as a navigation option. Users cannot reach the Maintenance page from the More menu.

Implementation

1. In frontend/src/shared-minimal/components/mobile/HamburgerDrawer.tsx:

  • Add { screen: 'Maintenance', label: 'Maintenance', icon: <BuildRoundedIcon /> } to the menuItems array
  • Place after Documents for logical grouping
  • Import BuildRoundedIcon from @mui/icons-material/BuildRounded

Files

  • frontend/src/shared-minimal/components/mobile/HamburgerDrawer.tsx

Commit Convention

fix: add Maintenance to mobile More menu (refs #164)

Test Criteria

  • Maintenance appears in the More (hamburger) menu
  • Tapping Maintenance navigates to the Maintenance screen correctly
  • Menu item order is logical (Dashboard, Vehicles, Fuel Logs, Documents, Maintenance, ...)
  • Verify on mobile (320px, 768px) viewports

Branch

Work on branch issue-162-ux-design-audit-cleanup (shared with all #162 sub-issues)

## Implementation Plan (from #162 -- Milestone 3) **Phase**: 1 (Foundation) | **Priority**: Critical | **Depends on**: None | **Blocks**: None ### Context The mobile bottom-sheet "More" menu (hamburger drawer) does not include Maintenance as a navigation option. Users cannot reach the Maintenance page from the More menu. ### Implementation **1. In `frontend/src/shared-minimal/components/mobile/HamburgerDrawer.tsx`:** - Add `{ screen: 'Maintenance', label: 'Maintenance', icon: <BuildRoundedIcon /> }` to the `menuItems` array - Place after Documents for logical grouping - Import `BuildRoundedIcon` from `@mui/icons-material/BuildRounded` ### Files - `frontend/src/shared-minimal/components/mobile/HamburgerDrawer.tsx` ### Commit Convention ``` fix: add Maintenance to mobile More menu (refs #164) ``` ### Test Criteria - Maintenance appears in the More (hamburger) menu - Tapping Maintenance navigates to the Maintenance screen correctly - Menu item order is logical (Dashboard, Vehicles, Fuel Logs, Documents, Maintenance, ...) - Verify on mobile (320px, 768px) viewports ### Branch Work on branch `issue-162-ux-design-audit-cleanup` (shared with all #162 sub-issues)
egullickson added
status
in-progress
and removed
status
backlog
labels 2026-02-14 01:37:41 +00:00
Author
Owner

Milestone: Implementation Complete

Phase: Execution | Agent: Developer | Status: PASS

Changes

  • Added BuildRoundedIcon import to HamburgerDrawer.tsx
  • Added { screen: 'Maintenance', label: 'Maintenance', icon: <BuildRoundedIcon /> } to menuItems array, placed after Documents for logical grouping

Verification

  • TypeScript type-check: PASS ('Maintenance' is a valid MobileScreen type)
  • ESLint: PASS
  • Commit: 73976a7 on branch issue-162-ux-design-audit-cleanup

Menu Order (bottom-to-top rendering)

Settings, Documents, Maintenance, Stations, Log Fuel, Vehicles, Dashboard

Verdict: PASS | Next: Visual verification on mobile viewports

## Milestone: Implementation Complete **Phase**: Execution | **Agent**: Developer | **Status**: PASS ### Changes - Added `BuildRoundedIcon` import to `HamburgerDrawer.tsx` - Added `{ screen: 'Maintenance', label: 'Maintenance', icon: <BuildRoundedIcon /> }` to `menuItems` array, placed after Documents for logical grouping ### Verification - TypeScript type-check: PASS (`'Maintenance'` is a valid `MobileScreen` type) - ESLint: PASS - Commit: `73976a7` on branch `issue-162-ux-design-audit-cleanup` ### Menu Order (bottom-to-top rendering) Settings, Documents, **Maintenance**, Stations, Log Fuel, Vehicles, Dashboard *Verdict*: PASS | *Next*: Visual verification on mobile viewports
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: egullickson/motovaultpro#164