diff --git a/libs/books-page/src/lib/book-api.effects.ts b/libs/books-page/src/lib/book-api.effects.ts
index 7cd0a45..cedecaf 100644
--- a/libs/books-page/src/lib/book-api.effects.ts
+++ b/libs/books-page/src/lib/book-api.effects.ts
@@ -11,11 +11,46 @@ export class BooksApiEffects {
   loadBooks$ = createEffect(() =>
     this.actions$.pipe(
       ofType(BooksPageActions.enter),
-      mergeMap(() =>
+      exhaustMap(() =>
         this.booksService
           .all()
           .pipe(map((books) => BooksApiActions.booksLoaded({ books })))
       )
     )
   );
+
+  createBook$ = createEffect(() =>
+    this.actions$.pipe(
+      ofType(BooksPageActions.createBook),
+      concatMap((action) =>
+        this.booksService
+          .create(action.book)
+          .pipe(map((book) => BooksApiActions.bookCreated({ book })))
+      )
+    )
+  );
+
+  updateBook$ = createEffect(() =>
+    this.actions$.pipe(
+      ofType(BooksPageActions.updateBook),
+      concatMap((action) =>
+        this.booksService
+          .update(action.bookId, action.changes)
+          .pipe(map((book) => BooksApiActions.bookUpdated({ book })))
+      )
+    )
+  );
+
+  deleteBook$ = createEffect(() =>
+    this.actions$.pipe(
+      ofType(BooksPageActions.deleteBook),
+      mergeMap((action) =>
+        this.booksService
+          .delete(action.bookId)
+          .pipe(
+            map(() => BooksApiActions.bookDeleted({ bookId: action.bookId }))
+          )
+      )
+    )
+  );
 }
diff --git a/libs/books-page/src/lib/books-page/books-page.component.ts b/libs/books-page/src/lib/books-page/books-page.component.ts
index 1348830..2999759 100644
--- a/libs/books-page/src/lib/books-page/books-page.component.ts
+++ b/libs/books-page/src/lib/books-page/books-page.component.ts
@@ -1,14 +1,13 @@
 import { Component, OnInit } from '@angular/core';
 import { Store } from '@ngrx/store';
 import { Observable } from 'rxjs';
-import { BooksPageActions, BooksApiActions } from '@book-co/books-page/actions';
+import { BooksPageActions } from '@book-co/books-page/actions';
 import { BookModel, BookRequiredProps } from '@book-co/shared-models';
 import {
   selectAllBooks,
   selectActiveBook,
   selectBooksEarningsTotals,
 } from '@book-co/shared-state-books';
-import { BooksService } from '@book-co/shared-services';
 
 @Component({
   selector: 'bco-books-page',
@@ -20,7 +19,7 @@ export class BooksPageComponent implements OnInit {
   currentBook$: Observable<BookModel | null>;
   total$: Observable<number>;
 
-  constructor(private booksService: BooksService, private store: Store) {
+  constructor(private store: Store) {
     this.books$ = store.select(selectAllBooks);
     this.currentBook$ = store.select(selectActiveBook);
     this.total$ = store.select(selectBooksEarningsTotals);
@@ -52,33 +51,15 @@ export class BooksPageComponent implements OnInit {
 
   saveBook(bookProps: BookRequiredProps) {
     this.store.dispatch(BooksPageActions.createBook({ book: bookProps }));
-
-    this.booksService.create(bookProps).subscribe((book) => {
-      this.removeSelectedBook();
-
-      this.store.dispatch(BooksApiActions.bookCreated({ book }));
-    });
   }
 
   updateBook(book: BookModel) {
     this.store.dispatch(
       BooksPageActions.updateBook({ bookId: book.id, changes: book })
     );
-
-    this.booksService.update(book.id, book).subscribe((book) => {
-      this.removeSelectedBook();
-
-      this.store.dispatch(BooksApiActions.bookUpdated({ book }));
-    });
   }
 
   onDelete(book: BookModel) {
     this.store.dispatch(BooksPageActions.deleteBook({ bookId: book.id }));
-
-    this.booksService.delete(book.id).subscribe(() => {
-      this.removeSelectedBook();
-
-      this.store.dispatch(BooksApiActions.bookDeleted({ bookId: book.id }));
-    });
   }
 }