manage server validations

src/components/courses/ManageCoursePage.js

@@ -41,10 +41,16 @@ function ManageCoursePage({ courses, authors, actions, history, ...props }) {
   function handleSave(event) {
     event.preventDefault();
     setSaving(true);
-    actions.saveCourse(course).then(() => {
-      toast.success("Course saved.");
-      history.push("/courses");
-    });
+    actions
+      .saveCourse(course)
+      .then(() => {
+        toast.success("Course saved.");
+        history.push("/courses");
+      })
+      .catch((error) => {
+        setSaving(false);
+        setErrors({ onSave: error.message });
+      });
   }
 
   return authors.length === 0 || course.length === 0 ? (

src/redux/actions/actionTypes.js

@@ -4,3 +4,4 @@ export const LOAD_AUTHORS_SUCCESS = "LOAD_AUTHORS_SUCCESS";
 export const CREATE_COURSE_SUCCESS = "CREATE_COURSE_SUCCESS";
 export const UPDATE_COURSE_SUCCESS = "UPDATE_COURSE_SUCCESS";
 export const BEGIN_API_CALL = "BEGIN_API_CALL";
+export const API_CALL_ERROR = "API_CALL_ERROR";

src/redux/actions/apiStatusActions.js

@@ -3,3 +3,7 @@ import * as types from "./actionTypes";
 export function beginApiCall() {
   return { type: types.BEGIN_API_CALL };
 }
+
+export function apiCallError() {
+  return { type: types.API_CALL_ERROR };
+}

src/redux/actions/authorActions.js

@@ -1,6 +1,6 @@
 import * as types from "./actionTypes";
 import * as authorApi from "../../api/authorApi";
-import { beginApiCall } from "./apiStatusActions";
+import { beginApiCall, apiCallError } from "./apiStatusActions";
 
 function loadAuthorsSuccess(authors) {
   return { type: types.LOAD_AUTHORS_SUCCESS, authors };
@@ -15,6 +15,7 @@ export function loadAuthors() {
         dispatch(loadAuthorsSuccess(authors));
       })
       .catch((error) => {
+        dispatch(apiCallError(error));
         throw error;
       });
   };

src/redux/actions/courseActions.js

@@ -1,6 +1,6 @@
 import * as types from "./actionTypes";
 import * as courseApi from "../../api/courseApi";
-import { beginApiCall } from "./apiStatusActions";
+import { beginApiCall, apiCallError } from "./apiStatusActions";
 
 function loadCoursesSuccess(courses) {
   return { type: types.LOAD_COURSES_SUCCESS, courses };
@@ -23,6 +23,7 @@ export function loadCourses() {
         dispatch(loadCoursesSuccess(courses));
       })
       .catch((error) => {
+        dispatch(apiCallError(error));
         throw error;
       });
   };
@@ -40,6 +41,7 @@ export function saveCourse(course) {
           : dispatch(createCourseSuccess(savedCourse));
       })
       .catch((error) => {
+        dispatch(apiCallError(error));
         throw error;
       });
   };

src/redux/reducers/apiStatusReducer.js

@@ -11,7 +11,10 @@ export default function apiCallStatusReducer(
 ) {
   if (action.type == types.BEGIN_API_CALL) {
     return state + 1;
-  } else if (actionTypeEndsInSuccess(action.type)) {
+  } else if (
+    action.type == types.API_CALL_ERROR ||
+    actionTypeEndsInSuccess(action.type)
+  ) {
     return state - 1;
   }