import 'dart:developer';

import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:mc_common_app/classes/app_state.dart';
import 'package:mc_common_app/classes/consts.dart';
import 'package:mc_common_app/extensions/int_extensions.dart';
import 'package:mc_common_app/extensions/string_extensions.dart';
import 'package:mc_common_app/theme/colors.dart';
import 'package:mc_common_app/widgets/extensions/extensions_widget.dart';

class CustomAppBar extends StatelessWidget implements PreferredSizeWidget {
  final Color? backgroundColor;
  final double? elevation;
  final double? toolbarHeight;
  final String? title;
  final Color? titleColor;
  final bool? isTitleCenter;
  final Color? backIconColor;
  final List<Widget>? actions;
  final bool isRemoveBackButton;
  final String profileImageUrl;
  final bool isDrawerEnabled;
  final VoidCallback? onTap;
  final Function? onBackButtonTapped;
  final double? leadingWidth;

  const CustomAppBar({
    Key? key,
    this.title,
    this.isDrawerEnabled = false,
    this.profileImageUrl = "",
    this.isRemoveBackButton = false,
    this.backgroundColor,
    this.actions,
    this.backIconColor,
    this.elevation,
    this.toolbarHeight,
    this.isTitleCenter,
    this.titleColor,
    this.onTap,
    this.onBackButtonTapped,
    this.leadingWidth,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        AppBar(
          automaticallyImplyLeading: false,
          leadingWidth: leadingWidth ?? 61,
          backgroundColor: backgroundColor ?? Colors.white,
          elevation: elevation ?? 0,
          centerTitle: isTitleCenter ?? true,
          scrolledUnderElevation: 0,
          toolbarHeight: toolbarHeight,
          leading: isDrawerEnabled
              ? InkWell(
            onTap: onTap,
            child: Row(
              children: [
                profileImageUrl.isEmpty && AppState().getUser.data!.userInfo!.userLocalImage != null
                    ? Image.file(
                  AppState().getUser.data!.userInfo!.userLocalImage!,
                  width: 34,
                  height: 34,
                  fit: BoxFit.fill,
                ).toCircle(borderRadius: 100)
                    : profileImageUrl.isEmpty && AppState().getUser.data!.userInfo!.userImageUrl != null
                    ? CachedNetworkImage(
                    imageUrl: AppState().getUser.data!.userInfo!.userImageUrl,
                    imageBuilder: (context, imageProvider) =>
                        Container(
                          decoration: BoxDecoration(
                            image: DecorationImage(
                              image: imageProvider,
                              fit: BoxFit.cover,
                            ),
                          ),
                        ),
                    placeholder: (context, url) => const Center(child: CircularProgressIndicator()),
                    errorWidget: (context, url, error) => const Icon(Icons.supervised_user_circle_outlined),
                    fadeInCurve: Curves.easeIn,
                    width: 34,
                    height: 34,
                    fit: BoxFit.fill,
                    fadeInDuration: const Duration(milliseconds: 1000),
                    useOldImageOnUrlChange: false)
                    .toCircle(borderRadius: 100)
                    : Image.asset(
                  MyAssets.carBanner,
                  width: 34,
                  height: 34,
                  fit: BoxFit.fill,
                ).toCircle(borderRadius: 100),
                10.width,
                SvgPicture.asset(MyAssets.dashboardDrawerIcon),
              ],
            ).paddingOnly(left: 21),
          )
              : isRemoveBackButton
              ? null
              : Row(
            children: [
              21.width,
              const Icon(Icons.arrow_back_ios, color: Colors.black, size: 16)
                  .toContainer(
                padding: const EdgeInsets.only(left: 5),
                borderRadius: 100,
                borderColor: MyColors.lightGreyEFColor,
                isEnabledBorder: true,
                height: 40,
                width: 40,
              )
                  .onPress(() {
                if (onBackButtonTapped != null) {
                  onBackButtonTapped!();
                } else {
                  Navigator.pop(context);
                }
              }),
            ],
          ),
          iconTheme: IconThemeData(
            color: backIconColor ?? Colors.black, //change your color here
          ),
          actions: actions,
          title: (title ?? "").toText(fontSize: 20),
        ),
        if (backgroundColor == null)
          const Divider(
              thickness: 1,
              height: 1)
      ],
    );
  }

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