import 'package:flutter/material.dart';
import 'package:go_router/go_router.dart';
import 'package:shared_preferences/shared_preferences.dart';

import '../../auth_state.dart';
import '../../models/responsive_policy.dart';

class MoreScreen extends StatefulWidget {
  const MoreScreen({super.key});

  @override
  State<MoreScreen> createState() => _MoreScreenState();
}

class _MoreScreenState extends State<MoreScreen> {
  late SharedPreferences _prefs;

  @override
  void initState() {
    super.initState();
    _initPrefs();
  }

  Future<void> _initPrefs() async {
    _prefs = await SharedPreferences.getInstance();
  }

  void _showLogoutDialog() {
    showDialog(
      context: context,
      builder: (BuildContext dialogContext) {
        return AlertDialog(
          shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.circular(16),
          ),
          title: const Text('Confirm Logout'),
          content: const Text('Are you sure you want to log out?'),
          actions: <Widget>[
            TextButton(
              child: const Text('Cancel'),
              onPressed: () {
                Navigator.of(dialogContext).pop();
              },
            ),
            TextButton(
              child: const Text('Logout'),
              onPressed: () {
                Navigator.of(dialogContext).pop();
                _prefs.clear();
                authState.refresh();
                context.go("/");
              },
            ),
          ],
        );
      },
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('More'), centerTitle: false),
      body: Center(
        child: LayoutBuilder(
          builder: (context, constraints) {
            final maxWidth = constraints.maxWidth > ResponsivePolicy.md
                ? 600.0
                : double.infinity;

            return SizedBox(
              width: maxWidth,
              child: ListView(
                padding: const EdgeInsets.all(16),
                children: [
                  _NavOptionTile(
                    icon: Icons.swap_horiz,
                    title: 'Change Workspace',
                    subtitle: 'Switch to a different workspace',
                    onTap: () => context.go('/workspace'),
                  ),
                  _NavOptionTile(
                    icon: Icons.people_outline,
                    title: 'Users',
                    subtitle: 'Manage users and permissions',
                    onTap: () => context.go('/users'),
                  ),
                  _NavOptionTile(
                    icon: Icons.monitor_heart_outlined,
                    title: 'Uptime Status',
                    subtitle: 'View system uptime and service status',
                    onTap: () => context.push('/uptime'),
                  ),
                  _NavOptionTile(
                    icon: Icons.support_agent_rounded,
                    title: 'Contact Us',
                    subtitle: 'Get in touch with our team',
                    onTap: () => context.push('/contact'),
                  ),
                  _NavOptionTile(
                    icon: Icons.delete_forever_outlined,
                    title: 'Request Account Deletion',
                    subtitle: 'Permanently delete your account and data',
                    onTap: () => context.push('/delete-account'),
                  ),
                  const SizedBox(height: 8),
                  _NavOptionTile(
                    icon: Icons.logout,
                    title: 'Logout',
                    subtitle: 'Sign out of your account',
                    onTap: () => _showLogoutDialog(),
                  ),
                ],
              ),
            );
          },
        ),
      ),
    );
  }
}

class _NavOptionTile extends StatelessWidget {
  const _NavOptionTile({
    required this.icon,
    required this.title,
    required this.subtitle,
    required this.onTap,
  });

  final IconData icon;
  final String title;
  final String subtitle;
  final VoidCallback onTap;

  @override
  Widget build(BuildContext context) {
    final theme = Theme.of(context);

    return ListTile(
      contentPadding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
      leading: Icon(icon, size: 28, color: theme.colorScheme.primary),
      title: Text(title, style: theme.textTheme.titleMedium),
      subtitle: Padding(
        padding: const EdgeInsets.only(top: 4),
        child: Text(subtitle, style: theme.textTheme.bodySmall),
      ),
      trailing: Icon(
        Icons.chevron_right,
        color: theme.colorScheme.onSurface.withAlpha(100),
      ),
      shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
      onTap: onTap,
    );
  }
}