import 'package:acter/common/providers/room_providers.dart';
import 'package:acter/common/providers/space_providers.dart';
import 'package:acter/router/routes.dart';
import 'package:acter/common/widgets/scrollable_list_tab_scroller.dart';
import 'package:acter/features/events/providers/event_providers.dart';
import 'package:acter/features/events/widgets/event_list_widget.dart';
import 'package:acter/features/pins/providers/pins_provider.dart';
import 'package:acter/features/pins/widgets/pin_list_widget.dart';
import 'package:acter/features/space/dialogs/suggested_rooms.dart';
import 'package:acter/features/space/providers/space_navbar_provider.dart';
import 'package:acter/features/space/providers/suggested_provider.dart';
import 'package:acter/features/space/widgets/space_header.dart';
import 'package:acter/features/space/widgets/space_sections/about_section.dart';
import 'package:acter/features/space/widgets/space_sections/other_chats_section.dart';
import 'package:acter/features/space/widgets/space_sections/members_section.dart';
import 'package:acter/features/space/widgets/space_sections/news_section.dart';
import 'package:acter/features/space/widgets/space_sections/other_sub_spaces_section.dart';
import 'package:acter/features/space/widgets/space_sections/space_actions_section.dart';
import 'package:acter/features/space/widgets/space_sections/spaces_loading_error_section.dart';
import 'package:acter/features/space/widgets/space_sections/suggested_chats_section.dart';
import 'package:acter/features/space/widgets/space_sections/suggested_spaces_section.dart';
import 'package:acter/features/space/widgets/space_toolbar.dart';
import 'package:acter/features/tasks/providers/tasklists_providers.dart';
import 'package:acter/features/tasks/widgets/task_list_widget.dart';
import 'package:flutter/material.dart';
import 'package:acter/l10n/generated/l10n.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:go_router/go_router.dart';
import 'package:scrollable_positioned_list/scrollable_positioned_list.dart';

class SpaceDetailsPage extends ConsumerStatefulWidget {
  static const headerKey = Key('space-menus-header');

  final String spaceId;

  const SpaceDetailsPage({super.key, required this.spaceId});

  @override
  ConsumerState<ConsumerStatefulWidget> createState() =>
      _SpaceDetailsPageState();
}

class _SpaceDetailsPageState extends ConsumerState<SpaceDetailsPage> {
  ValueNotifier<bool> showHeader = ValueNotifier<bool>(true);
  bool showedSuggested = false;
  ProviderSubscription<AsyncValue<bool>>? suggestionsShowerListener;
  final ItemPositionsListener itemPositionsListener =
      ItemPositionsListener.create();

  @override
  void initState() {
    super.initState();
    menuScrollingListeners();
    listenForSuggestions();
  }

  @override
  void didUpdateWidget(SpaceDetailsPage oldWidget) {
    super.didUpdateWidget(oldWidget);
    if (oldWidget.spaceId != widget.spaceId) {
      showedSuggested = false;
      suggestionsShowerListener?.close();
      listenForSuggestions();
    }
  }

  void listenForSuggestions() {
    suggestionsShowerListener = ref.listenManual(
      shouldShowSuggestedProvider(widget.spaceId),
      (asyncPrev, asyncNext) {
        final prev = asyncPrev?.valueOrNull ?? false;
        final next = asyncNext.valueOrNull ?? false;

        if (prev == next || !next) {
          // nothing to do
          return;
        }

        if (!showedSuggested) {
          // only show once per room.
          showedSuggested = true;
          showSuggestRoomsDialog(context, ref, widget.spaceId);
        }
      },
    );
  }

  void menuScrollingListeners() {
    itemPositionsListener.itemPositions.addListener(() {
      var value = itemPositionsListener.itemPositions;
      if (value.value.first.index == 0 &&
          value.value.first.itemLeadingEdge == 0) {
        showHeader.value = true;
      } else {
        showHeader.value = false;
      }
    });
  }

  @override
  Widget build(BuildContext context) {
    final colorScheme = Theme.of(context).colorScheme;
    return Scaffold(
      body: Container(
        decoration: BoxDecoration(
          gradient: LinearGradient(
            colors: [
              colorScheme.primary.withValues(alpha: 0.7),
              colorScheme.surface.withValues(alpha: 0.5),
              colorScheme.surface.withValues(alpha: 0.1),
              colorScheme.secondaryContainer,
            ],
            begin: Alignment.topCenter,
            end: Alignment.bottomCenter,
            stops: const [0.0, 0.2, 0.7, 1.0],
            tileMode: TileMode.decal,
          ),
        ),
        child: spaceBodyUI(),
      ),
    );
  }

