This repository has been archived by the owner on Dec 26, 2022. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 80
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Internal 184 log out redirect (#198)
* converted useInterval to timeMod, extracted dashboard styles, fixed useEffect bug of excessive calling * broke styles into modules, formatting and addition of card info when not logged in * removed logic to check if local for login, added else statement for rerender to display login message in uploadplugin and sidebar components * fixed duplicate use state bug * fixed grapl header styling for engagementview * refactoring, fixed key errors for tables * changed color of button * black formatting
- Loading branch information
1 parent
4646e23
commit 355ef4f
Showing
24 changed files
with
16,725 additions
and
339 deletions.
There are no files selected for viewing
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,66 +1,65 @@ | ||
import React from 'react'; | ||
import {createStyles, makeStyles, Theme} from "@material-ui/core/styles"; | ||
import React, { useEffect, useState } from 'react'; | ||
import { checkLogin } from '../Login'; | ||
import GraplHeader from "./reusableComponents/GraplHeader"; | ||
import {Link} from 'react-router-dom'; | ||
import { Link } from 'react-router-dom'; | ||
import { dasboardStyles } from './makeStyles/DashboardStyles'; | ||
import LoginNotification from "./reusableComponents/Notifications"; | ||
|
||
const useStyles = makeStyles( (theme: Theme) => | ||
createStyles({ | ||
root: { | ||
display: "flex", | ||
}, | ||
button: { | ||
backgroundColor: "#42C6FF", | ||
margin: "0.25rem", | ||
padding: "0.25rem", | ||
}, | ||
welcome: { | ||
width:"70%", | ||
textAlign:"center", | ||
backgroundColor: "#373740", | ||
height: "100vh", | ||
color: "white" | ||
}, | ||
nav: { | ||
margin: "2rem", | ||
width: "30%", | ||
display: "flex", | ||
flexDirection: "column", | ||
}, | ||
dashboard: { | ||
display: "flex", | ||
flexDirection: "row", | ||
}, | ||
link: { | ||
color: "white", | ||
textDecoration: "none", | ||
padding: ".75rem", | ||
backgroundColor: "#42C6FF", | ||
margin: "1rem", | ||
textAlign: "center", | ||
borderRadius: ".35rem", | ||
textTransform: "uppercase", | ||
fontWeight: "bolder" | ||
}, | ||
|
||
}) | ||
); | ||
const useStyles = dasboardStyles; | ||
|
||
export default function Dashboard() { | ||
const classes = useStyles(); | ||
return ( | ||
<> | ||
<GraplHeader displayBtn={false} /> | ||
const classes = useStyles(); | ||
|
||
const [state, setState] = useState({ | ||
loggedIn: true, | ||
renderedOnce: false, | ||
}); | ||
|
||
useEffect( | ||
() => { | ||
if(state.renderedOnce){ | ||
return; | ||
} | ||
|
||
const interval = setInterval(async () => { | ||
await checkLogin() | ||
.then((loggedIn) => { | ||
if(!loggedIn){ | ||
console.warn("Logged out") | ||
} | ||
setState({ | ||
loggedIn: loggedIn || false, | ||
renderedOnce: true, | ||
}); | ||
}); | ||
}, 2000); | ||
|
||
return () => { clearInterval(interval) } | ||
}, | ||
[state, setState]) | ||
|
||
console.log("state - loggedin", state.loggedIn); | ||
|
||
const loggedIn = state.loggedIn; | ||
|
||
return ( | ||
<> | ||
<GraplHeader displayBtn={false} /> | ||
|
||
<div className = { classes.dashboard}> | ||
<section className = { classes.nav }> | ||
<Link to = "/engagements" className = {classes.link}> Engagements </Link> | ||
<Link to = "/plugins" className = {classes.link}> Upload Plugin </Link> | ||
</section> | ||
<div className = { classes.dashboard}> | ||
<section className = { classes.nav }> | ||
<Link to = "/engagements" className = {classes.link}> Engagements </Link> | ||
<Link to = "/plugins" className = {classes.link}> Upload Plugin </Link> | ||
</section> | ||
|
||
<section className = { classes.welcome }> | ||
<div className = {classes.loggedIn}> | ||
{!loggedIn ? <LoginNotification /> : ""} | ||
</div> | ||
|
||
<section className = { classes.welcome }> | ||
<h1> Welcome! </h1> | ||
</section> | ||
</div> | ||
</> | ||
) | ||
} | ||
<h1> Welcome! </h1> | ||
</section> | ||
</div> | ||
</> | ||
) | ||
} |
Oops, something went wrong.