02-api-actions

Author: MikeRyanDev

src/app/books/actions/books-api.actions.ts

@@ -1,2 +1,22 @@
-import { createAction } from "@ngrx/store";
+import { createAction, props } from "@ngrx/store";
 import { BookModel } from "src/app/shared/models/book.model";
+
+export const booksLoaded = createAction(
+  "[Books API] Books Loaded Success",
+  props<{ books: BookModel[] }>()
+);
+
+export const bookCreated = createAction(
+  "[Books API] Book Created",
+  props<{ book: BookModel }>()
+);
+
+export const bookUpdated = createAction(
+  "[Books API] Book Updated",
+  props<{ book: BookModel }>()
+);
+
+export const bookDeleted = createAction(
+  "[Books API] Book Deleted",
+  props<{ bookId: string }>()
+);

src/app/books/components/books-page/books-page.component.ts

@@ -7,7 +7,7 @@ import {
   BookRequiredProps
 } from "src/app/shared/models/book.model";
 import { BooksService } from "src/app/shared/services/book.service";
-import { BooksPageActions } from "../../actions";
+import { BooksPageActions, BooksApiActions } from "../../actions";
 
 @Component({
   selector: "app-books",
@@ -35,6 +35,8 @@ export class BooksPageComponent implements OnInit {
     this.booksService.all().subscribe(books => {
       this.books = books;
       this.updateTotals(books);
+
+      this.store.dispatch(BooksApiActions.booksLoaded({ books }));
     });
   }
 
@@ -69,9 +71,11 @@ export class BooksPageComponent implements OnInit {
   saveBook(bookProps: BookRequiredProps) {
     this.store.dispatch(BooksPageActions.createBook({ book: bookProps }));
 
-    this.booksService.create(bookProps).subscribe(() => {
+    this.booksService.create(bookProps).subscribe(book => {
       this.getBooks();
       this.removeSelectedBook();
+
+      this.store.dispatch(BooksApiActions.bookCreated({ book }));
     });
   }
 
@@ -80,9 +84,11 @@ export class BooksPageComponent implements OnInit {
       BooksPageActions.updateBook({ bookId: book.id, changes: book })
     );
 
-    this.booksService.update(book.id, book).subscribe(() => {
+    this.booksService.update(book.id, book).subscribe(book => {
       this.getBooks();
       this.removeSelectedBook();
+
+      this.store.dispatch(BooksApiActions.bookUpdated({ book }));
     });
   }
 
@@ -92,6 +98,8 @@ export class BooksPageComponent implements OnInit {
     this.booksService.delete(book.id).subscribe(() => {
       this.getBooks();
       this.removeSelectedBook();
+
+      this.store.dispatch(BooksApiActions.bookDeleted({ bookId: book.id }));
     });
   }
 }