// contact_page.dart — 联系我们（desktop/tablet 一级页）
//
// 对照 ui_kits/desktop/dapp.jsx DContactView：渠道卡列表 + 服务时间。
// 演示渠道占位见 design/CLAUDE.md §8。
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';

import '../l10n/app_text.dart';
import '../pangolin_theme.dart';
import '../services/channel_launch.dart';
import '../services/contact_channels.dart';
import '../state/app_providers.dart';
import '../widgets/pangolin_icons.dart';

class ContactPage extends ConsumerWidget {
  const ContactPage({super.key});

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final c = context.pangolin;
    final t = ref.watch(appTextProvider);

    final channels = kContactChannels
        .map((ch) => (
              icon: ch.icon,
              name: switch (ch.nameKey) {
                'telegram' => 'Telegram',
                'email' => t.contactEmail,
                'website' => t.contactWebsite,
                _ => ch.nameKey,
              },
              sub: ch.sub,
              accent: ch.accent,
            ))
        .toList();

    return SingleChildScrollView(
      padding: const EdgeInsets.fromLTRB(32, 16, 32, 24),
      child: ConstrainedBox(
        constraints: const BoxConstraints(maxWidth: 560),
        child: Column(crossAxisAlignment: CrossAxisAlignment.stretch, children: [
          Text(t.contactIntro, style: PangolinText.sm.copyWith(color: c.fg2)),
          const SizedBox(height: 16),
          for (final ch in channels) ...[
            _ChannelCard(channel: ch),
            const SizedBox(height: 10),
          ],
          const SizedBox(height: 6),
          _HoursCard(t: t),
        ]),
      ),
    );
  }
}

class _ChannelCard extends StatelessWidget {
  const _ChannelCard({required this.channel});
  final ({IconData icon, String name, String sub, bool accent}) channel;

  @override
  Widget build(BuildContext context) {
    final c = context.pangolin;
    return GestureDetector(
      onTap: () => launchChannel(channel.sub),
      child: Container(
      padding: const EdgeInsets.all(14),
      decoration: BoxDecoration(
        color: c.surface,
        border: Border.all(color: c.border),
        borderRadius: BorderRadius.circular(PangolinRadius.lg),
        boxShadow: PangolinShadow.sm,
      ),
      child: Row(children: [
        Container(
          width: 38,
          height: 38,
          decoration: BoxDecoration(
            color: channel.accent ? c.accentSubtle : c.bgSubtle,
            borderRadius: BorderRadius.circular(PangolinRadius.md),
          ),
          child: Icon(channel.icon, size: 18, color: channel.accent ? c.accent : c.fg2),
        ),
        const SizedBox(width: 12),
        Expanded(
          child: Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
            Text(channel.name, style: PangolinText.body.copyWith(color: c.fg1, fontWeight: FontWeight.w600)),
            Text(channel.sub, style: PangolinText.caption.copyWith(color: c.fg3)),
          ]),
        ),
        Icon(PangolinIcons.chevronRight, size: 18, color: c.fg3),
      ]),
    ));
  }
}

class _HoursCard extends StatelessWidget {
  const _HoursCard({required this.t});
  final AppText t;

  @override
  Widget build(BuildContext context) {
    final c = context.pangolin;
    return Container(
      padding: const EdgeInsets.all(14),
      decoration: BoxDecoration(
        color: c.bgSubtle,
        borderRadius: BorderRadius.circular(PangolinRadius.lg),
      ),
      child: Row(children: [
        Icon(PangolinIcons.clock, size: 16, color: c.accent),
        const SizedBox(width: 10),
        Expanded(
          child: Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
            Text(t.contactHoursTitle, style: PangolinText.sm.copyWith(color: c.fg2, fontWeight: FontWeight.w600)),
            Text(t.contactHours, style: PangolinText.caption.copyWith(color: c.fg3)),
          ]),
        ),
      ]),
    );
  }
}