Bumped opensearch
This commit is contained in:
+11
-2
@@ -57,7 +57,7 @@ services:
|
|||||||
security_opt:
|
security_opt:
|
||||||
- seccomp:unconfined
|
- seccomp:unconfined
|
||||||
opensearch:
|
opensearch:
|
||||||
image: opensearchproject/opensearch:2.5.0
|
image: opensearchproject/opensearch:2.11.0
|
||||||
hostname: shuffle-opensearch
|
hostname: shuffle-opensearch
|
||||||
container_name: shuffle-opensearch
|
container_name: shuffle-opensearch
|
||||||
environment:
|
environment:
|
||||||
@@ -84,9 +84,17 @@ services:
|
|||||||
networks:
|
networks:
|
||||||
- shuffle
|
- shuffle
|
||||||
restart: unless-stopped
|
restart: unless-stopped
|
||||||
|
|
||||||
|
#memcached:
|
||||||
|
# image: docker.io/bitnami/memcached:1
|
||||||
|
# container_name: shuffle-cache
|
||||||
|
# hostname: shuffle-cache
|
||||||
|
# ports:
|
||||||
|
# - 11211:11211
|
||||||
|
|
||||||
#docker-socket-proxy:
|
#docker-socket-proxy:
|
||||||
# image: tecnativa/docker-socket-proxy
|
# image: tecnativa/docker-socket-proxy
|
||||||
# container_name: shuffle-frontend
|
# container_name: docker-socket-proxy
|
||||||
# hostname: docker-socket-proxy
|
# hostname: docker-socket-proxy
|
||||||
# privileged: true
|
# privileged: true
|
||||||
# environment:
|
# environment:
|
||||||
@@ -111,6 +119,7 @@ services:
|
|||||||
# - /var/run/docker.sock:/var/run/docker.sock
|
# - /var/run/docker.sock:/var/run/docker.sock
|
||||||
# networks:
|
# networks:
|
||||||
# - shuffle
|
# - shuffle
|
||||||
|
#
|
||||||
networks:
|
networks:
|
||||||
shuffle:
|
shuffle:
|
||||||
driver: bridge
|
driver: bridge
|
||||||
|
|||||||
@@ -0,0 +1,403 @@
|
|||||||
|
import React, { useState, useEffect, useRef } from "react";
|
||||||
|
import theme from '../theme.jsx';
|
||||||
|
import ReactGA from 'react-ga4';
|
||||||
|
import { useNavigate, Link } from 'react-router-dom';
|
||||||
|
|
||||||
|
import { Search as SearchIcon, CloudQueue as CloudQueueIcon, Code as CodeIcon, Close as CloseIcon, Folder as FolderIcon, LibraryBooks as LibraryBooksIcon } from '@mui/icons-material';
|
||||||
|
import aa from 'search-insights'
|
||||||
|
import DeleteIcon from '@mui/icons-material/Delete';
|
||||||
|
import ShowChartIcon from '@mui/icons-material/ShowChart';
|
||||||
|
import ExploreIcon from '@mui/icons-material/Explore';
|
||||||
|
import LightbulbIcon from "@mui/icons-material/Lightbulb";
|
||||||
|
import NewReleasesIcon from "@mui/icons-material/NewReleases";
|
||||||
|
import ExtensionIcon from "@mui/icons-material/Extension";
|
||||||
|
import EmailIcon from "@mui/icons-material/Email";
|
||||||
|
import FingerprintIcon from '@mui/icons-material/Fingerprint';
|
||||||
|
import AppSearch from "../components/Appsearch.jsx";
|
||||||
|
import { toast } from 'react-toastify';
|
||||||
|
import {
|
||||||
|
Zoom,
|
||||||
|
Grid,
|
||||||
|
Paper,
|
||||||
|
TextField,
|
||||||
|
Collapse,
|
||||||
|
IconButton,
|
||||||
|
Avatar,
|
||||||
|
ButtonBase,
|
||||||
|
InputAdornment,
|
||||||
|
Typography,
|
||||||
|
Button,
|
||||||
|
Tooltip,
|
||||||
|
List,
|
||||||
|
ListItem,
|
||||||
|
ListItemAvatar,
|
||||||
|
ListItemText,
|
||||||
|
} from '@mui/material';
|
||||||
|
|
||||||
|
const AppSearchButtons = (props) => {
|
||||||
|
const { userdata, globalUrl, appFramework, defaultSearch, finishedApps, onNodeSelect, setDiscoveryData, appName, AppImage, setDefaultSearch, discoveryData } = props
|
||||||
|
const ref = useRef()
|
||||||
|
const [moreButton, setMoreButton] = useState(false);
|
||||||
|
let navigate = useNavigate();
|
||||||
|
|
||||||
|
const sizing = moreButton ? 510 : 480;
|
||||||
|
const buttonWidth = 450;
|
||||||
|
const buttonMargin = 10;
|
||||||
|
const bottomButtonStyle = {
|
||||||
|
borderRadius: 200,
|
||||||
|
marginTop: moreButton ? 44 : "",
|
||||||
|
height: 51,
|
||||||
|
width: 510,
|
||||||
|
fontSize: 16,
|
||||||
|
// background: "linear-gradient(89.83deg, #FF8444 0.13%, #F2643B 99.84%)",
|
||||||
|
background: "linear-gradient(90deg, #F86744 0%, #F34475 100%)",
|
||||||
|
padding: "16px 24px",
|
||||||
|
// top: 20,
|
||||||
|
// margin: "auto",
|
||||||
|
textTransform: 'capitalize',
|
||||||
|
itemAlign: "center",
|
||||||
|
// marginTop: 25
|
||||||
|
// marginLeft: "65px",
|
||||||
|
};
|
||||||
|
const buttonStyle = {
|
||||||
|
flex: 1,
|
||||||
|
width: 224,
|
||||||
|
padding: 25,
|
||||||
|
margin: buttonMargin,
|
||||||
|
color: "var(--White-text, #F1F1F1)",
|
||||||
|
fontWeight: 400,
|
||||||
|
fontSize: 17,
|
||||||
|
background: "rgba(33, 33, 33, 1)",
|
||||||
|
textTransform: 'capitalize',
|
||||||
|
border: "1px solid rgba(33, 33, 33, 1)",
|
||||||
|
borderRadius: 8,
|
||||||
|
marginRight: 8,
|
||||||
|
};
|
||||||
|
|
||||||
|
const isCloud = window.location.host === "localhost:3002" || window.location.host === "shuffler.io";
|
||||||
|
|
||||||
|
const mouseOver = (e) => {
|
||||||
|
e.target.style.border = "1px solid #f85a3e";
|
||||||
|
}
|
||||||
|
const mouseOut = (e) => {
|
||||||
|
e.target.style.border = "1px solid rgb(33, 33, 33)";
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Grid item xs={11} style={{ display: "flex" }}>
|
||||||
|
|
||||||
|
{/*<FormLabel style={{ color: "#B9B9BA" }}>Find your integrations!</FormLabel>*/}
|
||||||
|
{/* <div style={{ display: "flex", width: 510, height:100 }}>
|
||||||
|
<Button
|
||||||
|
disabled={finishedApps.includes("CASES")}
|
||||||
|
variant={
|
||||||
|
defaultSearch === "CASES" ? "contained" : "outlined"
|
||||||
|
}
|
||||||
|
color="secondary"
|
||||||
|
style={{
|
||||||
|
flex: 1,
|
||||||
|
width: "100%",
|
||||||
|
padding: 25,
|
||||||
|
margin: buttonMargin,
|
||||||
|
fontSize: 18,
|
||||||
|
color: "var(--White-text, #F1F1F1)",
|
||||||
|
fontWeight: 400,
|
||||||
|
background: "rgba(33, 33, 33, 1)",
|
||||||
|
borderRadius: 8,
|
||||||
|
textTransform: 'capitalize',
|
||||||
|
border: "1px solid rgba(33, 33, 33, 1)" ,
|
||||||
|
}}
|
||||||
|
onMouseOver={mouseOver}
|
||||||
|
onMouseOut={mouseOut}
|
||||||
|
// startIcon = {defaultSearch === "CASES" ? newSelectedApp.image_url : <LightbulbIcon/>}
|
||||||
|
onClick={(event) => {
|
||||||
|
onNodeSelect("CASES");
|
||||||
|
setDefaultSearch(discoveryData.label)
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{appFramework === undefined || appFramework.cases === undefined || appFramework.cases.large_image === undefined ||
|
||||||
|
appFramework === null || appFramework.cases === null || appFramework.cases.large_image === null || appFramework.cases.large_image.length === 0 ?
|
||||||
|
<div style={{width: 40, border: "1px solid rgba(33, 33, 33, 1) !importent", height: 40, borderRadius: 9999, backgroundColor: "#2F2F2F", textAlign:"center"}}>
|
||||||
|
<LightbulbIcon style={{ marginTop: 6 }} />
|
||||||
|
</div>
|
||||||
|
: <img style={{ marginRight: 8, width: 40, height: 40, flexShrink: 0, borderRadius: 40, }} src={AppImage} />}
|
||||||
|
<div style={{marginLeft: 8, }}>
|
||||||
|
<Typography style={{display:"flex",border:"none"}} >Case Management</Typography>
|
||||||
|
{appFramework === undefined || appFramework.cases === undefined || appFramework.cases.name === undefined ||
|
||||||
|
appFramework === null || appFramework.cases === null || appFramework.cases.name === null || appFramework.cases.name.length === 0 ?
|
||||||
|
"":<Typography style={{fontSize: 12, textAlign:"left", color:"var(--label-grey-text, #9E9E9E)" }} >{AppName}</Typography>}
|
||||||
|
</div>
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
<div style={{ display: "flex", width: 510, height: 100 }}>
|
||||||
|
<Button
|
||||||
|
disabled={finishedApps.includes("SIEM")}
|
||||||
|
variant={
|
||||||
|
defaultSearch === "SIEM" ? "contained" : "outlined"
|
||||||
|
}
|
||||||
|
style={buttonStyle}
|
||||||
|
// startIcon={<SearchIcon />}
|
||||||
|
onMouseOver={mouseOver}
|
||||||
|
onMouseOut={mouseOut}
|
||||||
|
color="secondary"
|
||||||
|
onClick={(event) => {
|
||||||
|
onNodeSelect("SIEM");
|
||||||
|
setDefaultSearch(discoveryData.label)
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{appFramework === undefined || appFramework.siem === undefined || appFramework.siem.large_image === undefined ||
|
||||||
|
appFramework === null || appFramework.siem === null || appFramework.siem.large_image === null || appFramework.siem.large_image.length === 0 ?
|
||||||
|
<div style={{width: 40, border: "1px solid rgba(33, 33, 33, 1) !importent", height: 40, borderRadius: 9999, backgroundColor: "#2F2F2F", textAlign:"center"}}>
|
||||||
|
<SearchIcon style={{ marginTop: 6 }} />
|
||||||
|
</div>
|
||||||
|
: <img style={{ marginRight: 8, width: 40, height: 40, flexShrink: 0, borderRadius: 40, }} src={appFramework.siem.large_image} />}
|
||||||
|
<div style={{marginLeft: 8,}}>
|
||||||
|
<Typography style={{display:"flex",}}>SIEM</Typography>
|
||||||
|
{appFramework === undefined || appFramework.siem === undefined || appFramework.siem.name === undefined ||
|
||||||
|
appFramework === null || appFramework.siem === null || appFramework.siem.name === null || appFramework.siem.name.length === 0 ?
|
||||||
|
"":<Typography style={{fontSize: 12, textAlign:"left", color:"var(--label-grey-text, #9E9E9E)" }} >{appFramework.siem.name.split('_').join(' ')}</Typography>}
|
||||||
|
</div>
|
||||||
|
</Button>
|
||||||
|
<Button
|
||||||
|
disabled={
|
||||||
|
finishedApps.includes("EDR & AV") ||
|
||||||
|
finishedApps.includes("ERADICATION")
|
||||||
|
}
|
||||||
|
onMouseOver={mouseOver}
|
||||||
|
onMouseOut={mouseOut}
|
||||||
|
variant={
|
||||||
|
defaultSearch === "Eradication" ? "contained" : "outlined"
|
||||||
|
}
|
||||||
|
style={buttonStyle}
|
||||||
|
// startIcon={<NewReleasesIcon />}
|
||||||
|
color="secondary"
|
||||||
|
onClick={(event) => {
|
||||||
|
onNodeSelect("ERADICATION");
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{appFramework === undefined || appFramework.edr === undefined || appFramework.edr.large_image === undefined ||
|
||||||
|
appFramework === null || appFramework.edr === null || appFramework.edr.large_image === null || appFramework.edr.large_image.length === 0 ?
|
||||||
|
<div style={{width: 40, border: "1px solid rgba(33, 33, 33, 1) !importent", height: 40, borderRadius: 9999, backgroundColor: "#2F2F2F", textAlign:"center"}}>
|
||||||
|
<NewReleasesIcon style={{marginTop: 8 }} />
|
||||||
|
</div>
|
||||||
|
: <img style={{ marginRight: 8, width: 40, height: 40, flexShrink: 0, borderRadius: 40, }} src={appFramework.edr.large_image} />}
|
||||||
|
<div style={{marginLeft: 8,}}>
|
||||||
|
<Typography style={{display:"flex",}}>Endpoint</Typography>
|
||||||
|
{appFramework === undefined || appFramework.edr === undefined || appFramework.edr.name === undefined ||
|
||||||
|
appFramework === null || appFramework.edr === null || appFramework.edr.name === null || appFramework.edr.name.length === 0 ?
|
||||||
|
"":<Typography style={{fontSize: 12, textAlign:"left", color:"var(--label-grey-text, #9E9E9E)" }} >{appFramework.edr.name.split('_').join(' ')}</Typography>}
|
||||||
|
</div>
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
<div style={{ display: "flex", width: 510, height: 100 }}>
|
||||||
|
<Button
|
||||||
|
disabled={finishedApps.includes("INTEL")}
|
||||||
|
variant={
|
||||||
|
defaultSearch === "INTEL" ? "contained" : "outlined"
|
||||||
|
}
|
||||||
|
onMouseOver={mouseOver}
|
||||||
|
onMouseOut={mouseOut}
|
||||||
|
style={buttonStyle}
|
||||||
|
// startIcon={<ExtensionIcon />}
|
||||||
|
color="secondary"
|
||||||
|
onClick={(event) => {
|
||||||
|
onNodeSelect("INTEL");
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{appFramework === undefined || appFramework.intel === undefined || appFramework.intel.large_image === undefined ||
|
||||||
|
appFramework === null || appFramework.intel === null || appFramework.intel.large_image === null || appFramework.intel.large_image.length === 0 ?
|
||||||
|
<div style={{width: 40, border: "1px solid rgba(33, 33, 33, 1) !importent", height: 40, borderRadius: 9999, backgroundColor: "#2F2F2F", textAlign:"center"}}>
|
||||||
|
<ExtensionIcon style={{ marginTop: 8 }} />
|
||||||
|
</div>
|
||||||
|
: <img style={{ marginRight: 8, width: 40, height: 40, flexShrink: 0, borderRadius: 40, }} src={appFramework.intel.large_image} />}
|
||||||
|
<div style={{marginLeft: 8,}}>
|
||||||
|
<Typography style={{display:"flex",}}>Intel</Typography>
|
||||||
|
{appFramework === undefined || appFramework.intel === undefined || appFramework.intel.name === undefined ||
|
||||||
|
appFramework === null || appFramework.intel === null || appFramework.intel.name === null || appFramework.intel.name.length === 0 ?
|
||||||
|
"":<Typography style={{fontSize: 12, textAlign:"left", color:"var(--label-grey-text, #9E9E9E)" }} >{appFramework.intel.name.split('_').join(' ')}</Typography>}
|
||||||
|
</div>
|
||||||
|
</Button>
|
||||||
|
<Button
|
||||||
|
disabled={
|
||||||
|
finishedApps.includes("COMMS") ||
|
||||||
|
finishedApps.includes("EMAIL")
|
||||||
|
}
|
||||||
|
variant={
|
||||||
|
defaultSearch === "EMAIL" ? "contained" : "outlined"
|
||||||
|
}
|
||||||
|
onMouseOver={mouseOver}
|
||||||
|
onMouseOut={mouseOut}
|
||||||
|
style={buttonStyle}
|
||||||
|
// startIcon={<EmailIcon />}
|
||||||
|
color="secondary"
|
||||||
|
onClick={(event) => {
|
||||||
|
onNodeSelect("EMAIL");
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{appFramework === undefined || appFramework.communication === undefined || appFramework.communication.large_image === undefined ||
|
||||||
|
appFramework === null || appFramework.communication === null || appFramework.communication.large_image === null || appFramework.communication.large_image.length === 0 ?
|
||||||
|
<div style={{width: 40, border: "1px solid rgba(33, 33, 33, 1) !importent", height: 40, borderRadius: 9999, backgroundColor: "#2F2F2F", textAlign:"center"}}>
|
||||||
|
<EmailIcon style={{ marginTop: 8 }} />
|
||||||
|
</div>
|
||||||
|
: <img style={{ marginRight: 8, width: 40, height: 40, flexShrink: 0, borderRadius: 40, }} src={appFramework.communication.large_image} />}
|
||||||
|
<div style={{marginLeft: 8,}}>
|
||||||
|
<Typography style={{display:"flex",}}>Email</Typography>
|
||||||
|
{appFramework === undefined || appFramework.communication === undefined || appFramework.communication.name === undefined ||
|
||||||
|
appFramework === null || appFramework.communication === null || appFramework.communication.name === null || appFramework.communication.name.length === 0 ?
|
||||||
|
"":<Typography style={{fontSize: 12, textAlign:"left", color:"var(--label-grey-text, #9E9E9E)" }} >{appFramework.communication.name.split('_').join(' ')}</Typography>}
|
||||||
|
</div>
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
{moreButton ? (
|
||||||
|
<div style={{ display: "flex", width: 510, height: 100, marginBottom: 20 }}>
|
||||||
|
<Button
|
||||||
|
disabled={finishedApps.includes("NETWORK")}
|
||||||
|
variant={
|
||||||
|
defaultSearch === "NETWORK" ? "contained" : "outlined"
|
||||||
|
}
|
||||||
|
onMouseOver={mouseOver}
|
||||||
|
onMouseOut={mouseOut}
|
||||||
|
style={buttonStyle}
|
||||||
|
// startIcon={<ExtensionIcon />}
|
||||||
|
color="secondary"
|
||||||
|
onClick={(event) => {
|
||||||
|
onNodeSelect("NETWORK");
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{appFramework === undefined || appFramework.network === undefined || appFramework.network.large_image === undefined ||
|
||||||
|
appFramework === null || appFramework.network === null || appFramework.network.large_image === null || appFramework.network.large_image.length === 0 ?
|
||||||
|
<div style={{width: 40, border: "1px solid rgba(33, 33, 33, 1) !importent", height: 40, borderRadius: 9999, backgroundColor: "#2F2F2F", textAlign:"center"}}>
|
||||||
|
<ShowChartIcon style={{ marginTop: 8 }} />
|
||||||
|
</div>
|
||||||
|
: <img style={{ marginRight: 8, width: 40, height: 40, flexShrink: 0, borderRadius: 40, }} src={appFramework.network.large_image} />}
|
||||||
|
<div style={{marginLeft: 8,}}>
|
||||||
|
<Typography style={{display:"flex",}}>Network</Typography>
|
||||||
|
{appFramework === undefined || appFramework.network === undefined || appFramework.network.name === undefined ||
|
||||||
|
appFramework === null || appFramework.network === null || appFramework.network.name === null || appFramework.network.name.length === 0 ?
|
||||||
|
"":<Typography style={{fontSize: 10, textAlign:"left", color:"var(--label-grey-text, #9E9E9E)" }} >{appFramework.network.name}</Typography>}
|
||||||
|
</div>
|
||||||
|
</Button>
|
||||||
|
<Button
|
||||||
|
disabled={
|
||||||
|
finishedApps.includes("ASSETS")
|
||||||
|
}
|
||||||
|
variant={
|
||||||
|
defaultSearch === "ASSETS" ? "contained" : "outlined"
|
||||||
|
}
|
||||||
|
onMouseOver={mouseOver}
|
||||||
|
onMouseOut={mouseOut}
|
||||||
|
style={buttonStyle}
|
||||||
|
// startIcon={<EmailIcon />}
|
||||||
|
color="secondary"
|
||||||
|
onClick={(event) => {
|
||||||
|
onNodeSelect("ASSETS");
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{appFramework === undefined || appFramework.assets === undefined || appFramework.assets.large_image === undefined ||
|
||||||
|
appFramework === null || appFramework.assets === null || appFramework.assets.large_image === null || appFramework.assets.large_image.length === 0 ?
|
||||||
|
<div style={{width: 40, border: "1px solid rgba(33, 33, 33, 1) !importent", height: 40, borderRadius: 9999, backgroundColor: "#2F2F2F", textAlign:"center"}}>
|
||||||
|
<ExploreIcon style={{ marginTop: 8 }} />
|
||||||
|
</div>
|
||||||
|
: <img style={{ marginRight: 8, width: 40, height: 40, flexShrink: 0, borderRadius: 40, }} src={appFramework.assets.large_image} />}
|
||||||
|
<div style={{marginLeft: 8,}}>
|
||||||
|
<Typography style={{display:"flex",}}>Assets</Typography>
|
||||||
|
{appFramework === undefined || appFramework.assets === undefined || appFramework.assets.name === undefined ||
|
||||||
|
appFramework === null || appFramework.assets === null || appFramework.assets.name === null || appFramework.assets.name.length === 0 ?
|
||||||
|
"":<Typography style={{fontSize: 10, textAlign:"left", color:"var(--label-grey-text, #9E9E9E)" }} >{appFramework.assets.name}</Typography>}
|
||||||
|
</div>
|
||||||
|
</Button>
|
||||||
|
<Button
|
||||||
|
disabled={
|
||||||
|
finishedApps.includes("IAM")
|
||||||
|
}
|
||||||
|
variant={
|
||||||
|
defaultSearch === "IAM" ? "contained" : "outlined"
|
||||||
|
}
|
||||||
|
onMouseOver={mouseOver}
|
||||||
|
onMouseOut={mouseOut}
|
||||||
|
style={buttonStyle}
|
||||||
|
// startIcon={<EmailIcon />}
|
||||||
|
color="secondary"
|
||||||
|
onClick={(event) => {
|
||||||
|
onNodeSelect("IAM");
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{appFramework === undefined || appFramework.iam === undefined || appFramework.iam.large_image === undefined ||
|
||||||
|
appFramework === null || appFramework.iam === null || appFramework.iam.large_image === null || appFramework.iam.large_image.length === 0 ?
|
||||||
|
<div style={{width: 40, border: "1px solid rgba(33, 33, 33, 1) !importent", height: 40, borderRadius: 9999, backgroundColor: "#2F2F2F", textAlign:"center"}}>
|
||||||
|
<FingerprintIcon style={{ marginTop: 8 }} />
|
||||||
|
</div>
|
||||||
|
: <img style={{ marginRight: 8, width: 40, height: 40, flexShrink: 0, borderRadius: 40, }} src={appFramework.iam.large_image} />}
|
||||||
|
<div style={{marginLeft: 8,}}>
|
||||||
|
<Typography style={{display:"flex",}}>IAM</Typography>
|
||||||
|
{appFramework === undefined || appFramework.iam === undefined || appFramework.iam.name === undefined ||
|
||||||
|
appFramework === null || appFramework.iam === null || appFramework.iam.name === null || appFramework.iam.name.length === 0 ?
|
||||||
|
"":<Typography style={{fontSize: 8, textAlign:"left", color:"var(--label-grey-text, #9E9E9E)" }} >{appFramework.iam.name}</Typography>}
|
||||||
|
</div>
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
:
|
||||||
|
<div style={{ display: "flex", width: 510, paddingLeft: 165, }}>
|
||||||
|
<Button
|
||||||
|
style={{ color: "#f86a3e", textTransform: 'capitalize', border: 2, backgroundColor: "var(--Background-color, #1A1A1A)" }}
|
||||||
|
className="btn btn-primary"
|
||||||
|
onClick={(event) => {
|
||||||
|
setMoreButton(true);
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<Typography style={{ textDecorationLine: 'underline', }}>
|
||||||
|
See more Categories
|
||||||
|
</Typography>
|
||||||
|
</Button>
|
||||||
|
</div>} */}
|
||||||
|
<div style={{ display: "flex", width: 510, height: 64, borderRadius: 8, background: "var(--Container, #212121)" }}
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
onMouseOver={mouseOver}
|
||||||
|
onMouseOut={mouseOut}
|
||||||
|
disabled={finishedApps.includes("CASES")}
|
||||||
|
variant={
|
||||||
|
defaultSearch === "CASES" ? "contained" : "outlined"
|
||||||
|
}
|
||||||
|
color="secondary"
|
||||||
|
style={{
|
||||||
|
flex: 1,
|
||||||
|
width: "100%",
|
||||||
|
margin: buttonMargin,
|
||||||
|
fontSize: 18,
|
||||||
|
color: "var(--White-text, #F1F1F1)",
|
||||||
|
fontWeight: 400,
|
||||||
|
background: "rgba(33, 33, 33, 1)",
|
||||||
|
borderRadius: 8,
|
||||||
|
textTransform: 'capitalize',
|
||||||
|
}}
|
||||||
|
// startIcon = {defaultSearch === "CASES" ? newSelectedApp.image_url : <LightbulbIcon/>}
|
||||||
|
onClick={(event) => {
|
||||||
|
onNodeSelect("CASES");
|
||||||
|
setDefaultSearch(discoveryData.label)
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<div style={{marginLeft: 20, display:"flex", textAlign:"center", alignItems:"center", marginLeft: 100, width: 320, marginRight: "auto" }}>
|
||||||
|
{AppImage === undefined || AppImage === undefined ||
|
||||||
|
AppImage === null || AppImage === null || AppImage.length === 0 ?
|
||||||
|
<div style={{ width: 40, height: 40, borderRadius: 9999, backgroundColor: "#2F2F2F", textAlign: "center" }}>
|
||||||
|
<LightbulbIcon style={{ marginTop: 6 }} />
|
||||||
|
</div>
|
||||||
|
: <img style={{ marginRight: 8, width: 40, height: 40, flexShrink: 0, borderRadius: 40, }} src={AppImage} />}
|
||||||
|
<div style={{ marginLeft: 8, }}>
|
||||||
|
<Typography style={{ display: "flex", border: "none" }} >Case Management</Typography>
|
||||||
|
{appName === undefined || appName === undefined ||
|
||||||
|
appName === null || appName === null || appName.length === 0 ?
|
||||||
|
""
|
||||||
|
:
|
||||||
|
<Typography style={{ fontSize: 12, textAlign: "left", color: "var(--label-grey-text, #9E9E9E)" }} >{appName}</Typography>}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</Grid>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
export default AppSearchButtons
|
||||||
@@ -14,6 +14,7 @@ import ExtensionIcon from "@mui/icons-material/Extension";
|
|||||||
import EmailIcon from "@mui/icons-material/Email";
|
import EmailIcon from "@mui/icons-material/Email";
|
||||||
import FingerprintIcon from '@mui/icons-material/Fingerprint';
|
import FingerprintIcon from '@mui/icons-material/Fingerprint';
|
||||||
import AppSearch from "../components/Appsearch.jsx";
|
import AppSearch from "../components/Appsearch.jsx";
|
||||||
|
import AppSearchButtons from "../components/AppSearchButtons.jsx";
|
||||||
import { toast } from 'react-toastify';
|
import { toast } from 'react-toastify';
|
||||||
import {
|
import {
|
||||||
Zoom,
|
Zoom,
|
||||||
@@ -48,6 +49,8 @@ const AppSelection = props => {
|
|||||||
const [selectionOpen, setSelectionOpen] = React.useState(false)
|
const [selectionOpen, setSelectionOpen] = React.useState(false)
|
||||||
const [newSelectedApp, setNewSelectedApp] = React.useState({})
|
const [newSelectedApp, setNewSelectedApp] = React.useState({})
|
||||||
const [finishedApps, setFinishedApps] = React.useState([])
|
const [finishedApps, setFinishedApps] = React.useState([])
|
||||||
|
const [appButtons, setAppButtons] = useState([])
|
||||||
|
const [apps, setApps] = useState([])
|
||||||
const [appName, setAppName] = React.useState();
|
const [appName, setAppName] = React.useState();
|
||||||
const [moreButton, setMoreButton] = useState(false);
|
const [moreButton, setMoreButton] = useState(false);
|
||||||
|
|
||||||
@@ -56,12 +59,7 @@ const AppSelection = props => {
|
|||||||
let navigate = useNavigate();
|
let navigate = useNavigate();
|
||||||
const isCloud = window.location.host === "localhost:3002" || window.location.host === "shuffler.io";
|
const isCloud = window.location.host === "localhost:3002" || window.location.host === "shuffler.io";
|
||||||
|
|
||||||
const mouseOver = (e) => {
|
|
||||||
e.target.style.border = "1px solid #f85a3e";
|
|
||||||
}
|
|
||||||
const mouseOut = (e) => {
|
|
||||||
e.target.style.border = "1px solid rgb(33, 33, 33)";
|
|
||||||
}
|
|
||||||
const setFrameworkItem = (data) => {
|
const setFrameworkItem = (data) => {
|
||||||
console.log("Setting framework item: ", data, isCloud)
|
console.log("Setting framework item: ", data, isCloud)
|
||||||
// if (!isCloud) {
|
// if (!isCloud) {
|
||||||
@@ -109,6 +107,47 @@ const AppSelection = props => {
|
|||||||
//setFrameworkLoaded(true)
|
//setFrameworkLoaded(true)
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
const GetApps = (data) => {
|
||||||
|
console.log("Setting framework item: ", data, isCloud)
|
||||||
|
// if (!isCloud) {
|
||||||
|
// activateApp(data.id)
|
||||||
|
// }
|
||||||
|
|
||||||
|
fetch(globalUrl + "/api/v1/apps/frameworkConfiguration", {
|
||||||
|
method: "GET",
|
||||||
|
headers: {
|
||||||
|
"Content-Type": "application/json",
|
||||||
|
Accept: "application/json",
|
||||||
|
},
|
||||||
|
body: JSON.stringify(data),
|
||||||
|
credentials: "include",
|
||||||
|
})
|
||||||
|
.then((responseJson) => {
|
||||||
|
if (responseJson === null) {
|
||||||
|
console.log("null-response from server")
|
||||||
|
const pretend_apps = [{
|
||||||
|
"description": "TBD",
|
||||||
|
"id": "TBD",
|
||||||
|
"large_image": "",
|
||||||
|
"name": "TBD",
|
||||||
|
"type": "TBD"
|
||||||
|
}]
|
||||||
|
|
||||||
|
setApps(pretend_apps)
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
if (responseJson.success === false) {
|
||||||
|
console.log("error loading apps: ", responseJson)
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
setApps(responseJson);
|
||||||
|
})
|
||||||
|
.catch((error) => {
|
||||||
|
console.log("App loading error: " + error.toString());
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
const onNodeSelect = (label) => {
|
const onNodeSelect = (label) => {
|
||||||
// if (setDiscoveryWrapper !== undefined) {
|
// if (setDiscoveryWrapper !== undefined) {
|
||||||
@@ -128,6 +167,36 @@ const AppSelection = props => {
|
|||||||
setDefaultSearch(label.charAt(0).toUpperCase() + (label.substring(1)).toLowerCase())
|
setDefaultSearch(label.charAt(0).toUpperCase() + (label.substring(1)).toLowerCase())
|
||||||
};
|
};
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
var tempApps = []
|
||||||
|
if (tempApps.length === 0) {
|
||||||
|
const tempApps =
|
||||||
|
[{
|
||||||
|
"description": newSelectedApp.description,
|
||||||
|
"id": newSelectedApp.objectID,
|
||||||
|
"large_image": newSelectedApp.image_url,
|
||||||
|
"name": newSelectedApp.name,
|
||||||
|
"type": discoveryData
|
||||||
|
},
|
||||||
|
//{
|
||||||
|
// // description: newSelectedApp.siem.description,
|
||||||
|
// id: newSelectedApp.siem.objectID,
|
||||||
|
// large_image: newSelectedApp.siem.image_url,
|
||||||
|
// name: newSelectedApp.siem.name,
|
||||||
|
// type: discoveryData.siem
|
||||||
|
// },{
|
||||||
|
// // description: newSelectedApp.edr.description,
|
||||||
|
// id: newSelectedApp.edr.objectID,
|
||||||
|
// large_image: newSelectedApp.edr.image_url,
|
||||||
|
// name: newSelectedApp.edr.name,
|
||||||
|
// type: discoveryData.edr
|
||||||
|
// }
|
||||||
|
]
|
||||||
|
setAppButtons(tempApps)
|
||||||
|
GetApps()
|
||||||
|
}
|
||||||
|
}, [])
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (newSelectedApp.objectID === undefined || newSelectedApp.objectID === undefined || newSelectedApp.objectID.length === 0) {
|
if (newSelectedApp.objectID === undefined || newSelectedApp.objectID === undefined || newSelectedApp.objectID.length === 0) {
|
||||||
return
|
return
|
||||||
@@ -229,8 +298,8 @@ const AppSelection = props => {
|
|||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<div style={{ display: "flex" }}>
|
<div style={{ display: "flex" }}>
|
||||||
<div style={{ display: "flex", textAlign: "center", textTransform: "capitalize"}}>
|
<div style={{ display: "flex", textAlign: "center", textTransform: "capitalize" }}>
|
||||||
<Typography style={{ padding: 16, color:"#FFFFFF", textTransform: "capitalize" }}> {discoveryData} </Typography>
|
<Typography style={{ padding: 16, color: "#FFFFFF", textTransform: "capitalize" }}> {discoveryData} </Typography>
|
||||||
</div>
|
</div>
|
||||||
<div style={{ display: "flex" }}>
|
<div style={{ display: "flex" }}>
|
||||||
<Tooltip
|
<Tooltip
|
||||||
@@ -325,274 +394,29 @@ const AppSelection = props => {
|
|||||||
>
|
>
|
||||||
Select the apps you work with and we will connect the for you.
|
Select the apps you work with and we will connect the for you.
|
||||||
</Typography>
|
</Typography>
|
||||||
<Grid item xs={11} style={{}}>
|
{appButtons.map((appData, index) => {
|
||||||
|
|
||||||
{/*<FormLabel style={{ color: "#B9B9BA" }}>Find your integrations!</FormLabel>*/}
|
const appName = appData.name
|
||||||
<div style={{ display: "flex", width: 510, height:100 }}>
|
const AppImage = appData.large_image
|
||||||
<Button
|
const appType = appData.type
|
||||||
disabled={finishedApps.includes("CASES")}
|
|
||||||
variant={
|
return (
|
||||||
defaultSearch === "CASES" ? "contained" : "outlined"
|
|
||||||
}
|
<AppSearchButtons
|
||||||
color="secondary"
|
appFramework={appFramework}
|
||||||
style={{
|
appName={appName}
|
||||||
flex: 1,
|
appType = {appType}
|
||||||
width: "100%",
|
AppImage={AppImage}
|
||||||
padding: 25,
|
defaultSearch={defaultSearch}
|
||||||
margin: buttonMargin,
|
finishedApps={finishedApps}
|
||||||
fontSize: 18,
|
onNodeSelect={onNodeSelect}
|
||||||
color: "var(--White-text, #F1F1F1)",
|
discoveryData={discoveryData}
|
||||||
fontWeight: 400,
|
setDiscoveryData={setDiscoveryData}
|
||||||
background: "rgba(33, 33, 33, 1)",
|
setDefaultSearch={setDefaultSearch}
|
||||||
borderRadius: 8,
|
apps={apps}
|
||||||
textTransform: 'capitalize',
|
/>
|
||||||
border: "1px solid rgba(33, 33, 33, 1)" ,
|
|
||||||
}}
|
|
||||||
onMouseOver={mouseOver}
|
|
||||||
onMouseOut={mouseOut}
|
|
||||||
// startIcon = {defaultSearch === "CASES" ? newSelectedApp.image_url : <LightbulbIcon/>}
|
|
||||||
onClick={(event) => {
|
|
||||||
onNodeSelect("CASES");
|
|
||||||
setDefaultSearch(discoveryData.label)
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{appFramework === undefined || appFramework.cases === undefined || appFramework.cases.large_image === undefined ||
|
|
||||||
appFramework === null || appFramework.cases === null || appFramework.cases.large_image === null || appFramework.cases.large_image.length === 0 ?
|
|
||||||
<div style={{width: 40, border: "1px solid rgba(33, 33, 33, 1) !importent", height: 40, borderRadius: 9999, backgroundColor: "#2F2F2F", textAlign:"center"}}>
|
|
||||||
<LightbulbIcon style={{ marginTop: 6 }} />
|
|
||||||
</div>
|
|
||||||
: <img style={{ marginRight: 8, width: 40, height: 40, flexShrink: 0, borderRadius: 40, }} src={appFramework.cases.large_image} />}
|
|
||||||
<div style={{marginLeft: 8, }}>
|
|
||||||
<Typography style={{display:"flex",border:"none"}} >Case Management</Typography>
|
|
||||||
{appFramework === undefined || appFramework.cases === undefined || appFramework.cases.name === undefined ||
|
|
||||||
appFramework === null || appFramework.cases === null || appFramework.cases.name === null || appFramework.cases.name.length === 0 ?
|
|
||||||
"":<Typography style={{fontSize: 12, textAlign:"left", color:"var(--label-grey-text, #9E9E9E)" }} >{appFramework.cases.name.split('_').join(' ')}</Typography>}
|
|
||||||
</div>
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
<div style={{ display: "flex", width: 510, height: 100 }}>
|
|
||||||
<Button
|
|
||||||
disabled={finishedApps.includes("SIEM")}
|
|
||||||
variant={
|
|
||||||
defaultSearch === "SIEM" ? "contained" : "outlined"
|
|
||||||
}
|
|
||||||
style={buttonStyle}
|
|
||||||
// startIcon={<SearchIcon />}
|
|
||||||
onMouseOver={mouseOver}
|
|
||||||
onMouseOut={mouseOut}
|
|
||||||
color="secondary"
|
|
||||||
onClick={(event) => {
|
|
||||||
onNodeSelect("SIEM");
|
|
||||||
setDefaultSearch(discoveryData.label)
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{appFramework === undefined || appFramework.siem === undefined || appFramework.siem.large_image === undefined ||
|
|
||||||
appFramework === null || appFramework.siem === null || appFramework.siem.large_image === null || appFramework.siem.large_image.length === 0 ?
|
|
||||||
<div style={{width: 40, border: "1px solid rgba(33, 33, 33, 1) !importent", height: 40, borderRadius: 9999, backgroundColor: "#2F2F2F", textAlign:"center"}}>
|
|
||||||
<SearchIcon style={{ marginTop: 6 }} />
|
|
||||||
</div>
|
|
||||||
: <img style={{ marginRight: 8, width: 40, height: 40, flexShrink: 0, borderRadius: 40, }} src={appFramework.siem.large_image} />}
|
|
||||||
<div style={{marginLeft: 8,}}>
|
|
||||||
<Typography style={{display:"flex",}}>SIEM</Typography>
|
|
||||||
{appFramework === undefined || appFramework.siem === undefined || appFramework.siem.name === undefined ||
|
|
||||||
appFramework === null || appFramework.siem === null || appFramework.siem.name === null || appFramework.siem.name.length === 0 ?
|
|
||||||
"":<Typography style={{fontSize: 12, textAlign:"left", color:"var(--label-grey-text, #9E9E9E)" }} >{appFramework.siem.name.split('_').join(' ')}</Typography>}
|
|
||||||
</div>
|
|
||||||
</Button>
|
|
||||||
<Button
|
|
||||||
disabled={
|
|
||||||
finishedApps.includes("EDR & AV") ||
|
|
||||||
finishedApps.includes("ERADICATION")
|
|
||||||
}
|
|
||||||
onMouseOver={mouseOver}
|
|
||||||
onMouseOut={mouseOut}
|
|
||||||
variant={
|
|
||||||
defaultSearch === "Eradication" ? "contained" : "outlined"
|
|
||||||
}
|
|
||||||
style={buttonStyle}
|
|
||||||
// startIcon={<NewReleasesIcon />}
|
|
||||||
color="secondary"
|
|
||||||
onClick={(event) => {
|
|
||||||
onNodeSelect("ERADICATION");
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{appFramework === undefined || appFramework.edr === undefined || appFramework.edr.large_image === undefined ||
|
|
||||||
appFramework === null || appFramework.edr === null || appFramework.edr.large_image === null || appFramework.edr.large_image.length === 0 ?
|
|
||||||
<div style={{width: 40, border: "1px solid rgba(33, 33, 33, 1) !importent", height: 40, borderRadius: 9999, backgroundColor: "#2F2F2F", textAlign:"center"}}>
|
|
||||||
<NewReleasesIcon style={{marginTop: 8 }} />
|
|
||||||
</div>
|
|
||||||
: <img style={{ marginRight: 8, width: 40, height: 40, flexShrink: 0, borderRadius: 40, }} src={appFramework.edr.large_image} />}
|
|
||||||
<div style={{marginLeft: 8,}}>
|
|
||||||
<Typography style={{display:"flex",}}>Endpoint</Typography>
|
|
||||||
{appFramework === undefined || appFramework.edr === undefined || appFramework.edr.name === undefined ||
|
|
||||||
appFramework === null || appFramework.edr === null || appFramework.edr.name === null || appFramework.edr.name.length === 0 ?
|
|
||||||
"":<Typography style={{fontSize: 12, textAlign:"left", color:"var(--label-grey-text, #9E9E9E)" }} >{appFramework.edr.name.split('_').join(' ')}</Typography>}
|
|
||||||
</div>
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
<div style={{ display: "flex", width: 510, height: 100 }}>
|
|
||||||
<Button
|
|
||||||
disabled={finishedApps.includes("INTEL")}
|
|
||||||
variant={
|
|
||||||
defaultSearch === "INTEL" ? "contained" : "outlined"
|
|
||||||
}
|
|
||||||
onMouseOver={mouseOver}
|
|
||||||
onMouseOut={mouseOut}
|
|
||||||
style={buttonStyle}
|
|
||||||
// startIcon={<ExtensionIcon />}
|
|
||||||
color="secondary"
|
|
||||||
onClick={(event) => {
|
|
||||||
onNodeSelect("INTEL");
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{appFramework === undefined || appFramework.intel === undefined || appFramework.intel.large_image === undefined ||
|
|
||||||
appFramework === null || appFramework.intel === null || appFramework.intel.large_image === null || appFramework.intel.large_image.length === 0 ?
|
|
||||||
<div style={{width: 40, border: "1px solid rgba(33, 33, 33, 1) !importent", height: 40, borderRadius: 9999, backgroundColor: "#2F2F2F", textAlign:"center"}}>
|
|
||||||
<ExtensionIcon style={{ marginTop: 8 }} />
|
|
||||||
</div>
|
|
||||||
: <img style={{ marginRight: 8, width: 40, height: 40, flexShrink: 0, borderRadius: 40, }} src={appFramework.intel.large_image} />}
|
|
||||||
<div style={{marginLeft: 8,}}>
|
|
||||||
<Typography style={{display:"flex",}}>Intel</Typography>
|
|
||||||
{appFramework === undefined || appFramework.intel === undefined || appFramework.intel.name === undefined ||
|
|
||||||
appFramework === null || appFramework.intel === null || appFramework.intel.name === null || appFramework.intel.name.length === 0 ?
|
|
||||||
"":<Typography style={{fontSize: 12, textAlign:"left", color:"var(--label-grey-text, #9E9E9E)" }} >{appFramework.intel.name.split('_').join(' ')}</Typography>}
|
|
||||||
</div>
|
|
||||||
</Button>
|
|
||||||
<Button
|
|
||||||
disabled={
|
|
||||||
finishedApps.includes("COMMS") ||
|
|
||||||
finishedApps.includes("EMAIL")
|
|
||||||
}
|
|
||||||
variant={
|
|
||||||
defaultSearch === "EMAIL" ? "contained" : "outlined"
|
|
||||||
}
|
|
||||||
onMouseOver={mouseOver}
|
|
||||||
onMouseOut={mouseOut}
|
|
||||||
style={buttonStyle}
|
|
||||||
// startIcon={<EmailIcon />}
|
|
||||||
color="secondary"
|
|
||||||
onClick={(event) => {
|
|
||||||
onNodeSelect("EMAIL");
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{appFramework === undefined || appFramework.communication === undefined || appFramework.communication.large_image === undefined ||
|
|
||||||
appFramework === null || appFramework.communication === null || appFramework.communication.large_image === null || appFramework.communication.large_image.length === 0 ?
|
|
||||||
<div style={{width: 40, border: "1px solid rgba(33, 33, 33, 1) !importent", height: 40, borderRadius: 9999, backgroundColor: "#2F2F2F", textAlign:"center"}}>
|
|
||||||
<EmailIcon style={{ marginTop: 8 }} />
|
|
||||||
</div>
|
|
||||||
: <img style={{ marginRight: 8, width: 40, height: 40, flexShrink: 0, borderRadius: 40, }} src={appFramework.communication.large_image} />}
|
|
||||||
<div style={{marginLeft: 8,}}>
|
|
||||||
<Typography style={{display:"flex",}}>Email</Typography>
|
|
||||||
{appFramework === undefined || appFramework.communication === undefined || appFramework.communication.name === undefined ||
|
|
||||||
appFramework === null || appFramework.communication === null || appFramework.communication.name === null || appFramework.communication.name.length === 0 ?
|
|
||||||
"":<Typography style={{fontSize: 12, textAlign:"left", color:"var(--label-grey-text, #9E9E9E)" }} >{appFramework.communication.name.split('_').join(' ')}</Typography>}
|
|
||||||
</div>
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
{moreButton ? (
|
|
||||||
<div style={{ display: "flex", width: 510, height: 100, marginBottom: 20 }}>
|
|
||||||
<Button
|
|
||||||
disabled={finishedApps.includes("NETWORK")}
|
|
||||||
variant={
|
|
||||||
defaultSearch === "NETWORK" ? "contained" : "outlined"
|
|
||||||
}
|
|
||||||
onMouseOver={mouseOver}
|
|
||||||
onMouseOut={mouseOut}
|
|
||||||
style={buttonStyle}
|
|
||||||
// startIcon={<ExtensionIcon />}
|
|
||||||
color="secondary"
|
|
||||||
onClick={(event) => {
|
|
||||||
onNodeSelect("NETWORK");
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{appFramework === undefined || appFramework.network === undefined || appFramework.network.large_image === undefined ||
|
|
||||||
appFramework === null || appFramework.network === null || appFramework.network.large_image === null || appFramework.network.large_image.length === 0 ?
|
|
||||||
<div style={{width: 40, border: "1px solid rgba(33, 33, 33, 1) !importent", height: 40, borderRadius: 9999, backgroundColor: "#2F2F2F", textAlign:"center"}}>
|
|
||||||
<ShowChartIcon style={{ marginTop: 8 }} />
|
|
||||||
</div>
|
|
||||||
: <img style={{ marginRight: 8, width: 40, height: 40, flexShrink: 0, borderRadius: 40, }} src={appFramework.network.large_image} />}
|
|
||||||
<div style={{marginLeft: 8,}}>
|
|
||||||
<Typography style={{display:"flex",}}>Network</Typography>
|
|
||||||
{appFramework === undefined || appFramework.network === undefined || appFramework.network.name === undefined ||
|
|
||||||
appFramework === null || appFramework.network === null || appFramework.network.name === null || appFramework.network.name.length === 0 ?
|
|
||||||
"":<Typography style={{fontSize: 10, textAlign:"left", color:"var(--label-grey-text, #9E9E9E)" }} >{appFramework.network.name}</Typography>}
|
|
||||||
</div>
|
|
||||||
</Button>
|
|
||||||
<Button
|
|
||||||
disabled={
|
|
||||||
finishedApps.includes("ASSETS")
|
|
||||||
}
|
|
||||||
variant={
|
|
||||||
defaultSearch === "ASSETS" ? "contained" : "outlined"
|
|
||||||
}
|
|
||||||
onMouseOver={mouseOver}
|
|
||||||
onMouseOut={mouseOut}
|
|
||||||
style={buttonStyle}
|
|
||||||
// startIcon={<EmailIcon />}
|
|
||||||
color="secondary"
|
|
||||||
onClick={(event) => {
|
|
||||||
onNodeSelect("ASSETS");
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{appFramework === undefined || appFramework.assets === undefined || appFramework.assets.large_image === undefined ||
|
|
||||||
appFramework === null || appFramework.assets === null || appFramework.assets.large_image === null || appFramework.assets.large_image.length === 0 ?
|
|
||||||
<div style={{width: 40, border: "1px solid rgba(33, 33, 33, 1) !importent", height: 40, borderRadius: 9999, backgroundColor: "#2F2F2F", textAlign:"center"}}>
|
|
||||||
<ExploreIcon style={{ marginTop: 8 }} />
|
|
||||||
</div>
|
|
||||||
: <img style={{ marginRight: 8, width: 40, height: 40, flexShrink: 0, borderRadius: 40, }} src={appFramework.assets.large_image} />}
|
|
||||||
<div style={{marginLeft: 8,}}>
|
|
||||||
<Typography style={{display:"flex",}}>Assets</Typography>
|
|
||||||
{appFramework === undefined || appFramework.assets === undefined || appFramework.assets.name === undefined ||
|
|
||||||
appFramework === null || appFramework.assets === null || appFramework.assets.name === null || appFramework.assets.name.length === 0 ?
|
|
||||||
"":<Typography style={{fontSize: 10, textAlign:"left", color:"var(--label-grey-text, #9E9E9E)" }} >{appFramework.assets.name}</Typography>}
|
|
||||||
</div>
|
|
||||||
</Button>
|
|
||||||
<Button
|
|
||||||
disabled={
|
|
||||||
finishedApps.includes("IAM")
|
|
||||||
}
|
|
||||||
variant={
|
|
||||||
defaultSearch === "IAM" ? "contained" : "outlined"
|
|
||||||
}
|
|
||||||
onMouseOver={mouseOver}
|
|
||||||
onMouseOut={mouseOut}
|
|
||||||
style={buttonStyle}
|
|
||||||
// startIcon={<EmailIcon />}
|
|
||||||
color="secondary"
|
|
||||||
onClick={(event) => {
|
|
||||||
onNodeSelect("IAM");
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{appFramework === undefined || appFramework.iam === undefined || appFramework.iam.large_image === undefined ||
|
|
||||||
appFramework === null || appFramework.iam === null || appFramework.iam.large_image === null || appFramework.iam.large_image.length === 0 ?
|
|
||||||
<div style={{width: 40, border: "1px solid rgba(33, 33, 33, 1) !importent", height: 40, borderRadius: 9999, backgroundColor: "#2F2F2F", textAlign:"center"}}>
|
|
||||||
<FingerprintIcon style={{ marginTop: 8 }} />
|
|
||||||
</div>
|
|
||||||
: <img style={{ marginRight: 8, width: 40, height: 40, flexShrink: 0, borderRadius: 40, }} src={appFramework.iam.large_image} />}
|
|
||||||
<div style={{marginLeft: 8,}}>
|
|
||||||
<Typography style={{display:"flex",}}>IAM</Typography>
|
|
||||||
{appFramework === undefined || appFramework.iam === undefined || appFramework.iam.name === undefined ||
|
|
||||||
appFramework === null || appFramework.iam === null || appFramework.iam.name === null || appFramework.iam.name.length === 0 ?
|
|
||||||
"":<Typography style={{fontSize: 8, textAlign:"left", color:"var(--label-grey-text, #9E9E9E)" }} >{appFramework.iam.name}</Typography>}
|
|
||||||
</div>
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
)
|
)
|
||||||
:
|
})}
|
||||||
<div style={{ display: "flex", width: 510, paddingLeft: 165, }}>
|
|
||||||
<Button
|
|
||||||
style={{ color: "#f86a3e", textTransform: 'capitalize', border: 2, backgroundColor: "var(--Background-color, #1A1A1A)" }}
|
|
||||||
className="btn btn-primary"
|
|
||||||
onClick={(event) => {
|
|
||||||
setMoreButton(true);
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<Typography style={{ textDecorationLine: 'underline', }}>
|
|
||||||
See more Categories
|
|
||||||
</Typography>
|
|
||||||
</Button>
|
|
||||||
</div>}
|
|
||||||
</Grid>
|
|
||||||
</div>
|
</div>
|
||||||
<div style={{ flexDirection: "row", }}>
|
<div style={{ flexDirection: "row", }}>
|
||||||
<Button variant="contained" type="submit" fullWidth style={bottomButtonStyle} onClick={() => {
|
<Button variant="contained" type="submit" fullWidth style={bottomButtonStyle} onClick={() => {
|
||||||
|
|||||||
@@ -88,6 +88,7 @@ var downloadedImages []string
|
|||||||
// Images to be autodeployed in the latest version of Shuffle.
|
// Images to be autodeployed in the latest version of Shuffle.
|
||||||
var autoDeploy = map[string]string{
|
var autoDeploy = map[string]string{
|
||||||
"http:1.3.0": "frikky/shuffle:http_1.3.0",
|
"http:1.3.0": "frikky/shuffle:http_1.3.0",
|
||||||
|
"http:1.4.0": "frikky/shuffle:http_1.4.0",
|
||||||
"shuffle-tools:1.2.0": "frikky/shuffle:shuffle-tools_1.2.0",
|
"shuffle-tools:1.2.0": "frikky/shuffle:shuffle-tools_1.2.0",
|
||||||
"shuffle-subflow:1.0.0": "frikky/shuffle:shuffle-subflow_1.0.0",
|
"shuffle-subflow:1.0.0": "frikky/shuffle:shuffle-subflow_1.0.0",
|
||||||
"shuffle-subflow:1.1.0": "frikky/shuffle:shuffle-subflow_1.1.0",
|
"shuffle-subflow:1.1.0": "frikky/shuffle:shuffle-subflow_1.1.0",
|
||||||
|
|||||||
Reference in New Issue
Block a user