import 'package:flutter/material.dart';
import 'package:niogu_app/core/constants/app_font_size.dart';
import 'package:sizer/sizer.dart';

class TopBackBarApp extends StatelessWidget implements PreferredSizeWidget {
  final String title;
  final VoidCallback? onTap;

  const TopBackBarApp({super.key, required this.title, this.onTap});

  @override
  // TODO: implement preferredSize
  Size get preferredSize =>
      Size.fromHeight(100.w >= 600 ? 5.h : kToolbarHeight);

  @override
  Widget build(BuildContext context) {
    return AppBar(
      backgroundColor: Colors.white,
      surfaceTintColor: Colors.white,
      elevation: 0,
      centerTitle: true,
      leading: Center(
        child: Material(
          color: Colors.transparent,
          type: MaterialType.canvas,
          child: InkWell(
            onTap: onTap,
            borderRadius: BorderRadius.circular(2.5.w),
            child: Container(
              width: 10.w,
              height: 10.w,
              decoration: BoxDecoration(
                color: Colors.white,
                border: Border.all(color: Colors.grey.shade200),
                borderRadius: BorderRadius.circular(2.5.w),
                boxShadow: [
                  BoxShadow(
                    color: Colors.black.withOpacity(0.05),
                    blurRadius: 5,
                    offset: const Offset(0, 2),
                  ),
                ],
              ),
              child: Icon(
                Icons.arrow_back_ios_new_rounded,
                color: Colors.black87,
                size: 5.w,
              ),
            ),
          ),
        ),
      ),
      leadingWidth: 18.w,
      title: Text(
        title,
        style: TextStyle(
          color: Colors.black87,
          fontSize: AppFontSize.medium.sp,
          fontWeight: FontWeight.bold,
          letterSpacing: 0.5,
        ),
      ),
      /**
      actions: [
        IconButton(
          onPressed: onPressed,
          icon: Icon(
            Icons.help_outline_rounded,
            color: Colors.grey[400],
            size: 4.w,
          ),
        ),
        SizedBox(width: 3.w),
      ],
      */
      bottom: PreferredSize(
        preferredSize: Size.fromHeight(2),
        child: Container(color: Colors.grey.shade100, height: 1),
      ),
    );
  }
}
