import 'dart:convert';
import 'dart:io';
import "ItemMenu.dart";

import 'package:http/http.dart' as http;
import 'package:flutter/material.dart';
import '../classes/events.dart';
import 'package:shared_preferences/shared_preferences.dart';
import 'package:intl/intl.dart';
import 'package:intl/date_symbol_data_local.dart';

import '../variable/globals.dart' as globals;
import '../classes/MyDrawer.dart';

// app starting point
void main() {
  initializeDateFormatting("fr_FR", null).then((_) => (const MyApp()));
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: const ListItemOrganizers(organizer: "default"),
      debugShowCheckedModeBanner: false,
    );
  }
}

// homepage class
class ListItemOrganizers extends StatefulWidget {
  const ListItemOrganizers({Key? key, required this.organizer})
      : super(key: key);

  final String organizer;
  @override
  State<ListItemOrganizers> createState() => _MyHomePageState();
}

// homepage state
class _MyHomePageState extends State<ListItemOrganizers> {
  // variable to call and store future list of posts

  // function to fetch data from api and return future list of posts
  static Future<List<Events>> getPosts(organizer) async {
    SharedPreferences prefs = await SharedPreferences.getInstance();
    var accessToken = prefs.getString("access_token") ?? "";
    final List<Events> body = [];
    if (accessToken.isNotEmpty) {
      var url = Uri.parse("${globals.api}/events?organizers=${organizer}");
      final response = await http.get(url, headers: {
        "Content-Type": "application/json",
        HttpHeaders.cookieHeader: "access_token=${accessToken}"
      });
      final List body = json.decode(utf8.decode(response.bodyBytes));
      return body.map((e) => Events.fromJson(e)).toList();
    }
    return body;
  }

  // build function
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      drawer: MyDrawer(),
      body: Center(
        // FutureBuilder
        child: FutureBuilder<List<Events>>(
          future: getPosts(widget.organizer),
          builder: (context, snapshot) {
            if (snapshot.connectionState == ConnectionState.waiting) {
              // until data is fetched, show loader
              return const CircularProgressIndicator();
            } else if (snapshot.hasData) {
              // once data is fetched, display it on screen (call buildPosts())
              final posts = snapshot.data!;
              return buildPosts(posts);
            } else {
              // if no data, show simple Text
              return const Text("No data available");
            }
          },
        ),
      ),
    );
  }

  // function to display fetched data on screen
  Widget buildPosts(List<Events> posts) {
    // ListView Builder to show data in a list
    return Scaffold(
      appBar: AppBar(
        // Here we take the value from the MyHomePage object that was created by
        // the App.build method, and use it to set our appbar title.
        title: Text("Organisateur : ${widget.organizer}",
            overflow: TextOverflow.ellipsis),
        backgroundColor: Colors.blue,
        foregroundColor: Colors.white,
      ),
      body: ListView.separated(
        itemCount: posts.length,
        itemBuilder: (context, index) {
          final post = posts[index];
          final startDate = DateTime.parse(post.startDate!);
          final date = DateFormat.yMd().format(startDate);
          final time = DateFormat.Hm().format(startDate);

          return ListTile(
              title: Text('${post.name!}'),
              subtitle: Text('${post.place!}\n${date} ${time}'),
              onTap: () {
                Navigator.push(
                    context,
                    MaterialPageRoute(
                        builder: (_) => ItemMenu(title: post.id!)));
              });
        },
        separatorBuilder: (context, index) {
          return Divider();
        },
      ),
    );
  }
}