import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:go_router/go_router.dart';
// showcaseview removed due to null-safety incompatibility; onboarding shown via dialog

import '../providers/auth_provider.dart';
import '../providers/notifications_provider.dart';
import '../providers/profile_provider.dart';
import 'app_breakpoints.dart';

final GlobalKey notificationBellKey = GlobalKey();

class AppScaffold extends ConsumerWidget {
  const AppScaffold({super.key, required this.child});

  final Widget child;

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final profileAsync = ref.watch(currentProfileProvider);
    final role = profileAsync.maybeWhen(
      data: (profile) => profile?.role ?? 'standard',
      orElse: () => 'standard',
    );
    final displayName = profileAsync.maybeWhen(
      data: (profile) {
        final name = profile?.fullName.trim() ?? '';
        return name.isNotEmpty ? name : 'User';
      },
      orElse: () => 'User',
    );

    final isStandard = role == 'standard';
    final location = GoRouterState.of(context).uri.toString();
    final sections = _buildSections(role);

    final width = MediaQuery.of(context).size.width;
    final showRail = width >= AppBreakpoints.tablet;
    final isExtended = width >= AppBreakpoints.desktop;

    final railItems = _flattenSections(
      sections,
    ).where((item) => !item.isLogout).toList();
    final primaryItems = _primaryItemsForRole(role);
    final mobilePrimary = _mobilePrimaryItems(primaryItems);
    final overflowItems = _overflowItems(railItems, mobilePrimary);

    return Scaffold(
      appBar: AppBar(
        title: Row(
          children: [
            const Icon(Icons.memory),
            const SizedBox(width: 8),
            Text('TasQ'),
          ],
        ),
        actions: [
          if (isStandard)
            PopupMenuButton<int>(
              tooltip: 'Account',
              onSelected: (value) {
                if (value == 0) {
                  context.go('/profile');
                } else if (value == 1) {
                  ref.read(authControllerProvider).signOut();
                }
              },
              itemBuilder: (context) => const [
                PopupMenuItem(value: 0, child: Text('My profile')),
                PopupMenuItem(value: 1, child: Text('Sign out')),
              ],
              child: Padding(
                padding: const EdgeInsets.symmetric(horizontal: 12),
                child: Row(
                  children: [
                    const Icon(Icons.account_circle),
                    const SizedBox(width: 8),
                    Text(displayName),
                    const SizedBox(width: 4),
                    const Icon(Icons.expand_more),
                  ],
                ),
              ),
            )
          else
            Row(
              mainAxisSize: MainAxisSize.min,
              children: [
                IconButton(
                  tooltip: 'Profile',
                  onPressed: () => context.go('/profile'),
                  icon: const Icon(Icons.account_circle),
                ),
                IconButton(
                  tooltip: 'Sign out',
                  onPressed: () => ref.read(authControllerProvider).signOut(),
                  icon: const Icon(Icons.logout),
                ),
              ],
            ),
          const _NotificationBell(),
        ],
      ),
      bottomNavigationBar: showRail
          ? null
          : AppBottomNav(
              location: location,
              items: _mobileNavItems(mobilePrimary, overflowItems),
              onShowMore: overflowItems.isEmpty
                  ? null
                  : () => _showOverflowSheet(
                      context,
                      overflowItems,
                      () => ref.read(authControllerProvider).signOut(),
                    ),
            ),
      body: LayoutBuilder(
        builder: (context, constraints) {
          final railWidth = showRail ? (isExtended ? 256.0 : 80.0) : 0.0;
          return Stack(
            children: [
              Positioned.fill(
                left: railWidth,
                child: _ShellBackground(child: child),
              ),
              if (showRail)
                Positioned(
                  left: 0,
                  top: 0,
                  bottom: 0,
                  width: railWidth,
                  child: AppNavigationRail(
                    items: railItems,
                    location: location,
                    extended: isExtended,
                    displayName: displayName,
                    onLogout: () => ref.read(authControllerProvider).signOut(),
                  ),
                ),
            ],
          );
        },
      ),
    );
  }
}

class AppNavigationRail extends StatelessWidget {
  const AppNavigationRail({
    super.key,
    required this.items,
    required this.location,
    required this.extended,
    required this.displayName,
    required this.onLogout,
  });

  final List<NavItem> items;
  final String location;
  final bool extended;
  final String displayName;
  final VoidCallback onLogout;

