// 👥 백품타 그룹 상세 화면 (UI 전용) - 멤버 오늘 출석 현황, 친구 초대, 그룹 나가기.
// 서버 통신/상태는 lib/function/group_detail_controller.dart, friend_controller.dart가 담당한다.
import 'package:flutter/material.dart';
import '../function/friend_controller.dart';
import '../function/group_detail_controller.dart';
import '../theme/app_palette.dart';
import 'app_notice.dart';
import 'launchpad_transition.dart';
import 'study_timer_screen.dart';
import 'title_pill.dart';

class GroupDetailScreen extends StatefulWidget {
  final int groupId;
  final String groupName;
  final String studentId;
  final String studentName;
  final int? grade;

  const GroupDetailScreen({
    super.key,
    required this.groupId,
    required this.groupName,
    required this.studentId,
    required this.studentName,
    this.grade,
  });

  @override
  State<GroupDetailScreen> createState() => _GroupDetailScreenState();
}

class _GroupDetailScreenState extends State<GroupDetailScreen> {
  late final GroupDetailController _controller;

  @override
  void initState() {
    super.initState();
    _controller = GroupDetailController(
      groupId: widget.groupId,
      studentId: widget.studentId,
    );
    _controller.init();
  }

  @override
  void dispose() {
    _controller.dispose();
    super.dispose();
  }

  Future<void> _showInviteSheet() async {
    final friendController = FriendController(
      studentId: widget.studentId,
      studentName: '',
    );
    await friendController.init();
    if (!mounted) return;

    final memberIds = _controller.members
        .map((m) => m['studentId'] as String)
        .toSet();
    final invitable = friendController.friends
        .where((f) => !memberIds.contains(f['studentId']))
        .toList();

    await showModalBottomSheet<void>(
      context: context,
      backgroundColor: AppPalette.paper,
      shape: const RoundedRectangleBorder(
        borderRadius: BorderRadius.vertical(top: Radius.circular(20)),
      ),
      builder: (sheetContext) {
        return Padding(
          padding: const EdgeInsets.all(20),
          child: Column(
            mainAxisSize: MainAxisSize.min,
            crossAxisAlignment: CrossAxisAlignment.stretch,
            children: [
              const Text(
                '친구 초대',
                style: TextStyle(fontWeight: FontWeight.bold, fontSize: 16),
              ),
              const SizedBox(height: 12),
              if (invitable.isEmpty)
                const Padding(
                  padding: EdgeInsets.symmetric(vertical: 16),
                  child: Text(
                    '초대할 수 있는 친구가 없어요.\n(이미 그룹에 있거나 친구가 없어요)',
                    textAlign: TextAlign.center,
                    style: TextStyle(color: Colors.grey),
                  ),
                )
              else
                ConstrainedBox(
                  constraints: const BoxConstraints(maxHeight: 320),
                  child: ListView(
                    shrinkWrap: true,
                    children: [
                      for (final f in invitable)
                        ListTile(
                          leading: const Icon(
                            Icons.person_rounded,
                            color: AppPalette.ink,
                          ),
                          title: Text('${f['name']}'),
                          subtitle: Text('${f['studentId']}'),
                          trailing: ElevatedButton(
                            style: ElevatedButton.styleFrom(
                              backgroundColor: AppPalette.ink,
                              foregroundColor: AppPalette.paper,
                            ),
                            onPressed: () async {
                              final (success, message) = await _controller
                                  .invite(
                                    f['studentId'] as String,
                                    f['name'] as String,
                                  );
                              if (sheetContext.mounted) {
                                Navigator.of(sheetContext).pop();
                              }
                              if (!mounted) return;
                              AppNotice.show(
                                context,
                                message,
                                icon: success
                                    ? Icons.check_circle_rounded
                                    : Icons.error_outline_rounded,
                              );
                            },
                            child: const Text('초대'),
                          ),
                        ),
                    ],
                  ),
                ),
            ],
          ),
        );
      },
    );
    friendController.dispose();
  }

