Anguar NGXS - ProductsState

products.state.ts

import { tap } from "rxjs";
import { Injectable } from "@angular/core";
import { Action, Selector, State, StateContext } from "@ngxs/store";

import { GetProducts } from "./products.actions";
import { ProductsStateModel } from "../models/products-state.model";
import { ProductsService } from "@store/products/services/products.service";

@State<ProductsStateModel>({
  name: 'products',
  defaults: {
    skip: 0,
    limit: 0,
    total: 0,
    products: []
  }
})
@Injectable()
export class ProductsState {
  constructor(private readonly productsService: ProductsService) {
  }

  @Selector()
  static selectProducts({ products }: ProductsStateModel) {
    return products;
  }

  @Action(GetProducts)
  dispatchProductsState(context: StateContext<ProductsStateModel>, { request }: GetProducts) {
    return this.productsService.getProducts(request)
      .pipe(tap(response => context.patchState({ ...response })))
  }
}