The type 'void' can not be assigned to the type 'ObservableInput <Action>'

Question

I'm receiving the next type error when I'm trying to dispatch an observable of actions in my effect as shown below:

 @Effect()
    rideSummary$: Observable<Action> = this.actions$.pipe(
        ofType<GetRideSummary>(RideActionTypes.GetRideSummary),
        map(action => action.payload),
        switchMap(payload => {
            const { ride, passenger } = payload;
            const allPassengers = [...ride.passengers, passenger];
            this.store.dispatch(new SetLoading);
            return this.directionService.computeRideRouteSummary(ride, allPassengers)
            .then((summary: RideRouteSummary) => {
                const updatedRoute = Geometry.newFromData({
                    type: Geometry.LINE_STRING,
                    coordinates: summary.route
                });

                const totalTime = summary.totalTime;
                const arrivalTime = ride.type === Ride.TYPE_TOWORK ?
                    ride.hour :
                    ride.hour + summary.totalTime;
                const departureTime = ride.type === Ride.TYPE_TOWORK ?
                    ride.hour - summary.totalTime :
                    ride.hour;
               this.store.dispatch(new UnsetLoading);
               return this.store.dispatch(new GetRideSummarySuccess({
                    updatedRoute,
                    totalTime,
                    arrivalTime,
                    departureTime
                }));
                }
            ).catch(error => {
                this.store.dispatch(new UnsetLoading);
                catchError(() => of(new HandleError(error)));
            });
        })
    );

The type error says:

Unable to assign an argument of type "(payload: {ride: Ride; passenger: Passenger;}) => void" to the type parameter "(value: {ride: Ride; passenger: Passenger;}, index: number) => ObservableInput <Action> ".
The type 'void' can not be assigned to the type 'ObservableInput <Action>'.

I'm not sure what is the problem with the code. Seems to be something related to the promise. Any help?

Answer 1

The effect is defined as @Effect() meaning it expects an Action. The quick but dirty fix is to define your effect as @Effect({dispatch: false}). The more proper fix is to remove all of the store dispatches in your effect and return an action.

A quick example would be:

switchMap(payload => {
  this.store.dispatch(new FooBar());
}

To:

switchMap(payload => {
  return new FooBar();
}