  @override
  Widget build(BuildContext context) {
    final currentIndex = _currentIndex(location, items);
    return Container(
      decoration: BoxDecoration(
        color: Theme.of(context).colorScheme.surface,
        border: Border(
          right: BorderSide(
            color: Theme.of(context).colorScheme.outlineVariant,
          ),
        ),
      ),
      child: NavigationRail(
        extended: extended,
        selectedIndex: currentIndex,
        onDestinationSelected: (value) {
          items[value].onTap(context, onLogout: onLogout);
        },
        leading: const SizedBox.shrink(),
        trailing: const SizedBox.shrink(),
        destinations: [
          for (final item in items)
            NavigationRailDestination(
              icon: Icon(item.icon),
              selectedIcon: Icon(item.selectedIcon ?? item.icon),
              label: Text(item.label),
            ),
        ],
      ),
    );
  }
}

class AppBottomNav extends StatelessWidget {
  const AppBottomNav({
    super.key,
    required this.location,
    required this.items,
    this.onShowMore,
  });

  final String location;
  final List<NavItem> items;
  final VoidCallback? onShowMore;

  @override
  Widget build(BuildContext context) {
    final index = _currentIndex(location, items);
    return NavigationBar(
      selectedIndex: index,
      onDestinationSelected: (value) {
        final item = items[value];
        if (item.isOverflow) {
          onShowMore?.call();
          return;
        }
        item.onTap(context);
      },
      destinations: [
        for (final item in items)
          NavigationDestination(
            icon: Icon(item.icon),
            selectedIcon: Icon(item.selectedIcon ?? item.icon),
            label: item.label,
          ),
      ],
    );
  }
}

class _NotificationBell extends ConsumerWidget {
  const _NotificationBell();

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final unreadCount = ref.watch(unreadNotificationsCountProvider);
    return IconButton(
      tooltip: 'Notifications',
      onPressed: () => context.go('/notifications'),
      icon: Stack(
        clipBehavior: Clip.none,
        children: [
          const Icon(Icons.notifications),
          if (unreadCount > 0)
            const Positioned(
              right: -2,
              top: -2,
              child: Icon(Icons.circle, size: 10, color: Colors.red),
            ),
        ],
      ),
    );
  }
}

class _ShellBackground extends StatelessWidget {
  const _ShellBackground({required this.child});

  final Widget child;

  @override
  Widget build(BuildContext context) {
    return Container(
      decoration: BoxDecoration(
        gradient: LinearGradient(
          begin: Alignment.topLeft,
          end: Alignment.bottomRight,
          colors: [
            Theme.of(context).colorScheme.surface,
            Theme.of(context).colorScheme.surfaceContainerLowest,
          ],
        ),
      ),
      child: child,
    );
  }
}

class NavItem {
  NavItem({
    required this.label,
    required this.route,
    required this.icon,
    this.selectedIcon,
    this.isLogout = false,
    this.isOverflow = false,
  });

  final String label;
  final String route;
  final IconData icon;
  final IconData? selectedIcon;
  final bool isLogout;
  final bool isOverflow;

  void onTap(BuildContext context, {VoidCallback? onLogout}) {
    if (isLogout) {
      onLogout?.call();
      return;
    }
    if (route.isNotEmpty) {
      context.go(route);
    }
  }
}

class NavSection {
  NavSection({this.label, required this.items});

  final String? label;
  final List<NavItem> items;
}

List<NavSection> _buildSections(String role) {
  final mainItems = [
    NavItem(
      label: 'Dashboard',
      route: '/dashboard',
      icon: Icons.grid_view,
      selectedIcon: Icons.grid_view_rounded,
    ),
    NavItem(
      label: 'Tickets',
      route: '/tickets',
      icon: Icons.support_agent_outlined,
      selectedIcon: Icons.support_agent,
    ),
    NavItem(
      label: 'Tasks',
      route: '/tasks',
      icon: Icons.task_outlined,
      selectedIcon: Icons.task,
    ),
    NavItem(
      label: 'Events',
      route: '/events',
      icon: Icons.event_outlined,
      selectedIcon: Icons.event,
    ),
    NavItem(
      label: 'Announcement',
      route: '/announcements',
      icon: Icons.campaign_outlined,
      selectedIcon: Icons.campaign,
    ),
    NavItem(
      label: 'Workforce',
      route: '/workforce',
      icon: Icons.groups_outlined,
      selectedIcon: Icons.groups,
    ),
    NavItem(
      label: 'Reports',
      route: '/reports',
      icon: Icons.analytics_outlined,
      selectedIcon: Icons.analytics,
    ),
  ];

  if (role == 'admin' || role == 'dispatcher') {
    return [
      NavSection(label: 'Operations', items: mainItems),
      NavSection(
        label: 'Settings',
        items: [
          NavItem(
            label: 'User Management',
            route: '/settings/users',
            icon: Icons.admin_panel_settings_outlined,
            selectedIcon: Icons.admin_panel_settings,
          ),
          NavItem(
            label: 'Office Management',
            route: '/settings/offices',
            icon: Icons.apartment_outlined,
            selectedIcon: Icons.apartment,
          ),
          NavItem(
            label: 'Geofence test',
            route: '/settings/geofence-test',
            icon: Icons.map_outlined,
            selectedIcon: Icons.map,
          ),
          NavItem(
            label: 'IT Staff Teams',
            route: '/settings/teams',
            icon: Icons.groups_2_outlined,
            selectedIcon: Icons.groups_2,
          ),
          NavItem(
            label: 'Permissions',
            route: '/settings/permissions',
            icon: Icons.lock_open,
            selectedIcon: Icons.lock,
          ),
          NavItem(
            label: 'Logout',
            route: '',
            icon: Icons.logout,
            isLogout: true,
          ),
        ],
      ),
    ];
  }

  // non-admin users still get a simple Settings section containing only
  // permissions.  this keeps the screen accessible without exposing the
  // administrative management screens.
  return [
    NavSection(label: 'Operations', items: mainItems),
    NavSection(
      label: 'Settings',
      items: [
        NavItem(
          label: 'Permissions',
          route: '/settings/permissions',
          icon: Icons.lock_open,
          selectedIcon: Icons.lock,
        ),
      ],
    ),
  ];
}

