import 'package:external_repos/external_repos.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:go_router/go_router.dart';
import 'package:uae_stat/config/my_theme.dart';
import 'package:uae_stat/domain/use_cases/language.dart';
import 'package:uae_stat/infrastructure/services/img_asset_paths/icons/drawer_asset_icon_path.dart';
import 'package:uae_stat/infrastructure/services/img_asset_paths/logo_asset_path.dart';
import 'package:uae_stat/infrastructure/services/packages/list.dart';
import 'package:uae_stat/presentation/components/space.dart';

class MyDrawer extends ConsumerWidget {
  const MyDrawer({super.key});

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final logo = Image.asset(
      LogoAssetPath.fcsc,
      height: 40,
      width: 40,
    );
    final selectedDrawerItem = DrawerItems.values.firstWhereOrNull(
      (e) =>
          GoRouterState.of(context).fullPath!.split('/').elementAt(2) ==
          e.routePath,
    );
    final menuBtns = Column(
      children: DrawerItems.values
          .map(
            (e) => InkWell(
              onTap: () {
                Scaffold.of(context).closeDrawer();
                if (e != selectedDrawerItem) {
                  context.go('/${context.language}/${e.routePath}');
                }
              },
              child: Material(
                color: Colors.transparent,
                child: Padding(
                  padding: const EdgeInsets.symmetric(
                    horizontal: 28,
                    vertical: 16,
                  ),
                  child: Row(
                    children: [
                      Image.asset(
                        e.imgPath,
                        height: 20,
                        width: 20,
                        color: e == selectedDrawerItem
                            ? const Color(0xff898C81)
                            : const Color(0xff343330),
                      ),
                      12.horizontalSpace,
                      Expanded(
                        child: Text(
                          context.translate(
                            e.titleEN,
                            e.titleAR,
                          ),
                          style: TextStyle(
                            fontFamily: context.translate(
                              'Inter',
                              'NotoKufi',
                            ),
                            fontSize: 14,
                            color: e == selectedDrawerItem
                                ? const Color(0xff898C81)
                                : const Color(0xff343330),
                          ),
                        ),
                      ),
                      if (e == selectedDrawerItem)
                        const Icon(
                          CupertinoIcons.left_chevron,
                          size: 12,
                        ),
                    ],
                  ),
                ),
              ),
            ),
          )
          .toList(),
    );
    return Drawer(
      backgroundColor: Colors.white,
      surfaceTintColor: Colors.white,
      shape: const RoundedRectangleBorder(
        borderRadius: BorderRadius.horizontal(
          right: Radius.circular(30),
        ),
      ),
      child: SafeArea(
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Padding(
              padding: const EdgeInsets.symmetric(
                vertical: 12,
                horizontal: 26,
              ),
              child: logo,
            ),
            const Divider(height: 0),
            Padding(
              padding: const EdgeInsetsDirectional.symmetric(
                vertical: 16,
              ),
              child: menuBtns,
            ),
          ],
        ),
      ),
    );
  }
}

enum DrawerItems {
  favorites(
    routePath: 'my-favorites',
    titleEN: 'My Favorites',
    titleAR: 'المفضلات',
    imgPath: DrawerAssetIconPath.favorites,
  ),
  feedback(
    routePath: 'feedback',
    titleEN: 'Feedback',
    titleAR: 'شاركنا رأيك',
    imgPath: DrawerAssetIconPath.message,
  ),
  privacyPolicy(
    routePath: 'privacy-policy',
    titleEN: 'Terms & Privacy Policy',
    titleAR: 'الشروط وسياسة الخصوصية',
    imgPath: DrawerAssetIconPath.scroll,
  );

  const DrawerItems({
    required this.routePath,
    required this.titleEN,
    required this.titleAR,
    required this.imgPath,
  });

  final String routePath;
  final String titleEN;
  final String titleAR;
  final String imgPath;
}