import 'dart:math';

import 'package:fl_clash/common/common.dart';
import 'package:fl_clash/enum/enum.dart';
import 'package:fl_clash/providers/providers.dart';
import 'package:fl_clash/widgets/widgets.dart';
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'widgets/start_button.dart';

class DashboardFragment extends ConsumerStatefulWidget {
  const DashboardFragment({super.key});

  @override
  ConsumerState<DashboardFragment> createState() => _DashboardFragmentState();
}

class _DashboardFragmentState extends ConsumerState<DashboardFragment>
    with PageMixin {
  final key = GlobalKey<SuperGridState>();

  @override
  initState() {
    ref.listenManual(
      isCurrentPageProvider(PageLabel.dashboard),
      (prev, next) {
        if (prev != next && next == true) {
          initPageState();
        }
      },
      fireImmediately: true,
    );
    return super.initState();
  }

  @override
  Widget? get floatingActionButton => const StartButton();

  @override
  List<Widget> get actions => [
        ValueListenableBuilder(
          valueListenable: key.currentState!.addedChildrenNotifier,
          builder: (_, addedChildren, child) {
            return ValueListenableBuilder(
              valueListenable: key.currentState!.isEditNotifier,
              builder: (_, isEdit, child) {
                if (!isEdit || addedChildren.isEmpty) {
                  return Container();
                }
                return child!;
              },
              child: child,
            );
          },
          child: IconButton(
            onPressed: () {
              key.currentState!.showAddModal();
            },
            icon: Icon(
              Icons.add_circle,
            ),
          ),
        ),
        IconButton(
          icon: ValueListenableBuilder(
            valueListenable: key.currentState!.isEditNotifier,
            builder: (_, isEdit, ___) {
              return isEdit
                  ? Icon(Icons.save)
                  : Icon(
                      Icons.edit,
                    );
            },
          ),
          onPressed: () {
            key.currentState!.isEditNotifier.value =
                !key.currentState!.isEditNotifier.value;
          },
        ),
      ];

  _handleSave(List<GridItem> girdItems, WidgetRef ref) {
    final dashboardWidgets = girdItems
        .map(
          (item) => DashboardWidget.getDashboardWidget(item),
        )
        .toList();
    ref.read(appSettingProvider.notifier).updateState(
          (state) => state.copyWith(dashboardWidgets: dashboardWidgets),
        );
  }

  @override
  Widget build(BuildContext context) {
    final dashboardState = ref.watch(dashboardStateProvider);
    final columns = max(4 * ((dashboardState.viewWidth / 320).ceil()), 8);
    return Align(
      alignment: Alignment.topCenter,
      child: SingleChildScrollView(
        padding: const EdgeInsets.all(16).copyWith(
          bottom: 88,
        ),
        child: SuperGrid(
          key: key,
          crossAxisCount: columns,
          crossAxisSpacing: 16.ap,
          mainAxisSpacing: 16.ap,
          children: [
            ...dashboardState.dashboardWidgets
                .where(
                  (item) => item.platforms.contains(
                    SupportPlatform.currentPlatform,
                  ),
                )
                .map(
                  (item) => item.widget,
                ),
          ],
          onSave: (girdItems) {
            _handleSave(girdItems, ref);
          },
          addedItemsBuilder: (girdItems) {
            return DashboardWidget.values
                .where(
                  (item) =>
                      !girdItems.contains(item.widget) &&
                      item.platforms.contains(
                        SupportPlatform.currentPlatform,
                      ),
                )
                .map((item) => item.widget)
                .toList();
          },
        ),
      ),
    );
  }
}