import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import '../../../core/network/api_client.dart';
import '../../../core/theme/app_theme.dart';
import '../../../core/widgets/glass_container.dart';
import '../../../core/widgets/shimmer_loading.dart';
import '../../trades/bloc/trade_bloc.dart';
import '../../trades/bloc/trade_event.dart';
import '../../trades/bloc/trade_state.dart';
import '../../trades/repositories/trade_repository.dart';
import '../../asset_detail/views/asset_detail_screen.dart';
import 'dart:ui';

/// Premium Dashboard Widget for Auto-Screener Asset Recommendations
class TradesStreamWidget extends StatelessWidget {
  final ApiClient apiClient;

  const TradesStreamWidget({super.key, required this.apiClient});

  @override
  Widget build(BuildContext context) {
    return BlocProvider(
      create: (context) => TradeBloc(
        repository: TradeRepository(apiClient: apiClient),
      )..add(const FetchTrades()),
      child: const _TradesStreamWidgetContent(),
    );
  }
}

class _TradesStreamWidgetContent extends StatelessWidget {
  const _TradesStreamWidgetContent();

  @override
  Widget build(BuildContext context) {
    return BlocBuilder<TradeBloc, TradeState>(
      builder: (context, state) {
        if (state is TradeLoading) {
          return const _PremiumLoadingSkeleton();
        }

        if (state is TradeLoaded) {
          final proposals = state.trades.where((t) => t.isProposed && !t.isRejected).toList();

          if (proposals.isEmpty) {
            return const _EmptyRecommendations();
          }

          return Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Row(
                children: [
                  Container(
                    padding: const EdgeInsets.all(6),
                    decoration: BoxDecoration(
                      color: AppTheme.primaryEmerald.withValues(alpha: 0.2),
                      shape: BoxShape.circle,
                      boxShadow: [
                        BoxShadow(
                          color: AppTheme.primaryEmerald.withValues(alpha: 0.4),
                          blurRadius: 8,
                          spreadRadius: 2,
                        ),
                      ],
                    ),
                    child: Icon(Icons.bolt, color: AppTheme.primaryEmerald, size: 18),
                  ),
                  const SizedBox(width: 8),
                  const Text(
                    'KI Asset Empfehlungen',
                    style: TextStyle(fontWeight: FontWeight.bold, fontSize: 18, color: Colors.white, letterSpacing: 0.5),
                  ),
                  const Spacer(),
                  Container(
                    padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 4),
                    decoration: BoxDecoration(
                      color: Colors.amber.withValues(alpha: 0.15),
                      borderRadius: BorderRadius.circular(12),
                      border: Border.all(color: Colors.amber.withValues(alpha: 0.3)),
                    ),
                    child: Row(
                      children: [
                        const Icon(Icons.star_rounded, size: 14, color: Colors.amber),
                        const SizedBox(width: 4),
                        Text(
                          '${proposals.length} Neu',
                          style: const TextStyle(color: Colors.amber, fontWeight: FontWeight.bold, fontSize: 12),
                        ),
                      ],
                    ),
                  ),
                ],
              ),
              const SizedBox(height: 12),
              SizedBox(
                height: 160,
                child: ListView.builder(
                  scrollDirection: Axis.horizontal,
                  physics: const BouncingScrollPhysics(),
                  itemCount: proposals.length,
                  itemBuilder: (context, index) {
                    final p = proposals[index];
                    final isBuy = p.signalType.toUpperCase() == 'BUY' || p.signalType.toUpperCase() == 'LONG';
                    final signalColor = isBuy ? AppTheme.primaryEmerald : AppTheme.accentRed;

                    return GestureDetector(
                      onTap: () {
                        Navigator.push(
                          context,
                          MaterialPageRoute(
                            builder: (ctx) => AssetDetailScreen(
                              symbol: p.symbol.isNotEmpty ? p.symbol : p.isin,
                              apiClient: context.read<TradeBloc>().repository.apiClient,
                            ),
                          ),
                        );
                      },
                      child: Container(
                        width: 260,
                        margin: const EdgeInsets.only(right: 16),
                        child: ClipRRect(
                          borderRadius: BorderRadius.circular(20),
                          child: BackdropFilter(
                            filter: ImageFilter.blur(sigmaX: 10, sigmaY: 10),
                            child: Container(
                              decoration: BoxDecoration(
                                color: Colors.white.withValues(alpha: 0.03),
                                borderRadius: BorderRadius.circular(20),
                                border: Border.all(color: Colors.white.withValues(alpha: 0.1)),
                                gradient: LinearGradient(
                                  begin: Alignment.topLeft,
                                  end: Alignment.bottomRight,
                                  colors: [
                                    Colors.white.withValues(alpha: 0.08),
                                    signalColor.withValues(alpha: 0.02),
                                  ],
                                ),
                              ),
                              padding: const EdgeInsets.all(16),
                              child: Column(
                                crossAxisAlignment: CrossAxisAlignment.start,
                                children: [
                                  Row(
                                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                    children: [
                                      Text(
                                        p.symbol.isNotEmpty ? p.symbol : 'Trade',
                                        style: const TextStyle(fontWeight: FontWeight.bold, fontSize: 20, color: Colors.white),
                                      ),
                                      Container(
                                        padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 4),
                                        decoration: BoxDecoration(
                                          color: signalColor.withValues(alpha: 0.15),
                                          borderRadius: BorderRadius.circular(8),
                                          border: Border.all(color: signalColor.withValues(alpha: 0.3)),
                                        ),
                                        child: Text(
                                          p.signalType,
                                          style: TextStyle(color: signalColor, fontWeight: FontWeight.bold, fontSize: 11),
                                        ),
                                      ),
                                    ],
                                  ),
                                  if (p.companyName.isNotEmpty) ...[
                                    const SizedBox(height: 4),
                                    Text(
                                      p.companyName,
                                      style: TextStyle(color: AppTheme.textMuted, fontSize: 12),
                                      maxLines: 1,
                                      overflow: TextOverflow.ellipsis,
                                    ),
                                  ],
                                  const Spacer(),
                                  if (p.reasoning.isNotEmpty) ...[
                                    Text(
                                      p.reasoning,
                                      style: const TextStyle(color: Colors.white70, fontSize: 11, fontStyle: FontStyle.italic),
                                      maxLines: 2,
                                      overflow: TextOverflow.ellipsis,
                                    ),
                                    const SizedBox(height: 10),
                                  ],
                                  Row(
                                    children: [
                                      Text(
                                        'KI Score: ${(p.winRate).toStringAsFixed(0)}%',
                                        style: TextStyle(color: AppTheme.accentCyan, fontWeight: FontWeight.w600, fontSize: 13),
                                      ),
                                      const Spacer(),
                                      const Icon(Icons.arrow_forward_rounded, color: Colors.white54, size: 16),
                                    ],
                                  ),
                                ],
                              ),
                            ),
                          ),
                        ),
                      ),
                    );
                  },
                ),
              ),
            ],
          );
        }

        return const SizedBox.shrink();
      },
    );
  }
}

