feat: Add a Documents menu item, refactor DocumentsPage to use BlocProvider and UiAppBar, and capitalize the 'KROWER I' profile level badge text.

apps/mobile/packages/features/staff/profile/lib/src/presentation/widgets/header/profile_level_badge.dart

@@ -19,7 +19,7 @@ class ProfileLevelBadge extends StatelessWidget {
     switch (status) {
       case StaffStatus.active:
       case StaffStatus.verified:
-        return 'Krower I';
+        return 'KROWER I';
       case StaffStatus.pending:
       case StaffStatus.completedProfile:
         return 'Pending';

apps/mobile/packages/features/staff/profile/lib/src/presentation/widgets/sections/onboarding_section.dart

@@ -56,6 +56,11 @@ class OnboardingSection extends StatelessWidget {
                   label: i18n.menu_items.attire,
                   onTap: () => Modular.to.toAttire(),
                 ),
+                ProfileMenuItem(
+                  icon: UiIcons.file,
+                  label: i18n.menu_items.documents,
+                  onTap: () => Modular.to.toDocuments(),
+                ),
               ],
             ),
           ],

apps/mobile/packages/features/staff/profile_sections/compliance/documents/lib/src/presentation/pages/documents_page.dart

@@ -1,10 +1,10 @@
+import 'package:core_localization/core_localization.dart';
 import 'package:design_system/design_system.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
 import 'package:flutter_modular/flutter_modular.dart';
+import 'package:krow_core/core.dart';
 import 'package:krow_domain/krow_domain.dart';
-// ignore: depend_on_referenced_packages
-import 'package:core_localization/core_localization.dart';
 
 import '../blocs/documents/documents_cubit.dart';
 import '../blocs/documents/documents_state.dart';
@@ -14,89 +14,80 @@ import '../widgets/documents_progress_card.dart';
 class DocumentsPage extends StatelessWidget {
   const DocumentsPage({super.key});
 
-
   @override
   Widget build(BuildContext context) {
-    final DocumentsCubit cubit = Modular.get<DocumentsCubit>();
-
-    if (cubit.state.status == DocumentsStatus.initial) {
-      cubit.loadDocuments();
-    }
-
     return Scaffold(
-      appBar: AppBar(
+      appBar: UiAppBar(
-        elevation: 0,
+        title: t.staff_documents.title,
-        leading: IconButton(
+        showBackButton: true,
-          icon: const Icon(UiIcons.arrowLeft, color: UiColors.iconSecondary),
+        onLeadingPressed: () => Modular.to.toProfile(),
-          onPressed: () => Modular.to.pop(),
-        ),
-        title: Text(
-          t.staff_documents.title,
-          style: UiTypography.headline3m.copyWith(
-            color: UiColors.textPrimary,
-          ),
-        ),
-        bottom: PreferredSize(
-          preferredSize: const Size.fromHeight(1.0),
-          child: Container(color: UiColors.border, height: 1.0),
-        ),
       ),
-      body: BlocBuilder<DocumentsCubit, DocumentsState>(
+      body: BlocProvider<DocumentsCubit>(
-        bloc: cubit,
+        create: (BuildContext context) =>
-        builder: (BuildContext context, DocumentsState state) {
+            Modular.get<DocumentsCubit>()..loadDocuments(),
-          if (state.status == DocumentsStatus.loading) {
+        child: BlocBuilder<DocumentsCubit, DocumentsState>(
-            return const Center(
+          builder: (BuildContext context, DocumentsState state) {
-              child: CircularProgressIndicator(
+            if (state.status == DocumentsStatus.loading) {
-                valueColor: AlwaysStoppedAnimation<Color>(UiColors.primary),
+              return const Center(
-              ),
+                child: CircularProgressIndicator(
-            );
+                  valueColor: AlwaysStoppedAnimation<Color>(UiColors.primary),
-          }
+                ),
-          if (state.status == DocumentsStatus.failure) {
+              );
-            return Center(
+            }
-              child: Padding(
+            if (state.status == DocumentsStatus.failure) {
-                padding: const EdgeInsets.all(UiConstants.space4),
+              return Center(
+                child: Padding(
+                  padding: const EdgeInsets.all(UiConstants.space4),
+                  child: Text(
+                    state.errorMessage != null
+                        ? (state.errorMessage!.contains('errors.')
+                              ? translateErrorKey(state.errorMessage!)
+                              : t.staff_documents.list.error(
+                                  message: state.errorMessage!,
+                                ))
+                        : t.staff_documents.list.error(message: 'Unknown'),
+                    textAlign: TextAlign.center,
+                    style: UiTypography.body1m.copyWith(
+                      color: UiColors.textSecondary,
+                    ),
+                  ),
+                ),
+              );
+            }
+            if (state.documents.isEmpty) {
+              return Center(
                 child: Text(
-                  state.errorMessage != null
+                  t.staff_documents.list.empty,
-                      ? (state.errorMessage!.contains('errors.')
+                  style: UiTypography.body1m.copyWith(
-                          ? translateErrorKey(state.errorMessage!)
+                    color: UiColors.textSecondary,
-                          : t.staff_documents.list.error(message: state.errorMessage!))
+                  ),
-                      : t.staff_documents.list.error(message: 'Unknown'),
-                  textAlign: TextAlign.center,
-                  style: UiTypography.body1m.copyWith(color: UiColors.textSecondary),
                 ),
-              ),
+              );
-            );
+            }
-          }
-          if (state.documents.isEmpty) {
-            return Center(
-              child: Text(
-                t.staff_documents.list.empty,
-                style: UiTypography.body1m.copyWith(color: UiColors.textSecondary),
-              ),
-            );
-          }
 
-          return ListView(
+            return ListView(
-            padding: const EdgeInsets.symmetric(
+              padding: const EdgeInsets.symmetric(
-              horizontal: UiConstants.space5,
+                horizontal: UiConstants.space5,
-              vertical: UiConstants.space6,
+                vertical: UiConstants.space6,
-            ),
-            children: <Widget>[
-              DocumentsProgressCard(
-                completedCount: state.completedCount,
-                totalCount: state.totalCount,
-                progress: state.progress,
               ),
-              const SizedBox(height: UiConstants.space4),
+              children: <Widget>[
-              ...state.documents.map(
+                DocumentsProgressCard(
-                (StaffDocument doc) => DocumentCard(
+                  completedCount: state.completedCount,
-                  document: doc,
+                  totalCount: state.totalCount,
-                  onTap: () => Modular.to.pushNamed('./details', arguments: doc.id),
+                  progress: state.progress,
                 ),
-              ),
+                const SizedBox(height: UiConstants.space4),
-            ],
+                ...state.documents.map(
-          );
+                  (StaffDocument doc) => DocumentCard(
-        },
+                    document: doc,
+                    onTap: () =>
+                        Modular.to.pushNamed('./details', arguments: doc.id),
+                  ),
+                ),
+              ],
+            );
+          },
+        ),
       ),
     );
   }