prosappco/lib/screens/lists/professional_pending_service_list.dart

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:injector/injector.dart';
import 'package:intl/intl.dart';
import 'package:professional_repository/professional_repository.dart';
import 'package:prosappco/blocs/service_bloc/service_bloc.dart';
import 'package:prosappco/screens/service/professional_service_screen.dart';
import 'package:service_repository/service_repository.dart';
import 'package:shimmer/shimmer.dart';
import 'package:user_repository/user_repository.dart';

const _kPrimary = Color(0xFF1565C0);

extension _Th on BuildContext {
  ThemeData get _t => Theme.of(this);
  Color get bg => _t.scaffoldBackgroundColor;
  Color get card => _t.cardColor;
  Color get onSurface => _t.colorScheme.onSurface;
  Color get muted => _t.colorScheme.onSurface.withOpacity(0.55);
  Color get subtle => _t.colorScheme.onSurface.withOpacity(0.35);
  bool get isDark => _t.brightness == Brightness.dark;
  Color get shadowSm => isDark ? Colors.transparent : Colors.black.withOpacity(0.04);
}

class ProfessionalPendingServiceListScreen extends StatefulWidget {
  const ProfessionalPendingServiceListScreen({super.key});

  @override
  State<ProfessionalPendingServiceListScreen> createState() =>
      _ProfessionalPendingServiceListScreenState();
}

class _ProfessionalPendingServiceListScreenState
    extends State<ProfessionalPendingServiceListScreen> {
  late final ServiceBloc serviceBloc;

  @override
  void initState() {
    super.initState();
    serviceBloc = Injector.appInstance.get<ServiceBloc>();
    serviceBloc.add(
        LoadPendingServicesForProfessional(ApiUserRepository.currentUserId ?? ''));
  }

  @override
  Widget build(BuildContext context) {
    return BlocProvider<ServiceBloc>(
      create: (context) => serviceBloc,
      child: Scaffold(
        backgroundColor: context.bg,
        appBar: AppBar(
          title: const Text('Solicitudes'),
          backgroundColor: _kPrimary,
          foregroundColor: Colors.white,
          elevation: 0,
        ),
        body: BlocBuilder<ServiceBloc, ServiceState>(
          builder: (context, serviceState) {
            if (serviceState is ServicesForUserLoaded) {
              if (serviceState.services.isEmpty) return _emptyState(context);
              return ListView.builder(
                padding: const EdgeInsets.symmetric(vertical: 12),
                itemCount: serviceState.services.length,
                itemBuilder: (_, index) =>
                    _RequestCard(info: serviceState.services[index]),
              );
            }
            return _shimmerList();
          },
        ),
      ),
    );
  }

  Widget _emptyState(BuildContext context) {
    return Center(
      child: Padding(
        padding: const EdgeInsets.all(32),
        child: Column(mainAxisSize: MainAxisSize.min, children: [
          Container(
            width: 72,
            height: 72,
            decoration: BoxDecoration(
              color: context.subtle.withOpacity(0.1), shape: BoxShape.circle),
            child:
                Icon(Icons.inbox_outlined, size: 36, color: context.subtle),
          ),
          const SizedBox(height: 16),
          Text('Sin solicitudes pendientes',
              style: TextStyle(
                  fontSize: 16,
                  fontWeight: FontWeight.w700,
                  color: context.muted)),
          const SizedBox(height: 6),
          Text('Cuando un cliente solicite tus servicios\naparecerá aquí.',
              textAlign: TextAlign.center,
              style: TextStyle(
                  fontSize: 13, color: context.subtle, height: 1.5)),
        ]),
      ),
    );
  }

  Widget _shimmerList() {
    return Shimmer.fromColors(
      baseColor: Colors.grey[300]!,
      highlightColor: Colors.grey[100]!,
      child: ListView.builder(
        padding: const EdgeInsets.symmetric(vertical: 12),
        itemCount: 8,
        itemBuilder: (_, __) => Container(
          margin: const EdgeInsets.symmetric(horizontal: 16, vertical: 6),
          height: 84,
          decoration: BoxDecoration(
            color: Colors.white, borderRadius: BorderRadius.circular(14)),
        ),
      ),
    );
  }
}

class _RequestCard extends StatelessWidget {
  final ServiceInfoUI info;
  const _RequestCard({required this.info});

