Bloc: "Cannot add new events after calling close"

[mohamoha6200]

Hello and thank you for the amazing work you've put into the library :D

After doing some research I've finally decided to use Flutter_bloc as the main state management package in my current project that i've been working on it for more than a week now.

I'm aware that the issue has been has been raised before but i couldnt make it work even after looking it up !

So in my app I try to show the storePage depending on user's authState I guess that work fine the problem : since StorePage includes 3 nested blocs using a MultiBlocProvider :

MultiBlocProvider(
providers: [
BlocProvider(
create: (BuildContext context) => storePageBloc,
),
BlocProvider(
create: (BuildContext context) => categoryBloc,
),
BlocProvider(
create: (BuildContext context) => productBloc,
),
], )

I can fetch the store details and the catalog (categories/products) of the store correctly when I click on a category a SelectedACategory() event is dispatched then the products show up perfectly , my usecase here is that if a product is selected --SelectedAProduct() event-- while the user is Unauthenticated the signIn screen will popUP - till this point things are okay!
As I SignIn and I get redirected back to the StorePage the Store is there but as soon as I click on a category or a product (events get dispatched) I get this error saying that I can't add events after calling close !

Here is my InitState in the StorePage :

void initState() {

storePageBloc = getIt.get<StorePageBloc>();
categoryBloc = getIt.get<CategoryBloc>();
productBloc = getIt.get<ProductBloc>();

storePageBloc.add(StorePageInitialized(storeId: widget.storeId));

super.initState();

}

the storeBLoc since its the upper Bloc doesnt have a problem adding events but the inner ones (category and product) do ! Any idea why such behavior ?
I would like to keep the blocs alive because the user gets back to the StorePage right after login is that possible / advisable ? or instead reinstantiate/reset them to their initState ?
I tried dispatching an Initializing event for both category and product blocs but had the exact same error.

If anyone wanted to see the code to reproduce/check you can find it here :
https://github.com/mohamoha6200/Multi_commerce

To Reproduce
Steps to reproduce the behavior:

1. Select a store from the store list
2. Select a category
3. Select a product
4. Just click the signIn button
5. Select a category or a product

Expected behavior
Exactly the error I mentioned with the .add(event) highlighted.
Wanted behavior
Being able to continue the operations (selectingEvents ..etc) using the blocs normally.

Please feel free to point out any bad practices as I'm sure I made some since I'm new to BLoc.
The project is a bit sensitive so your help is super appreciated.

Thank you , best regards.

[theDarkBoffin]

Hi, @mohamoha6200.
Looking at your repository, if I'm not wrong, you're using Singleton Blocs.
Now what you're witnessing is expected behavior because BlocProvider closes the Bloc that you return in the create method, when the widget is disposed of, as the documentation of BlocProvider says.
That's why your StorePageBloc or, whatever singleton Bloc it is, is being closed once the widget is disposed of. And once a Bloc is closed, it doesn't respond to events anymore.

What you really need here is to pass the singleton Bloc to BlocProvider as a value argument instead of passing it via create. That way BlocProvider knows that it shouldn't close the Bloc, and you'll manually handle it. The below code should solve your problem:

MultiBlocProvider(
       providers: [
            BlocProvider(
                value: storePageBloc,
             ),
           BlocProvider(
               value: categoryBloc,
             ),
           BlocProvider(
               value: productBloc,
            ),
],)

[felangel]

As @theDarkBoffin mentioned, when BlocProvider creates the bloc, it also closes the bloc. You can either manually handle closing the bloc and use the value constructor as mentioned above, or you should lift the BlocProvider higher up in the tree because it's being prematurely closed.

I took a closer look and the problem is you're using both BlocProvider and get_it simultaneously. I would highly recommend using BlocProvider for providing blocs over get_it because BlocProvider manages the bloc lifecycle for you and handles automatically closing the bloc when it is no longer needed. I think it's ok to use get_it for repositories if you'd like but I'd recommend removing the blocs from service_locator.dart and instead creating them in BlocProvider as needed.

I created a sample PR which starts doing this refactor but you need to take it to completion. Also, feel free to message me on discord and I'm happy to setup a live coding session where we work through it together 👍

[mohamoha6200]

@theDarkBoffin : Thanks for the quick response !
I followed what you said and it worked like a charm :D I get the logic it makes perfect sense !
@felangel : Man I saw your intervention in the git I greatly appreciate your help , I managed to eliminate get_it for my blocs and went through the widgets as you recommended to switch to BlocProvider and it worked !
Can't thank you enough guys you got me back on track ;)
As for the Discord count me in 💯 😋