import 'dart:async';
import 'dart:ui' show ImageFilter;

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

import '../../providers/home_banner_provider.dart';
import '../../providers/di_providers.dart';
import '../../providers/library_overview_provider.dart';
import '../../providers/server_provider.dart';
import '../../providers/session_provider.dart';
import '../../providers/shell_backdrop_provider.dart';
import '../../features/settings/settings_page.dart';
import '../../providers/tmdb_settings_provider.dart';
import '../../providers/sm_account_provider.dart';
import '../../providers/trakt_settings_provider.dart';
import '../theme/app_theme.dart';
import 'server_action_menu.dart';
import 'server_menu_item.dart';
import 'top_drag_area.dart';

const _kSidebarCollapsedKey = 'smplayer.sidebar_collapsed';

const double _kSidebarBlurSigma = 18;


class _SidebarPalette {
  final Color fg;
  final Color fgMuted;
  final Color fgFaint;
  final Color glassTint;
  final Color hairline;

  const _SidebarPalette({
    required this.fg,
    required this.fgMuted,
    required this.fgFaint,
    required this.glassTint,
    required this.hairline,
  });

  static const dark = _SidebarPalette(
    fg: Colors.white,
    fgMuted: Color(0x99FFFFFF),
    fgFaint: Color(0x66FFFFFF),
    glassTint: Color(0x42000000),
    hairline: Color(0x14FFFFFF),
  );

  static const light = _SidebarPalette(
    fg: Color(0xFF1A1A1A),
    fgMuted: Color(0x99000000),
    fgFaint: Color(0x59000000),
    glassTint: Color(0x8CFFFFFF),
    hairline: Color(0x0F000000),
  );

  static const darkSurface = _SidebarPalette(
    fg: Colors.white,
    fgMuted: Color(0x99FFFFFF),
    fgFaint: Color(0x66FFFFFF),
    glassTint: Color(0x14FFFFFF),
    hairline: Color(0x1FFFFFFF),
  );
}

final sidebarCollapsedProvider = StateProvider<bool>((ref) => false);

Future<void> initSidebarState(WidgetRef ref) async {
  final prefs = await SharedPreferences.getInstance();
  final collapsed = prefs.getBool(_kSidebarCollapsedKey) ?? false;
  ref.read(sidebarCollapsedProvider.notifier).state = collapsed;
}

Future<void> _persistSidebarState(bool collapsed) async {
  final prefs = await SharedPreferences.getInstance();
  await prefs.setBool(_kSidebarCollapsedKey, collapsed);
}

class Sidebar extends ConsumerStatefulWidget {


  final int selectedBranchIndex;


  final void Function(int index, {bool initialLocation}) onNavigateBranch;


  final bool immersiveRoute;


  final String location;

  const Sidebar({
    super.key,
    required this.selectedBranchIndex,
    required this.onNavigateBranch,
    required this.location,
    this.immersiveRoute = false,
  });

  @override
  ConsumerState<Sidebar> createState() => _SidebarState();
}

class _SidebarState extends ConsumerState<Sidebar> {
  bool _suppressBlur = false;
  Timer? _blurTimer;

  @override
  void dispose() {
    _blurTimer?.cancel();
    super.dispose();
  }

  void _onCollapseToggled() {
    setState(() => _suppressBlur = true);
    _blurTimer?.cancel();
    _blurTimer = Timer(const Duration(milliseconds: 300), () {
      if (mounted) setState(() => _suppressBlur = false);
    });
  }

  Widget _frostedGlass({required bool suppressBlur, required Widget child}) {
    return BackdropFilter(
      enabled: !suppressBlur,
      filter: ImageFilter.blur(
        sigmaX: _kSidebarBlurSigma,
        sigmaY: _kSidebarBlurSigma,
      ),
      child: child,
    );
  }

