import 'package:flutter/material.dart';
import 'package:get/get.dart';
import '../controllers/navbar_controller.dart';
import '../../home/views/home_view.dart';
import '../../notification/views/notification_view.dart';
import '../../schedule/views/schedule_view.dart';
import '../../profile/views/profile_view.dart';

class NavbarView extends StatelessWidget {
  const NavbarView({super.key});

  @override
  Widget build(BuildContext context) {
    final controller = Get.put(NavbarController());

    final pages = const [
      HomeView(),
      NotificationView(),
      ScheduleView(),
      ProfileView(),
    ];

    return Obx(
      () => Scaffold(
        extendBody: true,
        body: IndexedStack(
          index: controller.selectedIndex.value,
          children: pages,
        ),
        bottomNavigationBar: _buildNavBar(controller),
      ),
    );
  }

  Widget _buildNavBar(NavbarController controller) {
    return Container(
      margin: const EdgeInsets.only(left: 20, right: 20, bottom: 15),
      padding: const EdgeInsets.symmetric(horizontal: 15, vertical: 12),
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(20),
        boxShadow: [
          BoxShadow(
            color: Colors.black.withOpacity(0.1),
            blurRadius: 10,
            offset: const Offset(0, -2),
          ),
        ],
      ),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceAround,
        children: [
          _navItem(controller, Icons.home, 0, 'Home'),
          _navItem(controller, Icons.chat_bubble_outline, 1, 'Notification'),
          _navItem(controller, Icons.calendar_today, 2, 'Schedule'),
          _navItem(controller, Icons.person_outline, 3, 'Account'),
        ],
      ),
    );
  }

  Widget _navItem(
    NavbarController controller,
    IconData icon,
    int index,
    String label,
  ) {
    final active = controller.selectedIndex.value == index;

    return InkWell(
      onTap: () => controller.changeTabIndex(index),
      borderRadius: BorderRadius.circular(12),
      child: Column(
        mainAxisSize: MainAxisSize.min,
        children: [
          Container(
            padding: const EdgeInsets.all(8),
            child: Icon(
              icon,
              size: 28,
              color: active ? const Color(0xFF0091EA) : Colors.grey[400],
            ),
          ),
          Text(
            label,
            style: TextStyle(
              color: active ? const Color(0xFF0091EA) : Colors.grey[400],
              fontSize: 12,
            ),
          ),
        ],
      ),
    );
  }
}
