import 'package:flutter/material.dart';

import '../../../../application/sync/sync_bloc.dart';

class SyncCompletedWidget extends StatelessWidget {
  final SyncStats stats;
  const SyncCompletedWidget({super.key, required this.stats});

  @override
  Widget build(BuildContext context) {
    return SingleChildScrollView(
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          // Success icon
          Container(
            width: 80,
            height: 80,
            decoration: BoxDecoration(
              color: Colors.green.shade50,
              borderRadius: BorderRadius.circular(40),
            ),
            child: Icon(
              Icons.check_circle,
              size: 48,
              color: Colors.green.shade600,
            ),
          ),

          SizedBox(height: 20),

          Text(
            'Sinkronisasi Berhasil!',
            style: TextStyle(
              fontSize: 18,
              fontWeight: FontWeight.bold,
              color: Colors.green.shade700,
            ),
          ),

          SizedBox(height: 8),

          Text(
            'Data berhasil diunduh ke perangkat',
            style: TextStyle(fontSize: 14, color: Colors.grey.shade600),
          ),

          SizedBox(height: 20),

          // Stats cards
          Container(
            padding: EdgeInsets.all(16),
            decoration: BoxDecoration(
              color: Colors.white,
              borderRadius: BorderRadius.circular(12),
              border: Border.all(color: Colors.grey.shade200),
            ),
            child: Column(
              children: [
                Text(
                  'Data yang Diunduh',
                  style: TextStyle(
                    fontSize: 14,
                    fontWeight: FontWeight.w600,
                    color: Colors.grey.shade700,
                  ),
                ),
                SizedBox(height: 12),
                Column(
                  children: [
                    _buildStatItem(
                      'Kategori',
                      '${stats.totalCategories}',
                      Icons.category,
                      Colors.blue,
                    ),
                    SizedBox(height: 8),
                    _buildStatItem(
                      'Produk',
                      '${stats.totalProducts}',
                      Icons.inventory_2,
                      Colors.green,
                    ),
                    SizedBox(height: 8),
                    _buildStatItem(
                      'Variant',
                      '${stats.totalVariants}',
                      Icons.tune,
                      Colors.orange,
                    ),
                  ],
                ),
              ],
            ),
          ),

          SizedBox(height: 12),

          Container(
            padding: EdgeInsets.symmetric(horizontal: 16, vertical: 8),
            decoration: BoxDecoration(
              color: Colors.grey.shade100,
              borderRadius: BorderRadius.circular(6),
            ),
            child: Text(
              'Mengalihkan ke halaman utama...',
              style: TextStyle(color: Colors.grey.shade600, fontSize: 10),
            ),
          ),
        ],
      ),
    );
  }

  Widget _buildStatItem(
    String label,
    String value,
    IconData icon,
    Color color,
  ) {
    return Container(
      padding: EdgeInsets.symmetric(horizontal: 12, vertical: 8),
      decoration: BoxDecoration(
        color: color.withOpacity(0.1),
        borderRadius: BorderRadius.circular(8),
      ),
      child: Row(
        mainAxisSize: MainAxisSize.min,
        children: [
          Icon(icon, size: 20, color: color),
          SizedBox(width: 8),
          Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Text(
                value,
                style: TextStyle(
                  fontSize: 16,
                  fontWeight: FontWeight.bold,
                  color: color,
                ),
              ),
              Text(
                label,
                style: TextStyle(fontSize: 10, color: Colors.grey.shade600),
              ),
            ],
          ),
        ],
      ),
    );
  }
}