import 'package:auto_route/auto_route.dart';
import 'package:flutter/material.dart';
import 'package:forui/forui.dart';
import 'package:xiao_pet_tracker/app_router/app_router.gr.dart';

@AutoRouterConfig()
class AppRouter extends RootStackRouter {
  @override
  RouteType get defaultRouteType => const RouteType.material();

  @override
  List<AutoRoute> get routes => [
        AutoRoute(
          page: MainRoute.page,
          path: '/',
          children: [
            AutoRoute(
              page: XiaoConnectorRoute.page,
            ),
            AutoRoute(
              page: RecordingsRoute.page,
              children: [],
            ),
          ],
        ),
        AutoRoute(
          page: RecordingsDetailsRoute.page,
        ),
      ];
}

@RoutePage()
class MainPage extends StatelessWidget {
  const MainPage({super.key});

  @override
  Widget build(BuildContext context) {
    return AutoTabsScaffold(
      // transitionBuilder: (context, child, animation) => AnimatedBuilder(
      //   animation: animation,
      //   child: child,
      //   // builder: (BuildContext context, Widget? child) {
      //   //   const begin = Offset(0.0, 0.1);
      //   //   const end = Offset.zero;
      //   //   final tween = Tween(begin: begin, end: end);
      //   //   final offsetAnimation = animation.drive(tween);
      //   //   return SlideTransition(
      //   //     position: offsetAnimation,
      //   //     child: Transform.scale(
      //   //       alignment: Alignment.bottomCenter,
      //   //       scale: animation.value,
      //   //       child: ClipPath(
      //   //         clipper: CircularRevealClipper(
      //   //           fraction: animation.value,
      //   //           centerAlignment: Alignment.bottomCenter,
      //   //           // centerOffset: centerOffset,
      //   //           // minRadius: minRadius,
      //   //           // maxRadius: maxRadius,
      //   //         ),
      //   //         child: child,
      //   //       ),
      //   //     ),
      //   //   );
      //   // },
      // ),
      animationDuration: const Duration(milliseconds: 650),
      routes: const [
        XiaoConnectorRoute(),
        RecordingsRoute(),
      ],
      bottomNavigationBuilder: (context, tabsRouter) {
        return FBottomNavigationBar(
          index: tabsRouter.activeIndex,
          onChange: tabsRouter.setActiveIndex,
          children: [
            FBottomNavigationBarItem(
              label: const Text('Xiao Connector'),
              icon: FIcon(FAssets.icons.microchip),
            ),
            FBottomNavigationBarItem(
              label: const Text('Recordings'),
              icon: FIcon(FAssets.icons.disc3),
            ),
          ],
        );
      },
    );
  }
}
