import 'package:app/core/ui/panel.dart';
import 'package:app/modules/settings/modules/app/app_settings_view.dart';
import 'package:flutter/material.dart';

class SettingsView extends StatelessWidget {
  const SettingsView({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Einstellungen')),
      body: PanelNavigator(rootBuilder: (ctx) => _CategoryList()),
    );
  }
}

/// ----------------- Root panel: Category list -----------------
class _CategoryList extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final scheme = Theme.of(context).colorScheme;

    Widget tile(IconData icon, String label, Widget Function() detail) {
      return Padding(
        padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 4),
        child: InkWell(
          borderRadius: BorderRadius.circular(14),
          onTap: () => context.panels.push((_) => detail(), title: label),
          child: Container(
            padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 10),
            decoration: BoxDecoration(
              color: Colors.transparent,
              borderRadius: BorderRadius.circular(14),
            ),
            child: Row(
              children: [
                Icon(icon),
                const SizedBox(width: 12),
                Expanded(child: Text(label)),
                Icon(Icons.chevron_right, color: scheme.outline),
              ],
            ),
          ),
        ),
      );
    }

    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        const _SectionHeader('App-Einstellungen'),
        tile(Icons.tune, 'App-Einstellungen', () => const AppSettingsView()),
        const SizedBox(height: 12),

        const _SectionHeader('Meine Daten'),
        tile(
          Icons.badge_outlined,
          'Persönliche Daten',
          () => const _PersonalPanel(),
        ),
        tile(
          Icons.manage_accounts_outlined,
          'Kontoverwaltung',
          () => const _AccountPanel(),
        ),
        tile(
          Icons.security_outlined,
          'Sicherheit',
          () => const _SecurityPanel(),
        ),
        const SizedBox(height: 12),

        const _SectionHeader('Hilfe'),
        tile(Icons.help_outline, 'Hilfe', () => const _HelpPanel()),
        tile(Icons.feedback_outlined, 'Feedback', () => const _FeedbackPanel()),
        tile(
          Icons.gavel_outlined,
          'Rechtliches & Datenschutz',
          () => const _LegalPanel(),
        ),
        const SizedBox(height: 24),

        const Divider(),
        ListTile(
          leading: const Icon(Icons.logout),
          title: const Text('Abmelden'),
          onTap: () {
            ScaffoldMessenger.of(context).showSnackBar(
              const SnackBar(
                content: Text('Logout… (noch nicht implementiert)'),
              ),
            );
          },
        ),
      ],
    );
  }
}

class _SectionHeader extends StatelessWidget {
  final String text;

  const _SectionHeader(this.text);

  @override
  Widget build(BuildContext context) => Padding(
    padding: const EdgeInsets.fromLTRB(16, 12, 16, 6),
    child: Text(
      text,
      style: Theme.of(context).textTheme.labelMedium?.copyWith(
        fontWeight: FontWeight.w700,
        letterSpacing: .2,
      ),
    ),
  );
}

/// ----------------- Detail panels (unchanged) -----------------

class _PersonalPanel extends StatelessWidget {
  const _PersonalPanel();

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        // const PanelHeader(title: 'Persönliche Daten'),
        Expanded(
          child: ListView(
            padding: const EdgeInsets.all(16),
            children: const [
              ListTile(
                leading: Icon(Icons.person_outline),
                title: Text('Name'),
                subtitle: Text('Max Mustermann'),
              ),
            ],
          ),
        ),
      ],
    );
  }
}

class _AccountPanel extends StatelessWidget {
  const _AccountPanel();

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        // const PanelHeader(title: 'Kontoverwaltung'),
        Expanded(
          child: ListView(
            padding: const EdgeInsets.all(16),
            children: const [
              ListTile(
                leading: Icon(Icons.alternate_email),
                title: Text('E-Mail'),
                subtitle: Text('max@example.com'),
              ),
            ],
          ),
        ),
      ],
    );
  }
}

class _SecurityPanel extends StatelessWidget {
  const _SecurityPanel();

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        // const PanelHeader(title: 'Sicherheit'),
        Expanded(
          child: ListView(
            padding: const EdgeInsets.all(16),
            children: const [
              ListTile(
                leading: Icon(Icons.lock_outline),
                title: Text('Passwort ändern'),
              ),
              ListTile(
                leading: Icon(Icons.phonelink_lock),
                title: Text('2-Faktor-Authentifizierung'),
                subtitle: Text('Aus'),
              ),
            ],
          ),
        ),
      ],
    );
  }
}

class _HelpPanel extends StatelessWidget {
  const _HelpPanel();

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        // const PanelHeader(title: 'Hilfe'),
        Expanded(
          child: ListView(
            padding: const EdgeInsets.all(16),
            children: const [
              ListTile(leading: Icon(Icons.help_outline), title: Text('FAQ')),
            ],
          ),
        ),
      ],
    );
  }
}

class _FeedbackPanel extends StatelessWidget {
  const _FeedbackPanel();

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        // const PanelHeader(title: 'Feedback'),
        Expanded(
          child: ListView(
            padding: const EdgeInsets.all(16),
            children: const [
              ListTile(
                leading: Icon(Icons.feedback_outlined),
                title: Text('Feedback senden'),
              ),
            ],
          ),
        ),
      ],
    );
  }
}

class _LegalPanel extends StatelessWidget {
  const _LegalPanel();

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        // const PanelHeader(title: 'Rechtliches & Datenschutz'),
        Expanded(
          child: ListView(
            padding: const EdgeInsets.all(16),
            children: const [
              ListTile(
                leading: Icon(Icons.privacy_tip_outlined),
                title: Text('Datenschutz'),
              ),
              ListTile(
                leading: Icon(Icons.article_outlined),
                title: Text('Nutzungsbedingungen'),
              ),
            ],
          ),
        ),
      ],
    );
  }
}