import 'package:auto_route/auto_route.dart';
import 'package:flutter/material.dart';
import 'package:shimmer/shimmer.dart';

import '../../../../application/analytic/profit_sharing_loader/profit_sharing_loader_bloc.dart';
import '../../../../common/extension/extension.dart';
import '../../../../common/theme/theme.dart';
import '../../../components/spacer/spacer.dart';

class ProfitSharingHeader extends StatelessWidget {
  final ProfitSharingLoaderState state;

  const ProfitSharingHeader({super.key, required this.state});

  @override
  Widget build(BuildContext context) {
    final budget = state.profitSharing.budget;
    final outletLabel = state.profitSharing.outletName.isNotEmpty
        ? state.profitSharing.outletName
        : context.lang.all_outlets;

    return Container(
      decoration: const BoxDecoration(
        gradient: LinearGradient(
          colors: AppColor.primaryGradient,
          begin: Alignment.topCenter,
          end: Alignment.bottomCenter,
        ),
        borderRadius: BorderRadius.only(
          bottomLeft: Radius.circular(24),
          bottomRight: Radius.circular(24),
        ),
      ),
      child: SafeArea(
        bottom: false,
        child: Padding(
          padding: const EdgeInsets.fromLTRB(16, 12, 16, 24),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Row(
                children: [
                  if (context.router.canPop()) ...[
                    GestureDetector(
                      onTap: () => context.router.maybePop(),
                      child: Container(
                        width: 40,
                        height: 40,
                        decoration: BoxDecoration(
                          color: AppColor.textWhite.withOpacity(0.15),
                          borderRadius: BorderRadius.circular(12),
                        ),
                        child: const Icon(
                          Icons.chevron_left_rounded,
                          color: AppColor.textWhite,
                          size: 24,
                        ),
                      ),
                    ),
                    const SpaceWidth(12),
                  ],
                  Expanded(
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Text(
                          context.lang.profit_sharing,
                          style: AppStyle.xl.copyWith(
                            color: AppColor.textWhite,
                            fontWeight: FontWeight.w700,
                            fontSize: 20,
                          ),
                        ),
                        const SizedBox(height: 2),
                        Text(
                          outletLabel,
                          style: AppStyle.sm.copyWith(
                            color: AppColor.textWhite.withOpacity(0.75),
                            fontSize: 12,
                          ),
                          maxLines: 1,
                          overflow: TextOverflow.ellipsis,
                        ),
                      ],
                    ),
                  ),
                ],
              ),

              const SpaceHeight(24),

              state.isFetching
                  ? _shimmerBox(width: 220, height: 36)
                  : Text(
                      budget.total.revenue.currencyFormatRp,
                      style: AppStyle.h1.copyWith(
                        color: AppColor.textWhite,
                        fontWeight: FontWeight.w900,
                        fontSize: 32,
                      ),
                    ),

              const SpaceHeight(4),
              Text(
                context.lang.total_revenue,
                style: AppStyle.sm.copyWith(
                  color: AppColor.textWhite.withOpacity(0.75),
                  fontSize: 13,
                ),
              ),

              const SpaceHeight(16),

              state.isFetching
                  ? _shimmerBox(width: 140, height: 32, radius: 20)
                  : _chip(
                      context.lang.order_count_label(budget.total.orderCount),
                    ),
            ],
          ),
        ),
      ),
    );
  }

  Widget _chip(String label) {
    return Container(
      padding: const EdgeInsets.symmetric(horizontal: 14, vertical: 8),
      decoration: BoxDecoration(
        color: AppColor.textWhite.withOpacity(0.15),
        borderRadius: BorderRadius.circular(20),
        border: Border.all(color: AppColor.textWhite.withOpacity(0.25)),
      ),
      child: Text(
        label,
        style: AppStyle.sm.copyWith(
          color: AppColor.textWhite,
          fontWeight: FontWeight.w600,
          fontSize: 12,
        ),
      ),
    );
  }

  Widget _shimmerBox({
    required double width,
    required double height,
    double radius = 8,
  }) {
    return Shimmer.fromColors(
      baseColor: AppColor.textWhite.withOpacity(0.3),
      highlightColor: AppColor.textWhite.withOpacity(0.6),
      child: Container(
        width: width,
        height: height,
        decoration: BoxDecoration(
          color: AppColor.textWhite.withOpacity(0.3),
          borderRadius: BorderRadius.circular(radius),
        ),
      ),
    );
  }
}