How to create a functional with editing a list item?

Question

I have an application in which, when clicking on FAB, an item is added to the list with a title, description and id.I need to implement a functional: so that when clicking on an item, the bottom sheet dialog pops up and there are two fields for editing title and description. When clicking on the event widget, the modal window receives its full information by the event id through the provider, the event object cannot be passed directly to the dialog. How can this be implemented? My code:

class HomeScreen extends StatefulWidget {
  const HomeScreen({Key? key}) : super(key: key);

  @override
  State<HomeScreen> createState() => _HomeScreenState();
}

class _HomeScreenState extends State<HomeScreen> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        child: Consumer<ListModel>(
          builder: (context, event, child) {
            return ListView.builder(
              itemCount: event.eventList.length,
              itemBuilder: (context, index) {
                return Container(
                  child: ListTile(
                    key: Key(event.eventList[index].id),
                    title: Text(
                      event.eventList[index].title),
                    subtitle: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Text(
                          event.eventList[index].detail),
                        Text(
                          event.eventList[index].id),
                      ],
                    ),
                    onTap: () {
                      showModalBottomSheet<void>(
                        context: context,
                        builder: (BuildContext context) {
                          return ModalBottomSheet();
                        },
                      );
                    },
                  ),
                );
              },
            );
          },
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          Provider.of<ListModel>(context, listen: false).addEventToList();
        },
        child: const Icon(Icons.add),
      ),
    );
  }
}

class ModalBottomSheet extends StatefulWidget {
  const ModalBottomSheet({Key? key}) : super(key: key);

  @override
  State<ModalBottomSheet> createState() => _ModalBottomSheetState();
}

class _ModalBottomSheetState extends State<ModalBottomSheet> {

  @override
  Widget build(BuildContext context) {
    return Container(
      height: 200,
      color: Colors.amber,
      child: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          mainAxisSize: MainAxisSize.min,
          children: [
            const Text('Change Event'),
            ElevatedButton(
              child: const Text('Close BottomSheet'),
              onPressed: () => Navigator.pop(context),
            )
          ],
        ),
      ),
    );
  }
}

class EventModel {
  String title;
  String detail;
  String id;

  EventModel(this.title, this.detail, this.id);
}

class ListModel extends ChangeNotifier {
  List<EventModel> eventList = [];

  addEventToList() {
    EventModel eventModel =
        EventModel('Event title', 'Event text', 'Id: ${eventList.length + 1}');
    eventList.add(eventModel);

    notifyListeners();
  }
}