  @override
  Widget build(BuildContext context) {
    ref.listen<bool>(sidebarCollapsedProvider, (prev, next) {
      if (prev != next) _onCollapseToggled();
    });
    final theme = Theme.of(context);
    final tokens = context.appTokens;
    final hasBackdrop = ref.watch(
      shellBackdropProvider.select((s) => s != null),
    );
    final immersive = widget.immersiveRoute && hasBackdrop;
    final isDark = theme.brightness == Brightness.dark;
    final palette = immersive
        ? _SidebarPalette.dark
        : (isDark ? _SidebarPalette.darkSurface : _SidebarPalette.light);
    final collapsed = ref.watch(sidebarCollapsedProvider);
    final sessionState = ref.watch(sessionProvider);
    final servers = ref.watch(serverListProvider).value ?? const [];
    final serverById = {for (final s in servers) s.id: s};
    final iconUrlByServer = {for (final s in servers) s.id: s.iconUrl};
    final currentIndex = widget.selectedBranchIndex;
    final locationSegments = Uri.parse(widget.location).pathSegments;
    final activeModuleId =
        locationSegments.length > 1 && locationSegments.first == 'modules'
        ? locationSegments[1]
        : null;
    final sessionByServerId = {
      for (final session in sessionState.value?.sessions ?? const [])
        session.serverId: session,
    };
    final sessionList = [
      for (final server in servers)
        if (!server.paused && sessionByServerId[server.id] != null)
          sessionByServerId[server.id]!,
    ];
    final tmdbConfigured =
        ref.watch(tmdbSettingsProvider).value?.canRequest ?? false;
    final traktConnected =
        ref.watch(traktSettingsProvider).value?.isConnected ?? false;
    final smAccountLoggedIn =
        ref.watch(smAccountProvider).value?.loggedIn ?? false;
    final enabledScriptWidgets =
        (ref.watch(installedScriptWidgetsProvider).value ?? const [])
            .where((installedWidget) => installedWidget.enabled)
            .toList(growable: false);
    final width = collapsed
        ? tokens.siderWidthCollapsed
        : tokens.siderWidthExpanded;

    return RepaintBoundary(
      child: AnimatedContainer(
        duration: tokens.siderTransition,
        curve: Curves.easeOutCubic,
        width: width,
        child: ClipRect(
          child: _frostedGlass(
            suppressBlur: _suppressBlur,
            child: AnimatedContainer(
              duration: const Duration(milliseconds: 350),
              curve: Curves.easeOut,
              decoration: BoxDecoration(
                color: palette.glassTint,
                border: Border(
                  right: BorderSide(color: palette.hairline, width: 1),
                ),
              ),
              child: OverflowBox(
                alignment: Alignment.topLeft,
                minWidth: width,
                maxWidth: width,
                child: SizedBox(
                  width: width,
                  child: Padding(
                    padding: EdgeInsets.fromLTRB(
                      collapsed ? 8 : 16,
                      10,
                      collapsed ? 8 : 16,
                      10,
                    ),
                    child: LayoutBuilder(
                      builder: (context, constraints) {
                        final effectiveCollapsed = constraints.maxWidth < 100;
                        const settingsNavReserveHeight = 48.0;
                        final reservedBottomHeight =
                            (sessionList.isNotEmpty ||
                                    enabledScriptWidgets.isNotEmpty
                                ? 16.0
                                : 0.0) +
                            4.0 +
                            settingsNavReserveHeight;
                        final availableHeaderHeight =
                            constraints.maxHeight - reservedBottomHeight;
                        final maxHeaderHeight = constraints.maxHeight.isFinite
                            ? (availableHeaderHeight < 0
                                  ? 0.0
                                  : availableHeaderHeight)
                            : double.infinity;
                        return Column(
                          crossAxisAlignment: effectiveCollapsed
                              ? CrossAxisAlignment.center
                              : CrossAxisAlignment.start,
                          children: [
                            ConstrainedBox(
                              constraints: BoxConstraints(
                                maxHeight: maxHeaderHeight,
                              ),
                              child: SingleChildScrollView(
                                child: AnimatedSize(
                                  duration: const Duration(milliseconds: 200),
                                  curve: Curves.easeOutCubic,
                                  alignment: Alignment.topCenter,
                                  child: Column(
                                    mainAxisSize: MainAxisSize.min,
                                    crossAxisAlignment: effectiveCollapsed
                                        ? CrossAxisAlignment.center
                                        : CrossAxisAlignment.start,
                                    children: [
                                      _SidebarHeader(
                                        collapsed: effectiveCollapsed,
                                        palette: palette,
                                        onToggle: () {
                                          final next = !collapsed;
                                          ref
                                                  .read(
                                                    sidebarCollapsedProvider
                                                        .notifier,
                                                  )
                                                  .state =
                                              next;
                                          _persistSidebarState(next);
                                        },
                                      ),
                                      const SizedBox(height: 16),
                                      _buildSearchEntry(
                                        context,
                                        collapsed: effectiveCollapsed,
                                        palette: palette,
                                      ),
                                      const SizedBox(height: 12),
                                      _navItem(
                                        context,
                                        icon: Icons.dns_outlined,
                                        label: '服务器',
                                        selected: currentIndex == 1,
                                        collapsed: effectiveCollapsed,
                                        palette: palette,
                                        onTap: () => widget.onNavigateBranch(1),
                                      ),
                                      _navItem(
                                        context,
                                        icon: Icons.dashboard_outlined,
                                        label: '聚合视界',
                                        selected: currentIndex == 2,
                                        collapsed: effectiveCollapsed,
                                        palette: palette,
                                        onTap: () => widget.onNavigateBranch(2),
                                      ),
                                      if (tmdbConfigured)
                                        _navItem(
                                          context,
                                          icon: Icons.explore_outlined,
                                          label: '发现',
                                          selected: currentIndex == 3,
                                          collapsed: effectiveCollapsed,
                                          palette: palette,
                                          onTap: () =>
                                              widget.onNavigateBranch(3),
                                        ),
                                      if (smAccountLoggedIn && traktConnected)
                                        _navItem(
                                          context,
                                          icon: Icons.calendar_today_outlined,
                                          label: '日历',
                                          selected: currentIndex == 4,
                                          collapsed: effectiveCollapsed,
                                          palette: palette,
                                          onTap: () =>
                                              widget.onNavigateBranch(4),
                                        ),
                                    ],
                                  ),
                                ),
                              ),
                            ),
                            if (sessionList.isNotEmpty ||
                                enabledScriptWidgets.isNotEmpty) ...[
                              const SizedBox(height: 16),
                              Expanded(
                                child: SingleChildScrollView(
                                  child: Column(
                                    children: [
                                      ...sessionList.map(
                                        (session) => Padding(
                                          padding: const EdgeInsets.only(
                                            bottom: 4,
                                          ),
                                          child: Builder(
                                            builder: (context) {
                                              final server =
                                                  serverById[session.serverId];
                                              final actions =
                                                  buildServerActionCallbacks(
                                                    context: context,
                                                    ref: ref,
                                                    server: server,
                                                    session: session,
                                                  );
                                              return ServerMenuItem(
                                                serverName: session.serverName,
                                                iconUrl:
                                                    iconUrlByServer[session
                                                        .serverId] ??
                                                    '',
                                                isActive:
                                                    session.isActive &&
                                                    activeModuleId == null,
                                                collapsed: effectiveCollapsed,
                                                foregroundActive: palette.fg,
                                                foregroundInactive:
                                                    palette.fgMuted,
                                                onTap: () async {
                                                  if (!session.isActive) {
                                                    await ref
                                                        .read(
                                                          sessionProvider
                                                              .notifier,
                                                        )
                                                        .switchSession(
                                                          session.serverId,
                                                        );
                                                    widget.onNavigateBranch(
                                                      0,
                                                      initialLocation: true,
                                                    );
                                                    return;
                                                  }
                                                  if (widget.location == '/') {
                                                    await Future.wait([
                                                      ref
                                                          .read(
                                                            libraryOverviewProvider
                                                                .notifier,
                                                          )
                                                          .softRefresh(),
                                                      ref
                                                          .read(
                                                            homeBannerProvider
                                                                .notifier,
                                                          )
                                                          .softRefresh(),
                                                    ]);
                                                  } else {
                                                    widget.onNavigateBranch(
                                                      0,
                                                      initialLocation: true,
                                                    );
                                                  }
                                                },
                                                onChangeIcon:
                                                    actions.onChangeIcon,
                                                onEdit: actions.onEdit,
                                                onChangePassword:
                                                    actions.onChangePassword,
                                                onTogglePause:
                                                    actions.onTogglePause,
                                                onDelete: actions.onDelete,
                                              );
                                            },
                                          ),
                                        ),
                                      ),
                                      for (final installedWidget
                                          in enabledScriptWidgets)
                                        _navItem(
                                          context,
                                          icon: Icons.extension_rounded,
                                          label: installedWidget.manifest.title,
                                          selected:
                                              activeModuleId ==
                                              installedWidget.manifest.id,
                                          collapsed: effectiveCollapsed,
                                          palette: palette,


                                          onTap: () => context.go(
                                            '/modules/${Uri.encodeComponent(installedWidget.manifest.id)}',
                                          ),
                                        ),
                                    ],
                                  ),
                                ),
                              ),
                            ] else
                              const Spacer(),
                            const SizedBox(height: 4),
                            _navItem(
                              context,
                              icon: Icons.settings_outlined,
                              label: '设置',
                              selected: false,
                              collapsed: effectiveCollapsed,
                              palette: palette,
                              onTap: () => showSettingsDialog(context),
                            ),
                          ],
                        );
                      },
                    ),
                  ),
                ),
              ),
            ),
          ),
        ),
      ),
    );
  }

