import 'dart:convert';

import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:go_router/go_router.dart';
import 'package:http/http.dart' as http;
import 'package:momo/models/image_list_resp.dart';
import 'package:momo/models/image_resp.dart';
import 'package:momo/provider/token.dart';

// import 'package:flutter_riverpod/flutter_riverpod.dart';
// import 'package:go_router/go_router.dart';
// import 'package:momo/provider/token.dart';
// import 'package:provider/provider.dart';

class Gallery extends ConsumerStatefulWidget {
  const Gallery({Key? key}) : super(key: key);

  @override
  ConsumerState<Gallery> createState() => _GalleryState();
}

class _GalleryState extends ConsumerState<Gallery> {
  Future<dynamic> loadImages(tk) async {
    http.Response resp = await http.get(
        Uri.parse("http://192.168.110.156:8080/image/history"),
        headers: {"Authorization": tk});
    return resp.body;
  }

  List<ImageResp> imageList = [];

  @override
  void dispose() {
    // TODO: implement dispose
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    String? tk = ref.watch(tokenProvider);
    if (tk != null) {
      loadImages(tk).then((bd) {
        if (mounted) {
          setState(() {
            imageList = ImageListResp.fromJson(jsonDecode(bd)).list;
          });
        }
      });
    }
    return GridView.builder(
        itemCount: imageList.length,
        gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
            crossAxisCount: MediaQuery.of(context).size.width > 640 ? 5 : 3),
        itemBuilder: (BuildContext context, int index) {
          return InkWell(
            onTap: () {
              context.go("/detail");
            },
            child: Image.network(
              "http://192.168.110.156:8080/image/thumbnail/${imageList[index].file_path}",
              fit: BoxFit.cover,
            ),
          );
        });
  }
}