  Future<void> _toggleVisibility() async {
    final makePublic = !_controller.isPublic;
    final confirmed = await showDialog<bool>(
      context: context,
      builder: (dialogContext) => AlertDialog(
        title: Text(makePublic ? '공개 그룹으로 전환' : '비공개 그룹으로 전환'),
        content: Text(
          makePublic
              ? '이제 누구나 이 그룹을 찾아서 참여 신청을 보낼 수 있어요. 참여는 그룹장이 허용해야 완료됩니다.'
              : '더 이상 공개 목록에 뜨지 않고, 대기 중인 참여 신청은 모두 거절 처리됩니다.',
        ),
        actions: [
          TextButton(
            onPressed: () => Navigator.pop(dialogContext, false),
            child: const Text('취소', style: TextStyle(color: Colors.grey)),
          ),
          ElevatedButton(
            style: ElevatedButton.styleFrom(
              backgroundColor: AppPalette.ink,
              foregroundColor: AppPalette.paper,
            ),
            onPressed: () => Navigator.pop(dialogContext, true),
            child: const Text('전환'),
          ),
        ],
      ),
    );
    if (confirmed != true) return;
    final (_, message) = await _controller.setVisibility(makePublic);
    if (!mounted) return;
    AppNotice.show(context, message);
  }

  Future<void> _respondJoinRequest(int requestId, bool accept) async {
    final (_, message) = await _controller.respondJoinRequest(
      requestId,
      accept,
    );
    if (!mounted) return;
    AppNotice.show(context, message);
  }

  Future<void> _leave() async {
    final confirmed = await showDialog<bool>(
      context: context,
      builder: (dialogContext) => AlertDialog(
        title: const Text('그룹 나가기'),
        content: Text('${widget.groupName} 그룹에서 나가시겠습니까?'),
        actions: [
          TextButton(
            onPressed: () => Navigator.pop(dialogContext, false),
            child: const Text('취소', style: TextStyle(color: Colors.grey)),
          ),
          TextButton(
            onPressed: () => Navigator.pop(dialogContext, true),
            child: const Text('나가기', style: TextStyle(color: Colors.red)),
          ),
        ],
      ),
    );
    if (confirmed != true) return;
    final (success, message) = await _controller.leave();
    if (!mounted) return;
    AppNotice.show(context, message);
    if (success) Navigator.of(context).pop();
  }

  String _formatMinutes(int seconds) {
    final m = seconds ~/ 60;
    if (m < 60) return '$m분';
    return '${m ~/ 60}시간 ${m % 60}분';
  }

  void _openTimer() {
    pushLaunchpad(
      context,
      (context) => StudyTimerScreen(
        studentId: widget.studentId,
        studentName: widget.studentName,
        grade: widget.grade,
      ),
    );
  }

  /// 넓은 화면(웹 데스크톱)에서 내용이 양옆으로 늘어지지 않게 가운데 최대 560 폭으로 맞춘다.
  double _sidePad(BuildContext context) {
    final width = MediaQuery.of(context).size.width;
    return ((width - 560) / 2).clamp(16.0, double.infinity);
  }