  Widget _buildSearchEntry(
    BuildContext context, {
    required bool collapsed,
    required _SidebarPalette palette,
  }) {
    final theme = Theme.of(context);

    if (collapsed) {
      return Tooltip(
        message: '搜索',
        preferBelow: false,
        child: GestureDetector(
          onTap: () => context.push('/global-search'),
          child: MouseRegion(
            cursor: SystemMouseCursors.click,
            child: SizedBox(
              width: 44,
              height: 38,
              child: Center(
                child: Icon(
                  Icons.search_outlined,
                  size: 20,
                  color: palette.fgFaint,
                ),
              ),
            ),
          ),
        ),
      );
    }

    return GestureDetector(
      onTap: () => context.push('/global-search'),
      child: MouseRegion(
        cursor: SystemMouseCursors.click,
        child: Padding(
          padding: const EdgeInsets.symmetric(horizontal: 4, vertical: 6),
          child: Row(
            children: [
              Icon(Icons.search_outlined, size: 18, color: palette.fgMuted),
              const SizedBox(width: 10),
              Expanded(
                child: Text(
                  '搜索',
                  style: theme.textTheme.bodySmall?.copyWith(
                    color: palette.fgMuted,
                  ),
                ),
              ),
              Text(
                '⌘K',
                style: theme.textTheme.labelSmall?.copyWith(
                  color: palette.fgFaint,
                  fontSize: 10,
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }

  Widget _navItem(
    BuildContext context, {
    required IconData icon,
    required String label,
    required bool selected,
    required bool collapsed,
    required _SidebarPalette palette,
    required VoidCallback onTap,
  }) {
    final theme = Theme.of(context);
    final foreground = selected ? palette.fg : palette.fgMuted;

    final child = GestureDetector(
      onTap: onTap,
      child: MouseRegion(
        cursor: SystemMouseCursors.click,
        child: Padding(
          padding: EdgeInsets.symmetric(
            horizontal: collapsed ? 0 : 4,
            vertical: 8,
          ),
          child: collapsed
              ? SizedBox(
                  width: 44,
                  child: Center(child: Icon(icon, size: 20, color: foreground)),
                )
              : Row(
                  children: [
                    Container(
                      width: 2,
                      height: 16,
                      margin: const EdgeInsets.only(right: 10),
                      decoration: BoxDecoration(
                        color: selected ? palette.fg : Colors.transparent,
                        borderRadius: BorderRadius.circular(1),
                      ),
                    ),
                    Icon(icon, size: 18, color: foreground),
                    const SizedBox(width: 10),
                    Expanded(
                      child: Text(
                        label,
                        maxLines: 1,
                        overflow: TextOverflow.ellipsis,
                        style: theme.textTheme.bodyMedium?.copyWith(
                          color: foreground,
                          fontWeight: selected
                              ? FontWeight.w600
                              : FontWeight.w400,
                        ),
                      ),
                    ),
                  ],
                ),
        ),
      ),
    );

    if (collapsed) {
      return Tooltip(
        message: label,
        preferBelow: false,
        child: Padding(padding: const EdgeInsets.only(bottom: 2), child: child),
      );
    }

    return Padding(padding: const EdgeInsets.only(bottom: 2), child: child);
  }
}

class _SidebarHeader extends StatelessWidget {
  final bool collapsed;
  final _SidebarPalette palette;
  final VoidCallback onToggle;

  const _SidebarHeader({
    required this.collapsed,
    required this.palette,
    required this.onToggle,
  });

  @override
  Widget build(BuildContext context) {
    final tokens = context.appTokens;

    if (collapsed) {
      return Column(
        children: [
          TopDragArea(
            child: SizedBox(
              width: double.infinity,
              height: tokens.titleBarHeight,
            ),
          ),
          const SizedBox(height: 4),
          GestureDetector(
            onTap: onToggle,
            child: MouseRegion(
              cursor: SystemMouseCursors.click,
              child: Icon(Icons.menu, size: 18, color: palette.fgFaint),
            ),
          ),
        ],
      );
    }

    return TopDragArea(
      child: SizedBox(
        height: tokens.titleBarHeight,
        child: Row(
          children: [
            const Spacer(),
            GestureDetector(
              onTap: onToggle,
              child: MouseRegion(
                cursor: SystemMouseCursors.click,
                child: Padding(
                  padding: const EdgeInsets.all(4),
                  child: Icon(Icons.menu, size: 18, color: palette.fgFaint),
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}