OHO-18(Perfect Homepage)

Backend/index.js

@@ -160,7 +160,7 @@ app.post('/api/transaction/add', async (req, res) => {
     const { description, amount, userId } = req.body;
     if (!userId) return res.status(400).json({ error: 'Missing userId' });
 
-    const predictRes = await axios.post('http://10.231.41.181:5000/api/predict', {
+    const predictRes = await axios.post('http://192.168.1.9:5000/api/predict', {
       description,
     });
     const category = predictRes.data.category || 'Other';
@@ -227,7 +227,7 @@ app.post('/api/transactions/voice', async (req, res) => {
       .trim();
     const description = cleaned || 'misc';
     // Step 3: Predict category using your Flask API
-    const predictRes = await axios.post('http://192.168.1.101:5000/api/predict', {
+    const predictRes = await axios.post('http://192.168.1.9:5000/api/predict', {
       description,
     });
     const category = predictRes.data?.category || 'Other';
@@ -429,7 +429,7 @@ app.post('/api/sync-gmail', async (req, res) => {
 
       let category = 'Other';
       try {
-        const predictRes = await axios.post('http://10.231.41.181:5000/api/predict', {
+        const predictRes = await axios.post('http://192.168.1.9:5000/api/predict', {
           description: parsed.vendor || "Unknown"
         }, { timeout: 5000 }); // Optional timeout
 

Frontend/analysis_options.yaml

@@ -7,6 +7,9 @@
 
 # The following line activates a set of recommended lints for Flutter apps,
 # packages, and plugins designed to encourage good coding practices.
+analyzer:
+  errors:
+    unused_field: ignore
 include: package:flutter_lints/flutter.yaml
 
 linter:

Frontend/lib/main.dart

@@ -8,7 +8,7 @@ import 'package:http/http.dart' as http;
 import 'package:monarch/login.dart';
 import 'package:monarch/speech.dart';
 import 'package:monarch/support/add.dart';
-import 'package:monarch/main_pages/Statistics/update_budget.dart';
+import 'package:monarch/main_pages/Statistics/Budget/update_budget.dart';
 import 'package:monarch/main_pages/HomePage/homepage.dart';
 import 'package:monarch/main_pages/Statistics/statistics.dart';
 
@@ -25,109 +25,9 @@ class MyApp extends StatelessWidget {
     return MaterialApp(
       debugShowCheckedModeBanner: false,
       theme: ThemeData(primarySwatch: Colors.blue),
-      home: const LoginScreen(),
+      home: const FinTrackHomePage(),
 
       // home: const SpeechInputPage(),
     );
   }
 }
-
-class AddTransactionPage extends StatefulWidget {
-  const AddTransactionPage({super.key});
-
-  @override
-  _AddTransactionPageState createState() => _AddTransactionPageState();
-}
-
-class _AddTransactionPageState extends State<AddTransactionPage> {
-  final TextEditingController descriptionController = TextEditingController();
-  final TextEditingController amountController = TextEditingController();
-  final baseUrl = dotenv.env['BASE_URL'];
-
-  Future<void> addTransaction() async {
-    // Show loading indicator
-    showDialog(
-      context: context,
-      barrierDismissible: false,
-      builder: (_) => const Center(child: CircularProgressIndicator()),
-    );
-
-    try {
-      final response = await http.post(
-        Uri.parse('$baseUrl/api/transaction/add'),
-        headers: {'Content-Type': 'application/json'},
-        body: json.encode({
-          'description': descriptionController.text,
-          'amount': double.tryParse(amountController.text),
-        }),
-      );
-
-      Navigator.of(context).pop(); // Close loading dialog
-
-      if (response.statusCode == 200) {
-        final responseData = json.decode(response.body);
-        final predictedCategory = responseData['data']['category'];
-
-        // Clear the input fields
-        descriptionController.clear();
-        amountController.clear();
-
-        ScaffoldMessenger.of(context).showSnackBar(
-          SnackBar(
-            content: Text(
-              '✅ Transaction added and categorized as: $predictedCategory',
-            ),
-          ),
-        );
-      } else {
-        ScaffoldMessenger.of(context).showSnackBar(
-          SnackBar(
-            content: Text('❌ Failed to add transaction: ${response.body}'),
-          ),
-        );
-      }
-    } catch (e) {
-      Navigator.push(
-        context,
-        MaterialPageRoute(builder: (context) => const Statistics()),
-      );
-      ScaffoldMessenger.of(
-        context,
-      ).showSnackBar(SnackBar(content: Text('⚠️ Error: $e')));
-    }
-  }
-
-  @override
-  Widget build(BuildContext context) {
-    return Scaffold(
-      appBar: AppBar(title: Text('Add Transaction')),
-      body: Padding(
-        padding: EdgeInsets.all(16),
-        child: Column(
-          children: [
-            TextField(
-              controller: descriptionController,
-              decoration: InputDecoration(labelText: 'Description'),
-            ),
-            TextField(
-              controller: amountController,
-              keyboardType: TextInputType.number,
-              decoration: InputDecoration(labelText: 'Amount'),
-            ),
-            SizedBox(height: 20),
-            ElevatedButton(onPressed: addTransaction, child: Text('Submit')),
-            ElevatedButton(
-              onPressed: () {
-                Navigator.push(
-                  context,
-                  MaterialPageRoute(builder: (context) => const Statistics()),
-                );
-              },
-              child: const Text('NextPage'),
-            ),
-          ],
-        ),
-      ),
-    );
-  }
-}

Frontend/lib/main_pages/HomePage/homepage.dart

@@ -1,11 +1,244 @@
-// ignore_for_file: deprecated_member_use, unused_local_variable, use_super_parameters, avoid_print
+// // ignore_for_file: deprecated_member_use, unused_local_variable, use_super_parameters, avoid_print
 
+// import 'package:flutter/material.dart';
+// import 'package:google_fonts/google_fonts.dart';
+// import 'package:monarch/other_pages/colors.dart';
+// import 'package:monarch/support/fetch_service.dart';
+// import 'package:monarch/main_pages/HomePage/hero_card.dart';
+// import 'package:monarch/main_pages/HomePage/navbar.dart';
+// import 'package:monarch/main_pages/HomePage/quick_actions.dart';
+// import 'package:monarch/support/transcations_recent.dart';
+
+// class FinTrackHomePage extends StatefulWidget {
+//   const FinTrackHomePage({Key? key}) : super(key: key);
+
+//   @override
+//   State<FinTrackHomePage> createState() => _FinTrackHomePageState();
+// }
+
+// class _FinTrackHomePageState extends State<FinTrackHomePage>
+//     with TickerProviderStateMixin {
+
+//   // Animation Controllers
+//   late AnimationController _fadeController;
+//   late AnimationController _slideController;
+//   late Animation<double> _fadeAnimation;
+//   late Animation<Offset> _slideAnimation;
+
+//   // Navigation State
+//   int _selectedIndex = 0;
+
+//   @override
+//   void initState() {
+//     super.initState();
+//     _initializeData();
+//     _setupAnimations();
+//   }
+
+//   @override
+//   void dispose() {
+//     _fadeController.dispose();
+//     _slideController.dispose();
+//     super.dispose();
+//   }
+
+//   // Initialize data fetching
+//   void _initializeData() {
+//     fetchRecentTransactions().then((transactions) {
+//       // Handle transactions data
+//     });
+//   }
+
+//   // Setup animation controllers and animations
+//   void _setupAnimations() {
+//     _fadeController = AnimationController(
+//       duration: const Duration(milliseconds: 1200),
+//       vsync: this,
+//     );
+
+//     _slideController = AnimationController(
+//       duration: const Duration(milliseconds: 800),
+//       vsync: this,
+//     );
+
+//     _fadeAnimation = Tween<double>(
+//       begin: 0.0,
+//       end: 1.0,
+//     ).animate(CurvedAnimation(
+//       parent: _fadeController,
+//       curve: Curves.easeOut,
+//     ));
+
+//     _slideAnimation = Tween<Offset>(
+//       begin: const Offset(0, 0.3),
+//       end: Offset.zero,
+//     ).animate(CurvedAnimation(
+//       parent: _slideController,
+//       curve: Curves.easeOutCubic,
+//     ));
+
+//     // Start animations
+//     _fadeController.forward();
+//     _slideController.forward();
+//   }
+
+//   // Build greeting header with enhanced styling
+//   Widget _buildGreetingHeader() {
+//     return Container(
+//       margin: const EdgeInsets.only(bottom: 24),
+//       child: Row(
+//         mainAxisAlignment: MainAxisAlignment.spaceBetween,
+//         crossAxisAlignment: CrossAxisAlignment.center,
+//         children: [
+//           // Greeting Section
+//           Expanded(
+//             child: Column(
+//               crossAxisAlignment: CrossAxisAlignment.start,
+//               children: [
+//                 Text(
+//                   'Good Morning! 👋',
+//                   style: GoogleFonts.inter(
+//                     color: primaryColor,
+//                     fontSize: 28,
+//                     fontWeight: FontWeight.w700,
+//                     height: 1.2,
+//                   ),
+//                 ),
+//                 const SizedBox(height: 4),
+//                 Text(
+//                   'Welcome back to your financial dashboard',
+//                   style: GoogleFonts.inter(
+//                     color: primaryColor.withOpacity(0.7),
+//                     fontSize: 14,
+//                     fontWeight: FontWeight.w400,
+//                   ),
+//                 ),
+//               ],
+//             ),
+//           ),
+
+//           // Notification Button with enhanced design
+//           Container(
+//             width: 52,
+//             height: 52,
+//             decoration: BoxDecoration(
+//               color: cardColor,
+//               borderRadius: BorderRadius.circular(18),
+//               boxShadow: [
+//                 BoxShadow(
+//                   color: accentColor.withOpacity(0.1),
+//                   blurRadius: 12,
+//                   offset: const Offset(0, 4),
+//                 ),
+//               ],
+//               border: Border.all(
+//                 color: accentColor.withOpacity(0.1),
+//                 width: 1,
+//               ),
+//             ),
+//             child: Material(
+//               color: Colors.transparent,
+//               child: InkWell(
+//                 borderRadius: BorderRadius.circular(18),
+//                 onTap: () {
+//                   // Handle notification tap
+//                 },
+//                 child: Icon(
+//                   Icons.notifications_outlined,
+//                   color: accentColor,
+//                   size: 26,
+//                 ),
+//               ),
+//             ),
+//           ),
+//         ],
+//       ),
+//     );
+//   }
+
+//   // Build main content sections
+//   Widget _buildMainContent() {
+//     return Column(
+//       crossAxisAlignment: CrossAxisAlignment.start,
+//       children: [
+//         // Balance Card Section
+//         Container(
+//           margin: const EdgeInsets.only(bottom: 28),
+//           child: const BalanceCardPage(),
+//         ),
+
+//         // Quick Actions Section
+//         Container(
+//           margin: const EdgeInsets.only(bottom: 28),
+//           child: QuickActionsPage(),
+//         ),
+
+//         // Recent Transactions Section
+//         Container(
+//           margin: const EdgeInsets.only(bottom: 32),
+//           child: RecentTransactionsWidget(
+//             recentTransactions: fetchRecentTransactions(),
+//           ),
+//         ),
+
+//         // Bottom spacing for FAB
+//         const SizedBox(height: 100),
+//       ],
+//     );
+//   }
+
+//   @override
+//   Widget build(BuildContext context) {
+//     return Scaffold(
+//       backgroundColor: backgroundColor,
+//       body: SafeArea(
+//         child: FadeTransition(
+//           opacity: _fadeAnimation,
+//           child: SlideTransition(
+//             position: _slideAnimation,
+//             child: CustomScrollView(
+//               physics: const BouncingScrollPhysics(),
+//               slivers: [
+//                 SliverToBoxAdapter(
+//                   child: Padding(
+//                     padding: const EdgeInsets.fromLTRB(20, 16, 20, 0),
+//                     child: Column(
+//                       crossAxisAlignment: CrossAxisAlignment.start,
+//                       children: [
+//                         _buildGreetingHeader(),
+//                         _buildMainContent(),
+//                       ],
+//                     ),
+//                   ),
+//                 ),
+//               ],
+//             ),
+//           ),
+//         ),
+//       ),
+
+//       // Enhanced Floating Action Button
+//       floatingActionButton: CustomNavBar(
+//         currentIndex: _selectedIndex,
+//         onTap: (index) {
+//           setState(() => _selectedIndex = index);
+//         },
+//         backgroundColor: backgroundColor,
+//         accentColor: accentColor,
+//         primaryColor: primaryColor,
+//         cardColor: cardColor,
+//         floatingActionButtonLocation: FloatingActionButtonLocation.centerTop,
+//       ),
+//     );
+//   }
+// }
+// ignore_for_file: deprecated_member_use, unused_local_variable, use_super_parameters, avoid_print
 import 'package:flutter/material.dart';
 import 'package:google_fonts/google_fonts.dart';
+import 'package:monarch/main_pages/HomePage/navbar.dart';
 import 'package:monarch/other_pages/colors.dart';
 import 'package:monarch/support/fetch_service.dart';
 import 'package:monarch/main_pages/HomePage/hero_card.dart';
-import 'package:monarch/main_pages/HomePage/navbar.dart';
 import 'package:monarch/main_pages/HomePage/quick_actions.dart';
 import 'package:monarch/support/transcations_recent.dart';
 
@@ -18,27 +251,36 @@ class FinTrackHomePage extends StatefulWidget {
 
 class _FinTrackHomePageState extends State<FinTrackHomePage>
     with TickerProviderStateMixin {
-
   // Animation Controllers
   late AnimationController _fadeController;
   late AnimationController _slideController;
+  late AnimationController _scaleController;
+
+  // Animations
   late Animation<double> _fadeAnimation;
   late Animation<Offset> _slideAnimation;
+  late Animation<double> _scaleAnimation;
 
   // Navigation State
+  // ignore: prefer_final_fields
   int _selectedIndex = 0;
 
+  // Time-based greeting data
+  String _greetingText = '';
+
   @override
   void initState() {
     super.initState();
     _initializeData();
     _setupAnimations();
+    _updateGreeting();
   }
 
   @override
   void dispose() {
     _fadeController.dispose();
     _slideController.dispose();
+    _scaleController.dispose();
     super.dispose();
   }
 
@@ -49,144 +291,469 @@ class _FinTrackHomePageState extends State<FinTrackHomePage>
     });
   }
 
-  // Setup animation controllers and animations
+  // Update greeting based on current time
+  void _updateGreeting() {
+    final now = DateTime.now();
+    final hour = now.hour;
+
+    if (hour >= 5 && hour < 12) {
+      _greetingText = 'Good Morning';
+    } else if (hour >= 12 && hour < 17) {
+      _greetingText = 'Good Afternoon';
+    } else if (hour >= 17 && hour < 21) {
+      _greetingText = 'Good Evening';
+    } else {
+      _greetingText = 'Good Night';
+    }
+  }
+
+  // Setup enhanced animation controllers
   void _setupAnimations() {
     _fadeController = AnimationController(
-      duration: const Duration(milliseconds: 1200),
+      duration: const Duration(milliseconds: 1500),
       vsync: this,
     );
 
     _slideController = AnimationController(
+      duration: const Duration(milliseconds: 1200),
+      vsync: this,
+    );
+
+    _scaleController = AnimationController(
       duration: const Duration(milliseconds: 800),
       vsync: this,
     );
 
-    _fadeAnimation = Tween<double>(
+    _fadeAnimation = Tween<double>(begin: 0.0, end: 1.0).animate(
-      begin: 0.0,
+      CurvedAnimation(parent: _fadeController, curve: Curves.easeOutQuart),
-      end: 1.0,
+    );
-    ).animate(CurvedAnimation(
-      parent: _fadeController,
-      curve: Curves.easeOut,
-    ));
 
     _slideAnimation = Tween<Offset>(
-      begin: const Offset(0, 0.3),
+      begin: const Offset(0, 0.2),
       end: Offset.zero,
-    ).animate(CurvedAnimation(
+    ).animate(
-      parent: _slideController,
+      CurvedAnimation(parent: _slideController, curve: Curves.easeOutCubic),
-      curve: Curves.easeOutCubic,
+    );
-    ));
 
-    // Start animations
+    _scaleAnimation = Tween<double>(begin: 0.8, end: 1.0).animate(
+      CurvedAnimation(parent: _scaleController, curve: Curves.elasticOut),
+    );
+
+    // Staggered animation start
     _fadeController.forward();
-    _slideController.forward();
+    Future.delayed(const Duration(milliseconds: 200), () {
+      _slideController.forward();
+    });
+    Future.delayed(const Duration(milliseconds: 400), () {
+      _scaleController.forward();
+    });
   }
 
-  // Build greeting header with enhanced styling
+  // Enhanced greeting header with time-based content
   Widget _buildGreetingHeader() {
     return Container(
-      margin: const EdgeInsets.only(bottom: 24),
+      margin: const EdgeInsets.only(bottom: 28),
       child: Row(
         mainAxisAlignment: MainAxisAlignment.spaceBetween,
-        crossAxisAlignment: CrossAxisAlignment.center,
+        crossAxisAlignment: CrossAxisAlignment.start,
         children: [
-          // Greeting Section
+          // Enhanced Greeting Section
           Expanded(
-            child: Column(
+            child: AnimatedBuilder(
-              crossAxisAlignment: CrossAxisAlignment.start,
+              animation: _scaleAnimation,
-              children: [
+              builder: (context, child) {
-                Text(
+                return Transform.scale(
-                  'Good Morning! 👋',
+                  scale: _scaleAnimation.value,
-                  style: GoogleFonts.inter(
+                  alignment: Alignment.centerLeft,
-                    color: primaryColor,
+                  child: Column(
-                    fontSize: 28,
+                    crossAxisAlignment: CrossAxisAlignment.start,
-                    fontWeight: FontWeight.w700,
+                    children: [
-                    height: 1.2,
+                      // Main greeting with emoji
-                  ),
+                      Row(
-                ),
+                        children: [
-                const SizedBox(height: 4),
+                          Text(
-                Text(
+                            '$_greetingText ',
-                  'Welcome back to your financial dashboard',
+                            style: GoogleFonts.inter(
-                  style: GoogleFonts.inter(
+                              color: primaryColor,
-                    color: primaryColor.withOpacity(0.7),
+                              fontSize: 32,
-                    fontSize: 14,
+                              fontWeight: FontWeight.w800,
-                    fontWeight: FontWeight.w400,
+                              height: 1.1,
-                  ),
+                              letterSpacing: -0.5,
-                ),
+                            ),
-              ],
+                          ),
-            ),
+                        ],
-          ),
+                      ),
+                      const SizedBox(height: 6),
 
-          // Notification Button with enhanced design
+                      // Enhanced sub-greeting
-          Container(
+                      const SizedBox(height: 8),
-            width: 52,
+                      // Date indicator
-            height: 52,
+                      Container(
-            decoration: BoxDecoration(
+                        padding: const EdgeInsets.symmetric(
-              color: cardColor,
+                          horizontal: 12,
-              borderRadius: BorderRadius.circular(18),
+                          vertical: 6,
-              boxShadow: [
+                        ),
-                BoxShadow(
+                        decoration: BoxDecoration(
-                  color: accentColor.withOpacity(0.1),
+                          color: accentColor.withOpacity(0.08),
-                  blurRadius: 12,
+                          borderRadius: BorderRadius.circular(20),
-                  offset: const Offset(0, 4),
+                          border: Border.all(
-                ),
+                            color: accentColor.withOpacity(0.15),
-              ],
+                            width: 1,
-              border: Border.all(
+                          ),
-                color: accentColor.withOpacity(0.1),
+                        ),
-                width: 1,
+                        child: Text(
-              ),
+                          _getFormattedDate(),
-            ),
+                          style: GoogleFonts.inter(
-            child: Material(
+                            color: accentColor,
-              color: Colors.transparent,
+                            fontSize: 12,
-              child: InkWell(
+                            fontWeight: FontWeight.w600,
-                borderRadius: BorderRadius.circular(18),
+                          ),
-                onTap: () {
+                        ),
-                  // Handle notification tap
+                      ),
-                },
+                    ],
-                child: Icon(
+                  ),
-                  Icons.notifications_outlined,
+                );
-                  color: accentColor,
+              },
-                  size: 26,
-                ),
-              ),
             ),
           ),
+          const SizedBox(width: 16),
+          // Enhanced notification button
+          _buildTransactionButtons(),
         ],
       ),
     );
   }
 
-  // Build main content sections
+  // Get formatted date string
+  String _getFormattedDate() {
+    final now = DateTime.now();
+    final weekdays = ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'];
+    final months = [
+      'Jan',
+      'Feb',
+      'Mar',
+      'Apr',
+      'May',
+      'Jun',
+      'Jul',
+      'Aug',
+      'Sep',
+      'Oct',
+      'Nov',
+      'Dec',
+    ];
+
+    return '${weekdays[now.weekday - 1]}, ${now.day} ${months[now.month - 1]}';
+  }
+
+  // Enhanced Transaction Entry Buttons with perfect UX
+  Widget _buildTransactionButtons() {
+    return AnimatedBuilder(
+      animation: _scaleAnimation,
+      builder: (context, child) {
+        return Transform.scale(
+          scale: _scaleAnimation.value,
+          child: Row(
+            children: [
+              // Gmail Transaction Button
+              Container(
+                width: 56,
+                height: 56,
+                decoration: BoxDecoration(
+                  color: cardColor,
+                  borderRadius: BorderRadius.circular(20),
+                  boxShadow: [
+                    BoxShadow(
+                      color: accentColor.withOpacity(0.08),
+                      blurRadius: 20,
+                      offset: const Offset(0, 8),
+                      spreadRadius: 0,
+                    ),
+                    BoxShadow(
+                      color: Colors.black.withOpacity(0.04),
+                      blurRadius: 4,
+                      offset: const Offset(0, 2),
+                    ),
+                  ],
+                  border: Border.all(
+                    color: accentColor.withOpacity(0.08),
+                    width: 1.5,
+                  ),
+                ),
+                child: Material(
+                  color: Colors.transparent,
+                  borderRadius: BorderRadius.circular(20),
+                  child: InkWell(
+                    borderRadius: BorderRadius.circular(20),
+                    onTap: () {
+                      _showTransactionEntryDialog('email');
+                    },
+                    child: Container(
+                      decoration: BoxDecoration(
+                        borderRadius: BorderRadius.circular(20),
+                      ),
+                      child: Icon(
+                        Icons.mail_outline,
+                        color: accentColor,
+                        size: 28,
+                      ),
+                    ),
+                  ),
+                ),
+              ),
+
+              const SizedBox(width: 12),
+
+              // Voice Transaction Button
+              Container(
+                width: 56,
+                height: 56,
+                decoration: BoxDecoration(
+                  color: cardColor,
+                  borderRadius: BorderRadius.circular(20),
+                  boxShadow: [
+                    BoxShadow(
+                      color: accentColor.withOpacity(0.08),
+                      blurRadius: 20,
+                      offset: const Offset(0, 8),
+                      spreadRadius: 0,
+                    ),
+                    BoxShadow(
+                      color: Colors.black.withOpacity(0.04),
+                      blurRadius: 4,
+                      offset: const Offset(0, 2),
+                    ),
+                  ],
+                  border: Border.all(
+                    color: accentColor.withOpacity(0.08),
+                    width: 1.5,
+                  ),
+                ),
+                child: Material(
+                  color: Colors.transparent,
+                  borderRadius: BorderRadius.circular(20),
+                  child: InkWell(
+                    borderRadius: BorderRadius.circular(20),
+                    onTap: () {
+                      _showTransactionEntryDialog('voice');
+                    },
+                    child: Container(
+                      decoration: BoxDecoration(
+                        borderRadius: BorderRadius.circular(20),
+                      ),
+                      child: Icon(
+                        Icons.mic_outlined,
+                        color: accentColor,
+                        size: 28,
+                      ),
+                    ),
+                  ),
+                ),
+              ),
+            ],
+          ),
+        );
+      },
+    );
+  }
+
+  // Transaction Entry Dialog (placeholder for functionality)
+  void _showTransactionEntryDialog(String type) {
+    showModalBottomSheet(
+      context: context,
+      backgroundColor: Colors.transparent,
+      isScrollControlled: true,
+      builder:
+          (context) => Container(
+            height: MediaQuery.of(context).size.height * 0.7,
+            decoration: BoxDecoration(
+              color: cardColor,
+              borderRadius: const BorderRadius.vertical(
+                top: Radius.circular(28),
+              ),
+              boxShadow: [
+                BoxShadow(
+                  color: Colors.black.withOpacity(0.1),
+                  blurRadius: 32,
+                  offset: const Offset(0, -8),
+                ),
+              ],
+            ),
+            child: Column(
+              children: [
+                // Handle Bar
+                Container(
+                  width: 48,
+                  height: 4,
+                  margin: const EdgeInsets.only(top: 16, bottom: 24),
+                  decoration: BoxDecoration(
+                    color: primaryColor.withOpacity(0.2),
+                    borderRadius: BorderRadius.circular(2),
+                  ),
+                ),
+
+                // Dialog Content
+                Expanded(
+                  child: Padding(
+                    padding: const EdgeInsets.symmetric(horizontal: 24),
+                    child: Column(
+                      crossAxisAlignment: CrossAxisAlignment.start,
+                      children: [
+                        // Header
+                        Row(
+                          children: [
+                            Container(
+                              width: 48,
+                              height: 48,
+                              decoration: BoxDecoration(
+                                color: accentColor.withOpacity(0.1),
+                                borderRadius: BorderRadius.circular(12),
+                                border: Border.all(
+                                  color: accentColor.withOpacity(0.2),
+                                  width: 1,
+                                ),
+                              ),
+                              child: Icon(
+                                type == 'email'
+                                    ? Icons.mail_outline
+                                    : Icons.mic_outlined,
+                                color: accentColor,
+                                size: 24,
+                              ),
+                            ),
+                            const SizedBox(width: 16),
+                            Column(
+                              crossAxisAlignment: CrossAxisAlignment.start,
+                              children: [
+                                Text(
+                                  type == 'email'
+                                      ? 'Email Transaction'
+                                      : 'Voice Transaction',
+                                  style: GoogleFonts.inter(
+                                    color: primaryColor,
+                                    fontSize: 20,
+                                    fontWeight: FontWeight.w700,
+                                  ),
+                                ),
+                                Text(
+                                  type == 'email'
+                                      ? 'Forward receipts to add transactions'
+                                      : 'Speak to record your transaction',
+                                  style: GoogleFonts.inter(
+                                    color: primaryColor.withOpacity(0.6),
+                                    fontSize: 14,
+                                    fontWeight: FontWeight.w500,
+                                  ),
+                                ),
+                              ],
+                            ),
+                          ],
+                        ),
+
+                        const SizedBox(height: 32),
+
+                        // Placeholder content
+                        Expanded(
+                          child: Center(
+                            child: Column(
+                              mainAxisAlignment: MainAxisAlignment.center,
+                              children: [
+                                Icon(
+                                  type == 'email' ? Icons.email : Icons.mic,
+                                  size: 64,
+                                  color: accentColor.withOpacity(0.3),
+                                ),
+                                const SizedBox(height: 16),
+                                Text(
+                                  type == 'email'
+                                      ? 'Email integration coming soon!'
+                                      : 'Voice recording coming soon!',
+                                  style: GoogleFonts.inter(
+                                    color: primaryColor.withOpacity(0.6),
+                                    fontSize: 16,
+                                    fontWeight: FontWeight.w500,
+                                  ),
+                                ),
+                              ],
+                            ),
+                          ),
+                        ),
+                      ],
+                    ),
+                  ),
+                ),
+              ],
+            ),
+          ),
+    );
+  }
+
+  // Enhanced main content with better spacing
   Widget _buildMainContent() {
     return Column(
       crossAxisAlignment: CrossAxisAlignment.start,
       children: [
-        // Balance Card Section
+        // Balance Card Section with staggered animation
-        Container(
+        _buildAnimatedSection(
-          margin: const EdgeInsets.only(bottom: 28),
+          delay: 600,
-          child: const BalanceCardPage(),
+          child: Container(
-        ),
+            margin: const EdgeInsets.only(bottom: 32),
-
+            child: const BalanceCardPage(),
-        // Quick Actions Section
-        Container(
-          margin: const EdgeInsets.only(bottom: 28),
-          child: QuickActionsPage(),
-        ),
-
-        // Recent Transactions Section
-        Container(
-          margin: const EdgeInsets.only(bottom: 32),
-          child: RecentTransactionsWidget(
-            recentTransactions: fetchRecentTransactions(),
           ),
         ),
 
-        // Bottom spacing for FAB
+        // Quick Actions Section with staggered animation
-        const SizedBox(height: 100),
+        _buildAnimatedSection(
+          delay: 800,
+          child: Container(
+            margin: const EdgeInsets.only(bottom: 32),
+            child: QuickActionsPage(),
+          ),
+        ),
+
+        // Recent Transactions Section with staggered animation
+        _buildAnimatedSection(
+          delay: 1000,
+          child: Container(
+            margin: const EdgeInsets.only(bottom: 32),
+            child: RecentTransactionsWidget(
+              recentTransactions: fetchRecentTransactions(),
+            ),
+          ),
+        ),
+
+        // Bottom spacing for FAB and navigation
+        const SizedBox(height: 120),
       ],
     );
   }
 
+  // Helper method for staggered animations
+  Widget _buildAnimatedSection({required int delay, required Widget child}) {
+    return FutureBuilder(
+      future: Future.delayed(Duration(milliseconds: delay)),
+      builder: (context, snapshot) {
+        if (snapshot.connectionState == ConnectionState.waiting) {
+          return Opacity(opacity: 0, child: child);
+        }
+        return AnimatedOpacity(
+          opacity: 1,
+          duration: const Duration(milliseconds: 600),
+          curve: Curves.easeOut,
+          child: AnimatedSlide(
+            offset:
+                snapshot.connectionState == ConnectionState.done
+                    ? Offset.zero
+                    : const Offset(0, 0.1),
+            duration: const Duration(milliseconds: 600),
+            curve: Curves.easeOutCubic,
+            child: child,
+          ),
+        );
+      },
+    );
+  }
+
   @override
   Widget build(BuildContext context) {
     return Scaffold(
@@ -196,28 +763,57 @@ class _FinTrackHomePageState extends State<FinTrackHomePage>
           opacity: _fadeAnimation,
           child: SlideTransition(
             position: _slideAnimation,
-            child: CustomScrollView(
+            child: RefreshIndicator(
-              physics: const BouncingScrollPhysics(),
+              onRefresh: () async {
-              slivers: [
+                // Add refresh functionality
-                SliverToBoxAdapter(
+                _initializeData();
-                  child: Padding(
+                _updateGreeting();
-                    padding: const EdgeInsets.fromLTRB(20, 16, 20, 0),
+                setState(() {});
-                    child: Column(
+                // Add haptic feedback
-                      crossAxisAlignment: CrossAxisAlignment.start,
+                // HapticFeedback.lightImpact();
-                      children: [
+              },
-                        _buildGreetingHeader(),
+              color: accentColor,
-                        _buildMainContent(),
+              backgroundColor: cardColor,
-                      ],
+              strokeWidth: 2.5,
+              displacement: 60,
+              child: CustomScrollView(
+                physics: const BouncingScrollPhysics(
+                  parent: AlwaysScrollableScrollPhysics(),
+                ),
+                slivers: [
+                  SliverToBoxAdapter(
+                    child: Container(
+                      decoration: BoxDecoration(
+                        gradient: LinearGradient(
+                          begin: Alignment.topCenter,
+                          end: Alignment.bottomCenter,
+                          colors: [
+                            backgroundColor,
+                            backgroundColor.withOpacity(0.95),
+                          ],
+                          stops: const [0.0, 1.0],
+                        ),
+                      ),
+                      child: Padding(
+                        padding: const EdgeInsets.fromLTRB(24, 20, 24, 0),
+                        child: Column(
+                          crossAxisAlignment: CrossAxisAlignment.start,
+                          children: [
+                            _buildGreetingHeader(),
+                            _buildMainContent(),
+                          ],
+                        ),
+                      ),
                     ),
                   ),
-                ),
+                ],
-              ],
+              ),
             ),
           ),
+
+          // Enhanced Floating Action Button
         ),
       ),
-
-      // Enhanced Floating Action Button
       floatingActionButton: CustomNavBar(
         currentIndex: _selectedIndex,
         onTap: (index) {

Frontend/lib/main_pages/Statistics/statistics.dart

@@ -9,8 +9,8 @@ import 'package:google_fonts/google_fonts.dart';
 import 'package:http/http.dart' as http;
 import 'package:monarch/support/add.dart';
 import 'package:monarch/other_pages/enviroment.dart';
-import 'package:monarch/main_pages/Statistics/update_budget.dart';
+import 'package:monarch/main_pages/Statistics/Budget/update_budget.dart';
-import 'package:monarch/main_pages/Statistics/budget_manager.dart';
+import 'package:monarch/main_pages/Statistics/Budget/budget_manager.dart';
 import 'package:monarch/main_pages/HomePage/homepage.dart';
 import 'package:monarch/main_pages/HomePage/navbar.dart';
 import 'package:shared_preferences/shared_preferences.dart';

Frontend/lib/other_pages/enviroment.dart

@@ -1,5 +1,5 @@
 class Environment {
-  static const String baseUrl = 'http://10.231.41.181:3000';
+  static const String baseUrl = 'http://192.168.1.9:3000';
   static const String serverClientId =
       "278433619849-cg6f7gk5cc45rgu1ojrlkf794lm4udgn.apps.googleusercontent.com";
 }