mobile-flutter/covas_mobile/lib/pages/ListItemMenu.dart

import 'package:flutter/material.dart';
import 'package:http/http.dart' as http;
import 'package:flutter_dotenv/flutter_dotenv.dart'; // Import dotenv
import 'dart:convert';
import 'dart:io';
import 'ItemMenu.dart';
import 'Camera.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 'package:camera/camera.dart';
import 'package:mapbox_gl/mapbox_gl.dart'; // Add this import
import 'dart:math';
import '../variable/globals.dart' as globals;

void main() {
  initializeDateFormatting("fr_FR", null).then((_) => runApp(const MyApp()));
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: const ListItemMenu(),
      debugShowCheckedModeBanner: false,
    );
  }
}

class ListItemMenu extends StatefulWidget {
  const ListItemMenu({super.key});

  @override
  State<ListItemMenu> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<ListItemMenu> {
  Future<List<Events>> postsFuture = getPosts();
  List<Events> filteredPosts = [];
  String geographicalZone = '';
  String query = '';
  List<Map<String, dynamic>> suggestions = [];
  TextEditingController inputGeo = TextEditingController();

  // Fetching events from API
  static Future<List<Events>> getPosts() 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");
      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;
  }

  Future<void> searchSuggestions(String input) async {
    await dotenv.load(fileName: ".env"); // Load .env file

    final mapboxAccessToken = dotenv.env['MAPBOX_ACCESS_TOKEN'] ?? '';
    final url =
        'https://api.mapbox.com/geocoding/v5/mapbox.places/${input}.json?access_token=${mapboxAccessToken}&proximity=ip';
    final response = await http.get(Uri.parse(url));

    if (response.statusCode == 200) {
      final data = json.decode(response.body);
      setState(() {
        suggestions = (data['features'] as List)
            .map((feature) => {
                  'place_name': feature['place_name'],
                  'geometry': feature[
                      'geometry'], // Include geometry for latitude/longitude
                })
            .toList();
      });
    } else {
      throw Exception('Failed to load suggestions');
    }
  }

  Future<void> fetchPostsByLocation(double latitude, double longitude) async {
    SharedPreferences prefs = await SharedPreferences.getInstance();
    var accessToken = prefs.getString("access_token") ?? "";

    if (accessToken.isNotEmpty) {
      // Calculate the boundaries
      double radiusInKm = 50;
      double latDistance = radiusInKm / 111.0;
      double lonDistance = radiusInKm / (111.0 * cos(latitude * pi / 180));

      double minLat = latitude - latDistance;
      double maxLat = latitude + latDistance;
      double minLon = longitude - lonDistance;
      double maxLon = longitude + lonDistance;

      var url = Uri.parse("${globals.api}/events/search"
          "?min_lat=$minLat&max_lat=$maxLat"
          "&min_lon=$minLon&max_lon=$maxLon");

      final response = await http.get(url, headers: {
        "Content-Type": "application/json",
        HttpHeaders.cookieHeader: "access_token=$accessToken"
      });

      if (response.statusCode == 200) {
        final List<dynamic> body = json.decode(utf8.decode(response.bodyBytes));
        setState(() {
          filteredPosts = body.isNotEmpty
              ? body
                  .map((e) => Events.fromJson(e as Map<String, dynamic>))
                  .toList()
              : [];
        });
      } else {
        throw Exception('Failed to load posts');
      }
    }
  }

