import 'package:easy_localization/easy_localization.dart';
import 'package:flutter/material.dart';
import 'package:gap/gap.dart';
import 'package:krow/core/presentation/gen/assets.gen.dart';
import 'package:krow/core/presentation/styles/theme.dart';

class EarningsAppBar extends StatelessWidget {
  final Widget child;
  final bool leading;

  const EarningsAppBar({
    super.key,
    required this.child,
    this.leading = false,
  });

  @override
  Widget build(BuildContext context) {
    return Stack(
      fit: StackFit.loose,
      children: [
        _buildProfileBackground(context),
        SafeArea(
          bottom: false,
          child: Center(
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.center,
              children: [
                const Gap(16),
                _buildAppBar(context),
                const Gap(24),
                child,
              ],
            ),
          ),
        )
      ],
    );
  }

  Widget _buildProfileBackground(BuildContext context) {
    return Positioned.fill(
      child: ClipRRect(
        borderRadius: const BorderRadius.only(
          bottomLeft: Radius.circular(12),
          bottomRight: Radius.circular(12),
        ),
        child: Container(
          width: MediaQuery.of(context).size.width,
          color: AppColors.bgColorDark,
          child: Assets.images.bg.svg(
            fit: BoxFit.fitWidth,
            alignment: Alignment.topCenter,
          ),
        ),
      ),
    );
  }

  Widget _buildAppBar(BuildContext context) {
    return Container(
      height: 48,
      margin: const EdgeInsets.symmetric(horizontal: 16),
      child: Row(
        crossAxisAlignment: CrossAxisAlignment.center,
        children: [
          if (leading) ...[
            GestureDetector(
              onTap: () {
                Navigator.of(context).pop();
              },
              child: Container(
                width: 48,
                height: 48,
                color: Colors.transparent,
                alignment: Alignment.center,
                child: Assets.images.appBar.appbarLeading.svg(
                  colorFilter: const ColorFilter.mode(
                    Colors.white,
                    BlendMode.srcIn,
                  ),
                ),
              ),
            ),
            const Gap(8),
          ],
          Text(
            'Earnings'.tr(),
            style: Theme.of(context)
                .textTheme
                .headlineSmall
                ?.copyWith(color: Colors.white),
          ),
          const Spacer(),
          Container(
            width: 48,
            height: 48,
            alignment: Alignment.center,
            child: Assets.images.appBar.notification.svg(
              colorFilter: const ColorFilter.mode(
                Colors.white,
                BlendMode.srcIn,
              ),
            ),
          ),
        ],
      ),
    );
  }
}
