// ignore_for_file: deprecated_member_use_from_same_package

import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:go_router/go_router.dart';
import 'package:hoshan/core/gen/assets.gen.dart';
import 'package:hoshan/core/routes/route_generator.dart';
import 'package:hoshan/data/model/chat_args.dart';
import 'package:hoshan/data/model/tools_categories_model.dart';
import 'package:hoshan/ui/theme/colors.dart';
import 'package:hoshan/ui/theme/cubit/theme_mode_cubit.dart';
import 'package:hoshan/ui/theme/responsive.dart';
import 'package:hoshan/ui/theme/text.dart';
import 'package:hoshan/ui/widgets/components/bot/bot_grid_card.dart';
import 'package:hoshan/ui/widgets/components/image/network_image.dart';
import 'package:hoshan/ui/widgets/sections/header/reversible_appbar.dart';

class SingleToolPage extends StatelessWidget {
  final Categories cat;
  const SingleToolPage({super.key, required this.cat});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: ReversibleAppbar(
        context,
        title: Row(
          mainAxisAlignment: MainAxisAlignment.end,
          children: [
            Text(
              cat.name ?? '',
              style: AppTextStyles.body3
                  .copyWith(color: Theme.of(context).colorScheme.onSurface),
            ),
            const SizedBox(
              width: 8,
            ),
            Assets.icon.outline.toolBox.svg(
                width: Responsive(context).isMobile() ? null : 32,
                color: Theme.of(context).colorScheme.onSurface),
          ],
        ),
      ),
      body: Responsive(context).maxWidthInDesktop(
        child: (contxet, mw) => SingleChildScrollView(
          physics: const BouncingScrollPhysics(),
          child: Directionality(
            textDirection: TextDirection.rtl,
            child: Column(
              children: [
                const SizedBox(
                  height: 24,
                ),
                Container(
                  padding: const EdgeInsets.all(8),
                  width: 90,
                  height: 90,
                  decoration: BoxDecoration(
                    borderRadius: BorderRadius.circular(16),
                    color: context.read<ThemeModeCubit>().isDark()
                        ? AppColors.black[900]
                        : AppColors.primaryColor[50],
                    boxShadow: const [
                      BoxShadow(
                        color: Color(0x664D4D4D),
                        blurRadius: 6,
                        offset: Offset(0, 1),
                        spreadRadius: 0,
                      )
                    ],
                  ),
                  child: ImageNetwork(
                      radius: 16,
                      // color: Theme.of(context).colorScheme.onSurface,
                      url: cat.image),
                ),
                const SizedBox(
                  height: 8,
                ),
                Text(
                  cat.name ?? '',
                  style: AppTextStyles.headline6
                      .copyWith(color: Theme.of(context).colorScheme.onSurface),
                ),
                if (cat.description != null)
                  Column(
                    children: [
                      const SizedBox(
                        height: 8,
                      ),
                      Text(
                        cat.description!,
                        style: AppTextStyles.body4.copyWith(
                            color: AppColors.gray[
                                context.read<ThemeModeCubit>().isDark()
                                    ? 600
                                    : 900]),
                      ),
                    ],
                  ),
                const SizedBox(
                  height: 12,
                ),
                GridView.builder(
                  physics: const NeverScrollableScrollPhysics(),
                  gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                      crossAxisCount: Responsive(context).isMobile() ? 2 : 3,
                      childAspectRatio: 1 / 1,
                      crossAxisSpacing: 16,
                      mainAxisSpacing: 16),
                  shrinkWrap: true,
                  padding: const EdgeInsets.all(16),
                  itemCount: cat.bots!.length,
                  itemBuilder: (context, index) {
                    return GestureDetector(
                        onTap: () => context.go(Routes.chatFromSingleTool,
                            extra: ChatArgs(bot: cat.bots![index])),
                        child: BotGridCard(
                          bot: cat.bots![index],
                          iconic: true,
                        ));
                  },
                )
              ],
            ),
          ),
        ),
      ),
    );
  }
}