diff --git a/src/components/courses/ManageCoursePage.js b/src/components/courses/ManageCoursePage.js index 723b710..be4e605 100644 --- a/src/components/courses/ManageCoursePage.js +++ b/src/components/courses/ManageCoursePage.js @@ -1,6 +1,6 @@ import React, { useEffect, useState } from "react"; import { connect } from "react-redux"; -import { loadCourses } from "../../redux/actions/courseActions"; +import { loadCourses, saveCourse } from "../../redux/actions/courseActions"; import { loadAuthors } from "../../redux/actions/authorActions"; import PropTypes from "prop-types"; import { bindActionCreators } from "redux"; @@ -33,12 +33,18 @@ function ManageCoursePage({ courses, authors, actions, ...props }) { })); } + function handleSave(event) { + event.preventDefault(); + actions.saveCourse(course); + } + return ( ); } @@ -63,7 +69,8 @@ function mapDispatchToProps(dispatch) { actions: bindActionCreators( { loadCourses, - loadAuthors + loadAuthors, + saveCourse }, dispatch ) diff --git a/src/redux/actions/actionTypes.js b/src/redux/actions/actionTypes.js index a9d88e5..10057de 100644 --- a/src/redux/actions/actionTypes.js +++ b/src/redux/actions/actionTypes.js @@ -1,3 +1,5 @@ export const CREATE_COURSE = "CREATE_COURSE"; export const LOAD_COURSES_SUCCESS = "LOAD_COURSES_SUCCESS"; export const LOAD_AUTHORS_SUCCESS = "LOAD_AUTHORS_SUCCESS"; +export const CREATE_COURSE_SUCCESS = "CREATE_COURSE_SUCCESS"; +export const UPDATE_COURSE_SUCCESS = "UPDATE_COURSE_SUCCESS"; diff --git a/src/redux/actions/courseActions.js b/src/redux/actions/courseActions.js index d891c33..261bac1 100644 --- a/src/redux/actions/courseActions.js +++ b/src/redux/actions/courseActions.js @@ -1,14 +1,18 @@ import * as types from "./actionTypes"; import * as courseApi from "../../api/courseApi"; -export function createCourse(course) { - return { type: types.CREATE_COURSE, course }; -} - function loadCoursesSuccess(courses) { return { type: types.LOAD_COURSES_SUCCESS, courses }; } +export function createCourseSuccess(course) { + return { type: types.CREATE_COURSE_SUCCESS, course }; +} + +export function updateCourseSuccess(course) { + return { type: types.UPDATE_COURSE_SUCCESS, course }; +} + export function loadCourses() { return function (dispatch) { return courseApi @@ -21,3 +25,19 @@ export function loadCourses() { }); }; } + +export function saveCourse(course) { + //eslint-disable-next-line no-unused-vars + return function (dispatch, getState) { + return courseApi + .saveCourse(course) + .then((savedCourse) => { + course.id + ? dispatch(updateCourseSuccess(savedCourse)) + : dispatch(createCourseSuccess(savedCourse)); + }) + .catch((error) => { + throw error; + }); + }; +} diff --git a/src/redux/reducers/courseReducer.js b/src/redux/reducers/courseReducer.js index aa61ab8..c1bf7f9 100644 --- a/src/redux/reducers/courseReducer.js +++ b/src/redux/reducers/courseReducer.js @@ -3,12 +3,17 @@ import initialState from "./initialState"; export default function courseReducer(state = initialState.courses, action) { switch (action.type) { - case types.CREATE_COURSE: - return [...state, { ...action.course }]; - case types.LOAD_COURSES_SUCCESS: return action.courses; + case types.CREATE_COURSE_SUCCESS: + return [...state, { ...action.course }]; + + case types.UPDATE_COURSE_SUCCESS: + return state.map((course) => + course.id === action.course.id ? action.course : course + ); + default: return state; }