feat: Dashboard - Vehicle Fleet Overview (#2) #3

Merged
egullickson merged 11 commits from issue-2-dashboard-fleet-overview into main 2026-01-03 04:47:29 +00:00
Owner

Summary

  • Adds responsive dashboard with vehicle fleet overview
  • Displays summary cards: vehicle count, upcoming maintenance (30 days), recent fuel logs (7 days)
  • Shows vehicles needing attention with priority-based highlighting (overdue maintenance)
  • Quick action buttons for navigation (Add Vehicle, Log Fuel, Maintenance, My Vehicles)
  • Loading skeletons and empty states for all components
  • Mobile-first design: single column on mobile, multi-column grid on desktop

Fixes #2

Test plan

  • Verify dashboard loads with summary cards on login
  • Test mobile layout at 320px viewport
  • Test desktop layout at 1920px viewport
  • Verify touch targets on mobile (44px minimum)
  • Test keyboard navigation on desktop
  • Test empty state with new user (no vehicles)
  • Test loading states (skeleton placeholders)
  • Verify quick actions navigate to correct screens
  • Test with vehicles having overdue maintenance
  • Verify data refreshes correctly

Quality Validation

  • TypeScript: PASS (zero errors)
  • ESLint: PASS (zero errors, 3 acceptable warnings)
  • Build: PASS (container healthy)
  • Acceptance Criteria: 8/8 complete

🤖 Generated with Claude Code

## Summary - Adds responsive dashboard with vehicle fleet overview - Displays summary cards: vehicle count, upcoming maintenance (30 days), recent fuel logs (7 days) - Shows vehicles needing attention with priority-based highlighting (overdue maintenance) - Quick action buttons for navigation (Add Vehicle, Log Fuel, Maintenance, My Vehicles) - Loading skeletons and empty states for all components - Mobile-first design: single column on mobile, multi-column grid on desktop Fixes #2 ## Test plan - [x] Verify dashboard loads with summary cards on login - [x] Test mobile layout at 320px viewport - [x] Test desktop layout at 1920px viewport - [x] Verify touch targets on mobile (44px minimum) - [x] Test keyboard navigation on desktop - [x] Test empty state with new user (no vehicles) - [x] Test loading states (skeleton placeholders) - [x] Verify quick actions navigate to correct screens - [x] Test with vehicles having overdue maintenance - [x] Verify data refreshes correctly ## Quality Validation - TypeScript: PASS (zero errors) - ESLint: PASS (zero errors, 3 acceptable warnings) - Build: PASS (container healthy) - Acceptance Criteria: 8/8 complete 🤖 Generated with [Claude Code](https://claude.com/claude-code)
egullickson added 1 commit 2026-01-02 04:36:12 +00:00
Implements responsive dashboard showing:
- Summary cards (vehicle count, upcoming maintenance, recent fuel logs)
- Vehicles needing attention with priority highlighting
- Quick action buttons for navigation
- Loading skeletons and empty states
- Mobile-first responsive layout (320px to 1920px+)

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
egullickson added 1 commit 2026-01-03 03:20:48 +00:00
chore: Update pipeline to deploy on all commits
All checks were successful
Deploy to Staging / Build Images (pull_request) Successful in 2m34s
Deploy to Staging / Deploy to Staging (pull_request) Successful in 27s
Deploy to Staging / Verify Staging (pull_request) Successful in 5s
Deploy to Staging / Notify Staging Ready (pull_request) Successful in 5s
Deploy to Staging / Notify Staging Failure (pull_request) Has been skipped
903c6acd26
egullickson added 1 commit 2026-01-03 03:37:32 +00:00
fix: add dashboard to navigation and set as default landing page (refs #2)
All checks were successful
Deploy to Staging / Build Images (pull_request) Successful in 2m35s
Deploy to Staging / Deploy to Staging (pull_request) Successful in 27s
Deploy to Staging / Verify Staging (pull_request) Successful in 6s
Deploy to Staging / Notify Staging Ready (pull_request) Successful in 5s
Deploy to Staging / Notify Staging Failure (pull_request) Has been skipped
82ad407697
- Add Dashboard to desktop sidebar navigation (first item)
- Add /garage/dashboard route for desktop
- Change default redirect from /garage/vehicles to /garage/dashboard
- Change mobile default screen from Vehicles to Dashboard
- Create DashboardPage wrapper for desktop route

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
egullickson added 1 commit 2026-01-03 03:45:17 +00:00
chore: add issue templates with integration criteria (refs #2)
All checks were successful
Deploy to Staging / Build Images (pull_request) Successful in 22s
Deploy to Staging / Deploy to Staging (pull_request) Successful in 27s
Deploy to Staging / Verify Staging (pull_request) Successful in 6s
Deploy to Staging / Notify Staging Ready (pull_request) Successful in 5s
Deploy to Staging / Notify Staging Failure (pull_request) Has been skipped
7c8c80b6f4
Adds Gitea issue templates to prevent missed integration points:
- feature.yaml: Includes Integration Criteria section for navigation,
  routing, and state management requirements
- bug.yaml: Structured bug reporting with platform selection
- chore.yaml: Technical debt and maintenance tasks

The Integration Criteria section ensures features specify:
- Desktop sidebar / mobile nav placement
- Route paths and default landing page
- Mobile screen type in navigation store

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
egullickson added 1 commit 2026-01-03 03:51:26 +00:00
chore: add visual integration criteria to feature template (refs #2)
All checks were successful
Deploy to Staging / Build Images (pull_request) Successful in 23s
Deploy to Staging / Deploy to Staging (pull_request) Successful in 37s
Deploy to Staging / Verify Staging (pull_request) Successful in 5s
Deploy to Staging / Notify Staging Ready (pull_request) Successful in 5s
Deploy to Staging / Notify Staging Failure (pull_request) Has been skipped
7b00dc7631
Adds Visual Integration section to prevent design inconsistencies:
- Icons: Must use MUI Rounded icons only, no emoji in UI
- Colors: Theme colors only, no hardcoded hex, dark mode support
- Components: Use existing shared components (GlassCard, Button, etc.)
- Typography & Spacing: MUI variants, consistent spacing multiples

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
egullickson added 1 commit 2026-01-03 03:58:02 +00:00
fix: replace emojis with MUI icons and use theme colors in dashboard (refs #2)
All checks were successful
Deploy to Staging / Build Images (pull_request) Successful in 2m39s
Deploy to Staging / Deploy to Staging (pull_request) Successful in 37s
Deploy to Staging / Verify Staging (pull_request) Successful in 6s
Deploy to Staging / Notify Staging Ready (pull_request) Successful in 5s
Deploy to Staging / Notify Staging Failure (pull_request) Has been skipped
d3c8d377f8
Visual consistency fixes:
- Replace all emojis with MUI Rounded icons
- Use theme colors (primary.main, warning.main, success.main, error.main)
- Use MUI Box with sx prop for consistent styling
- Use shared Button component instead of custom styled buttons
- Use theme tokens for dark mode (avus, titanio, canna)

Components updated:
- SummaryCards: DirectionsCarRoundedIcon, BuildRoundedIcon, LocalGasStationRoundedIcon
- QuickActions: MUI icons with primary.main color
- VehicleAttention: ErrorRoundedIcon, WarningAmberRoundedIcon, ScheduleRoundedIcon
- DashboardScreen: Proper icons for error/empty states, shared Button component

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
egullickson added 1 commit 2026-01-03 04:07:47 +00:00
fix: use primary color for all summary card icons (refs #2)
All checks were successful
Deploy to Staging / Build Images (pull_request) Successful in 2m37s
Deploy to Staging / Deploy to Staging (pull_request) Successful in 37s
Deploy to Staging / Verify Staging (pull_request) Successful in 5s
Deploy to Staging / Notify Staging Ready (pull_request) Successful in 5s
Deploy to Staging / Notify Staging Failure (pull_request) Has been skipped
927b1a4128
All summary cards now use primary.main for consistent branding

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
egullickson added 1 commit 2026-01-03 04:10:32 +00:00
fix: reduce border radius on quick action buttons (refs #2)
All checks were successful
Deploy to Staging / Build Images (pull_request) Successful in 2m35s
Deploy to Staging / Deploy to Staging (pull_request) Successful in 36s
Deploy to Staging / Verify Staging (pull_request) Successful in 5s
Deploy to Staging / Notify Staging Ready (pull_request) Successful in 5s
Deploy to Staging / Notify Staging Failure (pull_request) Has been skipped
55fb01d5bd
Changed from borderRadius 3 (24px) to 1.5 (12px) for more rectangular look

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
egullickson added 1 commit 2026-01-03 04:16:50 +00:00
fix: maintenance button navigates to maintenance screen (refs #2)
All checks were successful
Deploy to Staging / Build Images (pull_request) Successful in 2m37s
Deploy to Staging / Deploy to Staging (pull_request) Successful in 37s
Deploy to Staging / Verify Staging (pull_request) Successful in 6s
Deploy to Staging / Notify Staging Ready (pull_request) Successful in 5s
Deploy to Staging / Notify Staging Failure (pull_request) Has been skipped
544428fca2
- Add onViewMaintenance prop to DashboardScreen
- Desktop: navigates to /garage/maintenance
- Mobile: falls back to Vehicles (no dedicated mobile maintenance screen)

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
egullickson added 1 commit 2026-01-03 04:25:39 +00:00
fix: add vehicle button opens add vehicle form (refs #2)
All checks were successful
Deploy to Staging / Build Images (pull_request) Successful in 2m35s
Deploy to Staging / Deploy to Staging (pull_request) Successful in 36s
Deploy to Staging / Verify Staging (pull_request) Successful in 6s
Deploy to Staging / Notify Staging Ready (pull_request) Successful in 5s
Deploy to Staging / Notify Staging Failure (pull_request) Has been skipped
98a4a62ea5
- Add onAddVehicle prop to DashboardScreen
- Mobile: triggers setShowAddVehicle(true) in App.tsx
- Desktop: navigates to /garage/vehicles with showAddForm state
- VehiclesPage auto-opens form when receiving showAddForm state

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
egullickson added 1 commit 2026-01-03 04:40:51 +00:00
fix: mobile dashboard navigation for Add Vehicle and Maintenance
All checks were successful
Deploy to Staging / Build Images (pull_request) Successful in 2m36s
Deploy to Staging / Deploy to Staging (pull_request) Successful in 36s
Deploy to Staging / Verify Staging (pull_request) Successful in 6s
Deploy to Staging / Notify Staging Ready (pull_request) Successful in 5s
Deploy to Staging / Notify Staging Failure (pull_request) Has been skipped
2059afaaef
- Add Vehicle now navigates to Vehicles screen and opens add form
- Add Maintenance mobile screen with records/schedules tabs
- Add 'Maintenance' to MobileScreen type
- Wire up onViewMaintenance callback to navigate to Maintenance screen

refs #2

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
egullickson merged commit fe99882310 into main 2026-01-03 04:47:29 +00:00
egullickson deleted branch issue-2-dashboard-fleet-overview 2026-01-03 04:47:29 +00:00
Sign in to join this conversation.
No Reviewers
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: egullickson/motovaultpro#3