Error: Type argument 'RoutesBloc' doesn't conform to the bound 'BlocBase<S>' of the type variable 'B' on 'BlocBuilder'

Question

I'm getting this error and I have no clue where it's coming from.

class Routes extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return BlocBuilder<RoutesBloc, RoutesEvent>( // <-- It occurs here
      builder: (context, state) {
        return Text('...');
      },
    );
  }
}

Full error:

lib/screens/home_screen.dart:86:12: Error: Type argument 'RoutesBloc' doesn't conform to the bound 'BlocBase' of the type variable 'B' on 'BlocBuilder'.

• 'RoutesBloc' is from '/blocs/routes/routes_bloc.dart' ('lib/blocs/routes/routes_bloc.dart').
• 'BlocBase' is from 'package:bloc/src/bloc.dart' ('../../AppData/Local/Pub/Cache/hosted/pub.dartlang.org/bloc-7.0.0/lib/src/bloc.dart'). Try changing type arguments so that they conform to the bounds. return BlocBuilder<RoutesBloc, RoutesEvent>( ^

I use a multiplocprovider in my main.dart like this:

MultiBlocProvider(
  providers: [
      ...,
      BlocProvider<RoutesBloc>(
          create: (_) => RoutesBloc(
            apiRepository: ApiRepository.create(),
          )..add(RoutesLoaded()),
        ),
      ],
  child: AppView(),
)

routes_state.dart:

abstract class RoutesState extends Equatable {

const RoutesState();

  @override
  List<Object> get props => [];
}

class RoutesLoadInProgress extends RoutesState {}

class RoutesLoadSuccess extends RoutesState {
  final List<BoulderingRoute> routes;

  const RoutesLoadSuccess([this.routes = const []]);

  @override
  List<Object> get props => [routes];
}

class RoutesLoadFailure extends RoutesState {}

routes_event.dart:

abstract class RoutesEvent extends Equatable {
  const RoutesEvent();

  @override
  List<Object> get props => [];
}

class RoutesLoaded extends RoutesEvent {}

class RouteAdded extends RoutesEvent {
  final BoulderingRoute route;

  const RouteAdded({this.route}) : assert(route != null);

  @override
  List<Object> get props => [route];
}

class RouteUpdated extends RoutesEvent {
  final BoulderingRoute route;

  const RouteUpdated({this.route}) : assert(route != null);

  @override
  List<Object> get props => [route];
}

class RouteDeleted extends RoutesEvent {
  final BoulderingRoute route;

  const RouteDeleted({this.route}) : assert(route != null);

  @override
  List<Object> get props => [route];
}

routes_bloc.dart:

class RoutesBloc extends Bloc<RoutesEvent, RoutesState> {
  final ApiRepository _apiRepository;

  RoutesBloc({ApiRepository apiRepository})
      : assert(apiRepository != null),
        this._apiRepository = apiRepository,
        super(RoutesLoadInProgress());

  @override
  Stream<RoutesState> mapEventToState(
    RoutesEvent event,
  ) async* {
    print(event);
    if (event is RoutesLoaded) {
      yield* _mapRoutesLoadedToState();
    }
  }

  Stream<RoutesState> _mapRoutesLoadedToState() async* {
    try {
      print('start');
      final List<BoulderingRoute> routes =
          await _apiRepository.fetchBoulderingRoutes();
      yield RoutesLoadSuccess(routes);
    } catch (_) {
      yield RoutesLoadFailure();
    }
  }
}

I firstly thought that there must be something wrong with my RoutesBloc but changing the blocbuilder to a bloc that I'm successfully using at another place ends up with the same error.

Does someone know where this is coming from?

Answer 1

It should be return BlocBuilder<RoutesBloc, RoutesState> Check this: https://pub.dev/packages/flutter_bloc#blocbuilder

 BlocBuilder<BlocA, BlocAState>(
   builder: (context, state) {
     // return widget here based on BlocA's state
   }
 )