import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:on_field_work/controller/project_controller.dart';
import 'package:on_field_work/helpers/widgets/my_spacing.dart';
import 'package:on_field_work/helpers/widgets/my_text.dart';
import 'package:on_field_work/helpers/utils/mixins/ui_mixin.dart';

class CustomAppBar extends StatelessWidget
    with UIMixin
    implements PreferredSizeWidget {
  final String title;
  final String? projectName;
  final VoidCallback? onBackPressed;
  final Color? backgroundColor;

  CustomAppBar({
    super.key,
    required this.title,
    this.projectName,
    this.onBackPressed,
    this.backgroundColor,
  });

  @override
  Size get preferredSize => const Size.fromHeight(72);

  @override
  Widget build(BuildContext context) {
    final Color effectiveBackgroundColor =
        backgroundColor ?? contentTheme.primary;
    const Color onPrimaryColor = Colors.white;
    const double horizontalPadding = 16.0;

    return AppBar(
      backgroundColor: effectiveBackgroundColor,
      elevation: 0,
      automaticallyImplyLeading: false,
      titleSpacing: 0,
      shape: const RoundedRectangleBorder(
        borderRadius: BorderRadius.vertical(bottom: Radius.circular(0)),
      ),
      leading: Padding(
        padding: MySpacing.only(left: horizontalPadding),
        child: IconButton(
          icon: const Icon(
            Icons.arrow_back_ios_new,
            color: onPrimaryColor,
            size: 20,
          ),
          onPressed: onBackPressed ?? () => Get.back(),
          padding: EdgeInsets.zero,
          constraints: const BoxConstraints(),
        ),
      ),
      title: Padding(
        padding: MySpacing.only(right: horizontalPadding, left: 8),
        child: Row(
          children: [
            Expanded(
              child: Column(
                mainAxisSize: MainAxisSize.min,
                crossAxisAlignment: CrossAxisAlignment.start,
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  MyText.titleLarge(
                    title,
                    fontWeight: 800,
                    color: onPrimaryColor,
                    overflow: TextOverflow.ellipsis,
                    maxLines: 1,
                  ),
                  MySpacing.height(3),
                  GetBuilder<ProjectController>(
                    builder: (projectController) {
                      final displayProjectName = projectName ??
                          projectController.selectedProject?.name ??
                          'Select Project';
                      return Row(
                        children: [
                          const Icon(Icons.folder_open,
                              size: 14, color: onPrimaryColor),
                          MySpacing.width(4),
                          Flexible(
                            child: MyText.bodySmall(
                              displayProjectName,
                              fontWeight: 500,
                              color: onPrimaryColor.withOpacity(0.8),
                              overflow: TextOverflow.ellipsis,
                              maxLines: 1,
                            ),
                          ),
                          MySpacing.width(2),
                          const Icon(Icons.keyboard_arrow_down,
                              size: 18, color: onPrimaryColor),
                        ],
                      );
                    },
                  ),
                ],
              ),
            ),
          ],
        ),
      ),
      actions: [
        Padding(
          padding: MySpacing.only(right: horizontalPadding),
          child: IconButton(
            icon: const Icon(Icons.home, color: onPrimaryColor, size: 24),
            onPressed: () => Get.offAllNamed('/dashboard'),
          ),
        ),
      ],
    );
  }
}