feat: make statusId dynamic in reimbursement handling and update related components

lib/controller/expense/expense_detail_controller.dart

@@ -81,6 +81,7 @@ class ExpenseDetailController extends GetxController {
     required String reimburseTransactionId,
     required String reimburseDate,
     required String reimburseById,
+    required String statusId, // ✅ dynamic
   }) async {
     isLoading.value = true;
     errorMessage.value = '';
@@ -90,7 +91,7 @@ class ExpenseDetailController extends GetxController {
 
       final success = await ApiService.updateExpenseStatusApi(
         expenseId: expenseId,
-        statusId: 'reimbursed',
+        statusId: statusId, // ✅ now dynamic
         comment: comment,
         reimburseTransactionId: reimburseTransactionId,
         reimburseDate: reimburseDate,

lib/model/expense/reimbursement_bottom_sheet.dart

@@ -6,14 +6,14 @@ import 'package:marco/helpers/widgets/my_text.dart';
 
 class ReimbursementBottomSheet extends StatefulWidget {
   final String expenseId;
-   final String statusId;
+  final String statusId;
   final void Function() onClose;
   final Future<bool> Function({
     required String comment,
     required String reimburseTransactionId,
     required String reimburseDate,
     required String reimburseById,
-    
+    required String statusId,
   }) onSubmit;
 
   const ReimbursementBottomSheet({
@@ -21,16 +21,17 @@ class ReimbursementBottomSheet extends StatefulWidget {
     required this.expenseId,
     required this.onClose,
     required this.onSubmit,
-     required this.statusId,
-    
+    required this.statusId,
   });
 
   @override
-  State<ReimbursementBottomSheet> createState() => _ReimbursementBottomSheetState();
+  State<ReimbursementBottomSheet> createState() =>
+      _ReimbursementBottomSheetState();
 }
 
 class _ReimbursementBottomSheetState extends State<ReimbursementBottomSheet> {
-  final ExpenseDetailController controller = Get.find<ExpenseDetailController>();
+  final ExpenseDetailController controller =
+      Get.find<ExpenseDetailController>();
 
   final TextEditingController commentCtrl = TextEditingController();
   final TextEditingController txnCtrl = TextEditingController();
@@ -47,13 +48,15 @@ class _ReimbursementBottomSheetState extends State<ReimbursementBottomSheet> {
     showModalBottomSheet(
       context: context,
       backgroundColor: Colors.white,
-      shape: const RoundedRectangleBorder(borderRadius: BorderRadius.vertical(top: Radius.circular(16))),
+      shape: const RoundedRectangleBorder(
+          borderRadius: BorderRadius.vertical(top: Radius.circular(16))),
       builder: (_) {
         return SizedBox(
           height: 300,
           child: Obx(() {
             final employees = controller.allEmployees;
-            if (employees.isEmpty) return const Center(child: Text("No employees found"));
+            if (employees.isEmpty)
+              return const Center(child: Text("No employees found"));
             return ListView.builder(
               itemCount: employees.length,
               itemBuilder: (_, index) {
@@ -113,7 +116,8 @@ class _ReimbursementBottomSheetState extends State<ReimbursementBottomSheet> {
                   children: [
                     _buildInputField(label: 'Comment', controller: commentCtrl),
                     const SizedBox(height: 16),
-                    _buildInputField(label: 'Transaction ID', controller: txnCtrl),
+                    _buildInputField(
+                        label: 'Transaction ID', controller: txnCtrl),
                     const SizedBox(height: 16),
                     _buildDatePickerField(),
                     const SizedBox(height: 16),
@@ -130,12 +134,14 @@ class _ReimbursementBottomSheetState extends State<ReimbursementBottomSheet> {
     );
   }
 
-  Widget _buildInputField({required String label, required TextEditingController controller}) {
+  Widget _buildInputField(
+      {required String label, required TextEditingController controller}) {
     return TextField(
       controller: controller,
       decoration: InputDecoration(
         labelText: label,
-        contentPadding: const EdgeInsets.symmetric(horizontal: 12, vertical: 14),
+        contentPadding:
+            const EdgeInsets.symmetric(horizontal: 12, vertical: 14),
         border: OutlineInputBorder(
           borderRadius: BorderRadius.circular(8),
           borderSide: BorderSide(color: Colors.grey.shade300),
@@ -163,7 +169,8 @@ class _ReimbursementBottomSheetState extends State<ReimbursementBottomSheet> {
         child: InputDecorator(
           decoration: InputDecoration(
             labelText: 'Reimbursement Date',
-            contentPadding: const EdgeInsets.symmetric(horizontal: 12, vertical: 14),
+            contentPadding:
+                const EdgeInsets.symmetric(horizontal: 12, vertical: 14),
             border: OutlineInputBorder(
               borderRadius: BorderRadius.circular(8),
               borderSide: BorderSide(color: Colors.grey.shade300),
@@ -194,7 +201,8 @@ class _ReimbursementBottomSheetState extends State<ReimbursementBottomSheet> {
         child: InputDecorator(
           decoration: InputDecoration(
             labelText: 'Reimbursed By',
-            contentPadding: const EdgeInsets.symmetric(horizontal: 12, vertical: 14),
+            contentPadding:
+                const EdgeInsets.symmetric(horizontal: 12, vertical: 14),
             border: OutlineInputBorder(
               borderRadius: BorderRadius.circular(8),
               borderSide: BorderSide(color: Colors.grey.shade300),
@@ -206,7 +214,9 @@ class _ReimbursementBottomSheetState extends State<ReimbursementBottomSheet> {
                 : '${controller.selectedReimbursedBy.value?.firstName ?? ''} ${controller.selectedReimbursedBy.value?.lastName ?? ''}',
             style: TextStyle(
               fontSize: 14,
-              color: controller.selectedReimbursedBy.value == null ? Colors.grey : Colors.black,
+              color: controller.selectedReimbursedBy.value == null
+                  ? Colors.grey
+                  : Colors.black,
             ),
           ),
         ),
@@ -224,11 +234,13 @@ class _ReimbursementBottomSheetState extends State<ReimbursementBottomSheet> {
               Get.back();
             },
             icon: const Icon(Icons.close, color: Colors.white),
-            label: MyText.bodyMedium("Cancel", color: Colors.white, fontWeight: 600),
+            label: MyText.bodyMedium("Cancel",
+                color: Colors.white, fontWeight: 600),
             style: ElevatedButton.styleFrom(
               backgroundColor: Colors.red,
-              shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
-              padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 14),
+              shape: RoundedRectangleBorder(
+                  borderRadius: BorderRadius.circular(12)),
+              padding: const EdgeInsets.symmetric(horizontal: 5, vertical: 7),
             ),
           ),
         ),
@@ -251,7 +263,9 @@ class _ReimbursementBottomSheetState extends State<ReimbursementBottomSheet> {
                         comment: commentCtrl.text.trim(),
                         reimburseTransactionId: txnCtrl.text.trim(),
                         reimburseDate: dateStr.value,
-                        reimburseById: controller.selectedReimbursedBy.value!.id,
+                        reimburseById:
+                            controller.selectedReimbursedBy.value!.id,
+                        statusId: widget.statusId,
                       );
 
                       if (success) {
@@ -269,8 +283,10 @@ class _ReimbursementBottomSheetState extends State<ReimbursementBottomSheet> {
               ),
               style: ElevatedButton.styleFrom(
                 backgroundColor: Colors.indigo,
-                shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
-                padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 14),
+                shape: RoundedRectangleBorder(
+                    borderRadius: BorderRadius.circular(12)),
+                padding:
+                    const EdgeInsets.symmetric(horizontal: 5, vertical: 7),
               ),
             );
           }),

lib/view/expense/expense_detail_screen.dart

@@ -90,22 +90,28 @@ class ExpenseDetailScreen extends StatelessWidget {
       ),
       body: SafeArea(
         child: Obx(() {
+          // Show error snackbar only once after frame render
+          if (controller.errorMessage.isNotEmpty) {
+            WidgetsBinding.instance.addPostFrameCallback((_) {
+              Get.snackbar(
+                "Error",
+                controller.errorMessage.value,
+                backgroundColor: Colors.red.withOpacity(0.9),
+                colorText: Colors.white,
+              );
+              controller.errorMessage.value = '';
+            });
+          }
+
           if (controller.isLoading.value) {
             return _buildLoadingSkeleton();
           }
-          if (controller.errorMessage.isNotEmpty) {
-            return Center(
-              child: MyText.bodyMedium(
-                controller.errorMessage.value,
-                color: Colors.red,
-              ),
-            );
-          }
 
           final expense = controller.expense.value;
           if (expense == null) {
             return Center(
-                child: MyText.bodyMedium("No expense details found."));
+              child: MyText.bodyMedium("No expense details found."),
+            );
           }
 
           final statusColor = getStatusColor(expense.status.name,
@@ -116,8 +122,14 @@ class ExpenseDetailScreen extends StatelessWidget {
             decimalDigits: 2,
           ).format(expense.amount);
 
+          // === CHANGE: Add proper bottom padding to always keep content away from device nav bar ===
           return SingleChildScrollView(
-            padding: const EdgeInsets.all(8),
+            padding: EdgeInsets.fromLTRB(
+              8,
+              8,
+              8,
+              16 + MediaQuery.of(context).padding.bottom, // KEY LINE
+            ),
             child: Center(
               child: Container(
                 constraints: const BoxConstraints(maxWidth: 520),
@@ -199,13 +211,13 @@ class ExpenseDetailScreen extends StatelessWidget {
                         builder: (context) => ReimbursementBottomSheet(
                           expenseId: expense.id,
                           statusId: next.id,
-                          onClose:
-                              () {}, // <-- This is the missing required parameter
+                          onClose: () {},
                           onSubmit: ({
                             required String comment,
                             required String reimburseTransactionId,
                             required String reimburseDate,
                             required String reimburseById,
+                            required String statusId,
                           }) async {
                             final success = await controller
                                 .updateExpenseStatusWithReimbursement(
@@ -214,6 +226,7 @@ class ExpenseDetailScreen extends StatelessWidget {
                               reimburseTransactionId: reimburseTransactionId,
                               reimburseDate: reimburseDate,
                               reimburseById: reimburseById,
+                              statusId: statusId,
                             );
 
                             if (success) {