  Padding _buildGeographicalZoneSearchField() {
    return Padding(
      padding: const EdgeInsets.all(8.0),
      child: Column(
        children: [
          TextField(
            controller: inputGeo,
            decoration: InputDecoration(
              labelText: 'Search by geographical zone',
              border: OutlineInputBorder(),
              suffixIcon: IconButton(
                icon: Icon(Icons.clear),
                onPressed: () {
                  setState(() {
                    inputGeo.clear(); // Clear the text field
                    geographicalZone = ''; // Reset the geographical zone state
                    suggestions.clear(); // Optionally clear suggestions
                    filteredPosts.clear();
                  });
                },
              ),
            ),
            onChanged: (value) {
              setState(() {
                geographicalZone = value;
                searchSuggestions(value);
              });
            },
          ),
          if (suggestions.isNotEmpty)
            Container(
              height: 200,
              decoration: BoxDecoration(
                border: Border.all(color: Colors.blue),
                borderRadius: BorderRadius.circular(8),
              ),
              child: ListView.builder(
                shrinkWrap: true,
                itemCount: suggestions.length,
                itemBuilder: (context, index) {
                  return ListTile(
                    title: Text(suggestions[index]['place_name']),
                    onTap: () async {
                      final latitude =
                          suggestions[index]['geometry']['coordinates'][1];
                      final longitude =
                          suggestions[index]['geometry']['coordinates'][0];

                      setState(() {
                        geographicalZone = suggestions[index]['place_name'];
                        inputGeo.text = geographicalZone;
                        suggestions.clear();
                      });

                      await fetchPostsByLocation(latitude, longitude);
                    },
                  );
                },
              ),
            ),
        ],
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text("Item list menu"),
        backgroundColor: Colors.blue,
        foregroundColor: Colors.white,
        actions: [
          IconButton(
            icon: const Icon(Icons.search),
            onPressed: () {
              showSearch(
                context: context,
                delegate: SearchDelegateExample(),
              );
            },
          ),
        ],
      ),
      body: Column(
        children: [
          _buildGeographicalZoneSearchField(),
          Expanded(
            child: FutureBuilder<List<Events>>(
              future: postsFuture,
              builder: (context, snapshot) {
                if (snapshot.connectionState == ConnectionState.waiting) {
                  return const Center(child: CircularProgressIndicator());
                } else if (snapshot.hasData) {
                  final posts = snapshot.data!;
                  final displayedPosts =
                      filteredPosts.isEmpty ? posts : filteredPosts;
                  return buildPosts(displayedPosts);
                } else {
                  return const Text("No data available");
                }
              },
            ),
          ),
        ],
      ),
    );
  }

  // Function to display fetched data on screen
  Widget buildPosts(List<Events> posts) {
    return 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) => Divider(),
    );
  }
}

class SearchDelegateExample extends SearchDelegate {
  @override
  List<Widget> buildActions(BuildContext context) {
    return [
      IconButton(
        icon: const Icon(Icons.clear),
        onPressed: () {
          query = ''; // Clear the query text
          showSuggestions(context); // Show suggestions
        },
      ),
    ];
  }

  @override
  Widget buildLeading(BuildContext context) {
    return IconButton(
      icon: const Icon(Icons.arrow_back), // Default back icon
      onPressed: () {
        close(context, null); // Close the search delegate
      },
    );
  }

  @override
  Widget buildResults(BuildContext context) {
    // Here, you can return the actual results based on the query
    return FutureBuilder<List<Events>>(
      future: searchPosts(query), // Implement your own search logic
      builder: (context, snapshot) {
        if (snapshot.connectionState == ConnectionState.waiting) {
          return const Center(child: CircularProgressIndicator());
        } else if (snapshot.hasData) {
          final posts = snapshot.data!;
          return ListView.builder(
            itemCount: posts.length,
            itemBuilder: (context, index) {
              final post = posts[index];
              return ListTile(
                title: Text(post.name!),
                subtitle: Text(post.place!),
                onTap: () {
                  Navigator.push(
                    context,
                    MaterialPageRoute(
                      builder: (_) => ItemMenu(title: post.id!),
                    ),
                  );
                },
              );
            },
          );
        } else {
          return const Center(child: Text("No results found"));
        }
      },
    );
  }

  @override
  Widget buildSuggestions(BuildContext context) {
    return Container(); // This is for showing search suggestions if needed
  }

  Future<List<Events>> searchPosts(String query) 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/search?item=$query");
      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;
  }
}