import 'package:flutter/material.dart';
import 'package:go_router/go_router.dart';
import 'package:material_symbols_icons/symbols.dart';

import '../i18n/strings.g.dart';
import 'seed_glyph.dart';
import 'theme.dart';

/// The app's navigation drawer (mockup 03). Inventory is live; the social items
/// (market, profile, chat…) belong to Block 2 and are shown disabled with a
/// "coming soon" tag so the roadmap is visible.
class AppDrawer extends StatelessWidget {
  const AppDrawer({super.key});

  @override
  Widget build(BuildContext context) {
    final t = context.t;
    return Drawer(
      backgroundColor: Colors.white,
      child: SafeArea(
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.stretch,
          children: [
            const _DrawerHeader(),
            _ActiveItem(
              icon: const SeedGlyph(SeedGlyphs.jars, size: 22),
              label: t.menu.inventory,
              onTap: () {
                Navigator.of(context).pop();
                context.go('/inventory');
              },
            ),
            _SoonItem(icon: Symbols.storefront, label: t.menu.market),
            const Divider(),
            _SoonItem(icon: Icons.person_outline, label: t.menu.profile),
            _SoonItem(icon: Icons.chat_bubble_outline, label: t.menu.chat),
            _SoonItem(icon: Icons.favorite_border, label: t.menu.wishlist),
            _SoonItem(icon: Icons.group_outlined, label: t.menu.following),
            const Spacer(),
            const Divider(),
            _ActiveItem(
              icon: const Icon(Icons.settings_outlined),
              label: t.menu.settings,
              onTap: () {
                Navigator.of(context).pop();
                context.go('/settings');
              },
            ),
          ],
        ),
      ),
    );
  }
}

class _DrawerHeader extends StatelessWidget {
  const _DrawerHeader();

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: const EdgeInsets.fromLTRB(16, 12, 16, 12),
      child: Row(
        children: [
          const Icon(Symbols.eco, color: seedGreen, size: 32),
          const SizedBox(width: 12),
          Text(
            context.t.app.title,
            style: Theme.of(context).textTheme.titleLarge?.copyWith(
              color: seedGreenDark,
              fontWeight: FontWeight.bold,
            ),
          ),
        ],
      ),
    );
  }
}

class _ActiveItem extends StatelessWidget {
  const _ActiveItem({
    required this.icon,
    required this.label,
    required this.onTap,
  });

  final Widget icon;
  final String label;
  final VoidCallback onTap;

  @override
  Widget build(BuildContext context) {
    return ListTile(
      leading: SizedBox(width: 24, child: Center(child: icon)),
      title: Text(label),
      onTap: onTap,
    );
  }
}

/// A disabled Block-2 destination with a subtle "coming soon" tag.
class _SoonItem extends StatelessWidget {
  const _SoonItem({required this.icon, required this.label});

  final IconData icon;
  final String label;

  @override
  Widget build(BuildContext context) {
    return ListTile(
      enabled: false,
      leading: Icon(icon),
      title: Text(label),
      trailing: Text(
        context.t.common.comingSoon,
        style: Theme.of(
          context,
        ).textTheme.labelSmall?.copyWith(color: Colors.black38),
      ),
    );
  }
}