diff --git a/my-app/.env b/my-app/.env
new file mode 100644
index 0000000000000000000000000000000000000000..32bb703810657387416ebc5762fbe7a7ef8b14f1
--- /dev/null
+++ b/my-app/.env
@@ -0,0 +1 @@
+REACT_APP_SERVER=https://127.0.0.1/api
\ No newline at end of file
diff --git a/my-app/package-lock.json b/my-app/package-lock.json
index 810df5b905522ce3958cf9aaabdd315f548f3f95..3c13fe8f42555f7be342b510082c6211b9a81279 100644
--- a/my-app/package-lock.json
+++ b/my-app/package-lock.json
@@ -13,7 +13,10 @@
"@testing-library/user-event": "^13.5.0",
"base-64": "^1.0.0",
"bootstrap": "^5.2.3",
+ "dotenv": "^16.0.3",
"history": "^5.3.0",
+ "os-browserify": "^0.3.0",
+ "path-browserify": "^1.0.1",
"react": "^18.2.0",
"react-bootstrap": "^2.7.0",
"react-dom": "^18.2.0",
@@ -6814,11 +6817,11 @@
}
},
"node_modules/dotenv": {
- "version": "10.0.0",
- "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-10.0.0.tgz",
- "integrity": "sha512-rlBi9d8jpv9Sf1klPjNfFAuWDjKLwTIJJ/VxtoTwIR6hnZxcEOQCZg2oIL3MWBYw5GpUDKOEnND7LXTbIpQ03Q==",
+ "version": "16.0.3",
+ "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-16.0.3.tgz",
+ "integrity": "sha512-7GO6HghkA5fYG9TYnNxi14/7K9f5occMlp3zXAuSxn7CKCxt9xbNWG7yF8hTCSUchlfWSe3uLmlPfigevRItzQ==",
"engines": {
- "node": ">=10"
+ "node": ">=12"
}
},
"node_modules/dotenv-expand": {
@@ -12461,6 +12464,11 @@
"node": ">= 0.8.0"
}
},
+ "node_modules/os-browserify": {
+ "version": "0.3.0",
+ "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.3.0.tgz",
+ "integrity": "sha512-gjcpUc3clBf9+210TRaDWbf+rZZZEshZ+DlXMRCeAjp0xhTrnQsKHypIy1J3d5hKdUzj69t708EHtU8P6bUn0A=="
+ },
"node_modules/p-limit": {
"version": "3.1.0",
"resolved": "https://registry.npmjs.org/p-limit/-/p-limit-3.1.0.tgz",
@@ -12568,6 +12576,11 @@
"tslib": "^2.0.3"
}
},
+ "node_modules/path-browserify": {
+ "version": "1.0.1",
+ "resolved": "https://registry.npmjs.org/path-browserify/-/path-browserify-1.0.1.tgz",
+ "integrity": "sha512-b7uo2UCUOYZcnF/3ID0lulOJi/bafxa1xPe7ZPsammBSpjSWQkjNxlt635YGS2MiR9GjvuXCtz2emr3jbsz98g=="
+ },
"node_modules/path-exists": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz",
@@ -14562,6 +14575,14 @@
}
}
},
+ "node_modules/react-scripts/node_modules/dotenv": {
+ "version": "10.0.0",
+ "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-10.0.0.tgz",
+ "integrity": "sha512-rlBi9d8jpv9Sf1klPjNfFAuWDjKLwTIJJ/VxtoTwIR6hnZxcEOQCZg2oIL3MWBYw5GpUDKOEnND7LXTbIpQ03Q==",
+ "engines": {
+ "node": ">=10"
+ }
+ },
"node_modules/react-transition-group": {
"version": "4.4.5",
"resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.4.5.tgz",
diff --git a/my-app/package.json b/my-app/package.json
index 88f63f18f103ef482099b914e3d2ee9617701c96..49b97e8661bf54e3d2a3b57a54c3d1cda0baa9a7 100644
--- a/my-app/package.json
+++ b/my-app/package.json
@@ -8,7 +8,10 @@
"@testing-library/user-event": "^13.5.0",
"base-64": "^1.0.0",
"bootstrap": "^5.2.3",
+ "dotenv": "^16.0.3",
"history": "^5.3.0",
+ "os-browserify": "^0.3.0",
+ "path-browserify": "^1.0.1",
"react": "^18.2.0",
"react-bootstrap": "^2.7.0",
"react-dom": "^18.2.0",
diff --git a/my-app/src/App.js b/my-app/src/App.js
index 3b198b214918673fd1bf645b5fd1dbfb2c7ea441..a99fdf59177835949bb2b16313f8d4a515c95a83 100644
--- a/my-app/src/App.js
+++ b/my-app/src/App.js
@@ -9,7 +9,6 @@ import CreateNewUserForm from './components/UserComponents/CreateNewUser';
import { connect } from 'react-redux';
import { Routes, Route, Navigate } from 'react-router-dom';
-
const mapStateToProps = state => {
return {
user: state.AuthenticationReducer.user
diff --git a/my-app/src/actions/AuthenticationActions.js b/my-app/src/actions/AuthenticationActions.js
index 38289746021e04354883de721d4f181039fd390d..ebf589cea45fdddfd25d43c016dad6734c855041 100644
--- a/my-app/src/actions/AuthenticationActions.js
+++ b/my-app/src/actions/AuthenticationActions.js
@@ -7,6 +7,8 @@ export const AUTHENTICATION_PENDING = 'AUTHENTICATION_PENDING'
export const AUTHENTICATION_SUCCESS = 'AUTHENTICATION_SUCCESS'
export const AUTHENTICATION_ERROR = 'AUTHENTICATION_ERROR'
+const URL = process.env.REACT_APP_SERVER
+
export function getShowLoginDialogAction() {
return {
type: SHOW_LOGIN_DIALOG
@@ -21,10 +23,9 @@ export function getHideLoginDialogAction() {
}
export function getLogoutAction() {
+ console.log('LOGOUT');
return {
- type: LOGOUT,
- user: null,
- accessToken: null
+ type: LOGOUT
}
}
@@ -80,7 +81,7 @@ function login(userID, password) {
};
console.log("here")
- return fetch('https://localhost/api/authenticate', requestOptions)
+ return fetch(URL + '/authenticate', requestOptions)
.then(handleResponse)
.then(userSession => {
return userSession
diff --git a/my-app/src/actions/DegreeCourseManagementActions.js b/my-app/src/actions/DegreeCourseManagementActions.js
index a8e4ac53ec127e7f77668c95b380f30bfce09191..643c717e05defc7256386042888072e4dea3f7f7 100644
--- a/my-app/src/actions/DegreeCourseManagementActions.js
+++ b/my-app/src/actions/DegreeCourseManagementActions.js
@@ -11,6 +11,7 @@ export const SHOW_DELETE_DEGREECOURSE_MODAL = 'SHOW_DELETE_DEGREECOURSE_MODAL'
export const HIDE_DELETE_DEGREECOURSE_MODAL = 'HIDE_DELETE_DEGREECOURSE_MODAL'
export const PRESS_EDIT_BUTTON = 'PRESS_EDIT_BUTTON';
+const URL = process.env.REACT_APP_SERVER
export function getShowDeleteDegreeCourseModalAction(deleteModalData) {
console.log(deleteModalData)
@@ -56,7 +57,7 @@ export function createNewDegreeCourse(degreeCourseData, token) {
body: JSON.stringify(degreeCourseData)
}
- return fetch('https://localhost/api/degreeCourses', requestOptions)
+ return fetch(URL + '/degreeCourses', requestOptions)
.then(response => {
return response.json().then(body => {
if (response.status === 201) {
@@ -122,7 +123,7 @@ export function getAllDegreeCourses(token) {
headers: { 'Authorization': token }
};
- return fetch('https://localhost/api/degreeCourses', requestOptions)
+ return fetch(URL + '/degreeCourses', requestOptions)
.then(response => {
return response.json().then(body => {
if (response.status === 200) {
@@ -182,7 +183,7 @@ export function updateDegreeCourse(updateData, degreeCourseID, token) {
body: JSON.stringify(updateData)
}
- return fetch(`https://localhost/api/degreeCourses/${degreeCourseID}`, requestOptions)
+ return fetch(URL + `/degreeCourses/${degreeCourseID}`, requestOptions)
.then(response => {
console.log(response)
return response.json().then(body => {
@@ -247,7 +248,7 @@ export function deleteDegreeCourse(degreeCourseID, token) {
}
}
- return fetch('https://localhost/api/degreeCourses/' + degreeCourseID, requestOptions)
+ return fetch(URL + '/degreeCourses/' + degreeCourseID, requestOptions)
.then(response => {
console.log(response)
if (response.status === 204) {
diff --git a/my-app/src/actions/UserManagementActions.js b/my-app/src/actions/UserManagementActions.js
index f9bb4e1fb050a2548553cc2825f4f1760627db7a..090b28cea89decbbb5148b581377957ad104375b 100644
--- a/my-app/src/actions/UserManagementActions.js
+++ b/my-app/src/actions/UserManagementActions.js
@@ -10,7 +10,7 @@ export const EDIT_USER_ERROR = 'EDIT_USER_ERROR';
export const EDIT_USER_SUCCESS = 'EDIT_USER_SUCCESS';
export const PRESS_EDIT_BUTTON = 'PRESS_EDIT_BUTTON';
-
+const URL = process.env.REACT_APP_SERVER
//Pending, Success, Error Actions
@@ -205,7 +205,7 @@ export function getAllUsers(token) {
headers: { 'Authorization': token }
};
- return fetch('https://localhost/api/users', requestOptions)
+ return fetch(URL + '/users', requestOptions)
.then(response => {
return response.json().then(body => {
if (response.status === 200) {
@@ -224,7 +224,7 @@ export function getOneUser(userID, token) {
headers: { 'Authorization': token }
};
- return fetch(`https://localhost/api/users/${userID}`, requestOptions)
+ return fetch(URL + `/users/${userID}`, requestOptions)
.then(response => {
return response.json().then(body => {
if (response.status === 200) {
@@ -249,7 +249,7 @@ export function createNewUser(userData, token) {
body: JSON.stringify(userData)
}
- return fetch('https://localhost/api/users', requestOptions)
+ return fetch(URL + '/users', requestOptions)
.then(response => {
return response.json().then(body => {
if (response.status === 201) {
@@ -272,7 +272,7 @@ export function deleteUser(userID, token) {
}
}
- return fetch('https://localhost/api/users/' + userID, requestOptions)
+ return fetch(URL + '/users/' + userID, requestOptions)
.then(response => {
console.log(response)
if (response.status === 204) {
@@ -295,7 +295,7 @@ export function updateUser(updateData, userID, token) {
body: JSON.stringify(updateData)
}
- return fetch(`https://localhost/api/users/${userID}`, requestOptions)
+ return fetch(URL + `/users/${userID}`, requestOptions)
.then(response => {
console.log(response)
return response.json().then(body => {
diff --git a/my-app/src/components/DegreeCourseComponents/DegreeCourseItem.js b/my-app/src/components/DegreeCourseComponents/DegreeCourseItem.js
index ff147c542964528d7c41fa9b3459c8be4f8a4b02..6fb147f0d8664698da13500035ac09b23ff93ae8 100644
--- a/my-app/src/components/DegreeCourseComponents/DegreeCourseItem.js
+++ b/my-app/src/components/DegreeCourseComponents/DegreeCourseItem.js
@@ -2,17 +2,6 @@ import React, { Component } from "react";
import Button from "react-bootstrap/esm/Button";
import Card from 'react-bootstrap/Card';
import ListGroup from 'react-bootstrap/ListGroup';
-import { connect } from "react-redux";
-import { bindActionCreators } from "redux";
-
-import * as degreeCourseManagementActions from '../../actions/DegreeCourseManagementActions'
-
-const mapStateToProps = state => {
- return {
- showDeleteDegreeCourseModal: state.DegreeCourseReducer.showDeleteDegreeCourseModal,
- degreeCourseList: state.DegreeCourseReducer.degreeCourseList
- };
-}
class DegreeCourseItem extends Component {
render() {
@@ -55,10 +44,4 @@ class DegreeCourseItem extends Component {
}
}
-const mapDispatchToProps = dispatch => bindActionCreators({
- showDeleteDegreeCourseModalAction: degreeCourseManagementActions.getShowDeleteDegreeCourseModalAction,
- hideDeleteDegreeCourseModalAction: degreeCourseManagementActions.getHideDeleteDegreeCourseModalAction
-}, dispatch)
-
-const ConnectedDegreeCourseItems = connect(mapStateToProps, mapDispatchToProps)(DegreeCourseItem)
-export default ConnectedDegreeCourseItems
\ No newline at end of file
+export default DegreeCourseItem
\ No newline at end of file
diff --git a/my-app/src/components/DegreeCourseComponents/DegreeCourseManagement.js b/my-app/src/components/DegreeCourseComponents/DegreeCourseManagement.js
index da7f04ef10f090dee9ad1ffe9fc6fc36dec7504a..af54ca7bd34b55ddb0891ec5e8c4654f8f8999ae 100644
--- a/my-app/src/components/DegreeCourseComponents/DegreeCourseManagement.js
+++ b/my-app/src/components/DegreeCourseComponents/DegreeCourseManagement.js
@@ -37,6 +37,7 @@ class DegreeCourseManagement extends Component {
this.handleClose = this.handleClose.bind(this);
this.handleSwitchToList = this.handleSwitchToList.bind(this);
this.handleShowCreatePage = this.handleShowCreatePage.bind(this);
+ this.handleShowEditPage = this.handleShowEditPage.bind(this);
}
handleShowDeleteModal(e, dialogModalData) {
@@ -47,8 +48,9 @@ class DegreeCourseManagement extends Component {
handleShowEditPage(e, degreeCourse) {
e.preventDefault();
- this.setState({ editingDegreeCourse: degreeCourse })
- this.setState({ displayingPage: DISPLAY.EDIT })
+ this.setState(
+ { editingDegreeCourse: degreeCourse,
+ displayingPage: DISPLAY.EDIT })
}
handleShowCreatePage(e) {
@@ -78,7 +80,6 @@ class DegreeCourseManagement extends Component {
<DegreeCourseItem key={degreeCourse.id} degreeCourse={degreeCourse} handleShowDeleteModal={this.handleShowDeleteModal} handleShowEditPage={this.handleShowEditPage}/>
)
})
- console.log(degreeCourses)
return degreeCourses
}
}
diff --git a/my-app/src/components/TopMenu.js b/my-app/src/components/TopMenu.js
index e53a635da89097c70ecbfec4e1a3475e7663e0f0..5fdf3767d562a13c9cb32674271e7cdfd78fb5f4 100644
--- a/my-app/src/components/TopMenu.js
+++ b/my-app/src/components/TopMenu.js
@@ -39,9 +39,10 @@ class TopMenu extends Component {
}
render() {
- let OpenUserManagementPageButton;
+ let OpenManagementPageButtons;
+ console.log(this.props.isAdmin)
if (this.props.isAdmin) {
- OpenUserManagementPageButton =
+ OpenManagementPageButtons =
<>
<LinkContainer to="/userManagement" id="OpenUserManagementPageButton" onClick={this.handleUserManagementButtonAction}>
<Nav.Link>User-Management</Nav.Link>
@@ -65,7 +66,7 @@ class TopMenu extends Component {
<LinkContainer to="/" id="OpenStartPageButton">
<Nav.Link>Home</Nav.Link>
</LinkContainer>
- {OpenUserManagementPageButton}
+ {OpenManagementPageButtons}
<NavDropdown title="Dropdown" id="basic-nav-dropdown">
<NavDropdown.Item href="#action/3.1">Action</NavDropdown.Item>
<NavDropdown.Item href="#action/3.2">
diff --git a/my-app/src/components/UserComponents/UserItem.js b/my-app/src/components/UserComponents/UserItem.js
index cb73a0320db21aaa1fac80b6e3ad7732fe19579e..2749e8007312eef495072f1efce408e6b37ccec8 100644
--- a/my-app/src/components/UserComponents/UserItem.js
+++ b/my-app/src/components/UserComponents/UserItem.js
@@ -2,91 +2,21 @@ import React, { Component } from "react";
import Button from "react-bootstrap/esm/Button";
import Card from 'react-bootstrap/Card';
import ListGroup from 'react-bootstrap/ListGroup';
-import { connect } from "react-redux";
-import { bindActionCreators } from "redux";
-import DeleteUserModal from './DeleteUserModal'
-import EditUser from './EditUser'
-import CreateNewUser from './CreateNewUser'
-import addIcon from '../../icons/addIcon.png'
-
-
-import * as userManagementActions from '../../actions/UserManagementActions'
-
-const mapStateToProps = state => {
- return {
- showDeleteUserModal: state.UserManagementReducer.showDeleteUserModal,
- userList: state.UserManagementReducer.userList
- };
-}
-
-const DISPLAY = {
- LIST: "list",
- EDIT: "edit",
- CREATE: "create"
-}
class UserItem extends Component {
- constructor(props) {
- super(props);
- this.state = {
- displayingPage: DISPLAY.LIST,
- editingUser: null
+ render() {
+ const user = this.props.user
+ let editButtonID = "UserItemEditButton" + user.userID
+ let deleteButtonID = "UserItemDeleteButton" + user.userID
+ let itemID = "UserItem" + user.userID
+ let dialogData = {
+ dialogID: "DeleteDialogUser" + user.userID,
+ name: user.firstName + " " + user.lastName,
+ userID: user.userID
}
-
- this.MapAllUsers = this.MapAllUsers.bind(this);
- this.handleShowDeleteModal = this.handleShowDeleteModal.bind(this);
- this.handleClose = this.handleClose.bind(this);
- this.handleSwitchToList = this.handleSwitchToList.bind(this);
- this.handleShowCreatePage = this.handleShowCreatePage.bind(this);
- }
-
- handleShowDeleteModal(e, dialogModalData) {
- e.preventDefault();
- const { showDeleteUserModalAction } = this.props
- showDeleteUserModalAction(dialogModalData)
- }
-
- handleShowEditPage(e, user) {
- e.preventDefault();
- this.setState({ editingUser: user })
- this.setState({ displayingPage: DISPLAY.EDIT })
- }
-
- handleShowCreatePage(e) {
- e.preventDefault();
- this.setState({ displayingPage: DISPLAY.CREATE })
- }
-
- handleClose() {
- const { hideDeleteUserModalAction } = this.props;
- hideDeleteUserModalAction();
- }
-
- handleSwitchToList(e) {
- this.setState({ displayingPage: DISPLAY.LIST })
- }
-
- MapAllUsers() {
- const allUsers = this.props.userList
- if (allUsers) {
- var showDeleteUserModal = this.props.showDeleteUserModal
- if (showDeleteUserModal === undefined) {
- showDeleteUserModal = false
- }
- console.log("deleteModal:" + showDeleteUserModal)
- var users = allUsers.map(user => {
- let editButtonID = "UserItemEditButton" + user.userID
- let deleteButtonID = "UserItemDeleteButton" + user.userID
- let itemID = "UserItem" + user.userID
- let dialogData = {
- dialogID: "DeleteDialogUser" + user.userID,
- name: user.firstName + " " + user.lastName,
- userID: user.userID
- }
-
- return (
- <div key={user.userID}>
- <Card style={{ width: "18rem", background: '#ebebeb' }} id={itemID}>
+ return (
+ <div>
+ <Card style={{ width: "18rem", background: '#ebebeb' }} id={itemID}>
<Card.Header>{user.firstName} {user.lastName}</Card.Header>
<ListGroup variant="flush">
<ListGroup.Item >User ID: {user.userID}</ListGroup.Item>
@@ -94,63 +24,16 @@ class UserItem extends Component {
<ListGroup.Item >Last Name: {user.lastName}</ListGroup.Item>
</ListGroup>
<Card.Footer style={{ display: 'flex', justifyContent: 'space-evenly' }}>
- <Button variant="primary" onClick={(e) => this.handleShowEditPage(e, user)} id={editButtonID} >Edit</Button>
- <Button variant="primary" type="submit" onClick={(e) => this.handleShowDeleteModal(e, dialogData)} id={deleteButtonID} style={{ background: '#ffc800', color: 'black', border: 'none' }}>
+ <Button variant="primary" onClick={(e) => this.props.handleShowEditPage(e, user)} id={editButtonID} >Edit</Button>
+ <Button variant="primary" type="submit" onClick={(e) => this.props.handleShowDeleteModal(e, dialogData)} id={deleteButtonID} style={{ background: '#ffc800', color: 'black', border: 'none' }}>
Delete
</Button>
</Card.Footer>
</Card>
- </div>
- )
- })
- console.log(users)
- return users
- }
- }
-
- render() {
- var workspace
- switch (this.state.displayingPage) {
- case DISPLAY.LIST:
- workspace =
- (<>
- <Button id="UserManagementPageCreateUserButton" onClick={this.handleShowCreatePage}>
- <img alt="Add-User-Button" src={addIcon} style={{ width: '2rem' }}></img>
- </Button>
- {this.MapAllUsers()}
- <DeleteUserModal />
- </>)
- break
- case DISPLAY.CREATE:
- workspace = <CreateNewUser id="UserManagementPageCreateComponent" goBack={this.handleSwitchToList} />
- break
- case DISPLAY.EDIT:
- workspace = <EditUser id="UserManagementPageEditComponent" goBack={this.handleSwitchToList} editUser={this.state.editingUser} />
- break
- default:
- workspace = <Button onClick={this.handleShowCreatePage}>
- <img alt="Add-User-Button" src={addIcon} style={{ width: '2rem' }}></img>
- </Button>
- (<>
- <Button id="UserManagementPageCreateUserButton" onClick={this.handleShowCreatePage}>
- <img alt="Add-User-Button" src={addIcon} style={{ width: '2rem' }}></img>
- </Button>
- {this.MapAllUsers()}
- <DeleteUserModal />
- </>)
- }
- return (
- <div >
- {workspace}
</div>
)
}
}
-const mapDispatchToProps = dispatch => bindActionCreators({
- showDeleteUserModalAction: userManagementActions.getShowDeleteUserModalAction,
- hideDeleteUserModalAction: userManagementActions.getHideDeleteUserModalAction
-}, dispatch)
-const ConnectedUserItems = connect(mapStateToProps, mapDispatchToProps)(UserItem)
-export default ConnectedUserItems
\ No newline at end of file
+export default UserItem
\ No newline at end of file
diff --git a/my-app/src/components/UserComponents/UserManagement.js b/my-app/src/components/UserComponents/UserManagement.js
index 620d1b3741bc42958dc716b0fdda32257126ffab..f7c80c9ddb3946288c1ade84dac1d6e3f233e999 100644
--- a/my-app/src/components/UserComponents/UserManagement.js
+++ b/my-app/src/components/UserComponents/UserManagement.js
@@ -1,17 +1,135 @@
import React, { Component } from "react";
import UserItem from "./UserItem";
+import Button from "react-bootstrap/esm/Button";
+import DeleteUserModal from './DeleteUserModal'
+import EditUser from './EditUser'
+import CreateNewUser from './CreateNewUser'
+import addIcon from '../../icons/addIcon.png'
+import { connect } from "react-redux";
+import { bindActionCreators } from "redux";
+
+import * as userManagementActions from '../../actions/UserManagementActions'
+
+
+const mapStateToProps = state => {
+ return {
+ showDeleteUserModal: state.UserManagementReducer.showDeleteUserModal,
+ userList: state.UserManagementReducer.userList
+ };
+}
+
+const DISPLAY = {
+ LIST: "list",
+ EDIT: "edit",
+ CREATE: "create"
+}
class UserManagement extends Component {
+ constructor(props) {
+ super(props);
+ this.state = {
+ displayingPage: DISPLAY.LIST,
+ editingUser: null
+ }
+
+ this.MapAllUsers = this.MapAllUsers.bind(this);
+ this.handleShowDeleteModal = this.handleShowDeleteModal.bind(this);
+ this.handleClose = this.handleClose.bind(this);
+ this.handleSwitchToList = this.handleSwitchToList.bind(this);
+ this.handleShowCreatePage = this.handleShowCreatePage.bind(this);
+ this.handleShowEditPage = this.handleShowEditPage.bind(this);
+ }
+
+ handleShowDeleteModal(e, dialogModalData) {
+ e.preventDefault();
+ const { showDeleteUserModalAction } = this.props
+ showDeleteUserModalAction(dialogModalData)
+ }
+
+ handleShowEditPage(e, user) {
+ e.preventDefault();
+ this.setState({ editingUser: user })
+ this.setState({ displayingPage: DISPLAY.EDIT })
+ }
+
+ handleShowCreatePage(e) {
+ e.preventDefault();
+ this.setState({ displayingPage: DISPLAY.CREATE })
+ }
+
+ handleSwitchToList(e) {
+ this.setState({ displayingPage: DISPLAY.LIST })
+ }
+
+ handleClose() {
+ const { hideDeleteUserModalAction } = this.props;
+ hideDeleteUserModalAction();
+ }
+
+
+ MapAllUsers() {
+ const allUsers = this.props.userList
+ if (allUsers) {
+ var showDeleteUserModal = this.props.showDeleteUserModal
+ if (showDeleteUserModal === undefined) {
+ showDeleteUserModal = false
+ }
+ console.log("deleteModal:" + showDeleteUserModal)
+ var users = allUsers.map(user => {
+ return (
+ <div key={user.userID}>
+ <UserItem key={user.userID} user={user} handleShowDeleteModal={this.handleShowDeleteModal} handleShowEditPage={this.handleShowEditPage} />
+ </div>
+ )
+ })
+ return users
+ }
+ }
+
render() {
+ var workspace
+ switch (this.state.displayingPage) {
+ case DISPLAY.LIST:
+ workspace =
+ (<>
+ <Button id="UserManagementPageCreateUserButton" onClick={this.handleShowCreatePage}>
+ <img alt="Add-User-Button" src={addIcon} style={{ width: '2rem' }}></img>
+ </Button>
+ {this.MapAllUsers()}
+ <DeleteUserModal />
+ </>)
+ break
+ case DISPLAY.CREATE:
+ workspace = <CreateNewUser id="UserManagementPageCreateComponent" goBack={this.handleSwitchToList} />
+ break
+ case DISPLAY.EDIT:
+ workspace = <EditUser id="UserManagementPageEditComponent" goBack={this.handleSwitchToList} editUser={this.state.editingUser} />
+ break
+ default:
+ workspace = <Button onClick={this.handleShowCreatePage}>
+ <img alt="Add-User-Button" src={addIcon} style={{ width: '2rem' }}></img>
+ </Button>
+ (<>
+ <Button id="UserManagementPageCreateUserButton" onClick={this.handleShowCreatePage}>
+ <img alt="Add-User-Button" src={addIcon} style={{ width: '2rem' }}></img>
+ </Button>
+ {this.MapAllUsers()}
+ <DeleteUserModal />
+ </>)
+ }
return (
- <div>
- <div id="UserManagementPage" style={{ height: '50vw', backgroundColor: '#2b3648', padding: '10rem', display: 'flex', justifyContent: 'center' }}>
- <UserItem />
- </div>
+ <div id="UserManagementPage" style={{ height: '50vw', backgroundColor: '#2b3648', padding: '2rem' }}>
+ {workspace}
</div>
)
}
}
-export default UserManagement
\ No newline at end of file
+const mapDispatchToProps = dispatch => bindActionCreators({
+ showDeleteDegreeCourseModalAction: userManagementActions.getShowDeleteUserModalAction,
+ hideDeleteDegreeCourseModalAction: userManagementActions.getHideDeleteUserModalAction
+}, dispatch)
+
+const ConnectedUserManagement = connect(mapStateToProps, mapDispatchToProps)(UserManagement)
+export default ConnectedUserManagement
\ No newline at end of file
diff --git a/my-app/src/reducer/AuthenticationReducer.js b/my-app/src/reducer/AuthenticationReducer.js
index eaf1242e7cc823e4c10576dd8e1eaa3d19aeaf9d..cbf70b722f2be56ff664c8ed19214868395c9ab0 100644
--- a/my-app/src/reducer/AuthenticationReducer.js
+++ b/my-app/src/reducer/AuthenticationReducer.js
@@ -30,6 +30,8 @@ function AuthenticationReducer(state = initialState, action) {
error: null
}
case authenticationActions.AUTHENTICATION_SUCCESS:
+ console.log("Action: " + JSON.stringify(action));
+
return {
...state,
showLoginDialog: false,
@@ -48,7 +50,8 @@ function AuthenticationReducer(state = initialState, action) {
return {
...state,
user: null,
- accessToken: null
+ accessToken: null,
+ isAdmin: false
}
default:
return state;