Skip to content
This repository has been archived by the owner on Jul 28, 2021. It is now read-only.

Commit

Permalink
Merge pull request #256 from AtlasRender/bug-fixes-2
Browse files Browse the repository at this point in the history 
Bug fixes
  • Loading branch information
@DanilAndreev
DanilAndreev authored Dec 17, 2020
2 parents 5ffec20 + a3cfa37 commit 09d8bb9
Show file tree
Hide file tree
Showing 5 changed files with 187 additions and 69 deletions.
94 changes: 67 additions & 27 deletions src/layout/MonitorLayout/MonitorLayout.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
* All rights reserved.
*/

import React, {Ref, useEffect} from "react";
import React, {Ref, useEffect, useState} from "react";
import Drawer from "@material-ui/core/Drawer";
import AppBar from "@material-ui/core/AppBar";
import CssBaseline from "@material-ui/core/CssBaseline";
Expand All @@ -23,7 +23,7 @@ import {
Avatar,
Box,
Divider,
IconButton,
IconButton, Menu, MenuItem,
Popover,
SwipeableDrawer,
useMediaQuery,
Expand Down Expand Up @@ -57,6 +57,10 @@ import AddIcon from '@material-ui/icons/Add';
import WorkIcon from '@material-ui/icons/Work';
import CheckIcon from '@material-ui/icons/Check';
import GroupIcon from '@material-ui/icons/Group';
import useCoreRequest from "../../hooks/useCoreRequest";
import Organization from "../../interfaces/Organization";
import ErrorHandler from "../../utils/ErrorHandler";
import useEnqueueErrorSnackbar from "../../utils/enqueueErrorSnackbar";

/**
* MonitorLayoutProps - interface for MonitorLayout component
Expand All @@ -80,22 +84,31 @@ const MonitorLayout = React.forwardRef((props: MonitorLayoutProps, ref: Ref<HTML
className,
} = props;

const coreRequest = useCoreRequest();
const {changeRoute} = useChangeRoute();
const enqueueErrorSnackbar = useEnqueueErrorSnackbar();

const theme = useTheme();
const [open, setOpen] = React.useState(false);
const [state, setState] = React.useState({left: false});
const {logout, isLogged, getUser} = useAuth();
const [anchorEl, setAnchorEl] = React.useState<null | HTMLElement>(null);
const [userId, setUserId] = useState(-1);
const [organizations, setOrganizations] = useState<Organization[]>([]);

const openPopper = Boolean(anchorEl);
const id = openPopper ? "simple-popper" : undefined;
const location = useLocation();

console.log(organizations);

useEffect(() => {
const user: User | null = getUser();
if (user)
if (user){
CoreEventDispatcher.connect(user.bearer);
setUserId(user.id);
}


const listener = (message: any) => {
console.log("recieved11 ", message);
Expand Down Expand Up @@ -125,12 +138,33 @@ const MonitorLayout = React.forwardRef((props: MonitorLayoutProps, ref: Ref<HTML
}
}, [isLogged]);

useEffect(() => {
if(isLogged && userId >= 0) {
handleGetUserOrganizations();
}
}, [userId]);


const handleGetUserOrganizations = () => {
coreRequest()
.get(`users/${userId}/organizations`)
.then(response => {
setOrganizations(response.body)
})
.catch(err => {
const errorHandler = new ErrorHandler(enqueueErrorSnackbar);
errorHandler
// .on(401, () => {logout()})
.on(404, "User not found")
.handle(err);
})
}

const handleClick = (event: React.MouseEvent<HTMLElement>) => {
setAnchorEl(anchorEl ? null : event.currentTarget);
};

const handleClosePopover = () => {
const handleClose = () => {
setAnchorEl(null);
};

Expand Down Expand Up @@ -172,7 +206,6 @@ const MonitorLayout = React.forwardRef((props: MonitorLayoutProps, ref: Ref<HTML
<List>
<MenuElement icon={WorkIcon} page="jobs" label="Render ShortJobs"/>
<MenuElement icon={PersonIcon} page="user" label="User Page"/>
<MenuElement icon={GroupIcon} page="organization/1" label="Organization Page"/>
<MenuElement icon={CheckIcon} page="submit" label="Submit Page"/>
<MenuElement icon={AddIcon} page="createorganization" label="Create Organization"/>
</List>
Expand Down Expand Up @@ -216,30 +249,37 @@ const MonitorLayout = React.forwardRef((props: MonitorLayoutProps, ref: Ref<HTML
>
<Avatar/>
</IconButton>
<Popover
id={id}
open={openPopper}
<Menu
id="simple-menu"
anchorEl={anchorEl}
onClose={handleClosePopover}
className={classes.popperTop}
anchorOrigin={{
vertical: "bottom",
horizontal: "center",
}}
transformOrigin={{
vertical: "top",
horizontal: "center",
}}
keepMounted
open={Boolean(anchorEl)}
onClose={handleClose}
className={classes.rightSideMenu}
>
<Button
type="submit"
variant="contained"
color="primary"
onClick={handleLogout}
>
Logout
</Button>
</Popover>
<MenuItem onClick={() => {
changeRoute({page: "user", panel: null});
handleClose();
}}>Profile</MenuItem>
<MenuItem onClick={() => {
changeRoute({page: "jobs", panel: null});
handleClose();
}}>Render Jobs</MenuItem>
<MenuItem onClick={() => {
changeRoute({page: "organization/1"});
handleClose();
}}>Organization 1</MenuItem>
<MenuItem onClick={() => {
changeRoute({page: "organization/2"});
handleClose();
}}>Organization 2</MenuItem>
<MenuItem onClick={() => {
changeRoute({page: "organization/3"});
handleClose();
}}>Organization 3</MenuItem>
<MenuItem onClick={handleLogout}>Logout</MenuItem>
</Menu>

</Toolbar>
</AppBar>
<Drawer
Expand Down
3 changes: 3 additions & 0 deletions src/layout/MonitorLayout/styles.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -88,6 +88,9 @@ const styles = (theme: Theme) => createStyles({
header: {
background: theme.palette.header.dark,
color: theme.palette.common.white,
},
rightSideMenu: {
marginTop: 50,
}
});

Expand Down
137 changes: 101 additions & 36 deletions src/views/CreateOrganizationPageView/CreateOrganizationPageView.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -44,6 +44,7 @@ import useCoreRequest from "../../hooks/useCoreRequest";
import useAuth from "../../hooks/useAuth";
import ErrorHandler from "../../utils/ErrorHandler";
import useEnqueueSuccessSnackbar from "../../utils/EnqueSuccessSnackbar";
import DialogAddUsers from "../OrganizationPageView/LocalComponents/DialogAddUsers";


interface CreateOrganizationPageProps extends Stylable {
Expand Down Expand Up @@ -84,6 +85,60 @@ const CreateOrganizationPageView = React.forwardRef((props: CreateOrganizationPa
const [members, setMembers] = useState<UserData[]>([]);
const [addMemberButton, setAddMemberButton] = useState<boolean>(false);


//For dialog-----------------------------------------------------------------------------------------
const [newUsers, setNewUsers] = useState<number[]>([]);
const [availableUsers, setAvailableUsers] = useState<UserData[]>([]);


function handleNewUsersClick(newUserId: number) {
let newUsersArray = newUsers;
if (newUsers.includes(newUserId)) {
newUsersArray = newUsersArray.filter(userId => userId !== newUserId);
setNewUsers(newUsersArray);
} else {
setNewUsers([...newUsers, newUserId]);
}
}

function handleAddUser(usersToAddId: number[]) {
for(let i = 0; i < usersToAddId.length; i++) {
const newMember = users.filter(user => user.id === usersToAddId[i]);
if(newMember[0].id !== owner?.id) {
setMembers(prev => ([...prev, newMember[0]]));
}
}
setAddMemberButton(!addMemberButton);
setNewUsers([]);
}

function handleGetAvailableUsers() {
let availableMembers: UserData[] = users;
availableMembers = availableMembers.filter(user => user.id !== owner?.id);
for(let i = 0; i < members.length; i++) {
availableMembers = availableMembers.filter(user => (user.id !== members[i].id && user.id !== owner?.id));
}
setAvailableUsers(availableMembers);
}

const handleCloseDialogAddUser = () => {
setAddMemberButton(!addMemberButton);
setNewUsers([]);
}

useEffect(() => {
if(owner) {
handleGetAvailableUsers();
}
}, [owner]);

useEffect(() => {
handleGetAvailableUsers();
}, [members]);

//----------------------------------------------------------------------------------------------------


const theme = useTheme();
let info;

Expand Down Expand Up @@ -325,43 +380,53 @@ const CreateOrganizationPageView = React.forwardRef((props: CreateOrganizationPa
})}
</List>

<Dialog
<DialogAddUsers
open={addMemberButton}
onClose={() => setAddMemberButton(!addMemberButton)}
>
<DialogTitle className={classes.container}>
<Typography variant="h6" align="center">
Add members
</Typography>
</DialogTitle>
<Divider/>
<List className={classes.minWidthList}>
{users.map((user) => {
if (user.id === owner?.id) {
return;
}
return (
<ListItem key={user.id}>
<ListItemAvatar><Avatar/></ListItemAvatar>
<ListItemText primary={user.username}/>
<ListItemSecondaryAction>
<IconButton
onClick={() => setMembers(prev => [...prev, user])}
>
<AddIcon/>
</IconButton>
</ListItemSecondaryAction>
</ListItem>
);
})}
</List>
<Button
fullWidth
onClick={() => setAddMemberButton(!addMemberButton)}
>
Close
</Button>
</Dialog>
onClose={handleCloseDialogAddUser}
newUsers={newUsers}
availableUsers={availableUsers}
orgCreation={true}
onNewUserClick={handleNewUsersClick}
onAdduser={handleAddUser}
/>

{/*<Dialog*/}
{/* open={addMemberButton}*/}
{/* onClose={() => setAddMemberButton(!addMemberButton)}*/}
{/*>*/}
{/* <DialogTitle className={classes.container}>*/}
{/* <Typography variant="h6" align="center">*/}
{/* Add members*/}
{/* </Typography>*/}
{/* </DialogTitle>*/}
{/* <Divider/>*/}
{/* <List className={classes.minWidthList}>*/}
{/* {users.map((user) => {*/}
{/* if (user.id === owner?.id) {*/}
{/* return;*/}
{/* }*/}
{/* return (*/}
{/* <ListItem key={user.id}>*/}
{/* <ListItemAvatar><Avatar/></ListItemAvatar>*/}
{/* <ListItemText primary={user.username}/>*/}
{/* <ListItemSecondaryAction>*/}
{/* <IconButton*/}
{/* onClick={() => setMembers(prev => [...prev, user])}*/}
{/* >*/}
{/* <AddIcon/>*/}
{/* </IconButton>*/}
{/* </ListItemSecondaryAction>*/}
{/* </ListItem>*/}
{/* );*/}
{/* })}*/}
{/* </List>*/}
{/* <Button*/}
{/* fullWidth*/}
{/* onClick={() => setAddMemberButton(!addMemberButton)}*/}
{/* >*/}
{/* Close*/}
{/* </Button>*/}
{/*</Dialog>*/}
</Grid>
<Grid item xs={12} style={{display: "flex", justifyContent: "flex-end"}}>
<Grid item xs={3}>
Expand Down
Loading

0 comments on commit 09d8bb9

Please sign in to comment.