NgRx throws 'TypeError: undefined is not a non-null object' when creating effect

Question

I'm using and learning Angular 15 and I have this injectable class which creates an NgRx effect to store data in a firebase database but it throws undefined.

constructor(private actions$: Actions, private http: HttpClient) {}

  fetchRecipes = createEffect((): any => {
      this.actions$.pipe(
        ofType(RecipesActions.FETCH_RECIPES),
        switchMap(() => {
          return this.http.get<Recipe[]>
          (
            'https://recipebook-re-default-rtdb.europe-west1.firebasedatabase.app/recipes.json',
          )
        }),
        map(recipes => {
          return recipes.map(recipe => {
            return {
              ...recipe,
              ingredients: recipe.ingredients ? recipe.ingredients : []
            };
          });
        }),
        map(recipes => {
          return new RecipesActions.SetRecipes(recipes);
        })
      );
    });

I'm a very-beginner in angular and I did this effect following a course, maybe the course is a bit outdated and something is deprecated but I can not figure it out.

EDIT: Code on GitHub (can't get stacblitz to work sorry)

Answer 1

I feel so dumb, the problem was that I didn't return the this.actions$.pipe() so it didn't returned anything after all...

constructor(private actions$: Actions, private http: HttpClient) {}

fetchRecipes = createEffect((): any => {
   return this.actions$.pipe(...)
});