class _PremiumLoadingSkeleton extends StatelessWidget {
  const _PremiumLoadingSkeleton();

  @override
  Widget build(BuildContext context) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        const ShimmerLoading(width: 200, height: 24, borderRadius: 4),
        const SizedBox(height: 12),
        SizedBox(
          height: 160,
          child: ListView.builder(
            scrollDirection: Axis.horizontal,
            itemCount: 3,
            itemBuilder: (_, __) => const Padding(
              padding: EdgeInsets.only(right: 16),
              child: ShimmerLoading(width: 260, height: 160, borderRadius: 20),
            ),
          ),
        ),
      ],
    );
  }
}

class _EmptyRecommendations extends StatelessWidget {
  const _EmptyRecommendations();

  @override
  Widget build(BuildContext context) {
    return GlassContainer(
      padding: const EdgeInsets.all(20),
      child: Row(
        children: [
          Container(
            padding: const EdgeInsets.all(12),
            decoration: BoxDecoration(
              color: AppTheme.accentCyan.withValues(alpha: 0.1),
              shape: BoxShape.circle,
            ),
            child: Icon(Icons.radar, color: AppTheme.accentCyan, size: 24),
          ),
          const SizedBox(width: 16),
          Expanded(
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                const Text(
                  'KI Screener läuft...',
                  style: TextStyle(fontWeight: FontWeight.bold, fontSize: 15, color: Colors.white),
                ),
                const SizedBox(height: 4),
                Text(
                  'Es gibt aktuell keine neuen hoch-konfidenten Asset-Vorschläge. Die KI analysiert den Markt kontinuierlich.',
                  style: TextStyle(color: AppTheme.textMuted, fontSize: 12),
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }
}