import 'package:flutter/material.dart';

import '../../../../common/extension/extension.dart';
import '../../../../common/theme/theme.dart';
import '../../../components/spacer/spacer.dart';

class HomeWarnings extends StatelessWidget {
  const HomeWarnings({super.key});

  @override
  Widget build(BuildContext context) {
    // TODO: Integrate with actual warning data from backend
    final warnings = <_WarningItem>[];

    return Padding(
      padding: const EdgeInsets.symmetric(
        horizontal: AppValue.padding,
        vertical: 24,
      ).copyWith(bottom: 0),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          // Header
          Row(
            children: [
              Text(
                context.lang.warning_title,
                style: AppStyle.xl.copyWith(
                  fontWeight: FontWeight.w800,
                  color: AppColor.textPrimary,
                ),
              ),
              const SpaceWidth(8),
              Container(
                padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 2),
                decoration: BoxDecoration(
                  color: AppColor.error,
                  borderRadius: BorderRadius.circular(10),
                ),
                child: Text(
                  '${warnings.length}',
                  style: AppStyle.xs.copyWith(
                    color: AppColor.white,
                    fontWeight: FontWeight.w700,
                  ),
                ),
              ),
            ],
          ),
          const SpaceHeight(4),
          Text(
            context.lang.warning_desc,
            style: AppStyle.sm.copyWith(color: AppColor.textSecondary),
          ),
          const SpaceHeight(16),

          // Warning list / empty state
          Container(
            width: double.infinity,
            decoration: BoxDecoration(
              color: AppColor.white,
              borderRadius: BorderRadius.circular(16),
              boxShadow: [
                BoxShadow(
                  color: Colors.black.withOpacity(0.04),
                  blurRadius: 10,
                  offset: const Offset(0, 4),
                ),
              ],
            ),
            child: warnings.isEmpty
                ? _buildEmptyState(context)
                : ListView.separated(
                    shrinkWrap: true,
                    physics: const NeverScrollableScrollPhysics(),
                    padding: const EdgeInsets.symmetric(vertical: 8),
                    itemCount: warnings.length,
                    separatorBuilder: (_, __) => Divider(
                      height: 1,
                      color: AppColor.border.withOpacity(0.5),
                      indent: 72,
                    ),
                    itemBuilder: (context, index) {
                      final item = warnings[index];
                      return _WarningTile(item: item);
                    },
                  ),
          ),
        ],
      ),
    );
  }

  Widget _buildEmptyState(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.symmetric(vertical: 32, horizontal: 16),
      child: Column(
        children: [
          Icon(
            Icons.check_circle_outline_rounded,
            color: AppColor.success.withOpacity(0.6),
            size: 48,
          ),
          const SpaceHeight(12),
          Text(
            context.lang.no_warning,
            style: AppStyle.md.copyWith(
              fontWeight: FontWeight.w600,
              color: AppColor.textPrimary,
            ),
          ),
          const SpaceHeight(4),
          Text(
            context.lang.no_warning_desc,
            style: AppStyle.sm.copyWith(color: AppColor.textSecondary),
          ),
        ],
      ),
    );
  }
}

class _WarningTile extends StatelessWidget {
  final _WarningItem item;
  const _WarningTile({required this.item});

  @override
  Widget build(BuildContext context) {
    return InkWell(
      onTap: () {},
      child: Padding(
        padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 14),
        child: Row(
          children: [
            // Warning icon
            Container(
              width: 44,
              height: 44,
              decoration: BoxDecoration(
                color: item.severity == _WarningSeverity.tinggi
                    ? AppColor.error.withOpacity(0.1)
                    : AppColor.warning.withOpacity(0.1),
                borderRadius: BorderRadius.circular(12),
              ),
              child: Icon(
                Icons.warning_amber_rounded,
                color: item.severity == _WarningSeverity.tinggi
                    ? AppColor.error
                    : AppColor.warning,
                size: 22,
              ),
            ),
            const SpaceWidth(12),

            // Title + subtitle
            Expanded(
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Text(
                    item.title,
                    style: AppStyle.md.copyWith(
                      fontWeight: FontWeight.w700,
                      color: AppColor.textPrimary,
                    ),
                    maxLines: 1,
                    overflow: TextOverflow.ellipsis,
                  ),
                  const SizedBox(height: 2),
                  Text(
                    item.subtitle,
                    style: AppStyle.xs.copyWith(color: AppColor.textSecondary),
                    maxLines: 1,
                    overflow: TextOverflow.ellipsis,
                  ),
                ],
              ),
            ),
            const SpaceWidth(8),

            // Severity badge
            Container(
              padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 4),
              decoration: BoxDecoration(
                color: item.severity == _WarningSeverity.tinggi
                    ? AppColor.error.withOpacity(0.1)
                    : AppColor.warning.withOpacity(0.1),
                borderRadius: BorderRadius.circular(8),
              ),
              child: Text(
                item.severity == _WarningSeverity.tinggi
                    ? context.lang.severity_high
                    : context.lang.severity_medium,
                style: AppStyle.xs.copyWith(
                  color: item.severity == _WarningSeverity.tinggi
                      ? AppColor.error
                      : AppColor.warning,
                  fontWeight: FontWeight.w700,
                ),
              ),
            ),
            const SpaceWidth(4),

            // Chevron
            Icon(
              Icons.chevron_right_rounded,
              color: AppColor.textSecondary.withOpacity(0.5),
              size: 20,
            ),
          ],
        ),
      ),
    );
  }
}

// ignore: unused_element
enum _WarningSeverity { tinggi }

// ignore: unused_element
class _WarningItem {
  final String title;
  final String subtitle;
  final _WarningSeverity severity;

  const _WarningItem({
    required this.title,
    required this.subtitle,
    required this.severity,
  });
}