feat: Implement staff navigation items with profile completion requirements
This commit is contained in:
@@ -1,8 +1,8 @@
|
||||
import 'dart:ui';
|
||||
|
||||
import 'package:core_localization/core_localization.dart';
|
||||
import 'package:design_system/design_system.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:staff_main/src/utils/index.dart';
|
||||
|
||||
/// A custom bottom navigation bar for the Staff app.
|
||||
///
|
||||
@@ -36,7 +36,6 @@ class StaffMainBottomBar extends StatelessWidget {
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final t = Translations.of(context);
|
||||
// Staff App colors from design system
|
||||
// Using primary (Blue) for active as per prototype
|
||||
const Color activeColor = UiColors.primary;
|
||||
@@ -73,40 +72,12 @@ class StaffMainBottomBar extends StatelessWidget {
|
||||
mainAxisAlignment: MainAxisAlignment.spaceAround,
|
||||
crossAxisAlignment: CrossAxisAlignment.end,
|
||||
children: <Widget>[
|
||||
_buildNavItem(
|
||||
index: 0,
|
||||
icon: UiIcons.briefcase,
|
||||
label: t.staff.main.tabs.shifts,
|
||||
activeColor: activeColor,
|
||||
inactiveColor: inactiveColor,
|
||||
),
|
||||
_buildNavItem(
|
||||
index: 1,
|
||||
icon: UiIcons.dollar,
|
||||
label: t.staff.main.tabs.payments,
|
||||
activeColor: activeColor,
|
||||
inactiveColor: inactiveColor,
|
||||
),
|
||||
_buildNavItem(
|
||||
index: 2,
|
||||
icon: UiIcons.home,
|
||||
label: t.staff.main.tabs.home,
|
||||
activeColor: activeColor,
|
||||
inactiveColor: inactiveColor,
|
||||
),
|
||||
_buildNavItem(
|
||||
index: 3,
|
||||
icon: UiIcons.clock,
|
||||
label: t.staff.main.tabs.clock_in,
|
||||
activeColor: activeColor,
|
||||
inactiveColor: inactiveColor,
|
||||
),
|
||||
_buildNavItem(
|
||||
index: 4,
|
||||
icon: UiIcons.users,
|
||||
label: t.staff.main.tabs.profile,
|
||||
activeColor: activeColor,
|
||||
inactiveColor: inactiveColor,
|
||||
...defaultStaffNavItems.map(
|
||||
(item) => _buildNavItem(
|
||||
item: item,
|
||||
activeColor: activeColor,
|
||||
inactiveColor: inactiveColor,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
@@ -122,30 +93,31 @@ class StaffMainBottomBar extends StatelessWidget {
|
||||
/// - Spacing uses [UiConstants.space1]
|
||||
/// - Typography uses [UiTypography.footnote2m]
|
||||
/// - Colors are passed as parameters from design system
|
||||
///
|
||||
/// The [item.requireProfileCompletion] flag can be used to conditionally
|
||||
/// disable or style the item based on profile completion status.
|
||||
Widget _buildNavItem({
|
||||
required int index,
|
||||
required IconData icon,
|
||||
required String label,
|
||||
required StaffNavItem item,
|
||||
required Color activeColor,
|
||||
required Color inactiveColor,
|
||||
}) {
|
||||
final bool isSelected = currentIndex == index;
|
||||
final bool isSelected = currentIndex == item.index;
|
||||
return Expanded(
|
||||
child: GestureDetector(
|
||||
onTap: () => onTap(index),
|
||||
onTap: () => onTap(item.index),
|
||||
behavior: HitTestBehavior.opaque,
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
mainAxisAlignment: MainAxisAlignment.end,
|
||||
children: <Widget>[
|
||||
Icon(
|
||||
icon,
|
||||
item.icon,
|
||||
color: isSelected ? activeColor : inactiveColor,
|
||||
size: UiConstants.iconLg,
|
||||
),
|
||||
const SizedBox(height: UiConstants.space1),
|
||||
Text(
|
||||
label,
|
||||
item.label,
|
||||
style: UiTypography.footnote2m.copyWith(
|
||||
color: isSelected ? activeColor : inactiveColor,
|
||||
),
|
||||
|
||||
@@ -0,0 +1,2 @@
|
||||
export 'staff_nav_item.dart';
|
||||
export 'staff_nav_items_config.dart';
|
||||
@@ -0,0 +1,38 @@
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
/// Represents a single navigation item in the staff main bottom navigation bar.
|
||||
///
|
||||
/// This data class encapsulates all properties needed to define a navigation item,
|
||||
/// making it easy to add, remove, or modify items in the bottom bar without
|
||||
/// touching the UI code.
|
||||
class StaffNavItem {
|
||||
/// Creates a [StaffNavItem].
|
||||
const StaffNavItem({
|
||||
required this.index,
|
||||
required this.icon,
|
||||
required this.label,
|
||||
required this.tabKey,
|
||||
this.requireProfileCompletion = false,
|
||||
});
|
||||
|
||||
/// The index of this navigation item in the bottom bar.
|
||||
final int index;
|
||||
|
||||
/// The icon to display for this navigation item.
|
||||
final IconData icon;
|
||||
|
||||
/// The label text to display below the icon.
|
||||
final String label;
|
||||
|
||||
/// The unique key identifying this tab in the main navigation system.
|
||||
///
|
||||
/// This is used internally for routing and state management.
|
||||
final String tabKey;
|
||||
|
||||
/// Whether this navigation item requires the user's profile to be complete.
|
||||
///
|
||||
/// If true, this item may be disabled or show a prompt until the profile
|
||||
/// is fully completed. This is useful for gating access to features that
|
||||
/// require profile information.
|
||||
final bool requireProfileCompletion;
|
||||
}
|
||||
@@ -0,0 +1,44 @@
|
||||
import 'package:design_system/design_system.dart';
|
||||
import 'package:staff_main/src/utils/staff_nav_item.dart';
|
||||
|
||||
/// Predefined navigation items for the Staff app bottom navigation bar.
|
||||
///
|
||||
/// This list defines all available navigation items. To add, remove, or modify
|
||||
/// items, simply update this list. The UI will automatically adapt.
|
||||
final List<StaffNavItem> defaultStaffNavItems = [
|
||||
StaffNavItem(
|
||||
index: 0,
|
||||
icon: UiIcons.briefcase,
|
||||
label: 'Shifts',
|
||||
tabKey: 'shifts',
|
||||
requireProfileCompletion: false,
|
||||
),
|
||||
StaffNavItem(
|
||||
index: 1,
|
||||
icon: UiIcons.dollar,
|
||||
label: 'Payments',
|
||||
tabKey: 'payments',
|
||||
requireProfileCompletion: true,
|
||||
),
|
||||
StaffNavItem(
|
||||
index: 2,
|
||||
icon: UiIcons.home,
|
||||
label: 'Home',
|
||||
tabKey: 'home',
|
||||
requireProfileCompletion: false,
|
||||
),
|
||||
StaffNavItem(
|
||||
index: 3,
|
||||
icon: UiIcons.clock,
|
||||
label: 'Clock In',
|
||||
tabKey: 'clock_in',
|
||||
requireProfileCompletion: true,
|
||||
),
|
||||
StaffNavItem(
|
||||
index: 4,
|
||||
icon: UiIcons.users,
|
||||
label: 'Profile',
|
||||
tabKey: 'profile',
|
||||
requireProfileCompletion: false,
|
||||
),
|
||||
];
|
||||
Reference in New Issue
Block a user