Fixed 3 issues and completed FAB implementation:
1. ✅ Dynamic Submenu Top Position
- Submenu now moves to top-0 when header is hidden
- Moves back to top-16 when header is visible
- Smooth transition based on scroll
Implementation:
- Added isHeaderVisible state in Shell
- Header notifies parent via onVisibilityChange callback
- Submenu receives headerVisible prop
- Dynamic topClass: headerVisible ? 'top-16' : 'top-0'
2. ✅ Hide Submenu on More Page
- More page now has no submenu bar
- Cleaner UI for navigation menu
Implementation:
- Added isMorePage check: location.pathname === '/more'
- Conditionally render submenu: {!isMorePage && (...)}
3. ✅ FAB Working on All Pages
- Dashboard: Quick Actions (placeholder)
- Orders: Create Order → /orders/new ✅
- Products: Add Product → /products/new
- Customers: Add Customer → /customers/new
- Coupons: Create Coupon → /coupons/new
Implementation:
- Added useFABConfig('orders') to Orders page
- FAB now visible and functional
- Clicking navigates to create page
Mobile Navigation Flow:
┌─────────────────────────────────┐
│ App Bar (hides on scroll) │
├─────────────────────────────────┤
│ Submenu (top-0 when bar hidden) │ ← Dynamic!
├─────────────────────────────────┤
│ Page Header (sticky) │
├─────────────────────────────────┤
│ Content (scrollable) │
│ [+] FAB │ ← Working!
├─────────────────────────────────┤
│ Bottom Nav (fixed) │
└─────────────────────────────────┘
More Page (Clean):
┌─────────────────────────────────┐
│ App Bar │
├─────────────────────────────────┤
│ (No submenu) │ ← Clean!
├─────────────────────────────────┤
│ More Page Content │
│ - Coupons │
│ - Settings │
├─────────────────────────────────┤
│ Bottom Nav │
└─────────────────────────────────┘
Files Modified:
- App.tsx: Added header visibility tracking, More page check
- SubmenuBar.tsx: Added headerVisible prop, dynamic top
- DashboardSubmenuBar.tsx: Added headerVisible prop, dynamic top
- Orders/index.tsx: Added useFABConfig('orders')
Next Steps:
- Add useFABConfig to Products, Customers, Coupons pages
- Implement speed dial menu for Dashboard FAB
- Test on real devices
Result:
✅ Submenu position responds to header visibility
✅ More page has clean layout
✅ FAB working on Orders page
✅ Ready to add FAB to remaining pages
87d2704a72