diff --git a/frontend/src/HomePage/ManageOrgUsers.jsx b/frontend/src/HomePage/ManageOrgUsers.jsx
deleted file mode 100644
index 5283396100..0000000000
--- a/frontend/src/HomePage/ManageOrgUsers.jsx
+++ /dev/null
@@ -1,118 +0,0 @@
-import React from 'react';
-import { organizationService } from '@/_services';
-import Modal from 'react-bootstrap/Modal';
-import Button from 'react-bootstrap/Button';
-import { toast } from 'react-toastify';
-import 'react-toastify/dist/ReactToastify.css';
-import Skeleton from 'react-loading-skeleton';
-
-class ManageOrgUsers extends React.Component {
- constructor(props) {
- super(props);
-
- this.state = {
- showModal: false,
- appId: props.appId,
- isLoading: true,
- addingUser: false
- };
- }
-
- componentDidMount() {
-
- const appId = this.props.appId;
-
- organizationService.getUsers(appId).then(data => this.setState({
- users: data.users,
- isLoading: false,
- }));
-
- this.setState({ appId });
- }
-
- hideModal = () => {
- this.setState({
- showModal: false
- });
- }
-
- render() {
- const { showModal, isLoading, users } = this.state;
-
- return (
-
-
- {!showModal &&
this.setState({ showModal: true })}> Manage Users }
-
-
-
-
-
- Users and permissions
-
-
- Add User
-
- this.hideModal()}>
- x
-
-
-
-
-
-
- {isLoading ?
-
-
-
- :
-
-
-
-
- Name
- Email
- Role
-
-
-
-
- {users.map((user) =>
-
- {user.name}
-
- {user.email}
-
-
- {user.role}
-
-
- Remove
-
-
- )}
-
-
-
-
- }
-
-
-
-
-
-
-
-
-
- )
- }
-}
-
-export { ManageOrgUsers };
diff --git a/frontend/src/ManageOrgUsers/ManageOrgUsers.jsx b/frontend/src/ManageOrgUsers/ManageOrgUsers.jsx
new file mode 100644
index 0000000000..733e6e4d09
--- /dev/null
+++ b/frontend/src/ManageOrgUsers/ManageOrgUsers.jsx
@@ -0,0 +1,151 @@
+import React from 'react';
+import { organizationService } from '@/_services';
+import { authenticationService } from '@/_services';
+import 'react-toastify/dist/ReactToastify.css';
+import { Link } from 'react-router-dom';
+import Skeleton from 'react-loading-skeleton';
+
+class ManageOrgUsers extends React.Component {
+ constructor(props) {
+ super(props);
+
+ this.state = {
+ currentUser: authenticationService.currentUserValue,
+ showModal: false,
+ isLoading: true,
+ addingUser: false
+ };
+ }
+
+ componentDidMount() {
+ organizationService.getUsers(null).then(data => this.setState({
+ users: data.users,
+ isLoading: false,
+ }));
+ }
+
+ hideModal = () => {
+ this.setState({
+ showModal: false
+ });
+ }
+
+ render() {
+ const { isLoading, users } = this.state;
+
+ return (
+
+
+
+
+
+
+
+
+
+
+
+ this.setState({ showModal: true })}> Manage Users
+
+
+
+
+
+
+
+
+ Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus ad amet consectetur exercitationem fugiat in ipsa ipsum, natus odio quidem quod repudiandae sapiente. Amet debitis et magni maxime necessitatibus ullam.
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {/* Dashboard */}
+
+
+ Users & Permissions
+
+
+
+
+
+
+
+
+
+ {isLoading ?
+
+
+
+ :
+
+
+
+
+
+ Name
+ Email
+ Role
+
+
+
+
+ {users.map((user) =>
+
+ {user.name}
+
+ {user.email}
+
+
+ {user.role}
+
+
+ Remove
+
+
+ )}
+
+
+
+
+ }
+
+
+
+
+
+ )
+ }
+}
+
+export { ManageOrgUsers };
diff --git a/frontend/src/ManageOrgUsers/index.js b/frontend/src/ManageOrgUsers/index.js
new file mode 100644
index 0000000000..1181633604
--- /dev/null
+++ b/frontend/src/ManageOrgUsers/index.js
@@ -0,0 +1 @@
+export * from './ManageOrgUsers';