diff --git a/frontend/src/components/AppFramework.jsx b/frontend/src/components/AppFramework.jsx index ecff205f..383553fd 100644 --- a/frontend/src/components/AppFramework.jsx +++ b/frontend/src/components/AppFramework.jsx @@ -64,7 +64,7 @@ export const findSpecificApp = (framework, inputcategory) => { description: "", id: "", } - } else if (category === "communication") { + } else if (category === "communication" || category === "comms") { if (framework["Comms"] !== undefined && framework["Comms"].name !== undefined) { return framework["Comms"] } diff --git a/frontend/src/components/AppGrid.jsx b/frontend/src/components/AppGrid.jsx index 2d0e9d3d..5bb08119 100644 --- a/frontend/src/components/AppGrid.jsx +++ b/frontend/src/components/AppGrid.jsx @@ -31,7 +31,7 @@ import { const searchClient = algoliasearch("JNSS5CFDZZ", "db08e40265e2941b9a7d8f644b6e5240") //const searchClient = algoliasearch("L55H18ZINA", "a19be455e7e75ee8f20a93d26b9fc6d6") const AppGrid = props => { - const { maxRows, showName, showSuggestion, isMobile, globalUrl, parsedXs, userdata } = props + const { maxRows, showName, showSuggestion, isMobile, globalUrl, parsedXs, userdata, isHeader } = props const isCloud = window.location.host === "localhost:3002" || @@ -167,7 +167,7 @@ const AppGrid = props => { backgroundColor: index === mouseHoverIndex ? "rgba(255,255,255,0.8)" : theme.palette.inputColor, color: index === mouseHoverIndex ? theme.palette.inputColor : "rgba(255,255,255,0.8)", border: `1px solid ${innerColor}`, - padding: 15, + padding: isHeader ? null : 15, cursor: "pointer", position: "relative", minHeight: 116, diff --git a/frontend/src/components/AppSearchButtons.jsx b/frontend/src/components/AppSearchButtons.jsx index 324da856..2c85eb89 100644 --- a/frontend/src/components/AppSearchButtons.jsx +++ b/frontend/src/components/AppSearchButtons.jsx @@ -3,7 +3,7 @@ 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 { Search as Searchicon, CloudQueue as CloudQueueicon, Code as Codeicon, Close as Closeicon, Folder as Foldericon, LibraryBooks as LibraryBooksicon, Delete as DeleteIcon, Close as CloseIcon, } from '@mui/icons-material'; import aa from 'search-insights' import Deleteicon from '@mui/icons-material/Delete'; import ShowCharticon from '@mui/icons-material/ShowChart'; @@ -33,16 +33,37 @@ import { ListItem, ListItemAvatar, ListItemText, + IconButton, } from '@mui/material'; const AppSearchButtons = (props) => { - const { userdata, globalUrl, appFramework, finishedApps, appType, totalApps, index, onNodeSelect, setDiscoveryData, appName, AppImage, setDefaultSearch, discoveryData } = props + const { userdata, globalUrl, appFramework, finishedApps, appType, totalApps, index, onNodeSelect, setDiscoveryData, appName, AppImage, setDefaultSearch, discoveryData, checkLogin, setMissing, } = props const ref = useRef() let navigate = useNavigate(); const [isHover, setIsHover] = useState(false); const [localSearchOpen, setLocalSearchOpen] = useState(false) + const [newSelectedApp, setNewSelectedApp] = useState(undefined) + + useEffect(() => { + console.log("AppSearchButtons: newSelectedApp: " + JSON.stringify(newSelectedApp)) + + if (newSelectedApp !== undefined && setMissing != undefined) { + console.log("AppSearchButtons: setMissing is defined!") + + const submitAppFramework = { + "description": newSelectedApp.description, + "id": newSelectedApp.objectID, + "name": newSelectedApp.name, + "type": appType, + "large_image": newSelectedApp.image_url, + } + + setFrameworkItem(submitAppFramework) + setMissing(newSelectedApp) + } + }, [newSelectedApp]) if (appType === undefined) { console.log("Apptype is required in AppSearchButtons") @@ -63,10 +84,54 @@ const AppSearchButtons = (props) => { const foundApp = findSpecificApp(appFramework, appType) if (foundApp === undefined || foundApp === null) { - console.log("AppSearchButtons: App not found in appFramework") + console.log("AppSearchButtons: App not found in appFramework: " + appType) return null } + const setFrameworkItem = (data) => { + + fetch(globalUrl + "/api/v1/apps/frameworkConfiguration", { + method: "POST", + headers: { + "Content-Type": "application/json", + Accept: "application/json", + }, + body: JSON.stringify(data), + credentials: "include", + }) + .then((response) => { + if (response.status !== 200) { + console.log("Status not 200 for framework!"); + } + + if (checkLogin !== undefined) { + checkLogin() + } + + return response; + }) + .then((responseJson) => { + if (responseJson.success === false) { + if (responseJson.reason !== undefined) { + toast("Failed updating: " + responseJson.reason) + } else { + toast("Failed to update framework for your org.") + + } + } + //setFrameworkLoaded(true) + //setFrameworkData(responseJson) + }) + .catch((error) => { + if (checkLogin !== undefined) { + checkLogin() + } + + toast(error.toString()); + //setFrameworkLoaded(true) + }) + } + const icon = foundApp.large_image let xsValue = 12; if (index !== undefined && index !== 0) { @@ -86,6 +151,94 @@ const AppSearchButtons = (props) => { onMouseEnter={handleMouseEnter} onMouseLeave={handleMouseLeave} > + {localSearchOpen ? ( +
+
+
+ {discoveryData} +
+
+ + { + setLocalSearchOpen(false) + }} + > + + + + + { + e.preventDefault(); + setLocalSearchOpen(false) + setDefaultSearch("") + const submitDeletedApp = { + "description": "", + "id": "remove", + "name": "", + "type": discoveryData + } + setFrameworkItem(submitDeletedApp) + setNewSelectedApp({}) + setTimeout(() => { + setDiscoveryData({}) + setFrameworkItem(submitDeletedApp) + //setNewSelectedApp({}) + }, 1000) + //setAppName(discoveryData.cases.name) + }} + > + + + +
+
+
+ +
+ ) : null}
diff --git a/frontend/src/components/AppSelection.jsx b/frontend/src/components/AppSelection.jsx index c56b9d0f..9dafa6b3 100644 --- a/frontend/src/components/AppSelection.jsx +++ b/frontend/src/components/AppSelection.jsx @@ -2,7 +2,7 @@ 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 {isMobile} from "react-device-detect"; 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'; @@ -60,6 +60,117 @@ const AppSelection = props => { let navigate = useNavigate(); const isCloud = window.location.host === "localhost:3002" || window.location.host === "shuffler.io"; + useEffect(() => { + if (newSelectedApp === undefined || newSelectedApp.objectID === undefined || newSelectedApp.objectID === undefined || newSelectedApp.objectID.length === 0) { + return + } + + const submitNewApp = { + description: newSelectedApp.description, + id: newSelectedApp.objectID, + large_image: newSelectedApp.image_url, + name: newSelectedApp.name, + type: discoveryData + } + + if (discoveryData === "CASES") { + appFramework.cases = submitNewApp + } + else if (discoveryData === "SIEM") { + appFramework.siem = submitNewApp + } + else if (discoveryData === "ERADICATION") { + appFramework.edr = submitNewApp + } + else if (discoveryData === "INTEL") { + appFramework.intel = submitNewApp + } + else if (discoveryData === "EMAIL") { + appFramework.communication = submitNewApp + } + else if (discoveryData === "NETWORK") { + appFramework.network = submitNewApp + } + else if (discoveryData === "ASSETS") { + appFramework.assets = submitNewApp + } + else if (discoveryData === "IAM") { + appFramework.iam = submitNewApp + } + setFrameworkItem(submitNewApp); + setSelectionOpen(false); + console.log("Selected app changed (effect)"); + }, [newSelectedApp]); + + useEffect(() => { + var tempApps = [] + if (tempApps.length === 0) { + // Object.entries(appFramework).forEach(([key, value]) => { + // value.type = key; + // tempApps.push(value); + // }); + + // // Define the custom sorting order + // const customSortingOrder = ["CASES", "SIEM", "ENDPOINT", "INTEL", "EMAIL"]; + + const lastApps = {} + let endTypes = ["network", "assets", "iam"] + + if (appFramework === undefined || appFramework === null || Object.keys(appFramework).length === 0) { + //window.location.href = "/welcome" + return + } + + + Object.entries(appFramework).forEach(([key, value]) => { + if (key.toLowerCase() === "other" || key.toLowerCase() === "communication") { + return + } + + value.type = key; + + if (endTypes.includes(value.type.toLowerCase())) { + lastApps[value.type] = value + return + } + + if (lastPosted.type === value.type) { + value = lastPosted + } + + tempApps.push(JSON.parse(JSON.stringify(value))); + }); + + tempApps.sort((a, b) => { + if (a.type.length > b.type.length) { + return -1; + } else if (a.type.length < b.type.length) { + return 1; + } + }); + + let lastType = lastPosted.type === undefined ? "" : lastPosted.type.toLowerCase() + + if (endTypes.includes(lastType)) { + lastApps[lastPosted.type] = lastPosted + } + + if (moreButton) { + tempApps.push(JSON.parse(JSON.stringify(lastApps["network"]))) + tempApps.push(JSON.parse(JSON.stringify(lastApps["assets"]))) + tempApps.push(JSON.parse(JSON.stringify(lastApps["iam"]))) + } + + setAppButtons(tempApps) + console.log("Updated appButtons: ", appButtons) + GetApps() + } + }, [lastPosted, moreButton]) + + if (appFramework === undefined || appFramework === null || Object.keys(appFramework).length === 0) { + //window.location.href = "/welcome" + return null + } const setFrameworkItem = (data) => { console.log("Setting framework item: ", data, isCloud) @@ -157,9 +268,6 @@ const AppSelection = props => { } const onNodeSelect = (label) => { - // if (setDiscoveryWrapper !== undefined) { - // setDiscoveryWrapper({ id: label }); - // } if (isCloud) { ReactGA.event({ category: "welcome", @@ -168,116 +276,16 @@ const AppSelection = props => { }); } + console.log("NODESELECT: ", label) + setDiscoveryData(label) setSelectionOpen(true) - setNewSelectedApp({}) setDefaultSearch(label.charAt(0).toUpperCase() + (label.substring(1)).toLowerCase()) + + setNewSelectedApp(undefined) }; - - useEffect(() => { - if (newSelectedApp.objectID === undefined || newSelectedApp.objectID === undefined || newSelectedApp.objectID.length === 0) { - return - } - const submitNewApp = { - description: newSelectedApp.description, - id: newSelectedApp.objectID, - large_image: newSelectedApp.image_url, - name: newSelectedApp.name, - type: discoveryData - } - if (discoveryData === "CASES") { - appFramework.cases = submitNewApp - } - else if (discoveryData === "SIEM") { - appFramework.siem = submitNewApp - } - else if (discoveryData === "ERADICATION") { - appFramework.edr = submitNewApp - } - else if (discoveryData === "INTEL") { - appFramework.intel = submitNewApp - } - else if (discoveryData === "EMAIL") { - appFramework.communication = submitNewApp - } - else if (discoveryData === "NETWORK") { - appFramework.network = submitNewApp - } - else if (discoveryData === "ASSETS") { - appFramework.assets = submitNewApp - } - else if (discoveryData === "IAM") { - appFramework.iam = submitNewApp - } - setFrameworkItem(submitNewApp); - setSelectionOpen(false); - console.log("Selected app changed (effect)"); - }, [newSelectedApp]); - - useEffect(() => { - var tempApps = [] - if (tempApps.length === 0) { - // Object.entries(appFramework).forEach(([key, value]) => { - // value.type = key; - // tempApps.push(value); - // }); - - // // Define the custom sorting order - // const customSortingOrder = ["CASES", "SIEM", "ENDPOINT", "INTEL", "EMAIL"]; - - const lastApps = {} - let endTypes = ["network", "assets", "iam"] - - if (appFramework === undefined || appFramework === null || Object.keys(appFramework).length === 0) { - window.location.href = "/welcome" - return - } - - Object.entries(appFramework).forEach(([key, value]) => { - if (key.toLowerCase() === "other" || key.toLowerCase() === "communication") { - return - } - - value.type = key; - - if (endTypes.includes(value.type.toLowerCase())) { - lastApps[value.type] = value - return - } - - if (lastPosted.type === value.type) { - value = lastPosted - } - - tempApps.push(value); - }); - - tempApps.sort((a, b) => { - if (a.type.length > b.type.length) { - return -1; - } else if (a.type.length < b.type.length) { - return 1; - } - }); - - let lastType = lastPosted.type === undefined ? "" : lastPosted.type.toLowerCase() - - if (endTypes.includes(lastType)) { - lastApps[lastPosted.type] = lastPosted - } - - if (moreButton) { - tempApps.push(lastApps["network"]) - tempApps.push(lastApps["assets"]) - tempApps.push(lastApps["iam"]) - } - - setAppButtons(tempApps) - console.log("Updated appButtons: ", appButtons) - GetApps() - } - }, [lastPosted, moreButton]) + // const sizing = moreButton ? 510 : 480; const buttonWidth = 450; @@ -286,7 +294,7 @@ const AppSelection = props => { borderRadius: 200, marginTop: moreButton ? 44 : "", height: 51, - width: 500, + width: isMobile ? 250 : 500, fontSize: 16, background: "linear-gradient(90deg, #F86744 0%, #F34475 100%)", padding: "16px 24px", @@ -301,14 +309,15 @@ const AppSelection = props => { // minHeight: sizing, // maxHeight: sizing, marginTop: 10, - width: 500, - marginBottom: 25 + width: isMobile ? 380 : 500, + marginBottom: 25, + textAlign: isMobile ? "center" : null, }} > {selectionOpen ? (
{ variant="h4" style={{ marginLeft: 8, - marginTop: 40, + marginTop: isMobile ? null : 40, marginRight: 30, marginBottom: 0, }} @@ -419,42 +428,59 @@ const AppSelection = props => { Select the apps you work with and we will connect the for you. - {appButtons.map((appData, index) => { + {appButtons.map((appData, index) => { + // This is here due to a memory issue with setting apps properly + if (appData.id === "remove") { + console.log("Removed as appdata is overridden: ", appData) - const appName = appData.name - const AppImage = appData.large_image - const appType = appData.type + appData = { + "count": 0, + "description": "", + "id": "", + "large_image": "", + "name": "", + "type": appData.type, + } + } - return ( - - ) - })} + const appName = appData.name + const AppImage = appData.large_image + const appType = appData.type + + return ( + + ) + })}
{!moreButton ? ( -
+
{ setMoreButton(true) + + setTimeout(() => { + navigate("/welcome?tab=2") + }, 250) }} >See More Apps
): ""} -
+
+
+ +
- + {top_text} + {isCloud && highlight === true ? + + { + setSignatureOpen(true) + }} + > + + + + : null}
@@ -320,15 +460,61 @@ const Billing = (props) => { } - if (feature.includes("Licensed Worker: ")) { + if (feature.includes("Worker License: ")) { + const fieldId = "webhook_uri_field_"+index parsedFeature = - - Download the licensed worker - + + + Use the {feature.split("Worker License: ")[0]} Worker + + {}} + InputProps={{ + endAdornment: + + { + var copyText = document.getElementById(fieldId); + if (copyText !== undefined && copyText !== null) { + console.log("NAVIGATOR: ", navigator); + const clipboard = navigator.clipboard; + if (clipboard === undefined) { + toast("Can only copy over HTTPS (port 3443)"); + return; + } + + navigator.clipboard.writeText(copyText.value); + copyText.select(); + copyText.setSelectionRange( + 0, + 99999 + ); /* For mobile devices */ + + /* Copy the text inside the text field */ + document.execCommand("copy"); + toast("Copied Webhook URL"); + } else { + console.log("Couldn't find webhook URI field: ", copyText); + } + }} + edge="end" + > + + + + }} + fullWidth + /> + } return ( @@ -342,7 +528,7 @@ const Billing = (props) => { : null}
- {(highlight === true && subscription.name === "Pay as you go" && subscription.limit <= 10000) || subscription.name.includes("Scale") ? + {(highlight === true && (subscription.name === "Pay as you go" && subscription.limit <= 10000) || subscription.name === "Open Source") ? {subscription.name.includes("Scale") ? @@ -351,6 +537,18 @@ const Billing = (props) => { "You are not subscribed to any plan and are using the free plan with max 10,000 app runs per month. Upgrade to deactivate this limit." } + {/*isCloud ? + + : null*/} : null} @@ -692,6 +890,7 @@ const Billing = (props) => {
{isCloud && billingInfo.subscription !== undefined && billingInfo.subscription !== null ? { : !isCloud ? { highlight={true} /> { .map((sub, index) => { return ( { stripeKey={stripeKey} selectedOrganization={selectedOrganization} subscription={sub} + highlight={true} /> ) }) diff --git a/frontend/src/components/CreatorGrid.jsx b/frontend/src/components/CreatorGrid.jsx index 56b80786..ce6a197f 100644 --- a/frontend/src/components/CreatorGrid.jsx +++ b/frontend/src/components/CreatorGrid.jsx @@ -39,7 +39,7 @@ import { const searchClient = algoliasearch("JNSS5CFDZZ", "db08e40265e2941b9a7d8f644b6e5240") const CreatorGrid = props => { - const { maxRows, showName, showSuggestion, isMobile, globalUrl, parsedXs } = props + const { maxRows, showName, showSuggestion, isMobile, globalUrl, parsedXs, isHeader } = props const rowHandler = maxRows === undefined || maxRows === null ? 50 : maxRows const xs = parsedXs === undefined || parsedXs === null ? isMobile ? 6 : 4 : parsedXs //const [apps, setApps] = React.useState([]); @@ -165,7 +165,7 @@ const CreatorGrid = props => { return ( - + diff --git a/frontend/src/components/ExploreWorkflow.jsx b/frontend/src/components/ExploreWorkflow.jsx index 95b464e7..6333d673 100644 --- a/frontend/src/components/ExploreWorkflow.jsx +++ b/frontend/src/components/ExploreWorkflow.jsx @@ -4,6 +4,7 @@ import ReactGA from 'react-ga4'; import 'react-alice-carousel/lib/alice-carousel.css'; import TrendingFlatIcon from '@mui/icons-material/TrendingFlat'; import theme from '../theme.jsx'; +import {isMobile} from "react-device-detect"; import CheckBoxSharpIcon from '@mui/icons-material/CheckBoxSharp'; import { findSpecificApp } from "../components/AppFramework.jsx" import { @@ -40,7 +41,7 @@ import { useNavigate, Link } from "react-router-dom"; import WorkflowTemplatePopup from "../components/WorkflowTemplatePopup.jsx"; const ExploreWorkflow = (props) => { - const { userdata, globalUrl, appFramework } = props + const { userdata, globalUrl, appFramework, isLoggedIn, } = props const [activeUsecases, setActiveUsecases] = useState(0); const [modalOpen, setModalOpen] = React.useState(false); const [suggestedUsecases, setSuggestedUsecases] = useState([]) @@ -291,7 +292,7 @@ const ExploreWorkflow = (props) => { return (
{modalView} - + Start using workflows @@ -300,7 +301,7 @@ const ExploreWorkflow = (props) => {
-
+
{suggestedUsecases.length === 0 && usecasesSet ? @@ -330,7 +331,10 @@ const ExploreWorkflow = (props) => { return ( { fullWidth style={{ borderRadius: 200, height: 51, - width: 464, + width: isMobile? null : 464, fontSize: 16, padding: "16px 24px", margin: "auto", @@ -368,7 +372,7 @@ const ExploreWorkflow = (props) => {
- + Explore usecases diff --git a/frontend/src/components/Priorities.jsx b/frontend/src/components/Priorities.jsx index f003540c..b588fdf8 100644 --- a/frontend/src/components/Priorities.jsx +++ b/frontend/src/components/Priorities.jsx @@ -18,11 +18,49 @@ const Priorities = (props) => { const { globalUrl, userdata, serverside, billingInfo, stripeKey, checkLogin, setAdminTab, setCurTab, } = props; const [showDismissed, setShowDismissed] = React.useState(false); const [showRead, setShowRead] = React.useState(false); + const [appFramework, setAppFramework] = React.useState({}); + + useEffect(() => { + getFramework() + }, []) if (userdata === undefined || userdata === null) { return } + const getFramework = () => { + fetch(globalUrl + "/api/v1/apps/frameworkConfiguration", { + method: "GET", + headers: { + "Content-Type": "application/json", + Accept: "application/json", + }, + credentials: "include", + }) + .then((response) => { + if (response.status !== 200) { + console.log("Status not 200 for framework!"); + } + + return response.json(); + }) + .then((responseJson) => { + if (responseJson.success === false) { + setAppFramework({}) + if (responseJson.reason !== undefined) { + //toast("Failed loading: " + responseJson.reason) + } else { + //toast("Failed to load framework for your org.") + } + } else { + setAppFramework(responseJson) + } + }) + .catch((error) => { + console.log("err in framework: ", error.toString()); + }) + } + return (

Suggestions

@@ -62,6 +100,7 @@ const Priorities = (props) => { checkLogin={checkLogin} setAdminTab={setAdminTab} setCurTab={setCurTab} + appFramework={appFramework} /> ) }) diff --git a/frontend/src/components/Priority.jsx b/frontend/src/components/Priority.jsx index 947a837d..13c278d3 100644 --- a/frontend/src/components/Priority.jsx +++ b/frontend/src/components/Priority.jsx @@ -27,31 +27,42 @@ const Priority = (props) => { const isCloud = window.location.host === "localhost:3002" || window.location.host === "shuffler.io"; let navigate = useNavigate(); - var realigned = false + var realignedSrc = false + var realignedDst = false let newdescription = priority.description const descsplit = priority.description.split("&") if (appFramework !== undefined && descsplit.length === 5 && priority.description.includes(":default")) { - //console.log("descsplit: ", descsplit) + console.log("descsplit: ", descsplit) if (descsplit[1] === "") { const item = findSpecificApp(appFramework, descsplit[0]) - //console.log("item: ", item) + if (item !== null) { descsplit[1] = item.large_image + + console.log("DESCSPLIT name: ", descsplit[0]) + + if (descsplit[0].includes(":default")) { + realignedSrc = true + } + descsplit[0] = descsplit[0].split(":")[0] } - - realigned = true } if (descsplit[3] === "") { const item = findSpecificApp(appFramework, descsplit[2]) //console.log("item: ", item) + realignedDst = true if (item !== null) { descsplit[3] = item.large_image + + if (descsplit[2].includes(":default")) { + realignedDst = true + } + descsplit[2] = descsplit[2].split(":")[0] } - - realigned = true + } newdescription = descsplit.join("&") @@ -101,6 +112,8 @@ const Priority = (props) => { } + const srcSize = realignedSrc ? 35 : 30 + const dstSize = realignedDst ? 35 : 30 return (
@@ -112,7 +125,7 @@ const Priority = (props) => { {priority.type === "usecase" && priority.description.includes("&") ? - {priority.name} + {priority.name} {newdescription.split("&")[0]} @@ -120,7 +133,7 @@ const Priority = (props) => { {newdescription.split("&").length > 3 ? - {priority.name+"2"} + {priority.name+"2"} {newdescription.split("&")[2]} diff --git a/frontend/src/components/WelcomeForm2.jsx b/frontend/src/components/WelcomeForm2.jsx index f0b71273..3c9200e0 100644 --- a/frontend/src/components/WelcomeForm2.jsx +++ b/frontend/src/components/WelcomeForm2.jsx @@ -4,7 +4,7 @@ import Checkbox from "@mui/material/Checkbox"; import AliceCarousel from "react-alice-carousel"; import "react-alice-carousel/lib/alice-carousel.css"; - +import {isMobile} from "react-device-detect"; import SearchIcon from "@mui/icons-material/Search"; import EmailIcon from "@mui/icons-material/Email"; import NewReleasesIcon from "@mui/icons-material/NewReleases"; @@ -79,6 +79,7 @@ const WelcomeForm = (props) => { selectionOpen, setSelectionOpen, checkLogin, + isLoggedIn, } = props; const [moreButton, setMoreButton] = useState(false); const ref = useRef() @@ -449,19 +450,6 @@ const WelcomeForm = (props) => { } }; - const handleSkip = () => { - setclickdiff(240); - if (!isStepOptional(activeStep)) { - throw new Error("You can't skip a step that isn't optional."); - } - setActiveStep((prevActiveStep) => prevActiveStep + 1); - setSkipped((prevSkipped) => { - const newSkipped = new Set(prevSkipped.values()); - newSkipped.add(activeStep); - return newSkipped; - }); - }; - const handleReset = () => { setActiveStep(0); }; @@ -652,6 +640,7 @@ const WelcomeForm = (props) => { ); case 1: return ( + appFramework === undefined || appFramework === null ? null : { case 2: return ( -
+
-
+
@@ -692,13 +682,6 @@ const WelcomeForm = (props) => { const extraHeight = isCloud ? -7 : 0; return (
- {/*selectionOpen ? - - : null*/}
{activeStep === steps.length ? (
diff --git a/frontend/src/components/WorkflowTemplatePopup.jsx b/frontend/src/components/WorkflowTemplatePopup.jsx index e7deea1d..9b283da9 100644 --- a/frontend/src/components/WorkflowTemplatePopup.jsx +++ b/frontend/src/components/WorkflowTemplatePopup.jsx @@ -4,6 +4,7 @@ import { toast } from "react-toastify" import theme from '../theme.jsx'; import { useNavigate, Link, useParams } from "react-router-dom"; import AppSearchButtons from "../components/AppSearchButtons.jsx"; +import { isMobile } from "react-device-detect"; import { Button, Typography, @@ -27,7 +28,7 @@ import WorkflowTemplatePopup2 from "./WorkflowTemplatePopup.jsx"; import ConfigureWorkflow from "../components/ConfigureWorkflow.jsx"; const WorkflowTemplatePopup = (props) => { - const { userdata, appFramework, globalUrl, img1, srcapp, img2, dstapp, title, description, visualOnly, apps, isLoggedIn } = props; + const { userdata, appFramework, globalUrl, img1, srcapp, img2, dstapp, title, description, visualOnly, apps, isLoggedIn, isHomePage } = props; const [isActive, setIsActive] = useState(false); const [isHovered, setIsHovered] = useState(false); @@ -40,14 +41,18 @@ const WorkflowTemplatePopup = (props) => { const [missingSource, setMissingSource] = React.useState(undefined) const [missingDestination, setMissingDestination] = React.useState(undefined); + useEffect(() => { + console.log("Source & Dest check:", missingSource, missingDestination) + }, [missingSource, missingDestination]) + const isCloud = window.location.host === "localhost:3002" || window.location.host === "shuffler.io"; let navigate = useNavigate(); - const imagestyleWrapper = { + const imagestyleWrapper = { height: 40, width: 40, borderRadius: 40, - border: "1px solid rgba(255,255,255,0.3)", + border: isHomePage ? null : "1px solid rgba(255,255,255,0.3)", overflow: "hidden", display: "flex", } @@ -56,7 +61,7 @@ const WorkflowTemplatePopup = (props) => { height: 40, width: 40, borderRadius: 40, - border: "1px solid rgba(255,255,255,0.3)", + border: isHomePage ? null : "1px solid rgba(255,255,255,0.3)", overflow: "hidden", display: "flex", } @@ -65,13 +70,13 @@ const WorkflowTemplatePopup = (props) => { height: 40, width: 40, borderRadius: 40, - border: "1px solid rgba(255,255,255,0.3)", + border: isHomePage ? null : "1px solid rgba(255,255,255,0.3)", overflow: "hidden", } const imagestyleDefault = { display: "block", - marginLeft: 11, + marginLeft: 12, marginTop: 11, height: 35, width: "auto", @@ -168,6 +173,7 @@ const WorkflowTemplatePopup = (props) => { }); } + const getGeneratedWorkflow = () => { // POST // https://shuffler.io/api/v1/workflows/merge @@ -183,15 +189,13 @@ const WorkflowTemplatePopup = (props) => { if (srcapp.includes(":default")) { setMissingSource({ - "img": "https://shuffler.io/images/apps/" + srcapp + ".png", "type": srcapp.split(":")[0], }) } if (dstapp.includes(":default")) { setMissingDestination({ - "name": dstapp, - "img": "https://shuffler.io/images/apps/" + dstapp + ".png", + "type": dstapp.split(":")[0], }) } @@ -200,7 +204,6 @@ const WorkflowTemplatePopup = (props) => { setWorkflowLoading(true) - // FIXME: Remove hardcoding here after testing, and user srcapp/dstapp const newsrcapp = srcapp const newdstapp = dstapp @@ -228,15 +231,21 @@ const WorkflowTemplatePopup = (props) => { }) .then((response) => { if (response.status !== 200) { - console.log("Status not 200 for framework!"); + //console.log("Status not 200 for framework!"); } setWorkflowLoading(false) return response.json(); }) .then((responseJson) => { + if (responseJson.id !== undefined && responseJson.id !== null && responseJson.id !== "" && responseJson.name !== undefined && responseJson.name !== null && responseJson.name !== "") { + console.log("Success in workflow template (prebuilt): ", responseJson); + setWorkflow(responseJson) + return + } + if (responseJson.success === false) { - console.log("Error in workflow template: ", responseJson.error); + //console.log("Error in workflow template: ", responseJson.error); setErrorMessage("Failed to generate workflow for these tools - the Shuffle team has been notified. Click out of this window to continue. Contact support@shuffler.io for further assistance.") @@ -290,9 +299,9 @@ const WorkflowTemplatePopup = (props) => { style: { backgroundColor: "black", color: "white", - minWidth: 700, - maxWidth: 700, - paddingTop: 75, + minWidth: isHomePage ? null : isMobile ? 300 : 700, + maxWidth: isHomePage ? null : isMobile ? 300 : 700, + paddingTop: isMobile ? null : 75, itemAlign: "center", }, }} @@ -311,8 +320,8 @@ const WorkflowTemplatePopup = (props) => { > - - + + Configure Workflow @@ -343,16 +352,41 @@ const WorkflowTemplatePopup = (props) => {
} - {!isLoggedIn || missingSource === undefined ? null : -
+ + {isLoggedIn && (missingSource !== undefined || missingDestination !== undefined) ? + + {"The following app category is required generate this workflow: "} + + : null} + + {(missingSource !== undefined) ? +
- } + : null} + + {(missingDestination !== undefined) ? +
+ +
+ : null} + { if (title.length > maxlength) { parsedTitle = title.substring(0, maxlength) + "..." } - + console.log("isHomePage", isHomePage) parsedTitle = parsedTitle.replaceAll("_", " ") const parsedDescription = description !== undefined && description !== null ? description.replaceAll("_", " ") : "" return ( -
+
{ }
- + {parsedTitle} - + {parsedDescription}
diff --git a/frontend/src/views/Admin.jsx b/frontend/src/views/Admin.jsx index 346609f4..1ef82ba3 100755 --- a/frontend/src/views/Admin.jsx +++ b/frontend/src/views/Admin.jsx @@ -980,6 +980,22 @@ Let me know if you're interested, or set up a call here: https://drift.me/${user leads.push("customer") } + if (responseJson.lead_info.old_customer) { + leads.push("old customer") + } + + if (responseJson.lead_info.tech_partner) { + leads.push("tech partner") + } + + if (responseJson.lead_info.creator) { + leads.push("creator") + } + + if (responseJson.lead_info.opensource) { + leads.push("open source") + } + if (responseJson.lead_info.demo_done) { leads.push("demo done") } @@ -2412,7 +2428,7 @@ Let me know if you're interested, or set up a call here: https://drift.me/${user renderValue={(selected) => selected.join(', ')} MenuProps={MenuProps} > - {["contacted", "lead", "pov", "demo done", "customer", "student", "internal"].map((name) => ( + {["contacted", "lead", "pov", "demo done", "customer", "open source", "student", "internal", "old customer", "creator", "tech partner"].map((name) => ( -1} /> @@ -3000,7 +3016,7 @@ Let me know if you're interested, or set up a call here: https://drift.me/${user curTab === 1 ? (
-

User management

+

User Management

Add, edit, block or change passwords.{" "} + {users === undefined || users === null @@ -3091,6 +3111,24 @@ Let me know if you're interested, or set up a call here: https://drift.me/${user bgColor = "#1f2023"; } + const timeNow = new Date().getTime(); + + // Get the highest timestamp in data.login_info + var lastLogin = "N/A" + if (data.login_info !== undefined && data.login_info !== null) { + var loginInfo = 0 + for (var i = 0; i < data.login_info.length; i++) { + if (data.login_info[i].timestamp > loginInfo) { + loginInfo = data.login_info[i].timestamp + } + } + + if (loginInfo > 0) { + console.log("SETTING LAST LOGIN: " + loginInfo) + lastLogin = new Date(loginInfo * 1000).toISOString().slice(0, 10) + " (" + data.login_info.length + ")" + } + } + return ( ) : null} - + { setSelectedUserModalOpen(true); @@ -3300,6 +3338,11 @@ Let me know if you're interested, or set up a call here: https://drift.me/${user New apikey */} + + ); })} diff --git a/frontend/src/views/AngularWorkflow.jsx b/frontend/src/views/AngularWorkflow.jsx index 00cd2c16..6f44a3b2 100755 --- a/frontend/src/views/AngularWorkflow.jsx +++ b/frontend/src/views/AngularWorkflow.jsx @@ -977,14 +977,17 @@ const AngularWorkflow = (defaultprops) => { tmpView = execution_id; } + console.log("TMPVIEW: ", tmpView); + // Compare with currently selected item if (tmpView !== undefined && tmpView !== null && tmpView.length > 0) { // Don't clean up if it's already open if (executionModalOpen === true) { + console.log("Execution modal already open, not cleaning up") return } - const execution = responseJson.find((data) => data.execution_id === tmpView); + const execution = responseJson.executions.find((data) => data.execution_id === tmpView); setExecutionModalOpen(true) if (execution !== null && execution !== undefined) { diff --git a/frontend/src/views/Dashboard.jsx b/frontend/src/views/Dashboard.jsx index 41443966..f961076b 100755 --- a/frontend/src/views/Dashboard.jsx +++ b/frontend/src/views/Dashboard.jsx @@ -170,9 +170,6 @@ const UsecaseListComponent = (props) => { //console.log("parseUsecase: ", subcase) const srcdata = findSpecificApp(frameworkData, subcase.type) const dstdata = findSpecificApp(frameworkData, subcase.last) - - //console.log("srcdata: ", srcdata) - //console.log("dstdata: ", dstdata) if (srcdata !== undefined && srcdata !== null) { subcase.srcimg = srcdata.large_image @@ -192,9 +189,9 @@ const UsecaseListComponent = (props) => { subcase = parseUsecase(subcase) // Timeout 50ms to delay it slightly - setTimeout(() => { - setInputUsecase(subcase) - }, 50) + //setTimeout(() => { + // setInputUsecase(subcase) + //}, 50) fetch(`${globalUrl}/api/v1/workflows/usecases/${escape(subcase.name.replaceAll(" ", "_"))}`, { method: "GET", @@ -212,12 +209,13 @@ const UsecaseListComponent = (props) => { return response.json(); }) .then((responseJson) => { - //console.log("In responseJson for usecase: ", responseJson) var parsedUsecase = responseJson if (responseJson.success === false) { parsedUsecase = subcase } else { + console.log("FOUND: ", JSON.parse(JSON.stringify(responseJson))) + parsedUsecase = responseJson parsedUsecase.srcimg = subcase.srcimg @@ -417,7 +415,7 @@ const UsecaseListComponent = (props) => { const fixedName = subcase.name.toLowerCase().replace("_", " ") return ( - { + { //setSelectedWorkflows([]) if (selectedItem) { @@ -887,21 +885,23 @@ const UsecaseListComponent = (props) => { > Try it out: - 0 ? + + apps={apps} + /> + : null} {/* diff --git a/frontend/src/views/Search.jsx b/frontend/src/views/Search.jsx index ffa2061f..1f696aad 100644 --- a/frontend/src/views/Search.jsx +++ b/frontend/src/views/Search.jsx @@ -21,20 +21,13 @@ import { } from "@mui/icons-material"; -const bodyDivStyle = { - margin: "auto", - maxWidth: 1024, - scrollX: "hidden", - overflowX: "hidden", -} - // Should be different if logged in :| const Search = (props) => { - const { globalUrl, isLoaded, serverside, userdata, hidemargins, } = props; + const { globalUrl, isLoaded, serverside, userdata, hidemargins, isHeader} = props; let navigate = useNavigate(); const [curTab, setCurTab] = useState(0); - const iconStyle = { marginRight: 10 }; + const iconStyle = { marginRight: isHeader ? null : 10 }; useEffect(() => { if (serverside !== true && window.location.search !== undefined && window.location.search !== null) { @@ -58,15 +51,23 @@ const Search = (props) => { return null } + const bodyDivStyle = { + margin: "auto", + maxWidth: 1024, + scrollX: "hidden", + overflowX: "hidden", + justifyContent: isHeader ? "center" : null, + } + const boxStyle = { color: "white", flex: "1", - marginLeft: 10, - marginRight: 10, - paddingLeft: 30, - paddingRight: 30, - paddingBottom: 30, - paddingTop: hidemargins === true ? 0 : 30, + marginLeft: isHeader ? null : 10, + marginRight: isHeader ? null : 10, + paddingLeft: isHeader ? null : 30, + paddingRight: isHeader ? null : 30, + paddingBottom: isHeader ? null : 30, + paddingTop: hidemargins === true ? 0 : isHeader ? null : 30, display: "flex", flexDirection: "column", overflowX: "hidden", @@ -121,7 +122,7 @@ const Search = (props) => {
{ /> {curTab === 0 ? - + : curTab === 1 ? window.location.pathname === "/search" ? @@ -164,7 +165,7 @@ const Search = (props) => { : curTab === 3 ? - + : null}
diff --git a/frontend/src/views/Welcome.jsx b/frontend/src/views/Welcome.jsx index f9cab314..1b2085f4 100644 --- a/frontend/src/views/Welcome.jsx +++ b/frontend/src/views/Welcome.jsx @@ -2,7 +2,7 @@ import React, { useState, useEffect } from 'react'; import ReactGA from 'react-ga4'; import WelcomeForm2 from "../components/WelcomeForm2.jsx"; import AppFramework from "../components/AppFramework.jsx"; - +import {isMobile} from "react-device-detect"; import { ArrorForwardIos as ArrowForwardIosIcon, } from '@mui/icons-material'; @@ -269,22 +269,22 @@ const Welcome = (props) => { getApps() getAvailableWorkflows() - if ( - window.location.search !== undefined && - window.location.search !== null - ) { + if (window.location.search !== undefined && window.location.search !== null) { const urlSearchParams = new URLSearchParams(window.location.search); const params = Object.fromEntries(urlSearchParams.entries()); const foundTab = params["tab"]; + + // Make foundtab into a number + console.log("foundTab: ", foundTab, activeStep+1) if (foundTab !== null && foundTab !== undefined && !isNaN(foundTab) && foundTab >= 1 && foundTab <= 3) { + console.log("SETTING TAB TO: ", foundTab) + setShowWelcome(true) if (foundTab === 3 || foundTab === "3") { handleSetSearch(usecaseButtons[0].name, usecaseButtons[0].usecase) } setActiveStep(foundTab-1) - } else { - navigate(`/welcome?tab=2`) } } }, []) @@ -297,8 +297,8 @@ const Welcome = (props) => { flex: 1, padding: 0, textAlign: "center", - maxWidth: 275, - minWidth: 275, + maxWidth: isMobile ? null : 275, + minWidth: isMobile ? null : 275, backgroundColor: theme.palette.surfaceColor, color: "white", borderRadius: theme.palette.borderRadius, @@ -323,7 +323,7 @@ const Welcome = (props) => { const buttonStyle = { borderRadius: 200, height: 51, - width: 464, + width: isMobile ? 300 : 464, fontSize: 16, // background: "linear-gradient(89.83deg, #FF8444 0.13%, #F2643B 99.84%)", background: "linear-gradient(90deg, #F86744 0%, #F34475 100%)", @@ -331,7 +331,7 @@ const Welcome = (props) => { top: 105, margin: "auto", itemAlign: "center", - marginLeft: "65px", + marginLeft: isMobile? null : "65px", } const defaultImage = "/images/experienced.png" @@ -379,7 +379,7 @@ const Welcome = (props) => { })}
*/} - +
{/* @@ -391,6 +391,7 @@ const Welcome = (props) => { /> */} { />
- {/* {frameworkData === undefined || window.location.href.includes("tab=1") || window.location.href.includes("tab=3") ? null : -
- - App Framework - - - - -
- } */}
: -
- - {/*
- { - navigate("/workflows") - }}/> - { - navigate("/workflows") - }}> - Back - -
*/} - +
Help us get to know you @@ -466,7 +429,7 @@ const Welcome = (props) => { {/* We will use this information to personalize your automation */} -
+
{ if (isCloud) { @@ -479,6 +442,7 @@ const Welcome = (props) => { //setActiveStep(1) } + navigate("/welcome?tab=2") setShowWelcome(true) }}> @@ -487,12 +451,13 @@ const Welcome = (props) => { New to Shuffle - Let us guide you for an easier experience + Let us guide you for an easier experience
-
+
{/* OR */} @@ -521,10 +486,11 @@ const Welcome = (props) => {
-
+
- - - - {/*
{ - if (window.drift !== undefined) { - window.drift.api.startInteraction({ interactionId: 340045 }) - } else { - console.log("Couldn't find drift in window.drift and not .drift-open-chat with querySelector: ", window.drift) - } - }}> - - Want a demo instead? - -
*/}
} diff --git a/functions/onprem/orborus/orborus.go b/functions/onprem/orborus/orborus.go index 08da0bd1..5be518de 100755 --- a/functions/onprem/orborus/orborus.go +++ b/functions/onprem/orborus/orborus.go @@ -1410,6 +1410,7 @@ func main() { continue } + //defer newresp.Body.Close() if newresp.StatusCode == 405 { log.Printf("[WARNING] Received 405 from %s. This is likely due to a misconfigured base URL. Automatically swapping to GET request (backwards compatibility)", fullUrl) @@ -1619,6 +1620,7 @@ func main() { continue } + defer resultResp.Body.Close() body, err := ioutil.ReadAll(resultResp.Body) if err != nil { log.Printf("[ERROR] Failed reading confirm body: %s", err) @@ -1913,6 +1915,7 @@ func sendWorkerRequest(workflowExecution shuffle.ExecutionRequest) error { return err } + defer newresp.Body.Close() body, err := ioutil.ReadAll(newresp.Body) if err != nil { log.Printf("[ERROR] Failed reading body in worker request body to worker on %s: %s", streamUrl, err)