feat: Add an event parameter in BlocListener

[babakoto]

Thanks to all the contributors!

I would like to know if it’s possible to add an event in the BlocListener parameter.

Let’s say my state contains 3 fields like this:

class Example {
   final a;
   final b;
   final c;
}

Let’s assume EventA modifies only the a field, and EventB modifies both a and c.

I want to know which event modified the a field in my state, using a BlocListener like this:

BlocListener<AuthBloc, AuthState>(
  listener: (context, state, event) {
    if(event is EventA) {
      // Actions related to EventA
    }
  },
);

Currently, the solution I’m using is to store the event in the state itself:

class Example {
   final a;
   final b;
   final c;
   final ExampleEvent event;
}

The problem with BlocObserver is that it doesn’t have access to the Flutter context, which doesn’t solve my issue.

[DanMossa]

That's exactly what I'm doing and would love this as well.

Would help solve #4342

[felangel]

Hi @babakoto 👋
Thanks for opening an issue!

Rather than exposing event information to the BlocListener API, I highly recommend revisiting your state model. The state model should contain all relevant information needed for the presentation layer to function. If you really need to differentiate between the root cause for a property to have changed, you should consider adding more information/restructuring your state. I can’t provide a concrete suggestion without additional context but hope that helps 👍

If you’re still having trouble, please share additional context and explain what specifically you’re trying to achieve and I’m more than happy to provide suggestions/code snippets.

[DanMossa]

@felangel
Do you feel like it's acceptable for the events to bleed like that throughout the Bloc and UI?
I just wanna make sure it's "okay" in terms of architecture and the layering? and that I'm not crossing paths between things that shouldn't know about each other.

[felangel]

@felangel Do you feel like it's acceptable for the events to bleed like that throughout the Bloc and UI? I just wanna make sure it's "okay" in terms of architecture and the layering? and that I'm not crossing paths between things that shouldn't know about each other.

Not sure what you mean. The UI is responsible for notifying the bloc of events and re-rendering in response to states. How you model the states is totally up to you and depends on the feature you’re building.

[babakoto]

@felangel

If the event parameter were accessible in the Listener, it would be possible to group BloCs by feature rather than by screen. In an application with more than 35 screens

Context: Authentication Management

I use copyWith, but I don’t define multiple classes to represent the state in my BloCs. My goal is to group features within the same context into a single BloC instead of creating around thirty.

I have an AuthBloC that handles multiple actions: sign-in, sign-up, and password reset. These actions can coexist on the same page, for example, in a TabView, and must display different SnackBar messages depending on the success of the action (successful authentication, password reset, etc.).

Form Management

My BloCs do not directly manage forms; they only receive a Map<String, dynamic> as a parameter in events, provided by flutter_form_builder, which handles validation.

Issue Faced

When displaying a SnackBar in the BlocListener, I cannot easily determine which action succeeded (sign-up or sign-in). With multiple dedicated BloCs, this problem wouldn’t arise, but I prefer to limit their number, especially since both sign-in and sign-up return a User object.

How can I accurately identify which action was successful in the Listener without having to create multiple BloCs?

Current Solution

The solution I’m using is adding an event field to the state:

if (state.query.isSuccess && state.event is OnSignInEvent) {
  // Handle sign-in success
}

if (state.query.isSuccess && state.event is OnSignUpEvent) {
  // Handle sign-up success
}