From 6463b1acb3c9f223dafdd64cf33ec95533774543 Mon Sep 17 00:00:00 2001 From: Tudor Stanciu Date: Thu, 14 May 2020 02:06:14 +0300 Subject: [PATCH] SessionForwards --- src/features/session/actionCreators.js | 18 +++++ src/features/session/actionTypes.js | 3 + src/features/session/api.js | 5 +- .../session/components/SessionContainer.js | 27 +++++-- .../components/SessionDetailsComponent.js | 79 ++++++++----------- .../components/SessionListComponent.js | 15 +++- src/features/session/reducer.js | 15 ---- src/features/session/reducers.js | 37 +++++++++ src/redux/reducers/index.js | 6 +- src/redux/reducers/initialState.js | 1 + 10 files changed, 134 insertions(+), 72 deletions(-) delete mode 100644 src/features/session/reducer.js create mode 100644 src/features/session/reducers.js diff --git a/src/features/session/actionCreators.js b/src/features/session/actionCreators.js index 6552b36..840e2f2 100644 --- a/src/features/session/actionCreators.js +++ b/src/features/session/actionCreators.js @@ -13,3 +13,21 @@ export function loadServerSessions() { } }; } + +export function loadSessionForwards(sessionId) { + return async function (dispatch) { + try { + dispatch({ type: types.LOAD_SESSION_FORWARDS_STARTED, id: sessionId }); + const data = await dispatch( + sendHttpRequest(api.getSessionForwards(sessionId)) + ); + dispatch({ + type: types.LOAD_SESSION_FORWARDS_SUCCESS, + payload: data, + id: sessionId + }); + } catch (error) { + throw error; + } + }; +} diff --git a/src/features/session/actionTypes.js b/src/features/session/actionTypes.js index c20e900..ad67e26 100644 --- a/src/features/session/actionTypes.js +++ b/src/features/session/actionTypes.js @@ -1,2 +1,5 @@ export const LOAD_SERVER_SESSIONS_STARTED = "LOAD_SERVER_SESSIONS_STARTED"; export const LOAD_SERVER_SESSIONS_SUCCESS = "LOAD_SERVER_SESSIONS_SUCCESS"; + +export const LOAD_SESSION_FORWARDS_STARTED = "LOAD_SESSION_FORWARDS_STARTED"; +export const LOAD_SESSION_FORWARDS_SUCCESS = "LOAD_SESSION_FORWARDS_SUCCESS"; diff --git a/src/features/session/api.js b/src/features/session/api.js index 16b3174..4f4dad9 100644 --- a/src/features/session/api.js +++ b/src/features/session/api.js @@ -2,7 +2,10 @@ import { get } from "../../api/axiosApi"; const baseUrl = `${process.env.REVERSE_PROXY_API_URL}/server`; const getServerSessions = () => get(`${baseUrl}/sessions`); +const getSessionForwards = (sessionId) => + get(`${baseUrl}/session-forwards/${sessionId}`); export default { - getServerSessions + getServerSessions, + getSessionForwards }; diff --git a/src/features/session/components/SessionContainer.js b/src/features/session/components/SessionContainer.js index 2e6e511..b576293 100644 --- a/src/features/session/components/SessionContainer.js +++ b/src/features/session/components/SessionContainer.js @@ -3,30 +3,45 @@ import { connect } from "react-redux"; import { bindActionCreators } from "redux"; import PropTypes from "prop-types"; import SessionListComponent from "./SessionListComponent"; -import { loadServerSessions } from "../actionCreators"; +import { loadServerSessions, loadSessionForwards } from "../actionCreators"; -const SessionContainer = ({ actions, sessions }) => { +const SessionContainer = ({ actions, sessions, forwards }) => { useEffect(() => { actions.loadServerSessions(); }, []); - return ; + const handleToggle = (sessionId) => (_, expanded) => { + if (expanded) actions.loadSessionForwards(sessionId); + }; + + return ( + + ); }; SessionContainer.propTypes = { actions: PropTypes.object.isRequired, - sessions: PropTypes.array.isRequired + sessions: PropTypes.array.isRequired, + forwards: PropTypes.object.isRequired }; function mapStateToProps(state) { return { - sessions: state.sessions + sessions: state.sessions, + forwards: state.forwards }; } function mapDispatchToProps(dispatch) { return { - actions: bindActionCreators({ loadServerSessions }, dispatch) + actions: bindActionCreators( + { loadServerSessions, loadSessionForwards }, + dispatch + ) }; } diff --git a/src/features/session/components/SessionDetailsComponent.js b/src/features/session/components/SessionDetailsComponent.js index 236fb85..03b8762 100644 --- a/src/features/session/components/SessionDetailsComponent.js +++ b/src/features/session/components/SessionDetailsComponent.js @@ -8,6 +8,7 @@ import TableContainer from "@material-ui/core/TableContainer"; import TableHead from "@material-ui/core/TableHead"; import TableRow from "@material-ui/core/TableRow"; import Paper from "@material-ui/core/Paper"; +import Spinner from "../../../components/common/Spinner"; const StyledTableCell = withStyles((theme) => ({ head: { @@ -27,61 +28,49 @@ const StyledTableRow = withStyles((theme) => ({ } }))(TableRow); -function createData(name, calories, fat, carbs, protein) { - return { name, calories, fat, carbs, protein }; -} - -const rows = [ - createData("Frozen yoghurt", 159, 6.0, 24, 4.0), - createData("Ice cream sandwich", 237, 9.0, 37, 4.3), - createData("Eclair", 262, 16.0, 24, 6.0), - createData("Cupcake", 305, 3.7, 67, 4.3), - createData("Gingerbread", 356, 16.0, 49, 3.9) -]; - const useStyles = makeStyles({ table: { minWidth: 700 } }); -const SessionDetailsComponent = () => { +const SessionDetailsComponent = ({ forwards }) => { const classes = useStyles(); - return ( - - - - - Dessert (100g serving) - Calories - Fat (g) - Carbs (g) - Protein (g) - - - - {rows.map((row) => ( - - - {row.name} - - {row.calories} - {row.fat} - {row.carbs} - {row.protein} - - ))} - -
- + return !forwards || forwards.loading ? ( + + ) : ( + forwards.loaded && ( + + + + + + From + To + + + + {forwards.map((row) => ( + + {forwards.indexOf(row) + 1} + {row.from} + {row.to} + + ))} + +
+ + ) ); }; -SessionDetailsComponent.propTypes = {}; +SessionDetailsComponent.propTypes = { + forwards: PropTypes.array +}; export default SessionDetailsComponent; diff --git a/src/features/session/components/SessionListComponent.js b/src/features/session/components/SessionListComponent.js index ff54010..f7f4874 100644 --- a/src/features/session/components/SessionListComponent.js +++ b/src/features/session/components/SessionListComponent.js @@ -20,7 +20,7 @@ const useStyles = makeStyles((theme) => ({ } })); -const SessionListComponent = ({ sessions }) => { +const SessionListComponent = ({ sessions, handleToggle, forwards }) => { const classes = useStyles(); const { t } = useTranslation(); @@ -33,7 +33,10 @@ const SessionListComponent = ({ sessions }) => { sessions.loaded && sessions.map((session) => { return ( - + } aria-controls={`panel-${session.sessionId}-content`} @@ -42,7 +45,9 @@ const SessionListComponent = ({ sessions }) => { - + ); @@ -53,7 +58,9 @@ const SessionListComponent = ({ sessions }) => { }; SessionListComponent.propTypes = { - sessions: PropTypes.array.isRequired + sessions: PropTypes.array.isRequired, + handleToggle: PropTypes.func.isRequired, + forwards: PropTypes.object.isRequired }; export default SessionListComponent; diff --git a/src/features/session/reducer.js b/src/features/session/reducer.js deleted file mode 100644 index 0f4dc58..0000000 --- a/src/features/session/reducer.js +++ /dev/null @@ -1,15 +0,0 @@ -import * as types from "./actionTypes"; -import initialState from "../../redux/reducers/initialState"; - -export default function sessionsReducer(state = initialState.sessions, action) { - switch (action.type) { - case types.LOAD_SERVER_SESSIONS_STARTED: - return Object.assign([], { loading: true, loaded: false }); - - case types.LOAD_SERVER_SESSIONS_SUCCESS: - return Object.assign(action.payload, { loading: false, loaded: true }); - - default: - return state; - } -} diff --git a/src/features/session/reducers.js b/src/features/session/reducers.js new file mode 100644 index 0000000..0c22bc4 --- /dev/null +++ b/src/features/session/reducers.js @@ -0,0 +1,37 @@ +import * as types from "./actionTypes"; +import initialState from "../../redux/reducers/initialState"; + +export function sessionsReducer(state = initialState.sessions, action) { + switch (action.type) { + case types.LOAD_SERVER_SESSIONS_STARTED: + return Object.assign([], { loading: true, loaded: false }); + + case types.LOAD_SERVER_SESSIONS_SUCCESS: + return Object.assign(action.payload, { loading: false, loaded: true }); + + default: + return state; + } +} + +export function forwardsReducer(state = initialState.forwards, action) { + switch (action.type) { + case types.LOAD_SESSION_FORWARDS_STARTED: + return { + ...state, + [action.id]: Object.assign([], { loading: true, loaded: false }) + }; + + case types.LOAD_SESSION_FORWARDS_SUCCESS: + return { + ...state, + [action.id]: Object.assign(action.payload, { + loading: false, + loaded: true + }) + }; + + default: + return state; + } +} diff --git a/src/redux/reducers/index.js b/src/redux/reducers/index.js index b3d37d0..2c72f7a 100644 --- a/src/redux/reducers/index.js +++ b/src/redux/reducers/index.js @@ -1,11 +1,15 @@ import { combineReducers } from "redux"; import ajaxStatusReducer from "./ajaxStatusReducer"; import systemReducer from "../../features/system/reducer"; -import sessionsReducer from "../../features/session/reducer"; +import { + sessionsReducer, + forwardsReducer +} from "../../features/session/reducers"; const rootReducer = combineReducers({ system: systemReducer, sessions: sessionsReducer, + forwards: forwardsReducer, ajaxCallsInProgress: ajaxStatusReducer }); diff --git a/src/redux/reducers/initialState.js b/src/redux/reducers/initialState.js index 218f346..12f8350 100644 --- a/src/redux/reducers/initialState.js +++ b/src/redux/reducers/initialState.js @@ -1,5 +1,6 @@ export default { system: {}, sessions: Object.assign([], { loading: false, loaded: false }), + forwards: {}, ajaxCallsInProgress: 0 };