Bloc: Transform Example

[rsnider19]

Can you please provide an example of overriding transform? Specifically debouncing a certain event (e.g. Search), but not other events in the bloc? Thanks!

[felangel]

Hi @rsnider19 if we use the CounterBloc as an example and introduce a Search event which we want to debounce you can do something like:

@override
Stream<CounterState> transform(
  Stream<CounterEvent> events,
  Stream<CounterState> Function(CounterEvent event) next,
) {
    final observableStream = events as Observable<CounterEvent>;
    final nonDebounceStream = observableStream.where((event) {
      return (event is! Search);
    });
    final debounceStream = observableStream.where((event) {
      return (event is Search);
    }).debounce(Duration(milliseconds: 300));
    return super.transform(nonDebounceStream.mergeWith([debounceStream]), next);
}

Essentially, in the transform override you have access to the raw Stream<Event> and you can do whatever manipulation/transformation and return the new Stream<Event> which will be used by mapEventToState.

In a simple case where you want to debounce all events you can simply do:

@override
Stream<CounterState> transform(
  Stream<CounterEvent> events,
  Stream<CounterState> Function(CounterEvent event) next,
) {
   return super.transform(
      (events as Observable<CounterEvent>).debounce(
        Duration(milliseconds: 300),
      ),
      next,
    );
}

You can checkout the github search example app for an example of debouncing all events.

Let me know if that makes sense or if you have other questions.

[felangel]

Closing this for now but feel free to comment with any additional questions and I'll reopen it 👍

[rsnider19]

Worked perfect! Thanks!