import 'package:app_petty_cash/widget/sankbar_widget.dart';
import 'package:dio/dio.dart';
import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:intl/intl.dart';

import '../app/constant.dart';

class HistoryRowAtasWidget extends HookConsumerWidget {
  final String icon_category_id;
  final String icon_category_name;
  final String amount;
  final String tipe;
  final String tglTransaksi;
  // final ValueNotifier<bool> searchHistoryIsLoading;

  const HistoryRowAtasWidget({
    Key? key,
    required this.icon_category_id,
    required this.icon_category_name,
    required this.amount,
    required this.tipe,
    required this.tglTransaksi,
    // required this.searchHistoryIsLoading,
  }) : super(key: key);

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    // check file exist
    // Future<Widget> checkFileExistence(String fileUrl) async {
    //   try {
    //     final dio = Dio();
    //     final response = await dio.head(fileUrl);
    //     if (response.statusCode == 200) {
    //       return SvgPicture.network(
    //         fileUrl,
    //         semanticsLabel: 'Icon pizza',
    //         // placeholderBuilder: (BuildContext context) => Container(
    //         //   padding: const EdgeInsets.all(30.0),
    //         //   child: const CircularProgressIndicator(),
    //         // ),
    //       );
    //     } else {
    //       return SvgPicture.network(
    //         'https://devone.aplikasi.web.id/pettycash-media/icon/icon_13.svg',
    //         semanticsLabel: 'Icon pizza',
    //         // placeholderBuilder: (BuildContext context) => Container(
    //         //   padding: const EdgeInsets.all(30.0),
    //         //   child: const CircularProgressIndicator(),
    //         // ),
    //       );
    //     }
    //   } catch (e) {
    //     // print('Error checking file existence: $e');
    //     return SvgPicture.network(
    //       'https://devone.aplikasi.web.id/pettycash-media/icon/icon_13.svg',
    //       semanticsLabel: 'Icon pizza',
    //       // placeholderBuilder: (BuildContext context) => Container(
    //       //   padding: const EdgeInsets.all(30.0),
    //       //   child: const CircularProgressIndicator(),
    //       // ),
    //     );
    //   }
    // }

    final iconProvider =
        FutureProvider.family<Widget, String>((ref, fileUrl) async {
      try {
        final dio = Dio();
        final response = await dio.head(fileUrl);
        if (response.statusCode == 200) {
          return SvgPicture.network(
            fileUrl,
            semanticsLabel: 'Icon pizza',
          );
        } else {
          return SvgPicture.network(
            'https://devone.aplikasi.web.id/pettycash-media/icon/icon_13.svg',
            semanticsLabel: 'Icon pizza',
          );
        }
      } catch (e) {
        return SvgPicture.network(
          'https://devone.aplikasi.web.id/pettycash-media/icon/icon_13.svg',
          semanticsLabel: 'Icon pizza',
        );
      }
    });

    // fungsi tanggal
    String formatDateString(String inputDate) {
      try {
        // Parsing tanggal dari string input
        DateTime date = DateFormat('dd-MM-yyyy', 'id').parse(inputDate);

        // Format tanggal ke '30 Des 2023'
        String formattedDate = DateFormat('dd MMM yyyy', 'id').format(date);

        return formattedDate;
      } catch (e) {
        // Tangkap kesalahan jika format tanggal tidak sesuai
        print('Error parsing date: $e');
        // return 'Format Tanggal Salah';
        return inputDate;
      }
    }

    Widget getIconUrl(String categoryid) {
      List<Map<String, String>> iconDataList = [
        {
          'categoryid': '1',
          'url':
              'https://devone.aplikasi.web.id/pettycash-media/icon/icon_13.svg'
        },
        {
          'categoryid': '2',
          'url':
              'https://devone.aplikasi.web.id/pettycash-media/icon/icon_13.svg'
        },
        {
          'categoryid': '3',
          'url':
              'https://devone.aplikasi.web.id/pettycash-media/icon/icon_3.svg'
        },
        {
          'categoryid': '4',
          'url':
              'https://devone.aplikasi.web.id/pettycash-media/icon/icon_13.svg'
        },
        {
          'categoryid': '5',
          'url':
              'https://devone.aplikasi.web.id/pettycash-media/icon/icon_5.svg'
        },
        {
          'categoryid': '6',
          'url':
              'https://devone.aplikasi.web.id/pettycash-media/icon/icon_6.svg'
        },
        {
          'categoryid': '7',
          'url':
              'https://devone.aplikasi.web.id/pettycash-media/icon/icon_13.svg'
        },
        {
          'categoryid': '8',
          'url':
              'https://devone.aplikasi.web.id/pettycash-media/icon/icon_13.svg'
        },
        {
          'categoryid': '9',
          'url':
              'https://devone.aplikasi.web.id/pettycash-media/icon/icon_13.svg'
        },
        {
          'categoryid': '10',
          'url':
              'https://devone.aplikasi.web.id/pettycash-media/icon/icon_13.svg'
        },
        {
          'categoryid': '11',
          'url':
              'https://devone.aplikasi.web.id/pettycash-media/icon/icon_13.svg'
        },
        {
          'categoryid': '12',
          'url':
              'https://devone.aplikasi.web.id/pettycash-media/icon/icon_12.svg'
        },
        {
          'categoryid': '13',
          'url':
              'https://devone.aplikasi.web.id/pettycash-media/icon/icon_13.svg'
        },
      ];

      String urlFix = "";

      for (var i = 0; i < iconDataList.length; i++) {
        if (iconDataList[i]['categoryid'] == categoryid) {
          // urlFix =
          //     "https://devone.aplikasi.web.id/pettycash-media/icon/icon_$icon_category_id.svg";

          urlFix = iconDataList[i]['url'] ??
              "https://devone.aplikasi.web.id/pettycash-media/icon/icon_13.svg";
        }
      }

      if (urlFix == "") {
        urlFix =
            "https://devone.aplikasi.web.id/pettycash-media/icon/icon_13.svg";
      }

      // return urlFix;
      return SvgPicture.network(
        urlFix,
        semanticsLabel: 'Icon category',
      );
    }