List<NavItem> _standardNavItems() {
  return [
    NavItem(
      label: 'Dashboard',
      route: '/dashboard',
      icon: Icons.grid_view,
      selectedIcon: Icons.grid_view_rounded,
    ),
    NavItem(
      label: 'Tickets',
      route: '/tickets',
      icon: Icons.support_agent_outlined,
      selectedIcon: Icons.support_agent,
    ),
    NavItem(
      label: 'Tasks',
      route: '/tasks',
      icon: Icons.task_outlined,
      selectedIcon: Icons.task,
    ),
    NavItem(
      label: 'Events',
      route: '/events',
      icon: Icons.event_outlined,
      selectedIcon: Icons.event,
    ),
  ];
}

List<NavItem> _primaryItemsForRole(String role) {
  if (role == 'admin') {
    return [
      NavItem(
        label: 'Dashboard',
        route: '/dashboard',
        icon: Icons.grid_view_outlined,
        selectedIcon: Icons.grid_view_rounded,
      ),
      NavItem(
        label: 'Tickets',
        route: '/tickets',
        icon: Icons.support_agent_outlined,
        selectedIcon: Icons.support_agent,
      ),
      NavItem(
        label: 'Tasks',
        route: '/tasks',
        icon: Icons.task_outlined,
        selectedIcon: Icons.task,
      ),
      NavItem(
        label: 'Workforce',
        route: '/workforce',
        icon: Icons.groups_outlined,
        selectedIcon: Icons.groups,
      ),
      NavItem(
        label: 'Reports',
        route: '/reports',
        icon: Icons.analytics_outlined,
        selectedIcon: Icons.analytics,
      ),
    ];
  }
  return _standardNavItems();
}

List<NavItem> _mobileNavItems(List<NavItem> primary, List<NavItem> overflow) {
  if (overflow.isEmpty) {
    return primary;
  }
  return [
    ...primary,
    NavItem(label: 'More', route: '', icon: Icons.more_horiz, isOverflow: true),
  ];
}

List<NavItem> _mobilePrimaryItems(List<NavItem> primary) {
  if (primary.length <= 4) {
    return primary;
  }
  return primary.take(4).toList();
}

List<NavItem> _flattenSections(List<NavSection> sections) {
  return [for (final section in sections) ...section.items];
}

List<NavItem> _overflowItems(List<NavItem> all, List<NavItem> primary) {
  final primaryRoutes = primary.map((item) => item.route).toSet();
  return all
      .where(
        (item) =>
            !item.isLogout &&
            item.route.isNotEmpty &&
            !primaryRoutes.contains(item.route),
      )
      .toList();
}

Future<void> _showOverflowSheet(
  BuildContext context,
  List<NavItem> items,
  VoidCallback onLogout,
) async {
  await showModalBottomSheet<void>(
    context: context,
    showDragHandle: true,
    builder: (context) {
      return SafeArea(
        child: ListView(
          padding: const EdgeInsets.all(16),
          children: [
            for (final item in items)
              ListTile(
                leading: Icon(item.icon),
                title: Text(item.label),
                onTap: () {
                  Navigator.of(context).pop();
                  item.onTap(context, onLogout: onLogout);
                },
              ),
          ],
        ),
      );
    },
  );
}

bool _isSelected(String location, String route) {
  if (route.isEmpty) return false;
  if (location == route) return true;
  return location.startsWith('$route/');
}

int _currentIndex(String location, List<NavItem> items) {
  final index = items.indexWhere((item) => _isSelected(location, item.route));
  if (index != -1) return index;
  final overflowIndex = items.indexWhere((item) => item.isOverflow);
  return overflowIndex == -1 ? 0 : overflowIndex;
}
