import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_hooks/flutter_hooks.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';
import '../../app/app_extension.dart';
import '../../screen/no-login-home/no_login_riwayat_scan_provider.dart';
// import 'package:shared_preferences/shared_preferences.dart';
import '../../provider/no-login/no_login_current_user_provider.dart';
import '../../provider/no-login-scan/no_login_scan_provider.dart';

import '../../app/constant.dart';
import '../../app/route.dart';
import '../../widget/customsnackbarwidget.dart';
import '../no-login/no_login_refresh_token_provider.dart';
import 'no_login_card_riwayat_scan.dart';

class NoLoginHomeScreen extends HookConsumerWidget {
  const NoLoginHomeScreen({super.key});

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    SystemChrome.setEnabledSystemUIMode(SystemUiMode.manual, overlays: [
      SystemUiOverlay.bottom,
    ]);

    final currentUser = ref.watch(noLoginCurrentUserProvider);
    // final username = currentUser?.model.username ?? "-";
    final host = currentUser?.host ?? "";
    final isLoading = useState<bool>(false);
    final listScanArr = ref.watch(listScanRwt);
    final client_id = currentUser?.client_id ?? "";
    final token = currentUser?.token ?? "";
    final expire_date = currentUser?.expire_date ?? "";
    final readProsesAksi = ref.watch(noLoginprosesAksi);

    useEffect(() {
      WidgetsBinding.instance.addPostFrameCallback((timeStamp) async {
        if (client_id == "0" || token == "") {
          // not logged in and doesn't have token
          Navigator.of(context)
              .pushNamedAndRemoveUntil(noLoginRoute, (route) => false);
          return;
        }

        if (token != "") {
          if (await isTokenExpired() == true) {
            print("Token expired, refreshing...");
            ref.read(noLoginRefreshTokenProvider.notifier).refreshToken(
                  client_id: client_id,
                  host: host,
                  expire_date: expire_date,
                );
          }
        }
      });
      return () {};
    }, [currentUser]);

    useEffect(() {
      WidgetsBinding.instance.addPostFrameCallback((timestap) async {
        ref.read(noLoginRiwayatScanProvider.notifier).noLoginRiwayatScan(
              host: host,
              client_id: client_id,
              token: token,
              expire_date: expire_date,
            );
      });
      return () {};
    }, []);

    // refreshToken Provider
    ref.listen(noLoginRefreshTokenProvider, (prev, next) async {
      if (next is NoLoginRefreshTokenStateLoading) {
        isLoading.value = true;
      } else if (next is NoLoginRefreshTokenStateError) {
        isLoading.value = false;
        // errorMessage.value = next.message;
        snackbarWidget(
          context,
          next.message,
          snackbarType.error,
          Duration(seconds: 3),
        );
      } else if (next is NoLoginRefreshTokenStateDone) {
        isLoading.value = false;

        // check proses aksi yg berlangsung
        if (readProsesAksi == Constant.getRiwayat) {
          ref.read(noLoginRiwayatScanProvider.notifier).noLoginRiwayatScan(
                host: host,
                client_id: client_id,
                token: token,
                expire_date: expire_date,
              );
        }
      }
    });

    // listRiwayProvider
    ref.listen(noLoginRiwayatScanProvider, (prev, next) async {
      if (next is NoLoginRiwayatScanStateLoading) {
        isLoading.value = true;
      } else if (next is NoLoginRiwayatScanStateError) {
        isLoading.value = false;
        // errorMessage.value = next.message;
        snackbarWidget(
          context,
          next.message,
          snackbarType.error,
          Duration(seconds: 3),
        );
      } else if (next is NoLoginRiwayatScanStateDone) {
        isLoading.value = false;
      }
    });

    void getRiwayat() async {
      if (await isTokenExpired() == true) {
        ref.read(noLoginprosesAksi.notifier).state = Constant.getRiwayat;
        print("Token expired, refreshing...");
        ref.read(noLoginRefreshTokenProvider.notifier).refreshToken(
              client_id: client_id,
              host: host,
              expire_date: expire_date,
            );
      } else {
        ref.read(noLoginRiwayatScanProvider.notifier).noLoginRiwayatScan(
              host: host,
              client_id: client_id,
              token: token,
              expire_date: expire_date,
            );
      }
    }

