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 '../app/constant.dart';

class HomepageRowTransaksiWidget extends HookConsumerWidget {
  final String icon_category_id;
  final String icon_category_name;
  final String amount;
  final String tipe;
  final String tglTransaksi;

  const HomepageRowTransaksiWidget({
    Key? key,
    required this.icon_category_id,
    required this.icon_category_name,
    required this.amount,
    required this.tipe,
    required this.tglTransaksi,
  }) : 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(),
          ),
        );
      }
    }

    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();
              } else if (snapshot.hasError) {
                return Icon(
                  Icons.error,
                  color: Colors.red,
                );
              } else {
                return snapshot.data ??
                    Container();
              }
            },
          ),
        ),

        // 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: 32),
                  height: Constant.getActualYPhone(context: context, y: 19),
                  decoration: BoxDecoration(
                    color: Constant.bgIconHistory,
                    borderRadius: BorderRadius.all(
                      Radius.circular(6.0),
                    ),
                  ),
                  child: Padding(
                    padding: EdgeInsets.all(2.0),
                    child: Text(
                      tipe,
                      style: Constant.body1_600(context: context).copyWith(
                          fontWeight: FontWeight.w600,
                          color: Constant.pcBtnBackgroundColor),
                    ),
                  ),
                ),
                SizedBox(
                  height: Constant.getActualYPhone(
                    context: context,
                    y: 8,
                  ),
                ),
                Text(
                  tglTransaksi,
                  style: Constant.body1_600(context: context).copyWith(
                      fontWeight: FontWeight.w600, color: Constant.textGreyv2),
                ),
              ],
            ),
          ),
        ),
      ],
    );
  }
}
