RxJS: skip conditional mergeMap

Question

I have such service method:

updateUser(article) {
        this.httpClient
            .put(`articles/${article.id}`, article)
            .pipe(
                map(res => res.response),
                mergeMap(updatedArticle =>
                    this.articlesTagsAPI.someMethod(updatedArticle.id).pipe(
                        map(tags => ({ ...updatedArticle, tags })),
                        article.articleType === 'news'
                            ? mergeMap(() =>
                                  this.articlesTagsAPI.someOtherMethod(updatedArticle.id, article.tags).pipe(
                                      map(() => {
                                          return {
                                              ...updatedArticle,
                                              tags: article.tags
                                          };
                                      })
                                  )
                              )
                            : null
                    )
                )
            );
}

as you can see - I'm trying to add a conditional mergeMap (if condition -> call else one more method) is it possible to do somehow?

because returning null - isn't the best idea

something like this should happen if conditional is invalid:

updateUser(article) {
            this.httpClient
                .put(`articles/${article.id}`, article)
                .pipe(
                    map(res => res.response),
                    mergeMap(updatedArticle =>
                        this.articlesTagsAPI.someMethod(updatedArticle.id).pipe(
                            map(tags => ({ ...updatedArticle, tags }))
                        )
                    )
                );
    }

Answer 1

Try this:

updateUser(article) {

  this.httpClient
        .put(`articles/${article.id}`, article)
        
       .pipe(
            map(res => res.response),
            

                mergeMap(() =>       
                 this.articlesTagsAPI.someOtherMethod(updatedArticle.id, 
                           article.tags).pipe(
                                  map(() => {
                                     if(article.articleType === 'news'){
                                      return {
                                          ...updatedArticle,
                                          tags: article.tags
                                      };
                                     }else{ return of([])}
                                  })
                              )
                          )
                        
                )
            )
        );

}

Answer 2

As stated in this very useful article, the proper way of doing this would be to add the of instruction to always return an Observable its value inside your final subscribe.

Try this:

updateUser(article) {

    this.httpClient
        .put(`articles/${article.id}`, article)
        .pipe(
            map(res => res.response),
            mergeMap(updatedArticle =>
                this.articlesTagsAPI.someMethod(updatedArticle.id).pipe(
                    map(tags => ({ ...updatedArticle, tags })),
                    article.articleType === 'news'
                        ? mergeMap(() =>
                                this.articlesTagsAPI.someOtherMethod(updatedArticle.id, article.tags).pipe(
                                    map(() => {
                                        return {
                                            ...updatedArticle,
                                            tags: article.tags
                                        };
                                    })
                                )
                            )
                        : of(null)
                )
            )
        );
}