  @override
  Widget build(BuildContext context) {
    final service = info.service;
    final user = info.user;
    final si = _statusInfo(service.status);
    final dateStr = DateFormat('dd MMM yyyy', 'es')
        .format(DateTime.parse(service.day));
    final timeStr = ScheduleEntity.getFormatTime(service.range1Hour1) ?? '';

    return Container(
      margin: const EdgeInsets.symmetric(horizontal: 16, vertical: 6),
      decoration: BoxDecoration(
        color: context.card,
        borderRadius: BorderRadius.circular(14),
        boxShadow: [
          BoxShadow(
              color: context.shadowSm,
              blurRadius: 10,
              offset: const Offset(0, 2))
        ],
      ),
      child: ClipRRect(
        borderRadius: BorderRadius.circular(14),
        child: InkWell(
          onTap: () => Navigator.push(
            context,
            CupertinoPageRoute(
                builder: (_) =>
                    ProfessionalServiceScreen(serviceId: service.id!)),
          ),
          child: IntrinsicHeight(
            child: Row(children: [
              Container(width: 4, color: si.color),
              Padding(
                padding: const EdgeInsets.all(12),
                child: Container(
                  width: 50,
                  height: 50,
                  decoration: BoxDecoration(
                    shape: BoxShape.circle,
                    border: Border.all(
                        color: si.color.withOpacity(0.35), width: 2)),
                  child: ClipOval(
                    child: (user.picture == null || user.picture!.isEmpty)
                        ? Container(
                            color: _kPrimary.withOpacity(0.1),
                            child: Center(
                              child: Text(
                                user.name?.isNotEmpty == true
                                    ? user.name![0].toUpperCase()
                                    : '?',
                                style: const TextStyle(
                                    fontSize: 18,
                                    fontWeight: FontWeight.w700,
                                    color: _kPrimary),
                              ),
                            ),
                          )
                        : Image.network(user.picture!, fit: BoxFit.cover),
                  ),
                ),
              ),
              Expanded(
                child: Padding(
                  padding: const EdgeInsets.symmetric(vertical: 12),
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                      Text(user.name ?? '',
                          style: TextStyle(
                              fontSize: 14,
                              fontWeight: FontWeight.w700,
                              color: context.onSurface)),
                      if (service.description.isNotEmpty) ...[
                        const SizedBox(height: 2),
                        Text('"${service.description}"',
                            style: TextStyle(
                                fontSize: 12,
                                color: context.muted,
                                fontStyle: FontStyle.italic),
                            maxLines: 1,
                            overflow: TextOverflow.ellipsis),
                      ],
                      const SizedBox(height: 5),
                      Row(children: [
                        Icon(Icons.calendar_today_outlined,
                            size: 11, color: context.subtle),
                        const SizedBox(width: 4),
                        Text('$dateStr · $timeStr',
                            style: TextStyle(
                                fontSize: 11,
                                color: context.muted,
                                fontWeight: FontWeight.w500)),
                      ]),
                    ],
                  ),
                ),
              ),
              Padding(
                padding: const EdgeInsets.fromLTRB(8, 12, 12, 12),
                child: Column(
                  mainAxisAlignment: MainAxisAlignment.center,
                  crossAxisAlignment: CrossAxisAlignment.end,
                  children: [
                    _StatusBadge(si: si),
                    const SizedBox(height: 6),
                    Icon(Icons.chevron_right, size: 18, color: context.subtle),
                  ],
                ),
              ),
            ]),
          ),
        ),
      ),
    );
  }
}

class _StatusBadge extends StatelessWidget {
  final _StatusInfo si;
  const _StatusBadge({required this.si});

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 4),
      decoration: BoxDecoration(
        color: si.color.withOpacity(0.1),
        borderRadius: BorderRadius.circular(20),
        border: Border.all(color: si.color.withOpacity(0.3)),
      ),
      child: Row(mainAxisSize: MainAxisSize.min, children: [
        Icon(si.icon, size: 10, color: si.color),
        const SizedBox(width: 4),
        Text(si.label,
            style: TextStyle(
                fontSize: 10, fontWeight: FontWeight.w700, color: si.color)),
      ]),
    );
  }
}

class _StatusInfo {
  final String label;
  final Color color;
  final IconData icon;
  const _StatusInfo(this.label, this.color, this.icon);
}

_StatusInfo _statusInfo(ServiceStatus status) {
  switch (status) {
    case ServiceStatus.acepted:
      return const _StatusInfo('Aceptado', Color(0xFF1565C0), Icons.check_circle_outline);
    case ServiceStatus.active:
      return const _StatusInfo('En curso', Color(0xFF16A34A), Icons.play_circle_outline);
    case ServiceStatus.completed:
      return const _StatusInfo('Completado', Color(0xFF64748B), Icons.task_alt_outlined);
    case ServiceStatus.denied:
      return const _StatusInfo('Rechazado', Color(0xFFDC2626), Icons.cancel_outlined);
    case ServiceStatus.cancelled:
      return const _StatusInfo('Cancelado', Color(0xFF9CA3AF), Icons.remove_circle_outline);
    case ServiceStatus.selfBooked:
      return const _StatusInfo('Reservado', Color(0xFF7C3AED), Icons.bookmark_outline);
    default:
      return const _StatusInfo('Pendiente', Color(0xFFD97706), Icons.hourglass_top_outlined);
  }
}