import 'package:didvan/config/design_config.dart';
import 'package:didvan/config/theme_data.dart';
import 'package:didvan/constants/app_icons.dart';
import 'package:didvan/models/ai/ai_chat_args.dart';
import 'package:didvan/models/ai/tools_model.dart';
import 'package:didvan/views/ai/ai_state.dart';
import 'package:didvan/views/widgets/didvan/text.dart';
import 'package:didvan/views/widgets/skeleton_image.dart';
import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:provider/provider.dart';

class ToolCategoryViewWidget extends StatelessWidget {
  final Tools tool;
  const ToolCategoryViewWidget({Key? key, required this.tool})
      : super(key: key);

  @override
  Widget build(BuildContext context) {
    const Color customBackgroundColor = Color.fromRGBO(0, 126, 167, 1.0);

    return SingleChildScrollView(
      physics: const BouncingScrollPhysics(),
      padding: const EdgeInsets.only(bottom: 24),
      child: Column(
        children: [
          Container(
            width: double.infinity,
            padding: const EdgeInsets.only(top: 32, bottom: 16),
            child: Column(
              children: [
                if (tool.image != null)
                  SvgPicture.network(
                    tool.image!,
                    width: 64,
                    height: 64,
                    placeholderBuilder: (BuildContext context) =>
                        const SizedBox(
                      width: 64,
                      height: 64,
                      child: Center(
                          child: CircularProgressIndicator(strokeWidth: 2.0)),
                    ),
                  ),
                const SizedBox(height: 8),
                Container(
                  padding:
                      const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
                  margin: const EdgeInsets.symmetric(horizontal: 16),
                  child: DidvanText(
                    tool.name ?? "ابزار هوش مصنوعی",
                    fontSize: 20,
                    fontWeight: FontWeight.bold,
                    color: Theme.of(context).colorScheme.checkFav,
                    textAlign: TextAlign.center,
                  ),
                ),
              ],
            ),
          ),
          if (tool.guide != null && tool.guide!.isNotEmpty) ...[
            const SizedBox(height: 16),
            Padding(
              padding: const EdgeInsets.symmetric(horizontal: 32),
              child: DidvanText(
                tool.guide!,
                fontSize: 12,
                color: Theme.of(context).colorScheme.caption,
                textAlign: TextAlign.justify,
              ),
            ),
          ],
          const SizedBox(height: 24),
          if (tool.bots != null && tool.bots!.isNotEmpty)
            GridView.builder(
              shrinkWrap: true,
              itemCount: tool.bots!.length,
              physics: const NeverScrollableScrollPhysics(),
              padding: const EdgeInsets.symmetric(horizontal: 32),
              gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
                  crossAxisCount: 2,
                  childAspectRatio: 1 / 1.1,
                  crossAxisSpacing: 18,
                  mainAxisSpacing: 18),
              itemBuilder: (context, index) {
                final bot = tool.bots![index];
                return InkWell(
                  onTap: () {
                    context
                        .read<AiState>()
                        .startChat(AiChatArgs(bot: bot, isTool: tool.bots));
                  },
                  child: Container(
                    decoration: BoxDecoration(
                        borderRadius: BorderRadius.only(
                          topLeft: DesignConfig.highBorderRadius.topLeft,
                          topRight: DesignConfig.highBorderRadius.topRight,
                          bottomRight:
                              DesignConfig.highBorderRadius.bottomRight,
                          bottomLeft: DesignConfig.highBorderRadius.bottomLeft,
                        ),
                        color: Theme.of(context).colorScheme.surface,
                        border: Border.all(
                            color: Theme.of(context).colorScheme.border)),
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.stretch,
                      children: [
                        Container(
                          height: 20,
                          decoration: BoxDecoration(
                            color: customBackgroundColor,
                            borderRadius: BorderRadius.only(
                              topLeft: DesignConfig.highBorderRadius.topLeft,
                              topRight: DesignConfig.highBorderRadius.topRight,
                            ),
                          ),
                        ),
                        Expanded(
                          child: Padding(
                            padding: const EdgeInsets.fromLTRB(12, 8, 12, 12),
                            child: Column(
                              mainAxisAlignment: MainAxisAlignment.center,
                              children: [
                                if (bot.image != null)
                                  SkeletonImage(
                                    imageUrl: bot.image!,
                                    width: 70,
                                    height: 70,
                                    borderRadius: BorderRadius.circular(360),
                                  )
                                else
                                  Icon(DidvanIcons.ai_solid,
                                      size: 50,
                                      color: Theme.of(context)
                                          .colorScheme
                                          .primary),
                                const SizedBox(height: 15),
                                Container(
                                  decoration: const BoxDecoration(
                                    borderRadius:
                                        BorderRadius.all(Radius.circular(12)),
                                    color: customBackgroundColor,
                                  ),
                                  padding: const EdgeInsets.symmetric(
                                      horizontal: 8, vertical: 4),
                                  child: Padding(
                                    padding: const EdgeInsets.all(4.0),
                                    child: DidvanText(
                                      bot.name ?? '',
                                      fontSize: 14,
                                      fontWeight: FontWeight.bold,
                                      color: Theme.of(context)
                                          .colorScheme
                                          .onPrimary,
                                      maxLines: 1,
                                      overflow: TextOverflow.ellipsis,
                                      textAlign: TextAlign.center,
                                    ),
                                  ),
                                ),
                                if (bot.short != null &&
                                    bot.short!.isNotEmpty) ...[
                                  const SizedBox(height: 8),
                                  Expanded(
                                    child: DidvanText(
                                      bot.short!,
                                      fontSize: 10,
                                      color:
                                          Theme.of(context).colorScheme.caption,
                                      maxLines: 2,
                                      overflow: TextOverflow.ellipsis,
                                      textAlign: TextAlign.center,
                                    ),
                                  ),
                                ] else
                                  const Spacer(),
                              ],
                            ),
                          ),
                        ),
                      ],
                    ),
                  ),
                );
              },
            )
          else
            Padding(
              padding: const EdgeInsets.all(32.0),
              child: Center(
                  child: DidvanText(
                      "هیچ رباتی برای ابزار '${tool.name ?? "انتخابی"}' موجود نیست.")),
            ),
        ],
      ),
    );
  }
}
