import 'package:chipin_blogpost/features/authentication/services/auth_service.dart';
import 'package:chipin_blogpost/features/events/models/event_model.dart';
import 'package:chipin_blogpost/features/events/services/event_service.dart';
import 'package:chipin_blogpost/features/events/widgets/event_card.dart';
import 'package:flutter/material.dart';

class MyCreatedEventsScreen extends StatefulWidget {
  final EventService eventService;

  const MyCreatedEventsScreen({required this.eventService});

  @override
  _MyCreatedEventsScreenState createState() => _MyCreatedEventsScreenState();
}

class _MyCreatedEventsScreenState extends State<MyCreatedEventsScreen> {
  List<MyEventModel> myCreatedEvents = [];
  bool loading = true;

  @override
  void initState() {
    super.initState();
    fetchMyCreatedEvents();
  }

  Future<void> fetchMyCreatedEvents() async {
    try {
      String userId = await AuthService.getCreatorId();
      List<MyEventModel> events =
          await widget.eventService.getMyCreatedEvents(userId);
      setState(() {
        myCreatedEvents = events;
        loading = false;
      });
    } catch (error) {
      setState(() {
        loading = false;
      });
    }
  }

  @override
  Widget build(BuildContext context) {
    if (loading) {
      return const Center(
        child: CircularProgressIndicator(),
      );
    } else if (myCreatedEvents.isEmpty) {
      return const Center(
        child: Text('You do not have events created'),
      );
    } else {
      return ListView.builder(
        itemCount: myCreatedEvents.length,
        itemBuilder: (context, index) {
          MyEventModel event = myCreatedEvents[index];
          return EventCard(event: event, showJoinButton: false);
        },
      );
    }
  }
}

This code represents a screen in a mobile app where users can view their created events. Let's break it down step by step:

  1. We import necessary packages and classes that we will use in this code.
  2. We define a class called MyCreatedEventsScreen which extends StatefulWidget. This means it represents a screen that can change its state (content) over time.
  3. The MyCreatedEventsScreen class has a required parameter eventService of type EventService, which is passed when creating an instance of this class.
  4. Inside the MyCreatedEventsScreen class, we define a private class called _MyCreatedEventsScreenState, which extends State. This is the state class for the MyCreatedEventsScreen.
  5. Inside the _MyCreatedEventsScreenState class, we define a list variable myCreatedEvents, which will hold the created events of the user, and a boolean variable loading to indicate whether the data is still being loaded.
  6. In the initState method, which is a lifecycle method called when the state is initialized, we call the fetchMyCreatedEvents method to fetch the user's created events.
  7. The fetchMyCreatedEvents method is responsible for fetching the user's created events asynchronously. It first gets the user's ID using the AuthService class, then calls the getMyCreatedEvents method from the EventService class to retrieve the events. If successful, it updates the myCreatedEvents list and sets loading to false. If there is an error, it sets loading to false as well.
  8. The build method is where we build the UI for the screen. If loading is true, we display a CircularProgressIndicator widget in the center of the screen to indicate that data is being loaded.
  9. If myCreatedEvents is empty, we display a simple message saying "You do not have events created" in the center of the screen.
  10. If there are events in myCreatedEvents, we return a ListView.builder that dynamically builds a list of EventCard widgets based on the myCreatedEvents list. Each EventCard represents a created event and has a join button that is not shown (showJoinButton: false).

That's a complete breakdown of the code. It defines a screen where users can view their created events, handles fetching and displaying the events, and provides appropriate loading and error messages to the user.