import 'package:didvan/config/design_config.dart';
import 'package:didvan/config/theme_data.dart';
import 'package:didvan/constants/app_icons.dart';
import 'package:didvan/constants/assets.dart';
import 'package:didvan/models/ai/ai_chat_args.dart';
import 'package:didvan/views/ai/ai_state.dart';
import 'package:didvan/views/ai/history_ai_chat_state.dart';
import 'package:didvan/views/ai/tool_screen.dart';
import 'package:didvan/views/ai/widgets/message_bar_btn.dart';
import 'package:didvan/views/widgets/didvan/text.dart';
import 'package:didvan/views/widgets/shimmer_placeholder.dart';
import 'package:didvan/views/widgets/state_handlers/empty_connection.dart';
import 'package:didvan/views/widgets/state_handlers/empty_state.dart';
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';

class Ai extends StatefulWidget {
  const Ai({Key? key}) : super(key: key);

  @override
  // ignore: library_private_types_in_public_api
  _AiState createState() => _AiState();
}

class _AiState extends State<Ai> {
  @override
  void initState() {
    super.initState();
    context.read<AiState>().getTools();
    context.read<HistoryAiChatState>().getBots();
  }

  @override
  Widget build(BuildContext context) {
    return Stack(
      children: [
        Consumer<AiState>(
          builder: (BuildContext context, state, Widget? child) {
            switch (state.page) {
              case 1:
                return const ToolScreen();
              case 0:
              default:
                return Consumer<HistoryAiChatState>(
                  builder: (context, historyState, child) {
                    if (historyState.bots.isEmpty) {
                      return Center(
                        child: Image.asset(
                          Assets.loadingAnimation,
                          width: 60,
                          height: 60,
                        ),
                      );
                    }
                    final bot = historyState.bot!;
                    return Column(
                      mainAxisAlignment: MainAxisAlignment.end,
                      children: [
                        Expanded(
                          child: SingleChildScrollView(
                            child: Padding(
                              padding:
                                  const EdgeInsets.only(bottom: 24, top: 70),
                              child: Column(
                                children: [
                                  Consumer<AiState>(
                                    builder: (BuildContext context,
                                        AiState aiState, Widget? child) {
                                      final tools = aiState.tools;
                                      if (tools != null && tools.isEmpty) {
                                        return EmptyState(
                                          asset: Assets.emptyResult,
                                          title: 'لیست خالی است',
                                        );
                                      }
                                      if (aiState.loading) {
                                        return toolsPlaceHolder();
                                      }
                                      if (tools == null) {
                                        return Padding(
                                          padding: EdgeInsets.only(
                                              top: MediaQuery.sizeOf(context)
                                                      .height *
                                                  0.1),
                                          child: Center(
                                            child: EmptyConnection(
                                              onRetry: () {
                                                context
                                                    .read<AiState>()
                                                    .getTools();
                                              },
                                            ),
                                          ),
                                        );
                                      }

                                      return const SizedBox();
                                    },
                                  )
                                ],
                              ),
                            ),
                          ),
                        ),
                        Padding(
                          padding: const EdgeInsets.fromLTRB(20, 0, 20, 12),
                          child: Column(
                            mainAxisSize: MainAxisSize.min,
                            crossAxisAlignment: CrossAxisAlignment.end,
                            children: [
                              InkWell(
                                  onTap: () {
                                    context.read<AiState>().startChat(
                                        AiChatArgs(
                                            bot: bot,
                                            isTool: historyState.bots));
                                  },
                                  child: Column(
                                    children: [
                                      Row(
                                        children: [
                                          Expanded(
                                            child: Container(
                                              decoration: BoxDecoration(
                                                  color: Theme.of(context)
                                                      .colorScheme
                                                      .surface,
                                                  border: Border.all(
                                                      color:
                                                          const Color.fromARGB(
                                                              255, 0, 126, 167),
                                                      width: 1.5),
                                                  borderRadius:
                                                      BorderRadius.circular(
                                                          50)),
                                              child: Row(
                                                children: [
                                                  Expanded(
                                                      child: Padding(
                                                          padding:
                                                              const EdgeInsets
                                                                  .symmetric(
                                                            horizontal: 8.0,
                                                          ),
                                                          child: Form(
                                                              child: Row(
                                                            children: [
                                                              const MessageBarBtn(
                                                                  enable: true,
                                                                  icon: DidvanIcons
                                                                      .mic_regular),
                                                              const SizedBox(
                                                                width: 8,
                                                              ),
                                                              Expanded(
                                                                child:
                                                                    TextFormField(
                                                                  textInputAction:
                                                                      TextInputAction
                                                                          .newline,
                                                                  style: Theme.of(
                                                                          context)
                                                                      .textTheme
                                                                      .bodyMedium,
                                                                  minLines: 1,
                                                                  enabled:
                                                                      false,
                                                                  decoration:
                                                                      InputDecoration(
                                                                    border:
                                                                        InputBorder
                                                                            .none,
                                                                    hintText:
                                                                        'بنویسید یا پیام صوتی بگذارید...',
                                                                    hintStyle: Theme.of(
                                                                            context)
                                                                        .textTheme
                                                                        .bodySmall!
                                                                        .copyWith(
                                                                            color:
                                                                                Theme.of(context).colorScheme.disabledText),
                                                                  ),
                                                                ),
                                                              ),
                                                              const SizedBox(
                                                                width: 8,
                                                              ),
                                                              MessageBarBtn(
                                                                  click: () {
                                                                    context
                                                                        .read<
                                                                            AiState>()
                                                                        .startChat(
                                                                            AiChatArgs(
                                                                          bot:
                                                                              bot,
                                                                          attach:
                                                                              true,
                                                                        ));
                                                                  },
                                                                  enable: false,
                                                                  icon: Icons
                                                                      .add),
                                                            ],
                                                          ))))
                                                ],
                                              ),
                                            ),
                                          ),
                                        ],
                                      ),
                                      const Padding(
                                        padding:
                                            EdgeInsets.fromLTRB(8, 8, 8, 4),
                                        child: FittedBox(
                                          child: DidvanText(
                                            'مدل‌های هوش مصنوعی می‌توانند اشتباه کنند، صحت اطلاعات مهم را بررسی کنید.',
                                            style: TextStyle(
                                                fontWeight: FontWeight.w600),
                                          ),
                                        ),
                                      )
                                    ],
                                  )),
                            ],
                          ),
                        ),
                      ],
                    );
                  },
                );
            }
          },
        ),
      ],
    );
  }

