From 49ebb127572371730060b945356ff1f2ddd122b7 Mon Sep 17 00:00:00 2001 From: Tudor Stanciu Date: Tue, 12 May 2020 02:31:25 +0300 Subject: [PATCH] Server sessions page --- package-lock.json | 258 ++++++++++++++++++ package.json | 2 + src/components/App.js | 2 + src/components/common/Header.js | 4 + src/features/session/actionCreators.js | 15 + src/features/session/actionTypes.js | 2 + src/features/session/api.js | 8 + .../session/components/SessionContainer.js | 33 +++ .../components/SessionListComponent.js | 56 ++++ .../session/components/SessionSummary.js | 58 ++++ src/features/session/reducer.js | 15 + src/index.html | 14 + src/redux/reducers/index.js | 2 + src/redux/reducers/initialState.js | 1 + 14 files changed, 470 insertions(+) create mode 100644 src/features/session/actionCreators.js create mode 100644 src/features/session/actionTypes.js create mode 100644 src/features/session/api.js create mode 100644 src/features/session/components/SessionContainer.js create mode 100644 src/features/session/components/SessionListComponent.js create mode 100644 src/features/session/components/SessionSummary.js create mode 100644 src/features/session/reducer.js diff --git a/package-lock.json b/package-lock.json index 0727054..daeaaf1 100644 --- a/package-lock.json +++ b/package-lock.json @@ -979,6 +979,11 @@ "to-fast-properties": "^2.0.0" } }, + "@emotion/hash": { + "version": "0.8.0", + "resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.8.0.tgz", + "integrity": "sha512-kBJtf7PH6aWwZ6fka3zQ0p6SBYzx4fl1LoZXE2RrnYST9Xljm7WfKJrU4g/Xr3Beg72MLrp1AWNUmuYJTL7Cow==" + }, "@jest/types": { "version": "24.9.0", "resolved": "https://registry.npmjs.org/@jest/types/-/types-24.9.0.tgz", @@ -990,6 +995,126 @@ "@types/yargs": "^13.0.0" } }, + "@material-ui/core": { + "version": "4.9.13", + "resolved": "https://registry.npmjs.org/@material-ui/core/-/core-4.9.13.tgz", + "integrity": "sha512-GEXNwUr+laZ0N+F1efmHB64Fyg+uQIRXLqbSejg3ebSXgLYNpIjnMOPRfWdu4rICq0dAIgvvNXGkKDMcf3AMpA==", + "requires": { + "@babel/runtime": "^7.4.4", + "@material-ui/react-transition-group": "^4.3.0", + "@material-ui/styles": "^4.9.13", + "@material-ui/system": "^4.9.13", + "@material-ui/types": "^5.0.1", + "@material-ui/utils": "^4.9.12", + "@types/react-transition-group": "^4.2.0", + "clsx": "^1.0.4", + "hoist-non-react-statics": "^3.3.2", + "popper.js": "^1.16.1-lts", + "prop-types": "^15.7.2", + "react-is": "^16.8.0", + "react-transition-group": "^4.3.0" + }, + "dependencies": { + "dom-helpers": { + "version": "5.1.4", + "resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-5.1.4.tgz", + "integrity": "sha512-TjMyeVUvNEnOnhzs6uAn9Ya47GmMo3qq7m+Lr/3ON0Rs5kHvb8I+SQYjLUSYn7qhEm0QjW0yrBkvz9yOrwwz1A==", + "requires": { + "@babel/runtime": "^7.8.7", + "csstype": "^2.6.7" + } + }, + "react-transition-group": { + "version": "4.4.1", + "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.4.1.tgz", + "integrity": "sha512-Djqr7OQ2aPUiYurhPalTrVy9ddmFCCzwhqQmtN+J3+3DzLO209Fdr70QrN8Z3DsglWql6iY1lDWAfpFiBtuKGw==", + "requires": { + "@babel/runtime": "^7.5.5", + "dom-helpers": "^5.0.1", + "loose-envify": "^1.4.0", + "prop-types": "^15.6.2" + } + } + } + }, + "@material-ui/icons": { + "version": "4.9.1", + "resolved": "https://registry.npmjs.org/@material-ui/icons/-/icons-4.9.1.tgz", + "integrity": "sha512-GBitL3oBWO0hzBhvA9KxqcowRUsA0qzwKkURyC8nppnC3fw54KPKZ+d4V1Eeg/UnDRSzDaI9nGCdel/eh9AQMg==", + "requires": { + "@babel/runtime": "^7.4.4" + } + }, + "@material-ui/react-transition-group": { + "version": "4.3.0", + "resolved": "https://registry.npmjs.org/@material-ui/react-transition-group/-/react-transition-group-4.3.0.tgz", + "integrity": "sha512-CwQ0aXrlUynUTY6sh3UvKuvye1o92en20VGAs6TORnSxUYeRmkX8YeTUN3lAkGiBX1z222FxLFO36WWh6q73rQ==", + "requires": { + "@babel/runtime": "^7.5.5", + "dom-helpers": "^5.0.1", + "loose-envify": "^1.4.0", + "prop-types": "^15.6.2" + }, + "dependencies": { + "dom-helpers": { + "version": "5.1.4", + "resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-5.1.4.tgz", + "integrity": "sha512-TjMyeVUvNEnOnhzs6uAn9Ya47GmMo3qq7m+Lr/3ON0Rs5kHvb8I+SQYjLUSYn7qhEm0QjW0yrBkvz9yOrwwz1A==", + "requires": { + "@babel/runtime": "^7.8.7", + "csstype": "^2.6.7" + } + } + } + }, + "@material-ui/styles": { + "version": "4.9.13", + "resolved": "https://registry.npmjs.org/@material-ui/styles/-/styles-4.9.13.tgz", + "integrity": "sha512-lWlXJanBdHQ18jW/yphedRokHcvZD1GdGzUF/wQxKDsHwDDfO45ZkAxuSBI202dG+r1Ph483Z3pFykO2obeSRA==", + "requires": { + "@babel/runtime": "^7.4.4", + "@emotion/hash": "^0.8.0", + "@material-ui/types": "^5.0.1", + "@material-ui/utils": "^4.9.6", + "clsx": "^1.0.4", + "csstype": "^2.5.2", + "hoist-non-react-statics": "^3.3.2", + "jss": "^10.0.3", + "jss-plugin-camel-case": "^10.0.3", + "jss-plugin-default-unit": "^10.0.3", + "jss-plugin-global": "^10.0.3", + "jss-plugin-nested": "^10.0.3", + "jss-plugin-props-sort": "^10.0.3", + "jss-plugin-rule-value-function": "^10.0.3", + "jss-plugin-vendor-prefixer": "^10.0.3", + "prop-types": "^15.7.2" + } + }, + "@material-ui/system": { + "version": "4.9.13", + "resolved": "https://registry.npmjs.org/@material-ui/system/-/system-4.9.13.tgz", + "integrity": "sha512-6AlpvdW6KJJ5bF1Xo2OD13sCN8k+nlL36412/bWnWZOKIfIMo/Lb8c8d1DOIaT/RKWxTEUaWnKZjabVnA3eZjA==", + "requires": { + "@babel/runtime": "^7.4.4", + "@material-ui/utils": "^4.9.6", + "prop-types": "^15.7.2" + } + }, + "@material-ui/types": { + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/@material-ui/types/-/types-5.0.1.tgz", + "integrity": "sha512-wURPSY7/3+MAtng3i26g+WKwwNE3HEeqa/trDBR5+zWKmcjO+u9t7Npu/J1r+3dmIa/OeziN9D/18IrBKvKffw==" + }, + "@material-ui/utils": { + "version": "4.9.12", + "resolved": "https://registry.npmjs.org/@material-ui/utils/-/utils-4.9.12.tgz", + "integrity": "sha512-/0rgZPEOcZq5CFA4+4n6Q6zk7fi8skHhH2Bcra8R3epoJEYy5PL55LuMazPtPH1oKeRausDV/Omz4BbgFsn1HQ==", + "requires": { + "@babel/runtime": "^7.4.4", + "prop-types": "^15.7.2", + "react-is": "^16.8.0" + } + }, "@sheerun/mutationobserver-shim": { "version": "0.3.3", "resolved": "https://registry.npmjs.org/@sheerun/mutationobserver-shim/-/mutationobserver-shim-0.3.3.tgz", @@ -1021,12 +1146,34 @@ "@types/istanbul-lib-report": "*" } }, + "@types/prop-types": { + "version": "15.7.3", + "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.3.tgz", + "integrity": "sha512-KfRL3PuHmqQLOG+2tGpRO26Ctg+Cq1E01D2DMriKEATHgWLfeNDmq9e29Q9WIky0dQ3NPkd1mzYH8Lm936Z9qw==" + }, "@types/q": { "version": "1.5.2", "resolved": "https://registry.npmjs.org/@types/q/-/q-1.5.2.tgz", "integrity": "sha512-ce5d3q03Ex0sy4R14722Rmt6MT07Ua+k4FwDfdcToYJcMKNtRVQvJ6JCAPdAmAnbRb6CsX6aYb9m96NGod9uTw==", "dev": true }, + "@types/react": { + "version": "16.9.35", + "resolved": "https://registry.npmjs.org/@types/react/-/react-16.9.35.tgz", + "integrity": "sha512-q0n0SsWcGc8nDqH2GJfWQWUOmZSJhXV64CjVN5SvcNti3TdEaA3AH0D8DwNmMdzjMAC/78tB8nAZIlV8yTz+zQ==", + "requires": { + "@types/prop-types": "*", + "csstype": "^2.2.0" + } + }, + "@types/react-transition-group": { + "version": "4.2.4", + "resolved": "https://registry.npmjs.org/@types/react-transition-group/-/react-transition-group-4.2.4.tgz", + "integrity": "sha512-8DMUaDqh0S70TjkqU0DxOu80tFUiiaS9rxkWip/nb7gtvAsbqOXm02UCmR8zdcjWujgeYPiPNTVpVpKzUDotwA==", + "requires": { + "@types/react": "*" + } + }, "@types/yargs": { "version": "13.0.8", "resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-13.0.8.tgz", @@ -2443,6 +2590,11 @@ "wrap-ansi": "^2.0.0" } }, + "clsx": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/clsx/-/clsx-1.1.0.tgz", + "integrity": "sha512-3avwM37fSK5oP6M5rQ9CNe99lwxhXDOeSWVPAOYF6OazUTgZCMb0yWlJpmdD74REy1gkEaFiub2ULv4fq9GUhA==" + }, "coa": { "version": "2.0.2", "resolved": "https://registry.npmjs.org/coa/-/coa-2.0.2.tgz", @@ -2978,6 +3130,15 @@ } } }, + "css-vendor": { + "version": "2.0.8", + "resolved": "https://registry.npmjs.org/css-vendor/-/css-vendor-2.0.8.tgz", + "integrity": "sha512-x9Aq0XTInxrkuFeHKbYC7zWY8ai7qJ04Kxd9MnvbC1uO5DagxoHQjm4JvG+vCdXOoFtCjbL2XSZfxmoYa9uQVQ==", + "requires": { + "@babel/runtime": "^7.8.3", + "is-in-browser": "^1.0.2" + } + }, "css-what": { "version": "3.2.1", "resolved": "https://registry.npmjs.org/css-what/-/css-what-3.2.1.tgz", @@ -3100,6 +3261,11 @@ } } }, + "csstype": { + "version": "2.6.10", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-2.6.10.tgz", + "integrity": "sha512-D34BqZU4cIlMCY93rZHbrq9pjTAQJ3U8S8rfBqjwHxkGPThWFjzZDQpgMJY0QViLxth6ZKYiwFBo14RdN44U/w==" + }, "cyclist": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/cyclist/-/cyclist-1.0.1.tgz", @@ -5421,6 +5587,11 @@ "integrity": "sha1-7AbBDgo0wPL68Zn3/X/Hj//QPHM=", "dev": true }, + "hyphenate-style-name": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/hyphenate-style-name/-/hyphenate-style-name-1.0.3.tgz", + "integrity": "sha512-EcuixamT82oplpoJ2XU4pDtKGWQ7b00CD9f1ug9IaQ3p1bkHMiKCZ9ut9QDI6qsa6cpUuB+A/I+zLtdNK4n2DQ==" + }, "iconv-lite": { "version": "0.4.24", "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.24.tgz", @@ -5797,6 +5968,11 @@ "is-extglob": "^2.1.1" } }, + "is-in-browser": { + "version": "1.1.3", + "resolved": "https://registry.npmjs.org/is-in-browser/-/is-in-browser-1.1.3.tgz", + "integrity": "sha1-Vv9NtoOgeMYILrldrX3GLh0E+DU=" + }, "is-installed-globally": { "version": "0.1.0", "resolved": "https://registry.npmjs.org/is-installed-globally/-/is-installed-globally-0.1.0.tgz", @@ -6130,6 +6306,83 @@ "verror": "1.10.0" } }, + "jss": { + "version": "10.1.1", + "resolved": "https://registry.npmjs.org/jss/-/jss-10.1.1.tgz", + "integrity": "sha512-Xz3qgRUFlxbWk1czCZibUJqhVPObrZHxY3FPsjCXhDld4NOj1BgM14Ir5hVm+Qr6OLqVljjGvoMcCdXNOAbdkQ==", + "requires": { + "@babel/runtime": "^7.3.1", + "csstype": "^2.6.5", + "is-in-browser": "^1.1.3", + "tiny-warning": "^1.0.2" + } + }, + "jss-plugin-camel-case": { + "version": "10.1.1", + "resolved": "https://registry.npmjs.org/jss-plugin-camel-case/-/jss-plugin-camel-case-10.1.1.tgz", + "integrity": "sha512-MDIaw8FeD5uFz1seQBKz4pnvDLnj5vIKV5hXSVdMaAVq13xR6SVTVWkIV/keyTs5txxTvzGJ9hXoxgd1WTUlBw==", + "requires": { + "@babel/runtime": "^7.3.1", + "hyphenate-style-name": "^1.0.3", + "jss": "10.1.1" + } + }, + "jss-plugin-default-unit": { + "version": "10.1.1", + "resolved": "https://registry.npmjs.org/jss-plugin-default-unit/-/jss-plugin-default-unit-10.1.1.tgz", + "integrity": "sha512-UkeVCA/b3QEA4k0nIKS4uWXDCNmV73WLHdh2oDGZZc3GsQtlOCuiH3EkB/qI60v2MiCq356/SYWsDXt21yjwdg==", + "requires": { + "@babel/runtime": "^7.3.1", + "jss": "10.1.1" + } + }, + "jss-plugin-global": { + "version": "10.1.1", + "resolved": "https://registry.npmjs.org/jss-plugin-global/-/jss-plugin-global-10.1.1.tgz", + "integrity": "sha512-VBG3wRyi3Z8S4kMhm8rZV6caYBegsk+QnQZSVmrWw6GVOT/Z4FA7eyMu5SdkorDlG/HVpHh91oFN56O4R9m2VA==", + "requires": { + "@babel/runtime": "^7.3.1", + "jss": "10.1.1" + } + }, + "jss-plugin-nested": { + "version": "10.1.1", + "resolved": "https://registry.npmjs.org/jss-plugin-nested/-/jss-plugin-nested-10.1.1.tgz", + "integrity": "sha512-ozEu7ZBSVrMYxSDplPX3H82XHNQk2DQEJ9TEyo7OVTPJ1hEieqjDFiOQOxXEj9z3PMqkylnUbvWIZRDKCFYw5Q==", + "requires": { + "@babel/runtime": "^7.3.1", + "jss": "10.1.1", + "tiny-warning": "^1.0.2" + } + }, + "jss-plugin-props-sort": { + "version": "10.1.1", + "resolved": "https://registry.npmjs.org/jss-plugin-props-sort/-/jss-plugin-props-sort-10.1.1.tgz", + "integrity": "sha512-g/joK3eTDZB4pkqpZB38257yD4LXB0X15jxtZAGbUzcKAVUHPl9Jb47Y7lYmiGsShiV4YmQRqG1p2DHMYoK91g==", + "requires": { + "@babel/runtime": "^7.3.1", + "jss": "10.1.1" + } + }, + "jss-plugin-rule-value-function": { + "version": "10.1.1", + "resolved": "https://registry.npmjs.org/jss-plugin-rule-value-function/-/jss-plugin-rule-value-function-10.1.1.tgz", + "integrity": "sha512-ClV1lvJ3laU9la1CUzaDugEcwnpjPTuJ0yGy2YtcU+gG/w9HMInD5vEv7xKAz53Bk4WiJm5uLOElSEshHyhKNw==", + "requires": { + "@babel/runtime": "^7.3.1", + "jss": "10.1.1" + } + }, + "jss-plugin-vendor-prefixer": { + "version": "10.1.1", + "resolved": "https://registry.npmjs.org/jss-plugin-vendor-prefixer/-/jss-plugin-vendor-prefixer-10.1.1.tgz", + "integrity": "sha512-09MZpQ6onQrhaVSF6GHC4iYifQ7+4YC/tAP6D4ZWeZotvCMq1mHLqNKRIaqQ2lkgANjlEot2JnVi1ktu4+L4pw==", + "requires": { + "@babel/runtime": "^7.3.1", + "css-vendor": "^2.0.7", + "jss": "10.1.1" + } + }, "jsx-ast-utils": { "version": "2.2.3", "resolved": "https://registry.npmjs.org/jsx-ast-utils/-/jsx-ast-utils-2.2.3.tgz", @@ -7697,6 +7950,11 @@ "integrity": "sha512-ARhBOdzS3e41FbkW/XWrTEtukqqLoK5+Z/4UeDaLuSW+39JPeFgs4gCGqsrJHVZX0fUrx//4OF0K1CUGwlIFow==", "dev": true }, + "popper.js": { + "version": "1.16.1", + "resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.16.1.tgz", + "integrity": "sha512-Wb4p1J4zyFTbM+u6WuO4XstYx4Ky9Cewe4DWrel7B0w6VVICvPwdOpotjzcf6eD8TsckVnIMNONQyPIUFOUbCQ==" + }, "portfinder": { "version": "0.4.0", "resolved": "https://registry.npmjs.org/portfinder/-/portfinder-0.4.0.tgz", diff --git a/package.json b/package.json index e9e97c0..469fa9c 100644 --- a/package.json +++ b/package.json @@ -15,6 +15,8 @@ "serve:build": "http-server ./build" }, "dependencies": { + "@material-ui/core": "^4.9.13", + "@material-ui/icons": "^4.9.1", "axios": "^0.19.2", "bootstrap": "4.3.1", "immer": "2.1.3", diff --git a/src/components/App.js b/src/components/App.js index 32dabb5..0edbb5b 100644 --- a/src/components/App.js +++ b/src/components/App.js @@ -8,6 +8,7 @@ import CoursesPage from "./courses/CoursesPage"; import ManageCoursePage from "./courses/ManageCoursePage"; import { ToastContainer } from "react-toastify"; import "react-toastify/dist/ReactToastify.css"; +import SessionContainer from "../features/session/components/SessionContainer"; function App() { return ( @@ -19,6 +20,7 @@ function App() { + diff --git a/src/components/common/Header.js b/src/components/common/Header.js index d2e6183..d66effd 100644 --- a/src/components/common/Header.js +++ b/src/components/common/Header.js @@ -14,6 +14,10 @@ const Header = () => { Courses {" | "} + + Sessions + + {" | "} About diff --git a/src/features/session/actionCreators.js b/src/features/session/actionCreators.js new file mode 100644 index 0000000..6552b36 --- /dev/null +++ b/src/features/session/actionCreators.js @@ -0,0 +1,15 @@ +import * as types from "./actionTypes"; +import api from "./api"; +import { sendHttpRequest } from "../../redux/actions/httpActions"; + +export function loadServerSessions() { + return async function (dispatch) { + try { + dispatch({ type: types.LOAD_SERVER_SESSIONS_STARTED }); + const data = await dispatch(sendHttpRequest(api.getServerSessions())); + dispatch({ type: types.LOAD_SERVER_SESSIONS_SUCCESS, payload: data }); + } catch (error) { + throw error; + } + }; +} diff --git a/src/features/session/actionTypes.js b/src/features/session/actionTypes.js new file mode 100644 index 0000000..c20e900 --- /dev/null +++ b/src/features/session/actionTypes.js @@ -0,0 +1,2 @@ +export const LOAD_SERVER_SESSIONS_STARTED = "LOAD_SERVER_SESSIONS_STARTED"; +export const LOAD_SERVER_SESSIONS_SUCCESS = "LOAD_SERVER_SESSIONS_SUCCESS"; diff --git a/src/features/session/api.js b/src/features/session/api.js new file mode 100644 index 0000000..77fe4bb --- /dev/null +++ b/src/features/session/api.js @@ -0,0 +1,8 @@ +import { get } from "../../api/axiosApi"; +const baseUrl = process.env.REVERSE_PROXY_API_URL + "/server"; + +const getServerSessions = () => get(`${baseUrl}/sessions`); + +export default { + getServerSessions +}; diff --git a/src/features/session/components/SessionContainer.js b/src/features/session/components/SessionContainer.js new file mode 100644 index 0000000..2e6e511 --- /dev/null +++ b/src/features/session/components/SessionContainer.js @@ -0,0 +1,33 @@ +import React, { useEffect } from "react"; +import { connect } from "react-redux"; +import { bindActionCreators } from "redux"; +import PropTypes from "prop-types"; +import SessionListComponent from "./SessionListComponent"; +import { loadServerSessions } from "../actionCreators"; + +const SessionContainer = ({ actions, sessions }) => { + useEffect(() => { + actions.loadServerSessions(); + }, []); + + return ; +}; + +SessionContainer.propTypes = { + actions: PropTypes.object.isRequired, + sessions: PropTypes.array.isRequired +}; + +function mapStateToProps(state) { + return { + sessions: state.sessions + }; +} + +function mapDispatchToProps(dispatch) { + return { + actions: bindActionCreators({ loadServerSessions }, dispatch) + }; +} + +export default connect(mapStateToProps, mapDispatchToProps)(SessionContainer); diff --git a/src/features/session/components/SessionListComponent.js b/src/features/session/components/SessionListComponent.js new file mode 100644 index 0000000..268f619 --- /dev/null +++ b/src/features/session/components/SessionListComponent.js @@ -0,0 +1,56 @@ +import React from "react"; +import { makeStyles } from "@material-ui/core/styles"; +import ExpansionPanel from "@material-ui/core/ExpansionPanel"; +import ExpansionPanelSummary from "@material-ui/core/ExpansionPanelSummary"; +import ExpansionPanelDetails from "@material-ui/core/ExpansionPanelDetails"; +import Typography from "@material-ui/core/Typography"; +import ExpandMoreIcon from "@material-ui/icons/ExpandMore"; +import PropTypes from "prop-types"; +import SessionSummary from "./SessionSummary"; + +const useStyles = makeStyles((theme) => ({ + root: { + width: "100%" + }, + heading: { + fontSize: theme.typography.pxToRem(15), + fontWeight: theme.typography.fontWeightRegular + } +})); + +const SessionListComponent = ({ sessions }) => { + const classes = useStyles(); + + return ( +
+

Sessions

+ {sessions.loaded && + sessions.map((session) => { + return ( + + } + aria-controls="panel1a-content" + id="panel1a-header" + > + + + + + Lorem ipsum dolor sit amet, consectetur adipiscing elit. + Suspendisse malesuada lacus ex, sit amet blandit leo lobortis + eget. + + + + ); + })} +
+ ); +}; + +SessionListComponent.propTypes = { + sessions: PropTypes.array.isRequired +}; + +export default SessionListComponent; diff --git a/src/features/session/components/SessionSummary.js b/src/features/session/components/SessionSummary.js new file mode 100644 index 0000000..57600b1 --- /dev/null +++ b/src/features/session/components/SessionSummary.js @@ -0,0 +1,58 @@ +import React from "react"; +import PropTypes from "prop-types"; +import { Grid } from "@material-ui/core"; +import { makeStyles, withStyles } from "@material-ui/core/styles"; +import Checkbox from "@material-ui/core/Checkbox"; +import { blue } from "@material-ui/core/colors"; + +const GreenCheckbox = withStyles({ + root: { + color: blue[400], + "&$checked": { + color: blue[600] + } + }, + checked: {} +})((props) => ); + +const useStyles = makeStyles((theme) => ({ + value: { + fontWeight: theme.typography.fontWeightMedium + }, + miniContainer: { + paddingTop: "10px" + } +})); + +const SessionSummary = ({ session }) => { + const classes = useStyles(); + + return ( + <> + + + {"Session: "} + {session.sessionId} + + + {"Active: "} + {session.active ? ( + + ) : ( + + )} + + + {"Start date: "} + {session.startDate} + + + + ); +}; + +SessionSummary.propTypes = { + session: PropTypes.object.isRequired +}; + +export default SessionSummary; diff --git a/src/features/session/reducer.js b/src/features/session/reducer.js new file mode 100644 index 0000000..0f4dc58 --- /dev/null +++ b/src/features/session/reducer.js @@ -0,0 +1,15 @@ +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/index.html b/src/index.html index 07b0e2c..90abd25 100644 --- a/src/index.html +++ b/src/index.html @@ -2,6 +2,20 @@ + + + + + Reverse proxy diff --git a/src/redux/reducers/index.js b/src/redux/reducers/index.js index 51a78bb..f2ae5ce 100644 --- a/src/redux/reducers/index.js +++ b/src/redux/reducers/index.js @@ -3,9 +3,11 @@ import courseReducer from "./courseReducer"; import authorReducer from "./authorReducer"; import ajaxStatusReducer from "./ajaxStatusReducer"; import systemReducer from "../../features/system/reducer"; +import sessionsReducer from "../../features/session/reducer"; const rootReducer = combineReducers({ system: systemReducer, + sessions: sessionsReducer, courses: courseReducer, authors: authorReducer, ajaxCallsInProgress: ajaxStatusReducer diff --git a/src/redux/reducers/initialState.js b/src/redux/reducers/initialState.js index df40f15..0bf616a 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 }), courses: [], authors: [], ajaxCallsInProgress: 0