    return Row(
      children: [
        // kiri
        Container(
          width: Constant.getActualXPhone(context: context, x: 38),
          height: Constant.getActualYPhone(context: context, y: 38),
          decoration: BoxDecoration(
            color: Color.fromRGBO(241, 90, 41, 0.08),
            borderRadius: BorderRadius.all(
              Radius.circular(8.0),
            ),
          ),
          // child: Text('s'),
          // child: FutureBuilder<Widget>(
          //   future: checkFileExistence(
          //     'https://devone.aplikasi.web.id/pettycash-media/icon/icon_$icon_category_id.svg',
          //   ),
          //   builder: (context, snapshot) {
          //     // if (snapshot.connectionState == ConnectionState.waiting) {
          //     //   // return CircularProgressIndicator();
          //     //   return Text('');
          //     // } else if (snapshot.hasError) {
          //     //   return Icon(
          //     //     Icons.error,
          //     //     color: Colors.red,
          //     //   );
          //     // } else {
          //     //   return snapshot.data ?? Container();
          //     // }

          //     if (snapshot.connectionState == ConnectionState.done) {
          //       return snapshot.data ?? Container();
          //     } else if (snapshot.hasError) {
          //       return Icon(
          //         Icons.error,
          //         color: Colors.red,
          //       );
          //     } else {
          //       return Text('');
          //     }
          //   },
          // ),
          // child: Consumer(
          //   builder: (context, watch, child) {
          //     String iconUrl =
          //         'https://devone.aplikasi.web.id/pettycash-media/icon/icon_$icon_category_id.svg';
          //     final iconAsyncValue = ref.read(
          //       iconProvider(
          //         iconUrl,
          //       ),
          //     );

          //     return iconAsyncValue.when(
          //       loading: () {
          //         print('loading iconurl : $iconUrl');
          //         return CircularProgressIndicator();
          //       },
          //       error: (error, stackTrace) {
          //          print('error iconurl : $iconUrl');
          //         return Icon(
          //           Icons.error,
          //           color: Colors.red,
          //         );
          //       },
          //       data: (iconWidget) {
          //          print('data iconurl : $iconUrl');
          //         return iconWidget ?? Container();
          //       }
          //     );
          //   },
          // ),

          // child: SvgPicture.network(
          //   'https://devone.aplikasi.web.id/pettycash-media/icon/icon_$icon_category_id.svg',
          //   semanticsLabel: 'Icon pizza',
          // ),

          child: getIconUrl(icon_category_id),
        ),

        // tengah
        Expanded(
          child: Padding(
            padding: EdgeInsets.only(
              left: Constant.getActualYPhone(context: context, y: 20),
            ),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              mainAxisAlignment: MainAxisAlignment.start,
              children: [
                Text(
                  icon_category_name,
                  style: Constant.body2_600(context: context).copyWith(
                    fontWeight: FontWeight.w600,
                    color: Constant.textBlack,
                  ),
                ),
                SizedBox(
                  height: Constant.getActualYPhone(
                    context: context,
                    y: 8,
                  ),
                ),
                Text(
                  amount,
                  style: Constant.body1_600(context: context).copyWith(
                      fontWeight: FontWeight.w600,
                      color: Constant.pcBtnBackgroundColor),
                ),
              ],
            ),
          ),
        ),

        // kanan
        Expanded(
          child: Padding(
            padding: EdgeInsets.only(
              right: Constant.getActualYPhone(context: context, y: 8),
            ),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.end,
              mainAxisAlignment: MainAxisAlignment.end,
              children: [
                Container(
                  width: Constant.getActualXPhone(context: context, x: 80),
                  height: Constant.getActualYPhone(context: context, y: 24),
                  decoration: BoxDecoration(
                    color: Constant.bgIconHistory,
                    borderRadius: BorderRadius.all(
                      Radius.circular(6.0),
                    ),
                  ),
                  child: Align(
                    alignment: Alignment.center,
                    child: Text(
                      tipe,
                      style: Constant.body1_600(context: context).copyWith(
                        fontWeight: FontWeight.w600,
                        color: Constant.pcBtnBackgroundColor,
                        fontSize: 14,
                      ),
                    ),
                  ),
                ),
                SizedBox(
                  height: Constant.getActualYPhone(
                    context: context,
                    y: 8,
                  ),
                ),
                Text(
                  formatDateString(tglTransaksi),
                  style: Constant.body1_600(context: context).copyWith(
                      fontWeight: FontWeight.w600, color: Constant.textGreyv2),
                ),
              ],
            ),
          ),
        ),
      ],
    );
  }
}