  ListView toolsPlaceHolder() {
    return ListView.builder(
      itemCount: 10,
      shrinkWrap: true,
      padding: const EdgeInsets.symmetric(vertical: 8, horizontal: 24),
      physics: const NeverScrollableScrollPhysics(),
      itemBuilder: (context, index) {
        return Container(
          decoration: BoxDecoration(
            borderRadius: DesignConfig.lowBorderRadius,
            border: Border.all(
              color: const Color(0xffB8B8B8),
            ),
          ),
          padding: const EdgeInsets.all(24),
          margin: const EdgeInsets.symmetric(vertical: 8),
          child: Row(
            children: [
              ShimmerPlaceholder(
                width: 75,
                height: 75,
                borderRadius: BorderRadius.circular(360),
              ),
              const SizedBox(
                width: 8,
              ),
              const Expanded(
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: [
                        ShimmerPlaceholder(
                          width: 120,
                          height: 24,
                          borderRadius: DesignConfig.mediumBorderRadius,
                        ),
                        ShimmerPlaceholder(
                          width: 60,
                          height: 24,
                          borderRadius: DesignConfig.mediumBorderRadius,
                        ),
                      ],
                    ),
                    SizedBox(
                      height: 8,
                    ),
                    ShimmerPlaceholder(
                      width: 120,
                      height: 24,
                      borderRadius: DesignConfig.mediumBorderRadius,
                    ),
                    SizedBox(
                      height: 8,
                    ),
                    ShimmerPlaceholder(
                      width: 240,
                      height: 46,
                      borderRadius: DesignConfig.mediumBorderRadius,
                    ),
                  ],
                ),
              )
            ],
          ),
        );
      },
    );
  }
}