    return GestureDetector(
      onTap: () {
        FocusManager.instance.primaryFocus!.unfocus();
      },
      child: Scaffold(
        resizeToAvoidBottomInset: true,
        backgroundColor: Constant.bgGrey,
        body: Column(
          children: [
            // atas
            Image.asset(
              'images/vektoratas.png',
              width: double.infinity,
              fit: BoxFit.cover,
            ),
            SizedBox(
              height: Constant.getActualYPhone(
                context: context,
                y: 34,
              ),
            ),
            // button scan ktp
            Padding(
              padding: EdgeInsets.only(
                left: Constant.getActualXPhone(
                  context: context,
                  x: 20,
                ),
                right: Constant.getActualXPhone(
                  context: context,
                  x: 20,
                ),
              ),
              child: SizedBox(
                width: double.infinity,
                height: Constant.getActualYPhone(
                  context: context,
                  y: 48,
                ),
                child: ElevatedButton(
                  onPressed: () {
                    Navigator.of(context).pushNamed(noLoginScanRoute);
                  },
                  style: ElevatedButton.styleFrom(
                    backgroundColor: Constant.bgButton,
                    shape: RoundedRectangleBorder(
                      borderRadius: BorderRadius.circular(8),
                    ),
                    elevation: 8,
                    shadowColor: Constant.bgButton.withOpacity(0.24),
                  ),
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                      Image.asset(
                        'images/iconbarcode.png',
                        width: Constant.getActualXPhone(
                          context: context,
                          x: 20,
                        ),
                        height: Constant.getActualYPhone(
                          context: context,
                          y: 20,
                        ),
                        fit: BoxFit.cover,
                      ),
                      SizedBox(
                        width: Constant.getActualXPhone(
                          context: context,
                          x: 10,
                        ),
                      ),
                      Text(
                        'SCAN KTP BARU',
                        style:
                            Constant.titleButton500(context: context).copyWith(
                          color: Constant.textWhite,
                        ),
                      ),
                    ],
                  ),
                ),
              ),
            ),
            SizedBox(
              height: Constant.getActualYPhone(
                context: context,
                y: 56,
              ),
            ),
            // judul
            Padding(
              padding: EdgeInsets.only(
                left: Constant.getActualXPhone(
                  context: context,
                  x: 20,
                ),
                right: Constant.getActualXPhone(
                  context: context,
                  x: 20,
                ),
              ),
              child: Column(
                children: [
                  // DEBUG
                  // Text(currentUser?.token ?? ""),
                  // SizedBox(
                  //   height: Constant.getActualYPhone(
                  //     context: context,
                  //     y: 24,
                  //   ),
                  // ),
                  // Text(currentUser?.expire_date ?? ""),
                  // SizedBox(
                  //   height: Constant.getActualYPhone(
                  //     context: context,
                  //     y: 24,
                  //   ),
                  // ),
                  // DEBUG
                  Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: [
                      Text(
                        'Riwayat',
                        style: Constant.titleRiwayat(context: context).copyWith(
                          color: Constant.textBlack,
                        ),
                      ),
                      Text(
                        '20 Scan Terakhir',
                        style:
                            Constant.titleInputan500(context: context).copyWith(
                          color: Constant.inputanGrey,
                        ),
                      ),
                    ],
                  ),
                  SizedBox(
                    height: Constant.getActualYPhone(
                      context: context,
                      y: 24,
                    ),
                  ),
                ],
              ),
            ),
            // loading
            if (isLoading.value)
              Expanded(
                child: Center(
                  child: CircularProgressIndicator(
                    color: Constant.bgButton,
                  ),
                ),
              )
            // belum ada riwayat
            else if (listScanArr.isEmpty)
              Expanded(
                child: RefreshIndicator(
                  color: Constant.bgButton,
                  onRefresh: () async {
                    getRiwayat();
                  },
                  child: ListView(
                    physics:
                        AlwaysScrollableScrollPhysics(), // Agar bisa di-refresh meski kosong
                    children: [
                      SizedBox(
                          height: MediaQuery.of(context).size.height *
                              0.3), // Atur tinggi agar teks di tengah
                      Align(
                        alignment: Alignment.center,
                        child: Text(
                          'Belum Ada Riwayat',
                          style: Constant.titleInputan500(context: context),
                        ),
                      ),
                    ],
                  ),
                ),
              )
            // list card
            else
              Expanded(
                child: RefreshIndicator(
                  color: Constant.bgButton,
                  onRefresh: () async {
                    getRiwayat();
                  },
                  child: Padding(
                    padding: EdgeInsets.only(
                      left: Constant.getActualXPhone(context: context, x: 13),
                      right: Constant.getActualXPhone(context: context, x: 13),
                      bottom: Constant.getActualYPhone(context: context, y: 20),
                    ),
                    child: ListView.builder(
                      physics: AlwaysScrollableScrollPhysics(),
                      shrinkWrap: true,
                      itemCount: listScanArr.length,
                      itemBuilder: (context, i) {
                        final obj = listScanArr[i];
                        return Padding(
                          padding: EdgeInsets.only(
                            top: Constant.getActualYPhone(
                                context: context, y: 15),
                          ),
                          child: NoLoginCardRiwayatScan(
                            data: obj,
                          ),
                        );
                      },
                    ),
                  ),
                ),
              ),
          ],
        ),
      ),
    );
  }
}