  @override
  Widget build(BuildContext context) {
    return ListenableBuilder(
      listenable: _controller,
      builder: (context, _) {
        final members = _controller.members;
        final attendedCount = members
            .where((m) => m['attendedToday'] == true)
            .length;

        return Scaffold(
          backgroundColor: AppPalette.mist,
          appBar: AppBar(
            backgroundColor: Colors.transparent,
            foregroundColor: AppPalette.ink,
            elevation: 0,
            actions: [
              if (_controller.isOwner)
                IconButton(
                  icon: Icon(
                    _controller.isPublic
                        ? Icons.public_rounded
                        : Icons.lock_rounded,
                  ),
                  tooltip: _controller.isPublic ? '공개 그룹' : '비공개 그룹',
                  onPressed: _toggleVisibility,
                ),
              IconButton(
                icon: const Icon(Icons.exit_to_app_rounded),
                tooltip: '그룹 나가기',
                onPressed: _leave,
              ),
            ],
          ),
          floatingActionButton: FloatingActionButton.extended(
            backgroundColor: AppPalette.ink,
            foregroundColor: AppPalette.paper,
            onPressed: _showInviteSheet,
            icon: const Icon(Icons.person_add_rounded),
            label: const Text('친구 초대'),
          ),
          body: _controller.isLoading
              ? const Center(child: CircularProgressIndicator())
              : RefreshIndicator(
                  onRefresh: _controller.refresh,
                  child: ListView(
                    padding: EdgeInsets.fromLTRB(
                      _sidePad(context),
                      0,
                      _sidePad(context),
                      90,
                    ),
                    children: [
                      Center(child: TitlePill(widget.groupName)),
                      const SizedBox(height: 16),
                      Row(
                        children: [
                          Expanded(child: _statPill('전체 멤버', members.length)),
                          const SizedBox(width: 8),
                          Expanded(child: _statPill('오늘 공부함', attendedCount)),
                        ],
                      ),
                      const SizedBox(height: 12),
                      SizedBox(
                        width: double.infinity,
                        child: OutlinedButton.icon(
                          onPressed: _openTimer,
                          icon: const Icon(Icons.timer_rounded),
                          label: const Text('백품타 바로가기'),
                          style: OutlinedButton.styleFrom(
                            foregroundColor: AppPalette.ink,
                            side: const BorderSide(color: AppPalette.sage),
                            padding: const EdgeInsets.symmetric(vertical: 14),
                            shape: RoundedRectangleBorder(
                              borderRadius: BorderRadius.circular(16),
                            ),
                          ),
                        ),
                      ),
                      if (_controller.isOwner &&
                          _controller.joinRequests.isNotEmpty) ...[
                        const SizedBox(height: 20),
                        Row(
                          children: [
                            Container(
                              width: 4,
                              height: 16,
                              decoration: BoxDecoration(
                                color: AppPalette.ink,
                                borderRadius: BorderRadius.circular(2),
                              ),
                            ),
                            const SizedBox(width: 8),
                            const Text(
                              '대기 중인 참여 신청',
                              style: TextStyle(
                                fontSize: 16,
                                fontWeight: FontWeight.bold,
                                color: AppPalette.ink,
                              ),
                            ),
                            const SizedBox(width: 6),
                            Text(
                              '${_controller.joinRequests.length}명',
                              style: TextStyle(
                                fontSize: 13,
                                color: Colors.grey[500],
                              ),
                            ),
                          ],
                        ),
                        const SizedBox(height: 10),
                        for (final r in _controller.joinRequests)
                          Container(
                            margin: const EdgeInsets.only(bottom: 8),
                            padding: const EdgeInsets.symmetric(
                              horizontal: 16,
                              vertical: 12,
                            ),
                            decoration: BoxDecoration(
                              color: AppPalette.paper,
                              borderRadius: BorderRadius.circular(16),
                              border: Border.all(color: AppPalette.sage),
                            ),
                            child: Row(
                              children: [
                                Expanded(
                                  child: Text(
                                    '${r['name']} (${r['studentId']})',
                                    style: const TextStyle(
                                      fontWeight: FontWeight.bold,
                                    ),
                                  ),
                                ),
                                TextButton(
                                  onPressed: () => _respondJoinRequest(
                                    r['requestId'] as int,
                                    false,
                                  ),
                                  child: const Text(
                                    '거절',
                                    style: TextStyle(color: Colors.grey),
                                  ),
                                ),
                                ElevatedButton(
                                  style: ElevatedButton.styleFrom(
                                    backgroundColor: AppPalette.ink,
                                    foregroundColor: AppPalette.paper,
                                  ),
                                  onPressed: () => _respondJoinRequest(
                                    r['requestId'] as int,
                                    true,
                                  ),
                                  child: const Text('허용'),
                                ),
                              ],
                            ),
                          ),
                      ],
                      const SizedBox(height: 20),
                      Row(
                        children: [
                          Container(
                            width: 4,
                            height: 16,
                            decoration: BoxDecoration(
                              color: AppPalette.ink,
                              borderRadius: BorderRadius.circular(2),
                            ),
                          ),
                          const SizedBox(width: 8),
                          const Text(
                            '오늘 출석 현황',
                            style: TextStyle(
                              fontSize: 16,
                              fontWeight: FontWeight.bold,
                              color: AppPalette.ink,
                            ),
                          ),
                        ],
                      ),
                      const SizedBox(height: 10),
                      GridView.builder(
                        shrinkWrap: true,
                        physics: const NeverScrollableScrollPhysics(),
                        gridDelegate:
                            const SliverGridDelegateWithMaxCrossAxisExtent(
                              maxCrossAxisExtent: 150,
                              mainAxisSpacing: 10,
                              crossAxisSpacing: 10,
                              mainAxisExtent: 96,
                            ),
                        itemCount: members.length,
                        itemBuilder: (context, index) {
                          final m = members[index];
                          final attended = m['attendedToday'] == true;
                          return Container(
                            padding: const EdgeInsets.all(10),
                            decoration: BoxDecoration(
                              color: attended
                                  ? AppPalette.ink
                                  : AppPalette.paper,
                              borderRadius: BorderRadius.circular(16),
                              border: Border.all(
                                color: attended
                                    ? AppPalette.ink
                                    : AppPalette.sage,
                              ),
                            ),
                            child: Column(
                              crossAxisAlignment: CrossAxisAlignment.start,
                              children: [
                                Icon(
                                  attended
                                      ? Icons.check_circle_rounded
                                      : Icons.radio_button_unchecked_rounded,
                                  color: attended
                                      ? Colors.white
                                      : Colors.grey[350],
                                  size: 18,
                                ),
                                const Spacer(),
                                Text(
                                  '${m['name']}',
                                  maxLines: 1,
                                  overflow: TextOverflow.ellipsis,
                                  style: TextStyle(
                                    fontWeight: FontWeight.bold,
                                    fontSize: 13,
                                    color: attended
                                        ? Colors.white
                                        : AppPalette.ink,
                                  ),
                                ),
                                if (m['role'] == 'owner')
                                  Text(
                                    '그룹장',
                                    style: TextStyle(
                                      fontSize: 10,
                                      color: attended
                                          ? Colors.white70
                                          : Colors.grey[500],
                                    ),
                                  ),
                                const SizedBox(height: 2),
                                Text(
                                  _formatMinutes(
                                    (m['todaySeconds'] as num?)?.toInt() ?? 0,
                                  ),
                                  style: TextStyle(
                                    fontSize: 11,
                                    color: attended
                                        ? Colors.white70
                                        : Colors.grey[500],
                                  ),
                                ),
                              ],
                            ),
                          );
                        },
                      ),
                    ],
                  ),
                ),
        );
      },
    );
  }

  Widget _statPill(String label, int count) {
    return Container(
      padding: const EdgeInsets.symmetric(vertical: 14, horizontal: 16),
      decoration: BoxDecoration(
        color: AppPalette.paper,
        borderRadius: BorderRadius.circular(28),
        border: Border.all(color: AppPalette.sage),
      ),
      child: Column(
        children: [
          Text(label, style: TextStyle(fontSize: 12, color: Colors.grey[600])),
          const SizedBox(height: 4),
          Text(
            '$count명',
            style: const TextStyle(
              fontSize: 18,
              fontWeight: FontWeight.bold,
              color: AppPalette.ink,
            ),
          ),
        ],
      ),
    );
  }
}