Flutter/Riverpod Delete Item and Navigate - Best Practice

Question

I'm using Riverpod in a flutter app. Im showing items in a listview from a firebase database:

final eventStream = StreamProvider.autoDispose<Event?>(
        (ref) => ref.watch(eventService).eventStream(eventId: eventId));

Consumer(
          builder: (context, watch, child) {
                data: (Event? event) { LISTVIEW }
                loading: () => const CircularProgressIndicator(),
                error: (error, stackTrace) => Text(stackTrace.toString()));
          },

The problem is: when i delete the event (eventId) on the screen, where the consumer is listening on the stream and navigate to another screen, then it shows an error (stackTrace) because the consumer isn't finding the element anymore. I delete the item with a simple function:

void deleteEvent(BuildContext context) async {
    context.read(eventService).deleteEvent(eventId: eventId);
    await Navigator.push(
        context,
        MaterialPageRoute<Widget>(
        builder: (context) =>
        CreateEventScreen()));
}

Now my question: howto deal with that use case?

Answer 1

import 'package:dede_app/main.dart';
import 'package:dede_app/model/event.dart';
import 'package:dede_app/screens/add_item_to_event_screen/event_item_form_container.dart';
import 'package:dede_app/screens/add_item_to_event_screen/event_item_list_widget.dart';
import 'package:dede_app/screens/create_event_screen/create_event_screen.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_gen/gen_l10n/app_localizations.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:share_plus/share_plus.dart';
import 'drop_down_widget.dart';

class AddItemsToEventScreen extends StatelessWidget {
  AddItemsToEventScreen({Key? key, required this.eventId}) : super(key: key);

  // Declare a field that holds the Todo.
  final String eventId;

  @override
  Widget build(BuildContext context) {
    final eventStream = StreamProvider.autoDispose<Event?>(
        (ref) => ref.watch(eventService).eventStream(eventId: eventId));

    return Scaffold(
      appBar: AppBar(
        backgroundColor: Colors.lightGreen,
        // title: Text(AppLocalizations.of(context)!.addItemsToEventTitle),
        title: DropDownWidget(),
      ),
      body: Column(children: <Widget>[
        Consumer(
          builder: (context, watch, child) {
            final event = watch(eventStream);
            return event.when(
                data: (Event? event) {
                  if(event!.id != null) {
                    return EventItemFormContainer(context, event);
                  } else {
                    return const Text('Kein gültiger Event');
                  }
                },
                loading: () => const CircularProgressIndicator(),
                error: (error, stackTrace) => Text(stackTrace.toString()));
          },
        ),
        Expanded(
          child: SingleChildScrollView(
            child: EventItemList(eventId: this.eventId),
          ),
        ),
      ]),
      bottomNavigationBar: Container(
        height: 80,
        margin: const EdgeInsets.symmetric(vertical: 10, horizontal: 10),
        child: Row(
          children: <Widget>[
            Container(
              width: 66,
              child: Column(
                mainAxisAlignment: MainAxisAlignment.center,
                children: <Widget>[const Icon(Icons.edit, color: Colors.black)],
              ),
            ),
            Container(
              width: 80,
              child: Column(
                mainAxisAlignment: MainAxisAlignment.center,
                children: <Widget>[
                  ElevatedButton(
                      style: ButtonStyle(
                        elevation : MaterialStateProperty.all(0),
                        backgroundColor: MaterialStateProperty.all( Colors.transparent),
                      ),
                      onPressed: () => deleteEvent(context),
                      child: const Icon(Icons.delete, color: Colors.black))],
              ),
            ),
            Expanded(
              child: Container(
                alignment: Alignment.centerRight,
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.end,
                  children: <Widget>[
                    ElevatedButton(
                      onPressed: () {Share.share('Hier die URL zum Event einfügen', subject: 'Event xyz');},
                      child: Row(
                        mainAxisAlignment: MainAxisAlignment.spaceBetween,
                        children: <Widget>[
                          const Icon(
                            Icons.send,
                            color: Colors.black,
                          ),
                          Text(AppLocalizations.of(context)!
                              .addItemsToEventSendList),
                        ],
                      ),
                    ),
                  ],
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }

  void deleteEvent(BuildContext context) async {
    context.read(eventService).deleteEvent(eventId: eventId);
    await Navigator.push(
        context,
        MaterialPageRoute<Widget>(
        builder: (context) =>
        CreateEventScreen()));
  }
}