  Widget spaceBodyUI() {
    final tabs = ref.watch(tabsProvider(widget.spaceId));
    return ScrollableListTabScroller(
      headerKey: SpaceDetailsPage.headerKey,
      itemCount: tabs.length,
      itemPositionsListener: itemPositionsListener,

      //Space Details Header UI
      headerContainerBuilder:
          (context, menuBarWidget) => spaceHeaderUI(menuBarWidget),

      //Space Details Tab Menu UI
      tabBuilder:
          (context, index, active) =>
              spaceTabMenuUI(context, tabs[index], active),

      //Space Details Page UI
      itemBuilder: (context, index) => spacePageUI(tabs[index]),

      // we allow this to be refreshed by over-pulling
      onRefresh: () async {
        await Future.wait([
          ref.refresh(spaceProvider(widget.spaceId).future),
          ref.refresh(maybeRoomProvider(widget.spaceId).future),
        ]);
      },
    );
  }

  Widget spaceHeaderUI(Widget menuBarWidget) {
    final displayName =
        ref.watch(roomDisplayNameProvider(widget.spaceId)).valueOrNull;

    return Column(
      children: [
        //Header Content UI
        ValueListenableBuilder(
          valueListenable: showHeader,
          builder:
              (context, showHeader, child) => Stack(
                children: [
                  AnimatedContainer(
                    height: showHeader ? null : 0,
                    curve: Curves.easeIn,
                    duration: const Duration(seconds: 1),
                    child: SpaceHeader(spaceIdOrAlias: widget.spaceId),
                  ),
                  AnimatedContainer(
                    height: !showHeader ? null : 0,
                    curve: Curves.easeOut,
                    duration: const Duration(seconds: 1),
                    child: SpaceToolbar(
                      spaceId: widget.spaceId,
                      spaceTitle: Text(displayName ?? ''),
                    ),
                  ),
                ],
              ),
        ),
        //Append menu bar widget
        menuBarWidget,
      ],
    );
  }

  Widget spaceAvatar() {
    final avatarData =
        ref.watch(roomAvatarProvider(widget.spaceId)).valueOrNull;
    if (avatarData == null) {
      return Container(height: 200, color: Colors.red);
    }
    return Image.memory(
      avatarData.bytes,
      height: 300,
      width: MediaQuery.of(context).size.width,
      fit: BoxFit.cover,
    );
  }

  Widget spaceTabMenuUI(BuildContext context, TabEntry tabItem, bool active) {
    return Container(
      key: Key(tabItem.name),
      padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 8),
      margin: const EdgeInsets.only(left: 12, top: 12, bottom: 12),
      decoration: BoxDecoration(
        color: active ? Theme.of(context).colorScheme.primary : null,
        borderRadius: BorderRadius.circular(100),
      ),
      child: Text(itemLabel(context, tabItem)),
    );
  }

  String itemLabel(BuildContext context, TabEntry tabItem) {
    final lang = L10n.of(context);
    return switch (tabItem) {
      TabEntry.overview => lang.overview,
      TabEntry.pins => lang.pins,
      TabEntry.tasks => lang.tasks,
      TabEntry.events => lang.events,
      TabEntry.updates => lang.updates,
      TabEntry.suggestedChats => lang.suggestedChats,
      TabEntry.suggestedSpaces => lang.suggestedSpaces,
      TabEntry.chats => lang.chats,
      TabEntry.spaces => lang.spaces,
      TabEntry.spacesLoading => lang.spaces,
      TabEntry.members => lang.members,
      TabEntry.actions => '...',
    };
  }

  Widget spacePageUI(TabEntry tabItem) {
    return switch (tabItem) {
      TabEntry.overview => AboutSection(spaceId: widget.spaceId),
      TabEntry.updates => NewsSection(spaceId: widget.spaceId),
      TabEntry.pins => PinListWidget(
        pinListProvider: pinsProvider(widget.spaceId),
        spaceId: widget.spaceId,
        showSectionHeader: true,
        limit: 3,
        onClickSectionHeader:
            () => context.pushNamed(
              Routes.spacePins.name,
              pathParameters: {'spaceId': widget.spaceId},
            ),
      ),
      TabEntry.tasks => TaskListWidget(
        taskListProvider: taskListsProvider(widget.spaceId),
        spaceId: widget.spaceId,
        showSectionHeader: true,
        limit: 3,
        onClickSectionHeader:
            () => context.pushNamed(
              Routes.spaceTasks.name,
              pathParameters: {'spaceId': widget.spaceId},
            ),
      ),
      TabEntry.events => EventListWidget(
        isShowSpaceName: false,
        showSectionHeader: true,
        listProvider: allEventSorted(widget.spaceId),
        limit: 3,
        onClickSectionHeader:
            () => context.pushNamed(
              Routes.spaceEvents.name,
              pathParameters: {'spaceId': widget.spaceId},
            ),
      ),
      TabEntry.suggestedChats => SuggestedChatsSection(spaceId: widget.spaceId),
      TabEntry.suggestedSpaces => SuggestedSpacesSection(
        spaceId: widget.spaceId,
      ),
      TabEntry.chats => OtherChatsSection(spaceId: widget.spaceId),
      TabEntry.spaces => OtherSubSpacesSection(spaceId: widget.spaceId),
      TabEntry.spacesLoading => SpacesLoadingSection(spaceId: widget.spaceId),
      TabEntry.members => MembersSection(spaceId: widget.spaceId),
      TabEntry.actions => SpaceActionsSection(spaceId: widget.spaceId),
    };
  }
}
