import 'package:flutter/material.dart';
import '../../../../../shared/design_system/dashboard_theme.dart';

/// Widget de raccourcis rapides pour le dashboard
class DashboardShortcutsWidget extends StatelessWidget {
  final List<DashboardShortcut>? customShortcuts;
  final int maxShortcuts;

  const DashboardShortcutsWidget({
    super.key,
    this.customShortcuts,
    this.maxShortcuts = 6,
  });

  @override
  Widget build(BuildContext context) {
    final shortcuts = customShortcuts ?? _getDefaultShortcuts();
    final displayShortcuts = shortcuts.take(maxShortcuts).toList();

    return Container(
      decoration: DashboardTheme.cardDecoration,
      padding: const EdgeInsets.all(DashboardTheme.spacing20),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          _buildHeader(),
          const SizedBox(height: DashboardTheme.spacing16),
          _buildShortcutsGrid(displayShortcuts),
        ],
      ),
    );
  }

  Widget _buildHeader() {
    return Row(
      children: [
        Container(
          padding: const EdgeInsets.all(DashboardTheme.spacing8),
          decoration: BoxDecoration(
            color: DashboardTheme.tealBlue.withOpacity(0.1),
            borderRadius: BorderRadius.circular(DashboardTheme.borderRadiusSmall),
          ),
          child: const Icon(
            Icons.flash_on,
            color: DashboardTheme.tealBlue,
            size: 20,
          ),
        ),
        const SizedBox(width: DashboardTheme.spacing12),
        Expanded(
          child: Text(
            'Actions Rapides',
            style: DashboardTheme.titleMedium.copyWith(
              fontWeight: FontWeight.bold,
            ),
          ),
        ),
        TextButton(
          onPressed: () {
            // TODO: Personnaliser les raccourcis
          },
          child: Text(
            'Personnaliser',
            style: DashboardTheme.bodySmall.copyWith(
              color: DashboardTheme.tealBlue,
              fontWeight: FontWeight.w600,
            ),
          ),
        ),
      ],
    );
  }

  Widget _buildShortcutsGrid(List<DashboardShortcut> shortcuts) {
    return GridView.builder(
      shrinkWrap: true,
      physics: const NeverScrollableScrollPhysics(),
      gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
        crossAxisCount: 3,
        crossAxisSpacing: DashboardTheme.spacing12,
        mainAxisSpacing: DashboardTheme.spacing12,
        childAspectRatio: 1.0,
      ),
      itemCount: shortcuts.length,
      itemBuilder: (context, index) {
        return _buildShortcutItem(shortcuts[index]);
      },
    );
  }

  Widget _buildShortcutItem(DashboardShortcut shortcut) {
    return GestureDetector(
      onTap: shortcut.onTap,
      child: Container(
        decoration: BoxDecoration(
          color: shortcut.color.withOpacity(0.1),
          borderRadius: BorderRadius.circular(DashboardTheme.borderRadius),
          border: Border.all(
            color: shortcut.color.withOpacity(0.3),
            width: 1,
          ),
        ),
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Container(
              padding: const EdgeInsets.all(DashboardTheme.spacing12),
              decoration: BoxDecoration(
                color: shortcut.color.withOpacity(0.2),
                borderRadius: BorderRadius.circular(DashboardTheme.borderRadiusLarge),
              ),
              child: Icon(
                shortcut.icon,
                color: shortcut.color,
                size: 24,
              ),
            ),
            const SizedBox(height: DashboardTheme.spacing8),
            Text(
              shortcut.title,
              style: DashboardTheme.bodySmall.copyWith(
                color: shortcut.color,
                fontWeight: FontWeight.w600,
              ),
              textAlign: TextAlign.center,
              maxLines: 2,
              overflow: TextOverflow.ellipsis,
            ),
            if (shortcut.badge != null) ...[
              const SizedBox(height: DashboardTheme.spacing4),
              Container(
                padding: const EdgeInsets.symmetric(
                  horizontal: DashboardTheme.spacing6,
                  vertical: DashboardTheme.spacing2,
                ),
                decoration: BoxDecoration(
                  color: shortcut.badgeColor ?? DashboardTheme.error,
                  borderRadius: BorderRadius.circular(DashboardTheme.borderRadiusSmall),
                ),
                child: Text(
                  shortcut.badge!,
                  style: DashboardTheme.bodySmall.copyWith(
                    color: DashboardTheme.white,
                    fontWeight: FontWeight.bold,
                    fontSize: 10,
                  ),
                ),
              ),
            ],
          ],
        ),
      ),
    );
  }

  List<DashboardShortcut> _getDefaultShortcuts() {
    return [
      DashboardShortcut(
        title: 'Nouveau\nMembre',
        icon: Icons.person_add,
        color: DashboardTheme.success,
        onTap: () {
          // TODO: Naviguer vers ajout membre
        },
      ),
      DashboardShortcut(
        title: 'Créer\nÉvénement',
        icon: Icons.event_available,
        color: DashboardTheme.royalBlue,
        onTap: () {
          // TODO: Naviguer vers création événement
        },
      ),
      DashboardShortcut(
        title: 'Ajouter\nContribution',
        icon: Icons.payment,
        color: DashboardTheme.tealBlue,
        onTap: () {
          // TODO: Naviguer vers ajout contribution
        },
      ),
      DashboardShortcut(
        title: 'Envoyer\nMessage',
        icon: Icons.message,
        color: DashboardTheme.warning,
        badge: '3',
        badgeColor: DashboardTheme.error,
        onTap: () {
          // TODO: Naviguer vers messagerie
        },
      ),
      DashboardShortcut(
        title: 'Générer\nRapport',
        icon: Icons.assessment,
        color: DashboardTheme.info,
        onTap: () {
          // TODO: Naviguer vers génération rapport
        },
      ),
      DashboardShortcut(
        title: 'Paramètres',
        icon: Icons.settings,
        color: DashboardTheme.grey600,
        onTap: () {
          // TODO: Naviguer vers paramètres
        },
      ),
    ];
  }
}

class DashboardShortcut {
  final String title;
  final IconData icon;
  final Color color;
  final VoidCallback onTap;
  final String? badge;
  final Color? badgeColor;

  const DashboardShortcut({
    required this.title,
    required this.icon,
    required this.color,
    required this.onTap,
    this.badge,
    this.badgeColor,
  });
}
