feat: Implement staff navigation items with profile completion requirements

apps/mobile/packages/features/staff/staff_main/lib/src/presentation/widgets/staff_main_bottom_bar.dart

@@ -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(
+              ...defaultStaffNavItems.map(
-                index: 0,
+                (item) => _buildNavItem(
-                icon: UiIcons.briefcase,
+                  item: item,
-                label: t.staff.main.tabs.shifts,
+                  activeColor: activeColor,
-                activeColor: activeColor,
+                  inactiveColor: inactiveColor,
-                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,
               ),
             ],
           ),
@@ -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 StaffNavItem item,
-    required IconData icon,
-    required String label,
     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,
               ),

apps/mobile/packages/features/staff/staff_main/lib/src/utils/index.dart

@@ -0,0 +1,2 @@
+export 'staff_nav_item.dart';
+export 'staff_nav_items_config.dart';

apps/mobile/packages/features/staff/staff_main/lib/src/utils/staff_nav_item.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;
+}

apps/mobile/packages/features/staff/staff_main/lib/src/utils/staff_nav_items_config.dart

@@ -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,
+  ),
+];