Ran prettier on the whole frontend codebase again
This commit is contained in:
Isoporhode
+169
-171
@@ -1,181 +1,182 @@
|
||||
import React, { useEffect, useState } from 'react';
|
||||
import { useTheme } from '@material-ui/core/styles';
|
||||
import React, { useEffect, useState } from "react";
|
||||
import { useTheme } from "@material-ui/core/styles";
|
||||
|
||||
import Grid from '@material-ui/core/Grid';
|
||||
import Card from '@material-ui/core/Card';
|
||||
import CardActionArea from '@material-ui/core/CardActionArea';
|
||||
import CardContent from '@material-ui/core/CardContent';
|
||||
import CardHeader from '@material-ui/core/CardHeader';
|
||||
import Typography from '@material-ui/core/Typography';
|
||||
import Button from '@material-ui/core/Button';
|
||||
import Grid from "@material-ui/core/Grid";
|
||||
import Card from "@material-ui/core/Card";
|
||||
import CardActionArea from "@material-ui/core/CardActionArea";
|
||||
import CardContent from "@material-ui/core/CardContent";
|
||||
import CardHeader from "@material-ui/core/CardHeader";
|
||||
import Typography from "@material-ui/core/Typography";
|
||||
import Button from "@material-ui/core/Button";
|
||||
|
||||
const Workflows = (props) => {
|
||||
const { globalUrl, isLoggedIn, isLoaded, } = props
|
||||
const theme = useTheme();
|
||||
const [curView, setCurView] = useState(0);
|
||||
const [firstrequest, setFirstrequest] = useState(true)
|
||||
const [selectedItems, setSelectedItems] = useState([])
|
||||
const { globalUrl, isLoggedIn, isLoaded } = props;
|
||||
const theme = useTheme();
|
||||
const [curView, setCurView] = useState(0);
|
||||
const [firstrequest, setFirstrequest] = useState(true);
|
||||
const [selectedItems, setSelectedItems] = useState([]);
|
||||
|
||||
const viewdata1 = [
|
||||
{
|
||||
"title": "General",
|
||||
"content": "Learn about our ticketing solutions",
|
||||
"subitems": [
|
||||
{
|
||||
"name": "Search",
|
||||
"subtitle": "Search for anything, anywhere",
|
||||
},
|
||||
{
|
||||
"name": "Message",
|
||||
"subtitle": "Read and send messages",
|
||||
},
|
||||
{
|
||||
"name": "Parse emails",
|
||||
"subtitle": "what",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
"title": "Ticketing",
|
||||
"subitems": [
|
||||
{
|
||||
"name": "Search",
|
||||
"subtitle": "Search for anything, anywhere",
|
||||
},
|
||||
{
|
||||
"name": "Message",
|
||||
"subtitle": "Read and send messages",
|
||||
},
|
||||
{
|
||||
"name": "Parse emails",
|
||||
"subtitle": "what",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
"title": "Threat intel",
|
||||
"subitems": [
|
||||
{
|
||||
"name": "Search",
|
||||
"subtitle": "Search for anything, anywhere",
|
||||
},
|
||||
{
|
||||
"name": "Message",
|
||||
"subtitle": "Read and send messages",
|
||||
},
|
||||
{
|
||||
"name": "Parse emails",
|
||||
"subtitle": "what",
|
||||
},
|
||||
],
|
||||
},
|
||||
]
|
||||
const viewdata1 = [
|
||||
{
|
||||
title: "General",
|
||||
content: "Learn about our ticketing solutions",
|
||||
subitems: [
|
||||
{
|
||||
name: "Search",
|
||||
subtitle: "Search for anything, anywhere",
|
||||
},
|
||||
{
|
||||
name: "Message",
|
||||
subtitle: "Read and send messages",
|
||||
},
|
||||
{
|
||||
name: "Parse emails",
|
||||
subtitle: "what",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Ticketing",
|
||||
subitems: [
|
||||
{
|
||||
name: "Search",
|
||||
subtitle: "Search for anything, anywhere",
|
||||
},
|
||||
{
|
||||
name: "Message",
|
||||
subtitle: "Read and send messages",
|
||||
},
|
||||
{
|
||||
name: "Parse emails",
|
||||
subtitle: "what",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Threat intel",
|
||||
subitems: [
|
||||
{
|
||||
name: "Search",
|
||||
subtitle: "Search for anything, anywhere",
|
||||
},
|
||||
{
|
||||
name: "Message",
|
||||
subtitle: "Read and send messages",
|
||||
},
|
||||
{
|
||||
name: "Parse emails",
|
||||
subtitle: "what",
|
||||
},
|
||||
],
|
||||
},
|
||||
];
|
||||
|
||||
if (firstrequest) {
|
||||
setFirstrequest(false)
|
||||
if (props.match.params.key) {
|
||||
console.log("PROPS: ", props.match.params.key)
|
||||
const viewitem = viewdata1.find(item => item.title.toLowerCase() === props.match.params.key.toLowerCase())
|
||||
if (viewitem !== undefined && viewitem !== null) {
|
||||
setCurView(1)
|
||||
//setSelectedItem(viewitem)
|
||||
}
|
||||
}
|
||||
}
|
||||
if (firstrequest) {
|
||||
setFirstrequest(false);
|
||||
if (props.match.params.key) {
|
||||
console.log("PROPS: ", props.match.params.key);
|
||||
const viewitem = viewdata1.find(
|
||||
(item) =>
|
||||
item.title.toLowerCase() === props.match.params.key.toLowerCase()
|
||||
);
|
||||
if (viewitem !== undefined && viewitem !== null) {
|
||||
setCurView(1);
|
||||
//setSelectedItem(viewitem)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
const cardContentStyle = {
|
||||
height: "100%",
|
||||
width: "100%",
|
||||
padding: 40,
|
||||
};
|
||||
|
||||
const cardContentStyle = {
|
||||
height: "100%",
|
||||
width: "100%",
|
||||
padding: 40,
|
||||
}
|
||||
const outerGridView = {
|
||||
width: "100%",
|
||||
marginTop: 15,
|
||||
};
|
||||
|
||||
const outerGridView = {
|
||||
width: "100%",
|
||||
marginTop: 15,
|
||||
}
|
||||
const paperStyle = {
|
||||
height: 300,
|
||||
color: "white",
|
||||
backgroundColor: theme.palette.surfaceColor,
|
||||
color: "white",
|
||||
cursor: "pointer",
|
||||
display: "flex",
|
||||
textAlign: "center",
|
||||
};
|
||||
|
||||
const paperStyle = {
|
||||
height: 300,
|
||||
color: "white",
|
||||
backgroundColor: theme.palette.surfaceColor,
|
||||
color: "white",
|
||||
cursor: "pointer",
|
||||
display: "flex",
|
||||
textAlign: "center",
|
||||
}
|
||||
const HandleSelection = (data) => {
|
||||
const [selected, setSelected] = useState(false);
|
||||
|
||||
const HandleSelection = (data) => {
|
||||
const [selected, setSelected] = useState(false);
|
||||
var baseStyle = JSON.parse(JSON.stringify(paperStyle));
|
||||
if (selected) {
|
||||
baseStyle.backgroundColor = "white";
|
||||
baseStyle.color = "black";
|
||||
}
|
||||
|
||||
var baseStyle = JSON.parse(JSON.stringify(paperStyle))
|
||||
if (selected) {
|
||||
baseStyle.backgroundColor = "white"
|
||||
baseStyle.color = "black"
|
||||
}
|
||||
return (
|
||||
<Grid
|
||||
item
|
||||
xs={4}
|
||||
onClick={() => {
|
||||
console.log(selectedItems);
|
||||
if (selected) {
|
||||
const index = selectedItems.findIndex(
|
||||
(item) => item.title === data.title
|
||||
);
|
||||
if (index >= 0) {
|
||||
selectedItems.splice(index, 1);
|
||||
setSelectedItems(selectedItems);
|
||||
}
|
||||
} else {
|
||||
selectedItems.push(data);
|
||||
setSelectedItems(selectedItems);
|
||||
}
|
||||
|
||||
return (
|
||||
<Grid item xs={4} onClick={() => {
|
||||
console.log(selectedItems)
|
||||
if (selected) {
|
||||
const index = selectedItems.findIndex(item => item.title === data.title)
|
||||
if (index >= 0) {
|
||||
selectedItems.splice(index, 1)
|
||||
setSelectedItems(selectedItems)
|
||||
}
|
||||
} else {
|
||||
selectedItems.push(data)
|
||||
setSelectedItems(selectedItems)
|
||||
}
|
||||
setSelected(!selected);
|
||||
|
||||
setSelected(!selected)
|
||||
|
||||
//setCurView(1)
|
||||
//setSelectedItem(data)
|
||||
//window.location.pathname += "/"+data.title.toLowerCase()
|
||||
}}>
|
||||
<Card style={baseStyle}>
|
||||
<CardActionArea style={cardContentStyle}>
|
||||
<CardContent>
|
||||
<Typography variant="h4">
|
||||
{data.title}
|
||||
</Typography>
|
||||
</CardContent>
|
||||
</CardActionArea>
|
||||
</Card>
|
||||
</Grid>
|
||||
)
|
||||
}
|
||||
//setCurView(1)
|
||||
//setSelectedItem(data)
|
||||
//window.location.pathname += "/"+data.title.toLowerCase()
|
||||
}}
|
||||
>
|
||||
<Card style={baseStyle}>
|
||||
<CardActionArea style={cardContentStyle}>
|
||||
<CardContent>
|
||||
<Typography variant="h4">{data.title}</Typography>
|
||||
</CardContent>
|
||||
</CardActionArea>
|
||||
</Card>
|
||||
</Grid>
|
||||
);
|
||||
};
|
||||
|
||||
const view1 = curView === 0 ?
|
||||
<div>
|
||||
<Typography variant="h4">
|
||||
What are you interested in?
|
||||
</Typography>
|
||||
<Grid container style={outerGridView} spacing={3}>
|
||||
{viewdata1.map(data => {
|
||||
return (
|
||||
HandleSelection(data)
|
||||
)
|
||||
})}
|
||||
</Grid>
|
||||
{/*
|
||||
const view1 =
|
||||
curView === 0 ? (
|
||||
<div>
|
||||
<Typography variant="h4">What are you interested in?</Typography>
|
||||
<Grid container style={outerGridView} spacing={3}>
|
||||
{viewdata1.map((data) => {
|
||||
return HandleSelection(data);
|
||||
})}
|
||||
</Grid>
|
||||
{/*
|
||||
<Button variant="contained" color="primary" style={{height: 50, width: 300, margin: "auto",}} onClick={() => {
|
||||
setCurView(1)
|
||||
}}>
|
||||
Continue
|
||||
</Button>
|
||||
*/}
|
||||
</div>
|
||||
: null
|
||||
</div>
|
||||
) : null;
|
||||
|
||||
const view2 = curView === 1 ?
|
||||
<div>
|
||||
<Typography variant="h4">
|
||||
Step 2.
|
||||
</Typography>
|
||||
{/*
|
||||
const view2 =
|
||||
curView === 1 ? (
|
||||
<div>
|
||||
<Typography variant="h4">Step 2.</Typography>
|
||||
{/*
|
||||
<Grid container style={outerGridView} spacing={3}>
|
||||
{selectedItem.subitems === undefined ? null :
|
||||
selectedItem.subitems.map(data => {
|
||||
@@ -198,20 +199,17 @@ const Workflows = (props) => {
|
||||
})}
|
||||
</Grid>
|
||||
*/}
|
||||
</div>
|
||||
: null
|
||||
</div>
|
||||
) : null;
|
||||
|
||||
const baseView =
|
||||
<div style={{maxWidth: 1024, margin: "auto", paddingTop: 50,}}>
|
||||
{view1}
|
||||
{view2}
|
||||
</div>
|
||||
const baseView = (
|
||||
<div style={{ maxWidth: 1024, margin: "auto", paddingTop: 50 }}>
|
||||
{view1}
|
||||
{view2}
|
||||
</div>
|
||||
);
|
||||
|
||||
return (
|
||||
<div>
|
||||
{baseView}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
return <div>{baseView}</div>;
|
||||
};
|
||||
|
||||
export default Workflows
|
||||
export default Workflows;
|
||||
|
||||
Reference in New Issue
Block a user