Server sessions page

master
Tudor Stanciu 2020-05-12 02:31:25 +03:00
parent 5609267b44
commit 49ebb12757
14 changed files with 470 additions and 0 deletions

258
package-lock.json generated
View File

@ -979,6 +979,11 @@
"to-fast-properties": "^2.0.0" "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": { "@jest/types": {
"version": "24.9.0", "version": "24.9.0",
"resolved": "https://registry.npmjs.org/@jest/types/-/types-24.9.0.tgz", "resolved": "https://registry.npmjs.org/@jest/types/-/types-24.9.0.tgz",
@ -990,6 +995,126 @@
"@types/yargs": "^13.0.0" "@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": { "@sheerun/mutationobserver-shim": {
"version": "0.3.3", "version": "0.3.3",
"resolved": "https://registry.npmjs.org/@sheerun/mutationobserver-shim/-/mutationobserver-shim-0.3.3.tgz", "resolved": "https://registry.npmjs.org/@sheerun/mutationobserver-shim/-/mutationobserver-shim-0.3.3.tgz",
@ -1021,12 +1146,34 @@
"@types/istanbul-lib-report": "*" "@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": { "@types/q": {
"version": "1.5.2", "version": "1.5.2",
"resolved": "https://registry.npmjs.org/@types/q/-/q-1.5.2.tgz", "resolved": "https://registry.npmjs.org/@types/q/-/q-1.5.2.tgz",
"integrity": "sha512-ce5d3q03Ex0sy4R14722Rmt6MT07Ua+k4FwDfdcToYJcMKNtRVQvJ6JCAPdAmAnbRb6CsX6aYb9m96NGod9uTw==", "integrity": "sha512-ce5d3q03Ex0sy4R14722Rmt6MT07Ua+k4FwDfdcToYJcMKNtRVQvJ6JCAPdAmAnbRb6CsX6aYb9m96NGod9uTw==",
"dev": true "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": { "@types/yargs": {
"version": "13.0.8", "version": "13.0.8",
"resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-13.0.8.tgz", "resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-13.0.8.tgz",
@ -2443,6 +2590,11 @@
"wrap-ansi": "^2.0.0" "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": { "coa": {
"version": "2.0.2", "version": "2.0.2",
"resolved": "https://registry.npmjs.org/coa/-/coa-2.0.2.tgz", "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": { "css-what": {
"version": "3.2.1", "version": "3.2.1",
"resolved": "https://registry.npmjs.org/css-what/-/css-what-3.2.1.tgz", "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": { "cyclist": {
"version": "1.0.1", "version": "1.0.1",
"resolved": "https://registry.npmjs.org/cyclist/-/cyclist-1.0.1.tgz", "resolved": "https://registry.npmjs.org/cyclist/-/cyclist-1.0.1.tgz",
@ -5421,6 +5587,11 @@
"integrity": "sha1-7AbBDgo0wPL68Zn3/X/Hj//QPHM=", "integrity": "sha1-7AbBDgo0wPL68Zn3/X/Hj//QPHM=",
"dev": true "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": { "iconv-lite": {
"version": "0.4.24", "version": "0.4.24",
"resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.24.tgz", "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.24.tgz",
@ -5797,6 +5968,11 @@
"is-extglob": "^2.1.1" "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": { "is-installed-globally": {
"version": "0.1.0", "version": "0.1.0",
"resolved": "https://registry.npmjs.org/is-installed-globally/-/is-installed-globally-0.1.0.tgz", "resolved": "https://registry.npmjs.org/is-installed-globally/-/is-installed-globally-0.1.0.tgz",
@ -6130,6 +6306,83 @@
"verror": "1.10.0" "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": { "jsx-ast-utils": {
"version": "2.2.3", "version": "2.2.3",
"resolved": "https://registry.npmjs.org/jsx-ast-utils/-/jsx-ast-utils-2.2.3.tgz", "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==", "integrity": "sha512-ARhBOdzS3e41FbkW/XWrTEtukqqLoK5+Z/4UeDaLuSW+39JPeFgs4gCGqsrJHVZX0fUrx//4OF0K1CUGwlIFow==",
"dev": true "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": { "portfinder": {
"version": "0.4.0", "version": "0.4.0",
"resolved": "https://registry.npmjs.org/portfinder/-/portfinder-0.4.0.tgz", "resolved": "https://registry.npmjs.org/portfinder/-/portfinder-0.4.0.tgz",

View File

@ -15,6 +15,8 @@
"serve:build": "http-server ./build" "serve:build": "http-server ./build"
}, },
"dependencies": { "dependencies": {
"@material-ui/core": "^4.9.13",
"@material-ui/icons": "^4.9.1",
"axios": "^0.19.2", "axios": "^0.19.2",
"bootstrap": "4.3.1", "bootstrap": "4.3.1",
"immer": "2.1.3", "immer": "2.1.3",

View File

@ -8,6 +8,7 @@ import CoursesPage from "./courses/CoursesPage";
import ManageCoursePage from "./courses/ManageCoursePage"; import ManageCoursePage from "./courses/ManageCoursePage";
import { ToastContainer } from "react-toastify"; import { ToastContainer } from "react-toastify";
import "react-toastify/dist/ReactToastify.css"; import "react-toastify/dist/ReactToastify.css";
import SessionContainer from "../features/session/components/SessionContainer";
function App() { function App() {
return ( return (
@ -19,6 +20,7 @@ function App() {
<Route path="/courses" component={CoursesPage} /> <Route path="/courses" component={CoursesPage} />
<Route path="/course/:slug" component={ManageCoursePage} /> <Route path="/course/:slug" component={ManageCoursePage} />
<Route path="/course" component={ManageCoursePage} /> <Route path="/course" component={ManageCoursePage} />
<Route path="/sessions" component={SessionContainer} />
<Route component={PageNotFound} /> <Route component={PageNotFound} />
</Switch> </Switch>
<ToastContainer autoClose={3000} /> <ToastContainer autoClose={3000} />

View File

@ -14,6 +14,10 @@ const Header = () => {
Courses Courses
</NavLink> </NavLink>
{" | "} {" | "}
<NavLink to="/sessions" activeStyle={activeStyle}>
Sessions
</NavLink>
{" | "}
<NavLink to="/about" activeStyle={activeStyle}> <NavLink to="/about" activeStyle={activeStyle}>
About About
</NavLink> </NavLink>

View File

@ -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;
}
};
}

View File

@ -0,0 +1,2 @@
export const LOAD_SERVER_SESSIONS_STARTED = "LOAD_SERVER_SESSIONS_STARTED";
export const LOAD_SERVER_SESSIONS_SUCCESS = "LOAD_SERVER_SESSIONS_SUCCESS";

View File

@ -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
};

View File

@ -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 <SessionListComponent sessions={sessions} />;
};
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);

View File

@ -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 (
<div className={classes.root}>
<h2>Sessions</h2>
{sessions.loaded &&
sessions.map((session) => {
return (
<ExpansionPanel key={session.sessionId}>
<ExpansionPanelSummary
expandIcon={<ExpandMoreIcon />}
aria-controls="panel1a-content"
id="panel1a-header"
>
<SessionSummary session={session} />
</ExpansionPanelSummary>
<ExpansionPanelDetails>
<Typography>
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Suspendisse malesuada lacus ex, sit amet blandit leo lobortis
eget.
</Typography>
</ExpansionPanelDetails>
</ExpansionPanel>
);
})}
</div>
);
};
SessionListComponent.propTypes = {
sessions: PropTypes.array.isRequired
};
export default SessionListComponent;

View File

@ -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) => <Checkbox color="default" {...props} />);
const useStyles = makeStyles((theme) => ({
value: {
fontWeight: theme.typography.fontWeightMedium
},
miniContainer: {
paddingTop: "10px"
}
}));
const SessionSummary = ({ session }) => {
const classes = useStyles();
return (
<>
<Grid container className={classes.miniContainer}>
<Grid item xs={12} sm={3} md={3}>
{"Session: "}
<span className={classes.value}>{session.sessionId}</span>
</Grid>
<Grid item xs={12} sm={3} md={3}>
{"Active: "}
{session.active ? (
<GreenCheckbox checked={true} disabled />
) : (
<Checkbox indeterminate disabled />
)}
</Grid>
<Grid item xs={12} sm={3} md={3}>
{"Start date: "}
<span className={classes.value}>{session.startDate}</span>
</Grid>
</Grid>
</>
);
};
SessionSummary.propTypes = {
session: PropTypes.object.isRequired
};
export default SessionSummary;

View File

@ -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;
}
}

View File

@ -2,6 +2,20 @@
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />
<meta
name="viewport"
content="minimum-scale=1, initial-scale=1, width=device-width"
/>
<link
rel="stylesheet"
href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap"
/>
<link
rel="stylesheet"
href="https://fonts.googleapis.com/icon?family=Material+Icons"
/>
<title>Reverse proxy</title> <title>Reverse proxy</title>
</head> </head>

View File

@ -3,9 +3,11 @@ import courseReducer from "./courseReducer";
import authorReducer from "./authorReducer"; import authorReducer from "./authorReducer";
import ajaxStatusReducer from "./ajaxStatusReducer"; import ajaxStatusReducer from "./ajaxStatusReducer";
import systemReducer from "../../features/system/reducer"; import systemReducer from "../../features/system/reducer";
import sessionsReducer from "../../features/session/reducer";
const rootReducer = combineReducers({ const rootReducer = combineReducers({
system: systemReducer, system: systemReducer,
sessions: sessionsReducer,
courses: courseReducer, courses: courseReducer,
authors: authorReducer, authors: authorReducer,
ajaxCallsInProgress: ajaxStatusReducer ajaxCallsInProgress: ajaxStatusReducer

View File

@ -1,5 +1,6 @@
export default { export default {
system: {}, system: {},
sessions: Object.assign([], { loading: false, loaded: false }),
courses: [], courses: [],
authors: [], authors: [],
ajaxCallsInProgress: 0 ajaxCallsInProgress: 0