+
- :
-
-
- }
+ ) : (
+
+
+ ) }
{/*
@@ -262,7 +254,7 @@ const App = (message, props) => {
/>
+
+
+
+ {children}
+
+ )
+});
+
+const Wrapper2 = memo(({children}) => {
+
+ return (
+
+ {children}
+
+ );
+});
+
+const Wrapper = memo(({ children }) => {
+ return (
+
+
+ );
+};
+
+export default AnalyticsTab;
diff --git a/frontend/src/components/ApiExplorer.jsx b/frontend/src/components/ApiExplorer.jsx
index c2dfaeb3..e6080301 100644
--- a/frontend/src/components/ApiExplorer.jsx
+++ b/frontend/src/components/ApiExplorer.jsx
@@ -25,7 +25,8 @@ import {
TableRow,
InputAdornment,
Divider,
- LinearProgress
+ LinearProgress,
+ Tooltip,
} from "@mui/material";
import throttle from "lodash/throttle";
import theme from "../theme.jsx";
@@ -100,6 +101,8 @@ const ApiExplorer = memo(({ openapi, globalUrl, userdata, HandleApiExecution, se
const [ExampleBody, setExampleBody] = useState({});
const [filteredActions, setFilteredActions] = useState([]);
+ const [firstSendDone, setFirstSendDone] = useState(false)
+
const getJsonObject = (properties) => {
let jsonObject = {};
@@ -1181,6 +1184,7 @@ const ApiExplorer = memo(({ openapi, globalUrl, userdata, HandleApiExecution, se
}
}
}
+
var prefixCheck = "/v1";
if (parentUrl.includes("/")) {
const urlsplit = parentUrl.split("/");
@@ -1240,7 +1244,7 @@ const ApiExplorer = memo(({ openapi, globalUrl, userdata, HandleApiExecution, se
}
}
- newActions = newActions2;
+ newActions = newActions2
// Rearrange them by which has action_label
const firstActions = newActions.filter(
@@ -1255,9 +1259,9 @@ const ApiExplorer = memo(({ openapi, globalUrl, userdata, HandleApiExecution, se
data.action_label === null ||
data.action_label === "No Label"
);
- newActions = firstActions.concat(secondActions);
- setActions(newActions);
- setExampleBody(newActions[0]?.body);
+ newActions = firstActions.concat(secondActions)
+ setActions(newActions)
+ setExampleBody(newActions[0]?.body)
}, [openapi]);
return (
@@ -1425,36 +1429,47 @@ const ActionsList = memo(({
};
const handleSearch = (e) => {
- const query = e.target.value;
- setSearchQuery(query);
+ const query = e?.target?.value?.toLowerCase().replaceAll("_", " ");
+
+ setSearchQuery(query)
if (query.length === 0) {
- setVisibleActions(actions);
+ setVisibleActions(actions)
} else {
setVisibleActions(
- actions.filter((action) =>
- action.name.toLowerCase().includes(searchQuery.toLowerCase())
+ actions?.filter((action) =>
+ action?.name?.toLowerCase()?.replaceAll("_", " ")?.includes(searchQuery)
)
- );
+ )
}
- };
+ }
+
return (
+
+ Timeline
+
+
+
+
+
+
+
+
+ {expand ? null :
+ Apps
+
+
}
+
+ Onboarding
+
+
+
+
+
+
+
+
+
+
+
+ 
+ {checked ?
+
+
+ {checked ?
+
+
+ {checked ?
+
+
+ {checked ?
+
+
+ {checked ?
+
+
+ {checked ?
+
+ Other
+
+
+
+
+
+
+
+
+
+
+
+ {checked ?
+
+
+ {checked ?
+
+
+ {checked ?
+
+
+ {checked ?
+
+
+ {checked ?
+
+
+ {checked ?
+
+
+ Workflows
+
+
+
+
+
+
+
+ Insights
+
+
+ Sessions Overview
+
+
+
+
+
+ 2.8 Hours
+
+
+ Avg. Activity per session
+
+
+
+
+ /usercases/edr to ticket
+
+
+ Last visited page
+
+
+
+
+ /workflow/email management
+
+
+ Most visited page
+
+
{info?.title ? (
-
+
+
) : (
@@ -1463,9 +1478,10 @@ const ActionsList = memo(({
)}
- ![app logo]({openapi?.info["x-logo"]})
-
- {info.title}
-
-
+
+
+
+
+ {info.title}
+
+
+
- {action.name.replaceAll("_", " ")}
+ {action?.name?.replaceAll("_", " ")}
))
@@ -1794,7 +1811,7 @@ const Action = memo((
response.result = JSON.parse(response.result);
} catch (parseError) {
console.error("Error parsing result:", parseError);
- toast.error("Error parsing response result.");
+ //toast.error("Error parsing response result.");
}
}
@@ -2035,6 +2052,7 @@ const Action = memo((
}, [editorRef.current]);
+ const actionname = action?.name.charAt(0).toUpperCase() + action?.name.slice(1).replaceAll("_", " ")
return (
+ {props.level !== 1 ? (
+
+ );
+ }
+
+ const getAppDocs = (appname, location, version) => {
+ fetch(`${globalUrl}/api/v1/docs/${appname}?location=${location}&version=${version}`, {
+ headers: {
+ Accept: "application/json",
+ },
+ credentials: "include",
+ })
+ .then((response) => {
+ if (response.status === 200) {
+ //toast("Successfully GOT app "+appId)
+ } else {
+ //toast("Failed getting app");
+ }
+
+ return response.json();
+ })
+ .then((responseJson) => {
+ if (responseJson.success === true) {
+ if (responseJson.meta !== undefined && responseJson.meta !== null && Object.getOwnPropertyNames(responseJson.meta).length > 0) {
+ setSelectedMeta(responseJson.meta)
+ }
+
+ if (responseJson.reason !== undefined && responseJson.reason !== undefined && responseJson.reason.length > 0) {
+ if (!responseJson.reason.includes("404: Not Found") && responseJson.reason.length > 25) {
+ // Translate ![]()
into markdown ![]()
+ const imgRegex = / ({
+ ...prevState,
+ documentation: newdata,
+ }));
+ }
+ }
+ }
+
+ })
+ .catch((error) => {
+ toast(error.toString());
+ });
+ };
+
+ const handleDecodeOfOpenApiData = (data) => {
+ var appexists = false;
+ var parsedapp = {};
+
+ if (data.app !== undefined && data.app !== null) {
+ var parsedBaseapp = "";
+ try {
+ parsedBaseapp = base64_decode(data.app);
+ } catch (e) {
+ parsedBaseapp = data;
+ }
+
+ parsedapp = JSON.parse(parsedBaseapp);
+ parsedapp.name = parsedapp.name.replaceAll("_", " ");
+
+ appexists =
+ parsedapp.name !== undefined &&
+ parsedapp.name !== null &&
+ parsedapp.name.length !== 0;
+ if(parsedapp?.id.length > 0){
+ setSelectedAppData(parsedapp)
+ handleAppAuthenticationType(parsedapp)
+ const apptype = selectedAppData?.generated === false ? "python" : "openapi"
+ getAppDocs(parsedapp.name, apptype, parsedapp.version);
+ setAuthenticationModalOpen(true);
+ }
+ }
+
+ if (data.openapi === undefined || data.openapi === null) {
+ return;
+ }
+
+ var parsedDecoded = "";
+ try {
+ parsedDecoded = base64_decode(data.openapi);
+ } catch (e) {
+ parsedDecoded = data;
+ }
+
+ parsedapp = JSON.parse(parsedDecoded);
+ data =
+ parsedapp.body === undefined ? parsedapp : JSON.parse(parsedapp.body);
+ };
+
+ const getAppData = (appid) => {
+ if (appid === undefined || appid === null || appid.length === 0) {
+ return;
+ }
+ const url = `${globalUrl}/api/v1/apps/${appid}/config`;
+
+ fetch(url, {
+ credentials: "include",
+ method: "GET",
+ headers: {
+ "Content-Type": "application/json",
+ },
+ })
+ .then((response) => {
+ if (response.status !== 200) {
+ toast.error("Failed to get app data or App doesn't. Please contact support@shuffler.io");
+ return;
+ }
+ return response.json();
+ })
+ .then((responseJson) => {
+ if (responseJson.success === true) {
+ handleDecodeOfOpenApiData(responseJson);
+ } else {
+ toast.error("Failed to get app data or App doesn't exist");
+ }
+ })
+ .catch((error) => {
+ console.error("error for app is :", error);
+ });
+ };
+
+ const UpdateAppAuthentication = (data) => {
+ if (data === undefined || data === null) {
+ return;
+ }
+ const filteredData = data.filter((appAuth) => appAuth?.app?.id === appid);
+ if (filteredData.length === 0) {
+ setAppAuthentication([]);
+ setSelectedAuthentication({});
+ } else {
+ setAppAuthentication(filteredData);
+ setSelectedAuthentication(filteredData[0]);
+ }
+ };
+
+ const HandleAppAuthentication = ()=>{
+
+ const url = `${globalUrl}/api/v1/apps/authentication`;
+
+ fetch(url, {
+ method: "GET",
+ headers: {
+ "Content-Type": "application/json",
+ },
+ credentials: "include",
+ }).then((response) => {
+ if (response.status !== 200) {
+ return;
+ }
+ return response.json();
+ }).then((responseJson) => {
+ if (responseJson.success === true) {
+ UpdateAppAuthentication(responseJson.data);
+ } else {
+ toast.error("Failed to get app authentication data");
+ }
+ }).catch((error) => {
+ console.error("error for app is :", error);
+ });
+ }
+
+ const handleAppAuthenticationNew = (data) => () => {
+
+ const appid = data.objectID;
+ if (appid > 0) {
+ setAppId(appid);
+ }
+ if (appid.length > 0) {
+ toast.info(`Getting authentication for ${data.name}. Please wait...`);
+ getAppData(appid);
+ HandleAppAuthentication();
+ }
+ }
+
+ const AuthenticationData = (props) => {
+ const selectedApp = props.app;
+
+ const [authenticationOption, setAuthenticationOptions] = React.useState({
+ app: JSON.parse(JSON.stringify(selectedApp)),
+ fields: {},
+ label: "",
+ usage: [
+ {
+ // workflow_id: workflow.id,
+ },
+ ],
+ id: uuidv4(),
+ active: true,
+ });
+
+ if (
+ selectedApp.authentication === undefined ||
+ selectedApp.authentication.parameters === null ||
+ selectedApp.authentication.parameters === undefined ||
+ selectedApp.authentication.parameters.length === 0
+ ) {
+ return (
+
+
+ {selectedApp.name} does not require authentication
+
+
+ );
+ }
+
+ authenticationOption.app.actions = [];
+
+ for (let paramkey in selectedApp.authentication.parameters) {
+ if (
+ authenticationOption.fields[
+ selectedApp.authentication.parameters[paramkey].name
+ ] === undefined
+ ) {
+ authenticationOption.fields[
+ selectedApp.authentication.parameters[paramkey].name
+ ] = "";
+ }
+ }
+
+ const setNewAppAuth = (appAuthData, refresh) => {
+ setSelectedAuthentication(appAuthData);
+ var headers = {
+ "Content-Type": "application/json",
+ "Accept": "application/json",
+ }
+
+ headers["Org-Id"] = userdata?.active_org?.id
+
+ fetch(globalUrl + "/api/v1/apps/authentication", {
+ method: "PUT",
+ headers: headers,
+ body: JSON.stringify(appAuthData),
+ credentials: "include",
+ })
+ .then((response) => {
+ if (response.status !== 200) {
+ console.log("Status not 200 for setting app auth :O!");
+
+ if (response.status === 400) {
+ toast.error("Failed setting new auth. Please try again", {
+ "autoClose": true,
+ })
+ }
+ }
+
+ return response.json();
+ })
+ .then((responseJson) => {
+ if (!responseJson.success) {
+ toast.error("Error: " + responseJson.reason, {
+ "autoClose": false,
+ })
+
+ } else {
+ HandleAppAuthentication()
+ setAuthenticationModalOpen(false)
+ getAppAuthentication()
+ }
+ })
+ .catch((error) => {
+ console.log("New auth error: ", error.toString());
+ });
+ };
+
+ const handleSubmitCheck = () => {
+ if (authenticationOption.label.length === 0) {
+ authenticationOption.label = `Auth for ${selectedApp.name}`;
+ }
+ for (let paramkey in selectedApp.authentication.parameters) {
+ if (
+ authenticationOption.fields[
+ selectedApp.authentication.parameters[paramkey].name
+ ].length === 0
+ ) {
+ if (
+ selectedApp.authentication.parameters[paramkey].value !== undefined &&
+ selectedApp.authentication.parameters[paramkey].value !== null &&
+ selectedApp.authentication.parameters[paramkey].value.length > 0
+ ) {
+ authenticationOption.fields[
+ selectedApp.authentication.parameters[paramkey].name
+ ] = selectedApp.authentication.parameters[paramkey].value;
+ } else {
+ if (
+ selectedApp.authentication.parameters[paramkey].schema.type === "bool"
+ ) {
+ authenticationOption.fields[
+ selectedApp.authentication.parameters[paramkey].name
+ ] = "false";
+ } else {
+ toast(
+ "Field " +
+ selectedApp.authentication.parameters[paramkey].name +
+ " can't be empty"
+ );
+ return;
+ }
+ }
+ }
+ }
+
+ var newAuthOption = JSON.parse(JSON.stringify(authenticationOption));
+ var newFields = [];
+ for (let authkey in newAuthOption.fields) {
+ const value = newAuthOption.fields[authkey];
+ newFields.push({
+ "key": authkey,
+ "value": value,
+ });
+ }
+
+ newAuthOption.fields = newFields
+ setNewAppAuth(newAuthOption)
+ }
+
+ if (authenticationOption.label === null || authenticationOption.label === undefined) {
+ authenticationOption.label = selectedApp.name + " authentication";
+ }
+
+ return (
+ {
}}
>
- {data.tags.slice(0, 1).map((tag, tagIndex) => (
+ {data?.tags?.slice(0, 1)?.map((tag, tagIndex) => (
{normalizedString(tag)}
{tagIndex < 1 ? ", " : ""}
@@ -565,7 +569,7 @@ const AppGrid = (props) => {
) : (
- {action.name}
+ {actionname}
+ );
+});
+
+export default AppAuthTab;
+
+
+const SearchBox = ({ currentRefinement, refine, isSearchStalled, searchQuery, setSearchQuery }) => {
+ const handleSearch = (e) => {
+ refine(searchQuery.trim());
+ };
+
+ return (
+
+ );
+};
+
+const Hits = ({
+ hits,
+ insights,
+ setIsAnyAppActivated,
+ searchQuery,
+ isCloud,
+ globalUrl,
+ userdata,
+ getAppAuthentication
+}) => {
+ const [mouseHoverIndex, setMouseHoverIndex] = useState(-1);
+ const [selectedAppData, setSelectedAppData] = useState({})
+ const [appid, setAppId] = useState("")
+ const [selectedAuthentication, setSelectedAuthentication] = useState({})
+ const [authenticationModalOpen, setAuthenticationModalOpen] = useState(false)
+ const [authenticationType, setAuthenticationType] = React.useState("");
+ const [appAuthentication, setAppAuthentication] = useState([]);
+ const [selectedMeta, setSelectedMeta] = useState(undefined);
+ const [selectedAction, setSelectedAction] = useState(
+ {
+ "app_name": selectedAppData.name,
+ "app_id": selectedAppData.id,
+ "app_version": selectedAppData.version,
+ "large_image": selectedAppData.large_image,
+ }
+ )
+ const navigate = useNavigate();
+
+ const normalizedString = (name) => {
+ if (typeof name === 'string') {
+ return name.replace(/_/g, ' ');
+ } else {
+ return name;
+ }
+ };
+
+
+ let workflowDelay = 0;
+ const isHeader = true;
+ const paperStyle = {
+ color: "rgba(241, 241, 241, 1)",
+ padding: isHeader ? null : 15,
+ cursor: "pointer",
+ width: '100%',
+ maxHeight: 96,
+ borderRadius: 4,
+ transition: 'background-color 0.3s ease',
+ };
+
+ const base64_decode = (str) => {
+ return decodeURIComponent(
+ atob(str)
+ .split("")
+ .map(function (c) {
+ return "%" + ("00" + c.charCodeAt(0).toString(16)).slice(-2);
+ })
+ .join("")
+ );
+ };
+
+ const handleAppAuthenticationType = (selectedAppData)=> {
+
+ if (selectedAppData.authentication === undefined || selectedAppData.authentication === null) {
+ setAuthenticationType({
+ type: "",
+ })
+
+ selectedAppData.authentication = {
+ type: "",
+ required: false,
+ }
+ } else {
+ setAuthenticationType(
+ selectedAppData.authentication.type === "oauth2-app" || (selectedAppData.authentication.type === "oauth2" && selectedAppData.authentication.redirect_uri !== undefined && selectedAppData.authentication.redirect_uri !== null) ? {
+ type: selectedAppData.authentication.type,
+ redirect_uri: selectedAppData.authentication.redirect_uri,
+ refresh_uri: selectedAppData.authentication.refresh_uri,
+ token_uri: selectedAppData.authentication.token_uri,
+ scope: selectedAppData.authentication.scope,
+ client_id: selectedAppData.authentication.client_id,
+ client_secret: selectedAppData.authentication.client_secret,
+ grant_type: selectedAppData.authentication.grant_type,
+ } : {
+ type: "",
+ }
+ )
+ }
+ }
+
+ function Heading(props) {
+ const element = React.createElement(
+ `h${props.level}`,
+ { style: { marginTop: 40 } },
+ props.children
+ );
+ return (
+ {
- const newUrl = e.target.value;
+ const newUrl = e.target.value
setActionUrl(newUrl);
const params = extractParamsFromText(newUrl);
setRequestParams(params);
-
+
+
if (newUrl.startsWith("http://") || newUrl.startsWith("https://")) {
try {
const url = new URL(newUrl);
@@ -2235,9 +2255,12 @@ const Action = memo((
setPath(newPath);
} catch (error) {
- console.error("Invalid URL:", error);
+ console.error("Invalid URL:", newUrl, error);
+ toast("The URL is not a valid one. Please check and try again.")
}
- }
+ } else {
+ //toast("The URL needs to start with http:// or https://")
+ }
}}
/>
@@ -2259,6 +2282,13 @@ const Action = memo((
}}
disabled={disableExecuteButton}
onClick={() => {
+ /*
+ if (!firstSendDone) {
+ setFirstSendDone(true)
+ setCurTab(2)
+ }
+ */
+
if (actionUrl.length === 0) {
toast.error("URL cannot be empty");
return;
diff --git a/frontend/src/components/AppAuthTab.jsx b/frontend/src/components/AppAuthTab.jsx
new file mode 100644
index 00000000..43fa1c0f
--- /dev/null
+++ b/frontend/src/components/AppAuthTab.jsx
@@ -0,0 +1,2656 @@
+import React, { memo, useContext, useEffect, useState } from 'react';
+import {
+ Edit as EditIcon,
+ SelectAll as SelectAllIcon,
+ Delete as DeleteIcon,
+ CheckCircle as CheckCircleIcon,
+ Cancel as CancelIcon,
+ Search as SearchIcon,
+ Clear as ClearIcon,
+ DragIndicator as DragIndicatorIcon,
+ Close as CloseIcon,
+ LockOpen as LockOpenIcon,
+} from "@mui/icons-material";
+import { useNavigate } from "react-router-dom";
+import { toast } from "react-toastify";
+import theme from "../theme.jsx";
+import Markdown from "react-markdown";
+import AuthenticationOauth2 from "../components/Oauth2Auth.jsx";
+import { isMobile } from "react-device-detect"
+import PaperComponent from "../components/PaperComponent.jsx";
+import { CodeHandler, Img, OuterLink, } from '../views/Docs.jsx'
+import { v4 as uuidv4} from "uuid";
+
+import {
+ Divider,
+ List,
+ ListItem,
+ ListItemText,
+ IconButton,
+ Tooltip,
+ Chip,
+ Checkbox,
+ Typography,
+ TextField,
+ Button,
+ Dialog,
+ DialogTitle,
+ DialogActions,
+ DialogContent,
+ Select,
+ FormControl,
+ InputLabel,
+ MenuItem,
+ FormControlLabel,
+ InputAdornment,
+ Grid,
+ Zoom,
+ Paper,
+ Skeleton,
+ Link,
+} from "@mui/material";
+
+import algoliasearch from "algoliasearch/lite";
+import {
+ InstantSearch,
+ Configure,
+ connectSearchBox,
+ connectHits,
+ connectHitInsights,
+ RefinementList,
+ ClearRefinements,
+ connectStateResults
+} from "react-instantsearch-dom";
+import aa from "search-insights";
+import { Context } from '../context/ContextApi.jsx';
+
+const searchClient = algoliasearch(
+ "JNSS5CFDZZ",
+ "db08e40265e2941b9a7d8f644b6e5240"
+)
+
+const AppAuthTab = memo((props) => {
+ const { globalUrl, userdata, isCloud, selectedOrganization } = props;
+ const [selectedAuthentication, setSelectedAuthentication] = React.useState({});
+ const [authentication, setAuthentication] = React.useState([]);
+ const [selectedUserModalOpen, setSelectedUserModalOpen] = React.useState(false);
+ const [authenticationFields, setAuthenticationFields] = React.useState([]);
+ const [selectedAuthenticationModalOpen, setSelectedAuthenticationModalOpen] = React.useState(false);
+ const [appAuthenticationGroupEnvironment, setAppAuthenticationGroupEnvironment] = React.useState("");
+ const [environments, setEnvironments] = React.useState([]);
+ const [listItemExpanded, setListItemExpanded] = React.useState(-1);
+ const [appAuthenticationGroupModalOpen, setAppAuthenticationGroupModalOpen] = React.useState(false);
+ const [appAuthenticationGroupId, setAppAuthenticationGroupId] = React.useState("");
+ const [appAuthenticationGroups, setAppAuthenticationGroups] = React.useState([]);
+ const [appAuthenticationGroupName, setAppAuthenticationGroupName] = React.useState("");
+ const [appAuthenticationGroupDescription, setAppAuthenticationGroupDescription] = React.useState("");
+ const [appsForAppAuthGroup, setAppsForAppAuthGroup] = React.useState([]);
+ const [searchQuery, setSearchQuery] = React.useState("");
+ const [showAppModal, setShowAppModal] = useState(false)
+ const [showAuthenticationLoader, setShowAuthenticationLoader] = useState(true)
+ const [showAppAuthGroupLoader, setShowAppAuthGroupLoader] = useState(true)
+ const changeDistribution = (data) => {
+ //changeDistributed(data, !isDistributed)
+ editAuthenticationConfig(data.id, "suborg_distribute")
+ }
+
+ useEffect(() => {
+ getAppAuthentication();
+ getAppAuthenticationGroups();
+ getEnvironments();
+ }, [])
+
+ const getAppAuthentication = () => {
+ fetch(globalUrl + "/api/v1/apps/authentication", {
+ method: "GET",
+ headers: {
+ "Content-Type": "application/json",
+ Accept: "application/json",
+ },
+ credentials: "include",
+ })
+ .then((response) => {
+ if (response.status !== 200) {
+ console.log("Status not 200 for apps :O!");
+ return;
+ }
+
+ return response.json();
+ })
+ .then((responseJson) => {
+ if (responseJson.success === true) {
+ setAuthentication(responseJson.data);
+ setShowAuthenticationLoader(false)
+ } else {
+ toast("Failed getting authentications");
+ }
+ })
+ .catch((error) => {
+ toast(error.toString());
+ });
+ };
+
+ const updateAppAuthentication = (field) => {
+ setSelectedAuthenticationModalOpen(true);
+ setSelectedAuthentication(field);
+ //{selectedAuthentication.fields.map((data, index) => {
+ var newfields = [];
+ for (var key in field.fields) {
+ newfields.push({
+ key: field.fields[key].key,
+ value: "",
+ });
+ }
+ setAuthenticationFields(newfields);
+ };
+ const saveAuthentication = (authentication) => {
+ const data = authentication;
+ const url = globalUrl + "/api/v1/apps/authentication";
+
+ fetch(url, {
+ mode: "cors",
+ method: "PUT",
+ body: JSON.stringify(data),
+ credentials: "include",
+ crossDomain: true,
+ withCredentials: true,
+ headers: {
+ "Content-Type": "application/json; charset=utf-8",
+ },
+ })
+ .then((response) =>
+ response.json().then((responseJson) => {
+ if (responseJson["success"] === false) {
+ // Check if .reason exists
+ if (responseJson.reason !== undefined) {
+ toast("Failed changing authentication: " + responseJson.reason);
+ } else {
+ toast("Failed changing authentication");
+ }
+ } else {
+ getAppAuthentication();
+
+
+ setSelectedAuthentication({});
+ setSelectedAuthenticationModalOpen(false);
+ }
+ })
+ )
+ .catch((error) => {
+ toast("Err: " + error.toString());
+ });
+ };
+
+ const deleteAuthentication = (data) => {
+ toast("Deleting auth " + data.label);
+
+ // Just use this one?
+ const url = globalUrl + "/api/v1/apps/authentication/" + data.id;
+ console.log("URL: ", url);
+ fetch(url, {
+ method: "DELETE",
+ credentials: "include",
+ headers: {
+ "Content-Type": "application/json",
+ },
+ })
+ .then((response) =>
+ response.json().then((responseJson) => {
+ if (responseJson.success === false) {
+ toast("Failed deleting auth");
+ } else {
+ // Need to wait because query in ES is too fast
+ setTimeout(() => {
+ getAppAuthentication();
+ }, 1000);
+ //toast("Successfully deleted authentication!")
+ }
+ })
+ )
+ .catch((error) => {
+ console.log("Error in userdata: ", error);
+ });
+ };
+
+ const editAuthenticationConfig = (id, parentAction) => {
+ const data = {
+ id: id,
+ action: parentAction !== undefined && parentAction !== null ? parentAction : "assign_everywhere",
+ }
+
+ const url = globalUrl + "/api/v1/apps/authentication/" + id + "/config";
+
+ fetch(url, {
+ mode: "cors",
+ method: "POST",
+ body: JSON.stringify(data),
+ credentials: "include",
+ crossDomain: true,
+ withCredentials: true,
+ headers: {
+ "Content-Type": "application/json; charset=utf-8",
+ },
+ })
+ .then((response) =>
+ response.json().then((responseJson) => {
+ if (responseJson["success"] === false) {
+ toast("Failed overwriting appauth");
+ } else {
+ toast("Successfully updated auth!");
+ setSelectedUserModalOpen(false);
+ setTimeout(() => {
+ getAppAuthentication();
+ }, 1000);
+ }
+ })
+ )
+ .catch((error) => {
+ toast("Err: " + error.toString());
+ });
+ };
+
+ const editAuthenticationModal = selectedAuthenticationModalOpen ? (
+
+ ) : null;
+
+ const getEnvironments = () => {
+ fetch(globalUrl + "/api/v1/getenvironments", {
+ method: "GET",
+ headers: {
+ "Content-Type": "application/json",
+ Accept: "application/json",
+ },
+ credentials: "include",
+ })
+ .then((response) => {
+ if (response.status !== 200) {
+ console.log("Status not 200 for apps :O!");
+ return;
+ }
+
+ return response.json();
+ })
+ .then((responseJson) => {
+ setEnvironments(responseJson);
+
+ // Helper info for users in case they have a large queue and don't know about queue flushing
+ if (responseJson !== undefined && responseJson !== null && responseJson.length > 0) {
+ if (responseJson.length === 1 && responseJson[0].Type !== "cloud") {
+ setListItemExpanded(0)
+ }
+
+ for (var i = 0; i < responseJson.length; i++) {
+ const env = responseJson[i];
+
+ // Check if queuesize is too large
+ if (
+ env.queue !== undefined &&
+ env.queue !== null &&
+ env.queue > 100
+ ) {
+ toast(
+ "Queue size for " +
+ env.name +
+ " is very large. We recommend you to reduce it by flushing the queue before continuing.",
+ );
+ break;
+ }
+ }
+ }
+ })
+ .catch((error) => {
+ toast(error.toString());
+ });
+ };
+
+ const getAppAuthenticationGroups = () => {
+ //console.log("DEBUG: Skipping app auth group loading")
+ //return
+
+ fetch(globalUrl + "/api/v1/authentication/group", {
+ method: "GET",
+ headers: {
+ "Content-Type": "application/json",
+ Accept: "application/json",
+ },
+ credentials: "include",
+ })
+ .then((response) => {
+ if (response.status !== 200) {
+ console.log("Status not 200 for apps :O!");
+ return;
+ }
+
+ return response.json();
+ })
+ .then((responseJson) => {
+ if (responseJson.success === true) {
+ setAppAuthenticationGroups(responseJson.data);
+ setShowAppAuthGroupLoader(false)
+ }
+ })
+ .catch((error) => {
+ toast(error.toString());
+ });
+ };
+
+ const deleteAppAuthenticationGroup = (appAuthGroupId) => {
+ const url = `${globalUrl}/api/v1/authentication/group/${appAuthGroupId}`
+ fetch(url, {
+ method: "DELETE",
+ credentials: "include",
+ headers: {
+ "Content-Type": "application/json",
+ },
+ })
+ .then((response) => {
+ if (response.status !== 200) {
+ console.log("Status not 200 for deleting app auth group");
+ }
+
+ return response.json();
+ })
+ .then((responseJson) => {
+ if (responseJson.success === false) {
+ toast("Failed to delete app authentication group");
+ } else {
+ toast("App authentication group deleted")
+ getAppAuthenticationGroups()
+ }
+ })
+ .catch((error) => {
+ toast(error.toString())
+ })
+ }
+
+ const createAppAuthenticationGroup = (name, environment, description, appAuthIds) => {
+ // Makes list of ids into a full-on list of auth, but just with the ID
+ // The backend fills in the rest
+ console.log("INput auth: ", appAuthIds)
+ let app_auths = appAuthIds.map((appAuthId) => {
+ return { id: appAuthId };
+ })
+
+ var parsedAppGroup = {
+ label: name,
+ environment: environment,
+ description: description,
+ app_auths: app_auths
+ }
+
+ if (appAuthenticationGroupId !== undefined && appAuthenticationGroupId !== null && appAuthenticationGroupId !== "") {
+ parsedAppGroup.id = appAuthenticationGroupId
+ }
+
+ fetch(globalUrl + "/api/v1/authentication/group", {
+ method: "POST",
+ headers: {
+ "Content-Type": "application/json",
+ Accept: "application/json",
+ },
+ credentials: "include",
+ body: JSON.stringify(parsedAppGroup),
+ })
+ .then((response) => {
+ if (response.status !== 200) {
+ throw new Error("Failed to create app authentication group");
+ }
+
+ return response.json();
+ })
+ .then((responseJson) => {
+ if (responseJson.success === false) {
+ toast("Failed to create. Please try again, or contact support@shuffler.io")
+ } else {
+ // Close the modal
+ setAppAuthenticationGroupModalOpen(false)
+
+ toast("App authentication group created")
+ getAppAuthenticationGroups()
+ }
+ })
+ .catch((error) => {
+ toast(error.toString());
+ });
+ };
+
+ const handleAppAuthGroupCheckbox = (data) => {
+ //let groupApp = data.app.id
+ var newappauth = appsForAppAuthGroup
+ if (appsForAppAuthGroup.includes(data.app.id)) {
+ newappauth = newappauth.filter((item) => item !== data.app.id)
+ }
+
+ if (appsForAppAuthGroup.includes(data.id)) {
+ // Remove app from app auth group
+ newappauth = newappauth.filter((item) => item !== data.id)
+ setAppsForAppAuthGroup(newappauth)
+ return
+ }
+
+ for (var i = 0; i < authentication.length; i++) {
+ if (authentication[i].id === data.id) {
+ continue
+ }
+
+ if (!appsForAppAuthGroup.includes(authentication[i].id)) {
+ continue
+ }
+
+ if (authentication[i].app.id === data.app.id) {
+ // Remove app from app auth group
+ newappauth = newappauth.filter((item) => item !== authentication[i].id)
+ toast(`App ${data.app.name} is already in this group`)
+ }
+ }
+
+ setAppsForAppAuthGroup(newappauth.concat(data.id))
+ }
+
+ const authenticationView = appAuthenticationGroupModalOpen ?
+ (
+
+
+ {/* (appAuthenticationGroupModalOpen : { */}
+ {appAuthenticationGroupModalOpen && (
+
+ )}
+
+
+
+ ): null
+
+
+
+ const appModal = showAppModal ? (
+
+ ) : null;
+
+ return (
+
+ {appModal}
+
+
+
+
+
+ {/*
+
+
+ App Authentication
+
+
+ Control the authentication options for individual apps.
+
+
+
+ Learn more about App Authentication
+
+
+
+
+ {editAuthenticationModal}
+ {authenticationView}
+ -
+
+
+
+
+ No authentication found.
+
+
+ ):authentication.map((data, index) => {
+ var bgColor = "#212121";
+ if (index % 2 === 0) {
+ bgColor = "#1A1A1A";
+ }
+
+ //console.log("Auth data: ", data)
+ if (data.type === "oauth2") {
+ data.fields = [
+ {
+ key: "url",
+ value: "Secret. Replaced during app execution!",
+ },
+ {
+ key: "client_id",
+ value: "Secret. Replaced during app execution!",
+ },
+ {
+ key: "client_secret",
+ value: "Secret. Replaced during app execution!",
+ },
+ {
+ key: "scope",
+ value: "Secret. Replaced during app execution!",
+ },
+ ];
+ }
+
+ const isDistributed = data.suborg_distributed === true ? true : false;
+ var validIcon = 
+ 
+
+
+
+
+
+ +
+ {
+ setAppAuthenticationGroupId(data.id)
+
+ setAppAuthenticationGroupName(data.label)
+ setAppAuthenticationGroupDescription(data.description)
+
+ setAppsForAppAuthGroup(data.app_auths.map((appAuth) => appAuth.id))
+ setAppAuthenticationGroupEnvironment(data.environment)
+ setAppAuthenticationGroupModalOpen(true)
+ }}
+ >
+
+
+ {
+ deleteAppAuthenticationGroup(data.id)
+ }}
+ >
+
+
+
+ }
+ style={{ display:'table-cell', verticalAlign: 'middle' }}
+ />
+
+
+ );
+ }
+ )}
+
+ App Authentication Groups
+ + Disabled until further notice. Makes a workflow run replicate across all relevant authentications in an app auth group. Useful when the EXACT same workflow is supposed to run many times from one single input. {" "} + + Learn more about App Authentication Groups + + + ++ +
+
+ }
+ style={{ display:'table-cell', verticalAlign: 'middle' }}
+ />
+ -
+
+
+ No authentication groups found.
+
+
+ ): appAuthenticationGroups.map((data, index) => {
+ var bgColor = "#212121";
+ if (index % 2 === 0) {
+ bgColor = "#1A1A1A";
+ }
+
+ if (data.app_auths === undefined || data.app_auths === null) {
+ data.app_auths = []
+ }
+
+ return (
+
+
+
+
+
+
+
+ What is app authentication?
+
+
+ These are required fields for authenticating with {selectedApp.name}
+
+ Label for you to remember
+ {
+ authenticationOption.label = event.target.value;
+ }}
+ />
+
+
+
+
+
+
+ );
+ };
+
+ const authenticationModal = authenticationModalOpen ? (
+
+) : null;
+
+ return (
+
+ Authentication for {selectedApp.name.replaceAll("_", " ", -1)}
+
+
+ {
+ authenticationOption.fields[data.name] =
+ event.target.value;
+ }}
+ />
+ )}
+
+ );
+ })}
+
+ {authenticationModal}
+ {hits.length === 0 && searchQuery.length >= 0 ? (
+
+
+ )}
+
+ );
+
+};
+
+const CustomSearchBox = connectSearchBox(SearchBox);
+const CustomHits = connectHits(Hits);
diff --git a/frontend/src/components/AppFramework.jsx b/frontend/src/components/AppFramework.jsx
index c65cf1cf..d6fc1f42 100644
--- a/frontend/src/components/AppFramework.jsx
+++ b/frontend/src/components/AppFramework.jsx
@@ -198,7 +198,7 @@ export const findSpecificApp = (framework, inputcategory) => {
id: "",
}
} else {
- console.log("findSpecificApp: unknown category: ", category)
+ //console.log("findSpecificApp: unknown category: ", category)
}
return null
diff --git a/frontend/src/components/AppGrid.jsx b/frontend/src/components/AppGrid.jsx
index b0577937..8a5d9a18 100644
--- a/frontend/src/components/AppGrid.jsx
+++ b/frontend/src/components/AppGrid.jsx
@@ -116,7 +116,7 @@ const AppGrid = (props) => {
})
.then((response) => response.json())
.then((response) => {
- if (response.success === true) {
+ if (response?.success === true) {
setFormMessage(response.reason);
//toast("Thanks for submitting!")
} else {
@@ -307,7 +307,7 @@ const AppGrid = (props) => {
})
.then(response => response.json())
.then(responseJson => {
- if (responseJson.success) {
+ if (responseJson?.success) {
setUserdata(responseJson);
setAllActivatedAppIds(responseJson.active_apps)
setIsLoggedIn(true);
@@ -350,7 +350,7 @@ const AppGrid = (props) => {
})
.then((response) => response.json())
.then((responseJson) => {
- if (responseJson.success === false) {
+ if (responseJson?.success === false) {
toast.error(responseJson.reason);
} else {
//toast.success(`App ${type}d Successfully!`);
@@ -414,11 +414,15 @@ const AppGrid = (props) => {
scrollbarColor: "#494949 #2f2f2f",
}}
>
- {hits.map((data, index) => {
+ {hits?.map((data, index) => {
const appUrl =
- isCloud
- ? `/apps/${data.objectID}?queryID=${data.__queryID}`
- : `https://shuffler.io/apps/${data.objectID}?queryID=${data.__queryID}`;
+ isCloud === true ?
+ `/apps/${data.objectID}`
+ : `apps/${data.objectID}`;
+
+ if (data.name === "" && data.id === "") {
+ return null
+ }
return (
+
+ No Apps Found
+
+
+ ) : (
+
+ {hits.map((data, index) => {
+ const appUrl = isCloud
+ ? `/apps/${data.objectID}?queryID=${data.__queryID}`
+ : `https://shuffler.io/apps/${data.objectID}?queryID=${data.__queryID}`;
+
+ return (
+
+
+
+ setMouseHoverIndex(index)}
+ onMouseLeave={() => setMouseHoverIndex(-1)}
+ >
+
+
+
+
+
+ );
+ })}
+
+
{data.tags &&
- data.tags.map((tag, tagIndex) => (
+ data?.tags?.map((tag, tagIndex) => (
{normalizedString(tag)}
{tagIndex < data.tags.length - 1 ? ", " : ""}
@@ -756,7 +760,7 @@ const AppGrid = (props) => {
};
const transformRefinementListItems = items =>
- items.map(item => ({
+ items?.map(item => ({
...item,
label: item.label === 'true' ? 'App Editor' : 'Python',
}));
@@ -1099,7 +1103,7 @@ const AppGrid = (props) => {
}
});
- const categoryArray = Object.keys(categoryCountMap).map((category) => ({
+ const categoryArray = Object.keys(categoryCountMap)?.map((category) => ({
category,
count: categoryCountMap[category],
}));
@@ -1165,7 +1169,7 @@ const AppGrid = (props) => {
{!isLoading && (
- {topCategories.map((data, index) => (
+ {topCategories?.map((data, index) => (
{
- const { globalUrl, userdata, serverside, orgId, isSelectedDataStore } = props;
+ const { globalUrl, userdata, serverside, orgId, isSelectedDataStore, selectedOrganization } = props;
const [orgCache, setOrgCache] = React.useState("");
const [listCache, setListCache] = React.useState([]);
const [addCache, setAddCache] = React.useState("");
@@ -82,14 +91,43 @@ const CacheView = memo((props) => {
const [editCache, setEditCache] = React.useState(false);
const [cachedLoaded, setCachedLoaded] = React.useState(false);
const [show, setShow] = useState({});
- useEffect(() => {
- if(orgId?.length >0){
- listOrgCache(orgId);
- }
- }, [orgId]);
+ const [showDistributionPopup, setShowDistributionPopup] = useState(false);
+ const [selectedSubOrg, setSelectedSubOrg] = useState([]);
+ const [selectedCacheKey, setSelectedCacheKey] = useState("");
- const listOrgCache = (orgId) => {
- fetch(globalUrl + `/api/v1/orgs/${orgId}/list_cache`, {
+ // Direct category migration from ../components/Files.jsx
+ const [selectAllChecked, setSelectAllChecked] = React.useState(false)
+ const [renderTextBox, setRenderTextBox] = React.useState(false);
+ const [fileCategories, setFileCategories] = React.useState(["default"]);
+ const [selectedCategory, setSelectedCategory] = React.useState("default");
+ const [selectedFileId, setSelectedFileId] = React.useState("");
+ const [updateToThisCategory, setUpdateToThisCategory] = useState("")
+ const [showFileCategoryPopup, setShowFileCategoryPopup] = React.useState(false);
+ const [selectedFiles, setSelectedFiles] = useState([]);
+
+ useEffect(() => {
+ if (orgId?.length > 0) {
+ listOrgCache(orgId, selectedCategory)
+ }
+ }, [orgId])
+
+ const handleKeyDown = (event) => {
+ if (event.key === 'Enter') {
+ fileCategories.push(event.target.value);
+ setSelectedCategory(event.target.value);
+ setRenderTextBox(false);
+ }
+
+ if (event.key === 'Escape'){ // not working for some reasons
+ console.log('escape pressed')
+ setRenderTextBox(false);
+ }
+ }
+
+
+ const listOrgCache = (orgId, category) => {
+ const url = `${globalUrl}/api/v1/orgs/${orgId}/list_cache${category !== undefined ? `?category=${category.replaceAll(" ", "_")}` : ""}`
+ fetch(url, {
method: "GET",
headers: {
"Content-Type": "application/json",
@@ -109,6 +147,19 @@ const CacheView = memo((props) => {
if (responseJson.success === true) {
setListCache(responseJson.keys);
setCachedLoaded(true);
+
+ if (fileCategories.length === 1 && fileCategories[0] === "default") {
+ var newcategories = ["default"]
+ for (var key in responseJson.keys) {
+ if (responseJson.keys[key].category !== undefined && responseJson.keys[key].category !== null && responseJson.keys[key].category !== "" && !fileCategories.includes(responseJson.keys[key].category)) {
+ newcategories.push(responseJson.keys[key].category);
+ }
+ }
+
+ console.log("CATEGORIES: ", newcategories)
+
+ setFileCategories(newcategories)
+ }
}
if (responseJson.cursor !== undefined && responseJson.cursor !== null && responseJson.cursor !== "") {
@@ -122,15 +173,12 @@ const CacheView = memo((props) => {
const deleteCache = (orgId, key) => {
- //toast("Attempting to delete Cache");
-
- // method: "DELETE",
const method = "POST"
- //const url = `${globalUrl}/api/v1/orgs/${orgId}/cache/${key}`
const url = `${globalUrl}/api/v1/orgs/${orgId}/delete_cache`
const parsed = {
"org_id": orgId,
"key": key,
+ "category": selectedCategory === "" || selectedCategory === "default" ? "" : selectedCategory,
}
fetch(url, {
@@ -145,7 +193,7 @@ const CacheView = memo((props) => {
if (response.status === 200) {
toast("Successfully deleted Cache");
setTimeout(() => {
- listOrgCache(orgId);
+ listOrgCache(orgId, selectedCategory)
}, 1000);
} else {
toast("Failed deleting Cache. Does it still exist?");
@@ -157,7 +205,12 @@ const CacheView = memo((props) => {
};
const editOrgCache = (orgId) => {
- const cache = { key: dataValue.key , value: value };
+ const cache = {
+ key: dataValue.key,
+ value: value,
+ category: selectedCategory,
+ }
+
setCacheInput([cache]);
fetch(globalUrl + `/api/v1/orgs/${orgId}/set_cache`, {
@@ -181,7 +234,7 @@ const CacheView = memo((props) => {
.then((responseJson) => {
setAddCache(responseJson);
toast("Cache Edited Successfully!");
- listOrgCache(orgId);
+ listOrgCache(orgId, selectedCategory);
setModalOpen(false);
})
.catch((error) => {
@@ -190,9 +243,13 @@ const CacheView = memo((props) => {
};
const addOrgCache = (orgId) => {
- const cache = { key: key, value: value };
+ const cache = {
+ key: key,
+ value: value,
+ category: selectedCategory,
+ }
+
setCacheInput([cache]);
- console.log("cache input:", cacheInput)
fetch(globalUrl + `/api/v1/orgs/${orgId}/set_cache`, {
@@ -214,8 +271,8 @@ const CacheView = memo((props) => {
})
.then((responseJson) => {
setAddCache(responseJson);
- toast("New Cache Added Successfully!");
- listOrgCache(orgId);
+ toast("New key added Successfully!");
+ listOrgCache(orgId, selectedCategory);
setModalOpen(false);
})
.catch((error) => {
@@ -233,7 +290,9 @@ const CacheView = memo((props) => {
setValue(JSON.stringify(parsedjson, null, 2))
} catch (e) {
console.log("Error parsing JSON: ", e)
- //return JSON.stringify(inputvalue);
+ toast.info("Invalid JSON.", {
+ autoClose: 1500,
+ })
}
}
@@ -296,13 +355,14 @@ const CacheView = memo((props) => {
>
- { editCache ? "Edit Cache" : "Add Cache" }
+ { editCache ? "Edit Key" : "Add Key"}{selectedCategory === "" || selectedCategory === "default" ? "" : ` in category '${selectedCategory}'`}
- {topTags && topTags.length > 0 && topTags.map((data, index) => (
+ {topTags && topTags.length > 0 && topTags?.map((data, index) => (
)}
-
+ {isCloud ? (
+
@@ -2545,6 +2546,7 @@ const Billing = memo((props) => {
+ ): null}
Key
{
autoFixJson(value)
}}
>
-
@@ -368,6 +428,7 @@ const CacheView = memo((props) => {
style={{ borderRadius: "2px", fontSize: 16, color: "#ff8544", textTransform:"none" }}
onClick={() => {
setModalOpen(false)
+ setKey("")
setValue("")
setDataValue({})
}}
@@ -379,8 +440,12 @@ const CacheView = memo((props) => {
variant="contained"
style={{ borderRadius: "2px", backgroundColor: "#ff8544",color: "#1a1a1a", textTransform:"none" }}
onClick={() => {
+ if (value === "") {
+ toast("Key or Value can not be empty");
+ return;
+ }
{editCache ? editOrgCache(orgId) : addOrgCache(orgId)}
-
+ setKey("")
setValue("")
setDataValue({})
}}
@@ -392,13 +457,182 @@ const CacheView = memo((props) => {
);
+ const handleSelectSubOrg = (id, action) => {
+ if (action === "all") {
+ const childOrgs = userdata.orgs.filter(
+ (data) => data.creator_org === userdata.active_org.id
+ );
+ setSelectedSubOrg((prev) => {
+ if (prev.length === childOrgs.length) {
+ // If all child orgs are already selected, clear the selection
+ return [];
+ } else {
+ // Otherwise, select all child org IDs
+ return childOrgs.map((data) => data.id);
+ }
+ });
+ } else if (action === "none") {
+ setSelectedSubOrg([]);
+ } else {
+ setSelectedSubOrg((prev) => {
+ if (prev.includes(id)) {
+ return prev.filter((data) => data !== id);
+ } else {
+ return [...prev, id];
+ }
+ });
+ }
+ };
+
+ const changeDistribution = (id, selectedSubOrg) => {
+
+ editFileConfig(id, [...new Set(selectedSubOrg)], selectedCategory)
+ }
+
+
+ const editFileConfig = (id, selectedSubOrg, category) => {
+ const data = {
+ Key: id,
+ action: "suborg_distribute",
+ selected_suborgs: selectedSubOrg,
+ category: category === undefined || category === "" || category === "default" ? "" : category,
+ }
+
+ console.log("data: ", data);
+
+ const url = `${globalUrl}/api/v1/orgs/${orgId}/cache/config`;
+
+ fetch(url, {
+ mode: "cors",
+ method: "POST",
+ body: JSON.stringify(data),
+ credentials: "include",
+ crossDomain: true,
+ withCredentials: true,
+ headers: {
+ "Content-Type": "application/json; charset=utf-8",
+ },
+ })
+ .then((response) =>
+ response.json().then((responseJson) => {
+ if (responseJson["success"] === false) {
+ toast("Failed overwriting datastore");
+ } else {
+ toast("Successfully updated datastore!");
+ setTimeout(() => {
+ listOrgCache(orgId, selectedCategory);
+ setShowDistributionPopup(false);
+ }, 1000);
+ }
+ })
+ )
+ .catch((error) => {
+ toast("Err: " + error.toString());
+ });
+ };
+
+
+ const cacheDistributionModal = showDistributionPopup ? (
+
+ ) : null;
+
return (
{modalView}
+ {cacheDistributionModal}
-
You can store anything from lists of IPs to complex configurations. { setValue("") }} > - Add Cache + Add Key + + {fileCategories !== undefined && + fileCategories !== null && + fileCategories.length > 1 ? ( +
+
+
+
+ ) : null}
+
+ {
overflowX: "auto",
}}>
- {["Key", "Value", "Actions", "Updated"].map((header, index) => (
+ {["Key", "Value", "Actions", "Updated", "Distribution"].map((header, index) => (
{
backgroundColor: "#212121",
}}
>
- {Array(4)
+ {Array(5)
.fill()
.map((_, colIndex) => (
{
))
: listCache?.length === 0 ? (
-
- No Keys Found
-
+
+ {Array(5).fill().map((_, index) => (
+
+
): listCache?.map((data, index) => {
+ var category = selectedCategory
+ if (selectedCategory === "default") {
+ category = ""
+ }
+
+ if (data?.category === undefined && category === "") {
+ } else if (data?.category !== category) {
+ return null
+ }
+
var bgColor = isSelectedDataStore? "#212121":"#27292d";
if (index % 2 === 0) {
bgColor = isSelectedDataStore? "#1A1A1A":"#1f2023";
}
const validate = validateJson(data.value);
+ const isDistributed = data?.suborg_distribution?.length > 0 ? true : false;
return (
{
display: "table-cell",
overflow: "hidden",
verticalAlign: "middle",
- padding: "8px 8px 8px 15px"
+ padding: "8px 8px 8px 15px",
+ maxWidth: 200,
+ overflowX: "auto",
}}
primary={data.key}
/>
@@ -576,13 +1000,14 @@ const CacheView = memo((props) => {
primary={(
{
setEditCache(true)
setDataValue({
@@ -598,14 +1023,14 @@ const CacheView = memo((props) => {
{
window.open(`${globalUrl}/api/v1/orgs/${orgId}/cache/${data.key}?type=text&authorization=${data.public_authorization}`, "_blank");
}}
@@ -616,18 +1041,40 @@ const CacheView = memo((props) => {
{
deleteCache(orgId, data.key);
//deleteFile(orgId);
}}
>
-
+
@@ -642,6 +1089,49 @@ const CacheView = memo((props) => {
}}
primary={new Date(data.edited * 1000).toISOString()}
/>
+ {selectedOrganization.id !== undefined && data?.org_id !== selectedOrganization.id ?
+
+
+ {
+ setShowDistributionPopup(true)
+ if(data?.suborg_distribution?.length > 0){
+ setSelectedSubOrg(data.suborg_distribution)
+ }else{
+ setSelectedSubOrg([])
+ }
+ setSelectedCacheKey(data.key)
+ }}
+ />
+
+ }
+ style={{display: "table-cell", textAlign: 'center', verticalAlign: 'middle', }}
+ />
+ }
);
})}
@@ -653,4 +1143,4 @@ const CacheView = memo((props) => {
);
});
-export default memo(CacheView);
+export default memo(CacheView);
diff --git a/frontend/src/components/CloudSyncTab.jsx b/frontend/src/components/CloudSyncTab.jsx
new file mode 100644
index 00000000..08926570
--- /dev/null
+++ b/frontend/src/components/CloudSyncTab.jsx
@@ -0,0 +1,780 @@
+import React, { useEffect, useState, useContext } from "react";
+import {
+ FormControl,
+ Card,
+ Tooltip,
+ Typography,
+ TextField,
+ Button,
+ Grid,
+ ListItem,
+ ListItemText,
+ ListItemAvatar,
+ IconButton,
+ Avatar,
+ Zoom,
+ InputAdornment,
+ Switch,
+ Skeleton
+} from "@mui/material";
+import { ToastContainer, toast } from "react-toastify";
+import {
+ Edit as EditIcon,
+ Polyline as PolylineIcon,
+ CheckCircle as CheckCircleIcon,
+ Close as CloseIcon,
+ Visibility as VisibilityIcon,
+ VisibilityOff as VisibilityOffIcon,
+} from "@mui/icons-material";
+import theme from "../theme.jsx";
+import { styled } from '@mui/styles';
+import { Context } from "../context/ContextApi.jsx";
+
+const CloudSyncTab = (props) => {
+ const {
+ userdata,
+ globalUrl,
+ serverside
+ } = props;
+ const [cloudSyncApikey, setCloudSyncApikey] = useState("");
+ const [loading, setLoading] = useState(false);
+ const [showApiKey, setShowApiKey] = useState(false);
+ const [orgSyncResponse, setOrgSyncResponse] = React.useState("");
+ const [organizationFeatures, setOrganizationFeatures] = React.useState({});
+ const [selectedOrganization, setSelectedOrganization] = React.useState({});
+ const [selectedStatus, setSelectedStatus] = React.useState([]);
+ const [orgRequest, setOrgRequest] = React.useState(true);
+ const [userSettings, setUserSettings] = React.useState({});
+ const [, forceUpdate] = React.useState();
+ const itemColor = "white";
+ const isCloud = window?.location?.host === "localhost:3002" || window?.location?.host === "shuffler.io";
+ useEffect(() => { getSettings(); }, []);
+ const GridItem = (props) => {
+ const [expanded, setExpanded] = React.useState(false);
+ const [showEdit, setShowEdit] = React.useState(false);
+ const [newValue, setNewValue] = React.useState(-100);
+
+ const primary = props.data.primary;
+ const secondary = props.data.secondary;
+ const primaryIcon = props.data.icon;
+ const secondaryIcon = props.data.active ?
+
+
+ );
+ };
+ const handleGetOrg = (orgId) => {
+
+ if (serverside !== true && window.location.search !== undefined && window.location.search !== null) {
+ const urlSearchParams = new URLSearchParams(window.location.search);
+ const params = Object.fromEntries(urlSearchParams.entries());
+ const foundorgid = params["org_id"];
+ if (foundorgid !== undefined && foundorgid !== null) {
+ orgId = foundorgid;
+ }
+ }
+
+ if (orgId.length === 0) {
+ toast("Organization ID not defined. Please contact us on https://shuffler.io if this persists logout.");
+ return;
+ }
+
+ // Just use this one?
+
+ fetch(`${globalUrl}/api/v1/orgs/${orgId}`, {
+ method: "GET",
+ credentials: "include",
+ headers: {
+ "Content-Type": "application/json",
+ },
+ })
+ .then((response) => {
+ if (response.status === 401) {
+ }
+
+ return response.json();
+ })
+ .then((responseJson) => {
+ if (responseJson["success"] === false) {
+ toast("Failed getting your org. If this persists, please contact support.");
+ } else {
+ if (
+ responseJson.sync_features === undefined ||
+ responseJson.sync_features === null
+ ) {
+ responseJson.sync_features = {};
+ }
+
+ setSelectedOrganization(responseJson)
+ var lists = {
+ active: {
+ triggers: [],
+ features: [],
+ sync: [],
+ },
+ inactive: {
+ triggers: [],
+ features: [],
+ sync: [],
+ },
+ };
+ setOrganizationFeatures(lists);
+ }
+ })
+ .catch((error) => {
+ console.log("Error getting org: ", error);
+ toast("Error getting current organization");
+ });
+ };
+ const handleStopOrgSync = (org_id) => {
+ if (org_id === undefined || org_id === null) {
+ toast("Couldn't get org " + org_id);
+ return;
+ }
+
+ const data = {};
+
+ const url = globalUrl + "/api/v1/orgs/" + org_id + "/stop_sync";
+ fetch(url, {
+ mode: "cors",
+ method: "POST",
+ body: JSON.stringify(data),
+ credentials: "include",
+ crossDomain: true,
+ withCredentials: true,
+ headers: {
+ "Content-Type": "application/json; charset=utf-8",
+ },
+ })
+ .then((response) => {
+ if (response.status === 200) {
+ console.log("Cloud sync success?");
+ toast("Successfully stopped cloud sync");
+ } else {
+ console.log("Cloud sync fail?");
+ toast(
+ "Failed stopping sync. Try again, and contact support if this persists."
+ );
+ }
+
+ return response.json();
+ })
+ .then((responseJson) => {
+ setTimeout(() => {
+ handleGetOrg(org_id);
+ }, 1000);
+ })
+ .catch((error) => {
+ toast("Err: " + error.toString());
+ });
+ };
+
+ const enableCloudSync = (apikey, organization, disableSync) => {
+ setOrgSyncResponse("");
+
+ const data = {
+ apikey: apikey,
+ organization: organization,
+ disable: disableSync,
+ };
+
+ const url = globalUrl + "/api/v1/cloud/setup";
+ fetch(url, {
+ mode: "cors",
+ method: "POST",
+ body: JSON.stringify(data),
+ credentials: "include",
+ crossDomain: true,
+ withCredentials: true,
+ headers: {
+ "Content-Type": "application/json; charset=utf-8",
+ },
+ })
+ .then((response) => {
+ setLoading(false);
+ if (response.status === 200) {
+ console.log("Cloud sync success?");
+ } else {
+ console.log("Cloud sync fail?");
+ }
+
+ return response.json();
+ //setTimeout(() => {
+ //}, 1000)
+ })
+ .then((responseJson) => {
+ console.log("RESP: ", responseJson);
+ if (
+ responseJson.success === false &&
+ responseJson.reason !== undefined
+ ) {
+ setOrgSyncResponse(responseJson.reason);
+ toast("Failed to handle sync: " + responseJson.reason);
+ } else if (!responseJson.success) {
+ toast("Failed to handle sync.");
+ } else {
+ //getOrgs(); API no longer in use, as it's in handleInfo request
+ if (disableSync) {
+ toast("Successfully disabled sync!");
+ setOrgSyncResponse("Successfully disabled syncronization");
+ } else {
+ toast("Cloud Syncronization successfully set up!");
+ setOrgSyncResponse(
+ "Successfully started syncronization. Cloud features you now have access to can be seen below."
+ );
+ }
+
+ selectedOrganization.cloud_sync = !selectedOrganization.cloud_sync;
+ setSelectedOrganization(selectedOrganization);
+ setCloudSyncApikey("");
+
+ handleGetOrg(userdata.active_org.id);
+ }
+ })
+ .catch((error) => {
+ setLoading(false);
+ toast("Err: " + error.toString());
+ });
+ };
+ const getSettings = () => {
+ fetch(globalUrl + "/api/v1/getsettings", {
+ method: "GET",
+ headers: {
+ "Content-Type": "application/json",
+ Accept: "application/json",
+ },
+ credentials: "include",
+ })
+ .then((response) => {
+ if (response.status !== 200) {
+ console.log("Status not 200 when getting settings :O!");
+ }
+
+ return response.json();
+ })
+ .then((responseJson) => {
+ setUserSettings(responseJson);
+ })
+ .catch((error) => {
+ console.log(error);
+ });
+ };
+ if (
+ selectedOrganization.id === undefined &&
+ userdata !== undefined &&
+ userdata.active_org !== undefined &&
+ orgRequest === true
+ ) {
+ setOrgRequest(false);
+ handleGetOrg(userdata.active_org.id);
+ }
+
+ return (
+
Shuffle Datastore
+Shuffle Datastore {selectedCategory === "" || selectedCategory === "default" ? "" : `- Category '${selectedCategory}'`}
Datastore is a permanent key-value database for storing data that can be used cross-workflow.You can store anything from lists of IPs to complex configurations. { setValue("") }} > - Add Cache + Add Key + + {fileCategories !== undefined && + fileCategories !== null && + fileCategories.length > 1 ? ( +
+ {renderTextBox ?
+
+
+
+ :
+
+
+
+ }
+
+ {renderTextBox && {
+ handleKeyDown(event);
+ if(event.key === 'Enter' && selectedFileId.length > 0){
+ //setShowFileCategoryPopup(true)
+ setUpdateToThisCategory(event.target.value)
+ }
+
+ }}
+ style={{
+ height: 35,
+ width: 200,
+ marginTop: 0,
+ }}
+ InputProps={{
+ style: {
+ color: "white",
+ height: 35,
+ fontSize: 16,
+ borderRadius: 4,
+ paddingTop: 0,
+ },
+ }}
+ color="primary"
+ placeholder="Category name"
+ required
+ margin="dense"
+ defaultValue={""}
+ autoFocus
+ />}
{isSelectedDataStore? null :
+
+ {
+ setExpanded(prev => !prev);
+ if(showEdit){
+ setShowEdit(false)
+ }
+ }}
+ >
+
+ {primaryIcon}
+
+
+ {
+ e.preventDefault();
+ e.stopPropagation();
+ console.log('expanded', expanded)
+ if (expanded){
+ setExpanded(false)
+ }
+ if (showEdit) {
+ setShowEdit(false)
+ return
+ }
+
+ console.log("Edit")
+
+ setShowEdit(true)
+ }}
+ />
+
+ : null}
+ {userdata.support === true ?(
+
+
+ ):(
+
+ {
+ if (!isCloud || userdata.support !== true) {
+ return
+ }
+
+ e.preventDefault();
+ e.stopPropagation();
+
+ enableFeature()
+ }}
+ >
+ {secondaryIcon}
+
+
+ )}
+
+
+ {expanded ?
+ {
+ console.log("Submit")
+ submitEdit(e)
+ }}>
+
+
+ {
+ setNewValue(event.target.value)
+ }}
+ />
+
+
+
+ : null}
+
+
+
+ Usage:
+ {props.data.limit === 0 ? (
+ "Unlimited"
+ ) : (
+
+ {props.data.usage} / {props.data.limit === "" ? "Unlimited" : props.data.limit}
+
+ )}
+
+ {/*
+ Data sharing: {props.data.data_collection}
+ */}
+ Description: {secondary}
+
+ : null}
+
+
+ {showEdit ?
+
+
+ Features and Limitations that are currently available to you in your Cloud or Hybrid Organization. App Executions (App Runs) reset monthly. If the organization is a customer or in a trial, these features limitations are not always enforced.
+
+
+ {selectedOrganization.sync_features === undefined ||
+ selectedOrganization.sync_features === null
+ ?
+ {[...Array(18)].map((_, i) => (
+
+
+ ))}
+
+ : Object.keys(selectedOrganization.sync_features).map(function (
+ key,
+ index
+ ) {
+
+ if (key === "schedule" || key === "apps" || key === "updates" || key === "editing") {
+ return null;
+ }
+
+ const item = selectedOrganization.sync_features[key];
+ if (item === null) {
+ return null
+ }
+
+ const newkey = key.replaceAll("_", " ");
+ const griditem = {
+ primary: newkey,
+ secondary:
+ item.description === undefined ||
+ item.description === null ||
+ item.description.length === 0
+ ? "Not defined yet"
+ : item.description,
+ limit: item.limit,
+ usage: item.usage === undefined ||
+ item.usage === null ? 0 : item.usage,
+ data_collection: "None",
+ active: item.active,
+ icon:
+
+ );
+ })}
+
+
+ );
+};
+
+export default CloudSyncTab;
diff --git a/frontend/src/components/ConfigureWorkflow.jsx b/frontend/src/components/ConfigureWorkflow.jsx
index ea8af7bd..a6ac8623 100755
--- a/frontend/src/components/ConfigureWorkflow.jsx
+++ b/frontend/src/components/ConfigureWorkflow.jsx
@@ -799,12 +799,16 @@ const ConfigureWorkflow = (props) => {
>
+
+
+ {isCloud ? (
+ + Cloud syncronization +
+ + What does cloud sync do? Cloud synchronization is a way of getting more out of Shuffle. Shuffle will ALWAYS make every option open source, but features relying on other users can't be done without a collaborative approach. + +
+
+ ) : (
+
+
+ Currently syncronizing:{" "}
+ {selectedOrganization.cloud_sync_active === true
+ ? True
+ : False}
+
+ {selectedOrganization.cloud_sync_active ? (
+
+ Syncronization interval:{" "}
+ {selectedOrganization.sync_config.interval === 0
+ ? "60"
+ : selectedOrganization.sync_config.interval}
+
+ ) : null}
+
+ Your Api key
+
+ {userSettings?.apikey === undefined || userSettings?.apikey === null || userSettings?.apikey?.length <=0 ? (
+
+
+
+ {
+ setShowApiKey(!showApiKey)
+ }}
+ >
+ {showApiKey ?
+
+ )
+ }}
+ required
+ fullWidth={true}
+ disabled={true}
+ autoComplete="cloud apikey"
+ id="apikey_field"
+ margin="normal"
+ placeholder="Cloud Apikey"
+ variant="outlined"
+ value={userSettings?.apikey}
+ defaultValue={userSettings?.apikey}
+ type={!isCloud || showApiKey ? "text" : "password"}
+ />
+ {selectedOrganization.cloud_sync_active ? (
+
+ ) : null}
+
}
+
+
+ Message from Shuffle Cloud: {orgSyncResponse}
+
+ ) : null}
+
+ )}
+
+
+ {
+ setCloudSyncApikey(event.target.value);
+ }}
+ />
+
+
+ {orgSyncResponse.length > 0 ? (
+ + Features +
+
+
+ {
+ if (filled) {
+ return
+ }
+
setOpened(!opened);
// Scroll to it
@@ -865,6 +869,7 @@ const ConfigureWorkflow = (props) => {
isLoggedIn={true}
getAppAuthentication={undefined}
+ workflow={workflow}
setFinalized={setFinalized}
/>
@@ -1377,7 +1382,7 @@ const ConfigureWorkflow = (props) => {
return (
-
+
diff --git a/frontend/src/components/EnvironmentTab.jsx b/frontend/src/components/EnvironmentTab.jsx
new file mode 100644
index 00000000..cd0a9416
--- /dev/null
+++ b/frontend/src/components/EnvironmentTab.jsx
@@ -0,0 +1,1677 @@
+import React, { memo, useContext, useEffect, useState } from 'react';
+import theme from "../theme.jsx";
+import {
+ Tooltip,
+ Typography,
+ Switch,
+ TextField,
+ Button,
+ ButtonGroup,
+ List,
+ ListItem,
+ ListItemText,
+ IconButton,
+ Dialog,
+ DialogTitle,
+ DialogActions,
+ DialogContent,
+ Checkbox,
+ Divider,
+ Tab,
+ Tabs,
+ Collapse,
+ Skeleton,
+ Grid,
+ Chip,
+ MenuItem,
+} from "@mui/material";
+import { CopyToClipboard } from "../views/Docs.jsx"
+import {
+ FileCopy as FileCopyIcon,
+ CheckCircle as CheckCircleIcon,
+ Cached as CachedIcon,
+ Cloud as CloudIcon,
+ Cancel as CancelIcon,
+ Help as HelpIcon,
+ ExpandLess as ExpandLessIcon,
+ ExpandMore as ExpandMoreIcon,
+} from "@mui/icons-material";
+import { toast } from 'react-toastify';
+import { Context } from '../context/ContextApi.jsx';
+import { green, red } from '../views/AngularWorkflow.jsx'
+import AppSearch from "../components/AppSearch1.jsx";
+
+const EnvironmentTab = memo((props) => {
+ const { globalUrl, isCloud, userdata, selectedOrganization } = props;
+ const [environments, setEnvironments] = React.useState([]);
+ const [showArchived, setShowArchived] = React.useState(false);
+ const [modalUser, setModalUser] = React.useState({});
+ const [loginInfo, setLoginInfo] = React.useState("");
+ const [modalOpen, setModalOpen] = React.useState(false);
+ const [showLoader, setShowLoader] = useState(true)
+ const [commandController, setCommandController] = React.useState({
+ pipelines: false,
+ proxies: false,
+ })
+ const [installationTab, setInstallationTab] = React.useState(0);
+ const [isExpanded, setIsExpanded] = React.useState(false);
+ const [listItemExpanded, setListItemExpanded] = React.useState(-1);
+ const [, setUpdate] = React.useState(0);
+ const [showDistributionPopup, setShowDistributionPopup] = React.useState(false);
+ const [selectedEnvironment, setSelectedEnvironment] = React.useState(null);
+ const [selectedSubOrg, setSelectedSubOrg] = React.useState([]);
+ const [showLocationActionModal, setShowLocationActionModal] = React.useState(undefined)
+
+
+ useEffect(() => {
+ getEnvironments();
+ setModalUser({});
+ }, []);
+
+ const changeModalData = (field, value) => {
+ modalUser[field] = value;
+ };
+
+ // Horrible frontend fix for environments
+ const setDefaultEnvironment = (environment) => {
+ // FIXME - add more checks to this
+ toast("Setting default location to " + environment.Name);
+ var newEnv = [];
+ for (var key in environments) {
+ if (environments[key].id == environment.id) {
+ if (environments[key].archived) {
+ toast("Can't set archived to default");
+ return;
+ }
+
+ environments[key].default = true;
+ } else if (
+ environments[key].default == true &&
+ environments[key].id !== environment.id
+ ) {
+ environments[key].default = false;
+ }
+
+ newEnv.push(environments[key]);
+ }
+
+ // Just use this one?
+ const url = globalUrl + "/api/v1/setenvironments";
+ fetch(url, {
+ method: "PUT",
+ credentials: "include",
+ body: JSON.stringify(newEnv),
+ headers: {
+ "Content-Type": "application/json",
+ },
+ })
+ .then((response) =>
+ response.json().then((responseJson) => {
+ if (responseJson["success"] === false) {
+ toast(responseJson.reason);
+ setTimeout(() => {
+ getEnvironments();
+ }, 1500);
+ } else {
+ setLoginInfo("");
+ setModalOpen(false);
+ setTimeout(() => {
+ getEnvironments();
+ }, 1500);
+ }
+ }),
+ )
+ .catch((error) => {
+ console.log("Error in backend data: ", error);
+ });
+ };
+
+ const rerunCloudWorkflows = (environment) => {
+ toast("Starting execution reruns. This can run in the background.");
+ fetch(`${globalUrl}/api/v1/environments/${environment.id}/rerun`, {
+ method: "GET",
+ credentials: "include",
+ })
+ .then((response) => {
+ if (response.status !== 200) {
+ console.log("Status not 200 for apps :O!");
+ return;
+ } else {
+ toast(response.reason);
+ //toast("Aborted all dangling workflows");
+ }
+
+ return response.json();
+ })
+ .then((responseJson) => {
+ console.log("Got response for execution: ", responseJson);
+ //console.log("RESPONSE: ", responseJson)
+ //setFiles(responseJson)
+ })
+ .catch((error) => {
+ //toast(error.toString())
+ });
+ }
+
+ const getEnvironments = () => {
+ fetch(globalUrl + "/api/v1/getenvironments", {
+ method: "GET",
+ headers: {
+ "Content-Type": "application/json",
+ Accept: "application/json",
+ },
+ credentials: "include",
+ })
+ .then((response) => {
+ if (response.status !== 200) {
+ console.log("Status not 200 for apps :O!");
+ return;
+ }
+
+ return response.json();
+ })
+ .then((responseJson) => {
+ setEnvironments(responseJson);
+ setShowLoader(false)
+ // Helper info for users in case they have a large queue and don't know about queue flushing
+ if (responseJson !== undefined && responseJson !== null && responseJson.length > 0) {
+ if (responseJson.length === 1 && responseJson[0].Type !== "cloud") {
+ setListItemExpanded(0)
+ }
+ for (var i = 0; i < responseJson.length; i++) {
+ const env = responseJson[i];
+
+ // Check if queuesize is too large
+ if (env.queue !== undefined && env.queue !== null && env.queue > 100) {
+ toast("Queue size for " + env.name + " is very large. We recommend you to reduce it by flushing the queue before continuing.");
+ break
+ }
+ }
+ }
+ })
+ .catch((error) => {
+ toast(error.toString());
+ });
+ };
+
+ const flushQueue = (name) => {
+ // Just use this one?
+ const url = globalUrl + "/api/v1/flush_queue";
+ fetch(url, {
+ method: "DELETE",
+ credentials: "include",
+ headers: {
+ "Content-Type": "application/json",
+ },
+ })
+ .then((response) =>
+ response.json().then((responseJson) => {
+ if (responseJson["success"] === false) {
+ toast(responseJson.reason);
+ getEnvironments();
+ } else {
+ setLoginInfo("");
+ setModalOpen(false);
+ getEnvironments();
+ }
+ }),
+ )
+ .catch((error) => {
+ console.log("Error when deleting: ", error);
+ });
+ };
+
+
+ const deleteEnvironment = (environment) => {
+ // FIXME - add some check here ROFL
+ //const name = environment.name
+
+ //toast("Modifying environment " + name)
+ //var newEnv = []
+ //for (var key in environments) {
+ // if (environments[key].Name == name) {
+ // if (environments[key].default) {
+ // toast("Can't modify the default environment")
+ // return
+ // }
+
+ // if (environments[key].type === "cloud" && !environments[key].archived) {
+ // toast("Can't modify cloud environments")
+ // return
+ // }
+
+ // environments[key].archived = !environments[key].archived
+ // }
+
+ // newEnv.push(environments[key])
+ //}
+ const id = environment.id;
+
+ //toast("Modifying environment " + environment.Name)
+ var newEnv = [];
+ for (var key in environments) {
+ if (environments[key].id == id) {
+ if (environments[key].default) {
+ toast("Can't modify the default environment. Change the default environment first.");
+ return;
+ }
+
+ if (environments[key].type === "cloud" && !environments[key].archived) {
+ toast("Can't modify cloud environments");
+ return;
+ }
+
+ environments[key].archived = !environments[key].archived;
+ }
+
+ newEnv.push(environments[key]);
+ }
+
+ // Just use this one?
+ const url = globalUrl + "/api/v1/setenvironments";
+ fetch(url, {
+ method: "PUT",
+ credentials: "include",
+ body: JSON.stringify(newEnv),
+ headers: {
+ "Content-Type": "application/json",
+ },
+ })
+ .then((response) =>
+ response.json().then((responseJson) => {
+ if (responseJson["success"] === false) {
+ toast(responseJson.reason);
+ getEnvironments();
+ } else {
+ setLoginInfo("");
+ setModalOpen(false);
+ getEnvironments();
+ }
+ }),
+ )
+ .catch((error) => {
+ console.log("Error when deleting: ", error);
+ });
+ };
+
+ const abortEnvironmentWorkflows = (environment) => {
+ //console.log("Aborting all workflows started >10 minutes ago, not finished");
+ toast(
+ "Clearing the queue - this may take some time. A new will show up when finished.",
+ );
+
+ fetch(
+ `${globalUrl}/api/v1/environments/${environment.id}/stop?deleteall=true`,
+ {
+ method: "GET",
+ credentials: "include",
+ },
+ )
+ .then((response) => {
+ if (response.status !== 200) {
+ console.log("Status not 200 for apps :O!");
+ toast("Failed aborting dangling workflows");
+ return;
+ } else {
+ toast("Successfully cleared the queue");
+
+ getEnvironments();
+ }
+
+ return response.json();
+ })
+ .then((responseJson) => {
+ console.log("Got response for execution: ", responseJson);
+ //console.log("RESPONSE: ", responseJson)
+ //setFiles(responseJson)
+ })
+ .catch((error) => {
+ //toast(error.toString())
+ });
+ };
+
+ const changeRecommendation = (recommendation, action) => {
+ const data = {
+ action: action,
+ name: recommendation.name,
+ };
+
+ fetch(`${globalUrl}/api/v1/recommendations/modify`, {
+ mode: "cors",
+ method: "POST",
+ body: JSON.stringify(data),
+ credentials: "include",
+ crossDomain: true,
+ withCredentials: true,
+ headers: {
+ "Content-Type": "application/json; charset=utf-8",
+ },
+ })
+ .then((response) => {
+ if (response.status === 200) {
+ } else {
+ }
+
+ return response.json();
+ })
+ .then((responseJson) => {
+ if (responseJson.success === true) {
+ getEnvironments();
+ } else {
+ if (
+ responseJson.success === false &&
+ responseJson.reason !== undefined
+ ) {
+ toast("Failed change recommendation: ", responseJson.reason);
+ } else {
+ toast("Failed change recommendation");
+ }
+ }
+ })
+ .catch((error) => {
+ toast(
+ "Failed dismissing alert. Please contact support@shuffler.io if this persists.",
+ );
+ });
+ };
+
+ const getOrborusCommand = (environment) => {
+ if (environment.Type === "cloud") {
+ //toast("No Orborus necessary for environment cloud. Create and use a different environment to run executions on-premises.",)
+ return
+ }
+
+ if (
+ props.userdata.active_org === undefined ||
+ props.userdata.active_org === null
+ ) {
+ return;
+ }
+
+ const elementName = "copy_element_shuffle";
+ var auth =
+ environment.auth === ""
+ ? "cb5st3d3Z!3X3zaJ*Pc"
+ : environment.auth
+
+ // Escape exclamation marks for copying
+ auth = auth.replace("\\!", "!").replace(/!/g, "\\!")
+
+ const newUrl =
+ globalUrl === "https://shuffler.io"
+ ? "https://shuffle-backend-stbuwivzoq-nw.a.run.app"
+ : globalUrl;
+
+ var skipPipeline = false
+ if (commandController.pipelines === true) {
+ skipPipeline = true
+ }
+
+ var addProxy = false
+ if (commandController.proxies === true) {
+ addProxy = true
+ }
+
+ if (installationTab === 1) {
+ return (`docker run -d \\
+ --restart=always \\
+ --name="shuffle-orborus" \\
+ --pull=always \\
+ --volume "/var/run/docker.sock:/var/run/docker.sock" \\
+ -e AUTH="${auth}" \\
+ -e ENVIRONMENT_NAME="${environment.Name}" \\
+ -e ORG="${environment.org_id}" \\
+ -e SHUFFLE_WORKER_IMAGE="ghcr.io/shuffle/shuffle-worker:latest" \\
+ -e SHUFFLE_SWARM_CONFIG=run \\
+ -e SHUFFLE_LOGS_DISABLED=true \\
+ -e BASE_URL="${newUrl}" \\${addProxy ? `
+ -e HTTPS_PROXY=IP:PORT \\` : ""}${skipPipeline ? `
+ -e SHUFFLE_SKIP_PIPELINES=true \\` : ""}
+ ghcr.io/shuffle/shuffle-orborus:latest
+ `)
+ } else if (installationTab === 2) {
+ return `https://shuffler.io/docs/configuration#kubernetes`
+ }
+
+ const commandData = `docker rm shuffle-orborus --force; \\\ndocker run -d \\
+ --restart=always \\
+ --name="shuffle-orborus" \\
+ --pull=always \\
+ --volume "/var/run/docker.sock:/var/run/docker.sock" \\
+ -e AUTH="${auth}" \\
+ -e ENVIRONMENT_NAME="${environment.Name}" \\
+ -e ORG="${props.userdata.active_org.id}" \\
+ -e BASE_URL="${newUrl}" \\${addProxy ? `
+ -e HTTPS_PROXY=IP:PORT \\` : ""}${skipPipeline ? `
+ -e SHUFFLE_SKIP_PIPELINES=true \\` : ""}
+ ghcr.io/shuffle/shuffle-orborus:latest`
+
+ return commandData
+ };
+
+ const submitEnvironment = (data) => {
+ // FIXME - add some check here ROFL
+ environments.push({
+ name: data.environment,
+ type: "onprem",
+ });
+
+ // Just use this one?
+ var baseurl = globalUrl;
+ const url = baseurl + "/api/v1/setenvironments";
+ fetch(url, {
+ method: "PUT",
+ credentials: "include",
+ body: JSON.stringify(environments),
+ headers: {
+ "Content-Type": "application/json",
+ },
+ })
+ .then((response) =>
+ response.json().then((responseJson) => {
+ if (responseJson["success"] === false) {
+ setLoginInfo("Error in input: " + responseJson.reason);
+ getEnvironments();
+ } else {
+ setLoginInfo("");
+ setModalOpen(false);
+ getEnvironments();
+ }
+ }),
+ )
+ .catch((error) => {
+ console.log("Error in userdata: ", error);
+ });
+ };
+
+ const modalView = (
+
+ );
+
+
+ const textColor = "#9E9E9E !important";
+
+ const handleSelectSubOrg = (id, action) => {
+ if (action === "all") {
+ const childOrgs = userdata.orgs.filter(
+ (data) => data.creator_org === userdata.active_org.id
+ );
+ setSelectedSubOrg((prev) => {
+ if (prev.length === childOrgs.length) {
+ // If all child orgs are already selected, clear the selection
+ return [];
+ } else {
+ // Otherwise, select all child org IDs
+ return childOrgs.map((data) => data.id);
+ }
+ });
+ } else if (action === "none") {
+ setSelectedSubOrg([]);
+ } else {
+ setSelectedSubOrg((prev) => {
+ if (prev.includes(id)) {
+ return prev.filter((data) => data !== id);
+ } else {
+ return [...prev, id];
+ }
+ });
+ }
+ };
+
+ const queueSizeText = (queue) => {
+ if (queue === undefined || queue === null) return 0;
+ if (queue < 0) return 0;
+ if (queue > 1000) return ">1000";
+ return queue;
+ };
+
+ const LocationActionModal = (props) => {
+ const { showLocationActionModal } = props
+
+ const [searchQuery, setSearchQuery] = React.useState("");
+
+ if (showLocationActionModal === undefined || showLocationActionModal === null) {
+ return null
+ }
+
+ if (showLocationActionModal?.open !== true) {
+ return null
+ }
+
+
+
+ return (
+
+ )
+ }
+
+ const editEnvironmentConfig = (id, selectedSubOrg, cacheKey) => {
+ const data = {
+ action: "suborg_distribute",
+ selected_suborgs: selectedSubOrg,
+ }
+
+ const url = `${globalUrl}/api/v1/environments/${id}/config`;
+
+ fetch(url, {
+ mode: "cors",
+ method: "POST",
+ body: JSON.stringify(data),
+ credentials: "include",
+ crossDomain: true,
+ withCredentials: true,
+ headers: {
+ "Content-Type": "application/json; charset=utf-8",
+ },
+ })
+ .then((response) =>
+ response.json().then((responseJson) => {
+ if (responseJson["success"] === false) {
+ toast("Failed overwriting environments");
+ } else {
+ toast("Successfully updated environments!");
+ setTimeout(() => {
+ getEnvironments();
+ setShowDistributionPopup(false);
+ }, 1000);
+ }
+ })
+ )
+ .catch((error) => {
+ toast("Err: " + error.toString());
+ });
+ };
+
+ const changeDistribution = (id, selectedSubOrg) => {
+
+ editEnvironmentConfig(id, [...new Set(selectedSubOrg)])
+ }
+
+ const EnvironmentDistributionModal = showDistributionPopup ? (
+
+ ) : null;
+
+ return (
+
{setConfigureWorkflowModalOpen !== undefined ?
@@ -1387,7 +1392,7 @@ const ConfigureWorkflow = (props) => {
: null
}
-
+
{/*
{
{requiredActions.length > 0 ? (
- Please configure the following steps to help us complete your workflow. This can also be done later.
+ To complete the workflow setup, please configure the following steps.
{setConfigureWorkflowModalOpen !== undefined ?
@@ -1434,6 +1439,13 @@ const ConfigureWorkflow = (props) => {
)
})}
+
+ {/*
+
+ Once done, you may continue to the workflow.
+
+ */}
+
) : null}
diff --git a/frontend/src/components/DetectionExplorer.jsx b/frontend/src/components/DetectionExplorer.jsx
index fed09d26..4b73e0f0 100644
--- a/frontend/src/components/DetectionExplorer.jsx
+++ b/frontend/src/components/DetectionExplorer.jsx
@@ -36,7 +36,8 @@ const handleDirectoryChange = (folderDisabled, setFolderDisabled, globalUrl, isD
}
const action = folderDisabled ? "enable_folder" : "disable_folder";
- const url = `${globalUrl}/api/v1/detections/${action}`;
+ //const url = `${globalUrl}/api/v1/detections/${detectionType}/selected_rules/${action}`;
+ const url = `${globalUrl}/api/v1/detections/sigma/selected_rules/${action}`;
fetch(url, {
method: "PUT",
@@ -258,7 +259,7 @@ const DetectionExplorer = (props) => {
rule.description.toLowerCase().includes(searchQuery.toLowerCase())
)
- const lakeNodes = environmentList !== undefined && environmentList !== null ? environmentList.filter((env) => env?.data_lake?.enabled === true).length : 0
+ const lakeNodes = environmentList !== undefined && environmentList !== null ? environmentList.filter((env) => env?.archived === false && env?.data_lake?.enabled === true).length : 0
return (
@@ -284,7 +285,8 @@ const DetectionExplorer = (props) => {
+ Type
+ {
+ console.log("Data: ", e.target.value)
-
-
+
+
+
+ {
+ innerWorkflow.blogpost = event.target.value
+ setInnerWorkflow(innerWorkflow)
}}
- >
- {showMoreClicked ? {
+ innerWorkflow.video = event.target.value
+ setInnerWorkflow(innerWorkflow)
+ }}
+ InputProps={{
+ style: {
+ color: "white",
+ },
+ }}
+ color="primary"
+ defaultValue={innerWorkflow.video}
+ placeholder="A youtube or loom link to the video"
+ rows="1"
+ label="Video"
+ margin="dense"
+ fullWidth
+ />
-
-
+
+
+
+
+ : null}
- {workflow !== undefined && workflow !== null && workflow.id !== undefined && workflow.id !== null && workflow.id.length > 0 ?
+
+ {/*workflow !== undefined && workflow !== null && workflow.id !== undefined && workflow.id !== null && workflow.id.length > 0 ?
{
- :
+ : */}
- }
+ {/**/}
{detectionInfo?.category === "SIGMA" || detectionInfo?.category === "SIEM" ?
-
+
0 ? green : red}} />
diff --git a/frontend/src/components/DetectionRuleCard.jsx b/frontend/src/components/DetectionRuleCard.jsx
index 986b227f..1a2e9760 100644
--- a/frontend/src/components/DetectionRuleCard.jsx
+++ b/frontend/src/components/DetectionRuleCard.jsx
@@ -137,6 +137,8 @@ const RuleCard = ({ ruleName, description, file_id, globalUrl, folderDisabled, i
setResponseValue(e.target.value)
+ toast.error("The automatic response system is NOT available for you yet. Please contact support@shuffler.io if you want to try this feature.")
+
// FIXME: Handle:
// 1. Get the current cache for the detection
// 2. Create a new mapping for Detection -> Response
@@ -187,7 +189,7 @@ const RuleCard = ({ ruleName, description, file_id, globalUrl, folderDisabled, i
{
Workflows can be built from scratch, or from templates. Usecases can help you discover next steps, and you can search for them directly. Learn more
- {/*
-
- Type
- {
- console.log("Data: ", e.target.value)
-
- innerWorkflow.workflow_type = e.target.value
- setInnerWorkflow(innerWorkflow)
- }}
- >
-
-
-
-
- {
- innerWorkflow.blogpost = event.target.value
- setInnerWorkflow(innerWorkflow)
- }}
- InputProps={{
- style: {
- color: "white",
- },
- }}
- color="primary"
- defaultValue={innerWorkflow.blogpost}
- placeholder="A blogpost or other reference for how this work workflow was built, and what it's for."
- rows="1"
- label="blogpost"
- margin="dense"
- fullWidth
- />
- {
- innerWorkflow.video = event.target.value
- setInnerWorkflow(innerWorkflow)
- }}
- InputProps={{
- style: {
- color: "white",
- },
- }}
- color="primary"
- defaultValue={innerWorkflow.video}
- placeholder="A youtube or loom link to the video"
- rows="1"
- label="Video"
- margin="dense"
- fullWidth
- />
+
{
@@ -633,21 +572,21 @@ const EditWorkflow = (props) => {
fullWidth
/>
-
- MSSP controls
+ Multi-Tenancy, Backups & Security
-
-
- MSSP Suborg Distribution (beta - contact support@shuffler.io for more info)
+
+ Multi-Tenant Workflows. Make one workflow, and keep a separate, synced copy in all your tenants. Control distributed auth, runtime locations, files, datastore keys etc. (contact support@shuffler.io if you want a demo. Please try it!)
+
{userdata !== undefined && userdata !== null && userdata.orgs !== undefined && userdata.orgs !== null && userdata.orgs.length > 0 ?
userdata.orgs.filter(org => org.creator_org === userdata.active_org.id).length === 0 ?
userdata.active_org.creator_org === undefined || userdata.active_org.creator_org === null || userdata.active_org.creator_org === "" ?
- Your organization does not have any suborgs yet OR your user may not have access to available suborgs. Please make one or get access to suborgs by another admin, then try again.
+ Your organization does not have any suborgs yet OR your user may not have access to available suborgs. Please make one or get access to suborgs by another admin, then try again.
:
@@ -687,6 +626,7 @@ const EditWorkflow = (props) => {
All
{userdata.orgs.map((data, index) => {
+
var skipOrg = false;
if (data.creator_org !== undefined && data.creator_org !== null && data.creator_org === userdata.active_org.id) {
// Finds the parent org
@@ -694,6 +634,8 @@ const EditWorkflow = (props) => {
return null
}
+ const correctRegion = data?.region_url === userdata?.region_url
+
const imagesize = 22
const imageStyle = {
width: imagesize,
@@ -727,7 +669,11 @@ const EditWorkflow = (props) => {
return (
-
- : null}
- {!isEditing ? <>
-
+
+ )
+}
+
+export default EditOrgTab;
diff --git a/frontend/src/components/EditWorkflow.jsx b/frontend/src/components/EditWorkflow.jsx
index a7694562..b67bde93 100644
--- a/frontend/src/components/EditWorkflow.jsx
+++ b/frontend/src/components/EditWorkflow.jsx
@@ -71,7 +71,7 @@ const EditWorkflow = (props) => {
const [_, setUpdate] = React.useState(""); // Used for rendering, don't remove
const [submitLoading, setSubmitLoading] = React.useState(false);
- const [showMoreClicked, setShowMoreClicked] = React.useState(expanded === true ? true : false);
+ const [showMoreClicked, setShowMoreClicked] = React.useState(isEditing !== false ? true : false);
const [innerWorkflow, setInnerWorkflow] = React.useState(workflow)
@@ -88,6 +88,8 @@ const EditWorkflow = (props) => {
const [inputMarkdown, setInputMarkdown] = React.useState(workflow?.form_control?.input_markdown !== undefined && workflow?.form_control?.input_markdown !== null ? workflow?.form_control?.input_markdown : "")
const [scrollDone, setScrollDone] = React.useState(false)
const [selectedYieldActions, setSelectedYieldActions] = React.useState(workflow?.form_control?.output_yields !== undefined && workflow?.form_control?.output_yields !== null ? JSON.parse(JSON.stringify(workflow?.form_control?.output_yields)) : [])
+ const [selectedCleanupActions, setSelectedCleanupActions] = React.useState(workflow?.form_control?.cleanup_actions !== undefined && workflow?.form_control?.cleanup_actions !== null ? JSON.parse(JSON.stringify(workflow?.form_control?.cleanup_actions)) : [])
+
const [formWidth, setFormWidth] = React.useState(boxWidth === undefined || boxWidth === null ? 500 : boxWidth)
const classes = useStyles();
@@ -103,9 +105,10 @@ const EditWorkflow = (props) => {
const foundScroll = document.getElementById(scrollTo)
if (foundScroll !== null) {
// Smooth scroll
- foundScroll.scrollIntoView({ behavior: "smooth" })
+ foundScroll.scrollIntoView({
+ behavior: "smooth",
+ })
}
-
}, 200)
setScrollDone(true)
@@ -188,6 +191,10 @@ const EditWorkflow = (props) => {
var upload = "";
var total_count = 0
+ const isCloud =
+ window.location.host === "localhost:3002" ||
+ window.location.host === "shuffler.io";
+
return (
+
+
+
+ {
+ if (userdata.support === false) {
+ toast("Region change is not directly implemented yet, and requires support help.")
+
+ if (window.drift !== undefined) {
+ window.drift.api.startInteraction({
+ interactionId: 386411,
+ })
+ }
+ } else {
+ // Show region change modal
+ console.log("Should open region change modal")
+ setRegionChangeModalOpen(true)
+ }
+ }}
+ >
+ {regiontag}
+
+
+ : null} */}
+
+
+
+
+ {/* {isCloud ?
+
+
+ Organization overview
+ + On this page organization admins can configure organisations, and sub-orgs (MSSP).{" "} + + Learn more + + +
+
+ {
+ const org_id = selectedOrganization.id;
+
+ // Check if organization ID exists
+ if (!org_id) {
+ toast("No organization ID found");
+ return;
+ }
+
+ // Use clipboard API
+ navigator.clipboard.writeText(org_id)
+ .then(() => {
+ toast.success(`${org_id} copied to clipboard`);
+ })
+ .catch((error) => {
+ // Fallback for browsers that don't support clipboard API
+ try {
+ // Create temporary input element
+ const tempInput = document.createElement('input');
+ tempInput.value = org_id;
+ document.body.appendChild(tempInput);
+ tempInput.select();
+ document.execCommand('copy');
+ document.body.removeChild(tempInput);
+ toast(`${org_id} copied to clipboard`);
+ } catch (err) {
+ toast("Failed to copy. Please try again.");
+ console.error("Copy failed:", err);
+ }
+ });
+ }}
+ >
+
+
+ {userdata.support === true ?
+
+ {/**/}
+
+
+
+ : null}
+
+
-
- */}
+
+
{showUpload === true ?
@@ -290,7 +295,7 @@ const EditWorkflow = (props) => {
bottom: 0,
zIndex: 1002,
backgroundColor: theme.palette.backgroundColor,
- height: 50,
+ height: 75,
paddingTop: 20,
paddingLeft: 75,
}}>
@@ -324,15 +329,21 @@ const EditWorkflow = (props) => {
innerWorkflow.form_control.input_markdown = inputMarkdown
innerWorkflow.form_control.output_yields = selectedYieldActions
innerWorkflow.form_control.form_width = formWidth
+ innerWorkflow.form_control.cleanup_actions = selectedCleanupActions
innerWorkflow.name = name
innerWorkflow.description = description
+
if (newWorkflowTags.length > 0) {
innerWorkflow.tags = newWorkflowTags
+ } else {
+ innerWorkflow.tags = []
}
if (selectedUsecases.length > 0) {
innerWorkflow.usecase_ids = selectedUsecases
+ } else {
+ innerWorkflow.usecase_ids = []
}
if (dueDate > 0) {
@@ -361,7 +372,6 @@ const EditWorkflow = (props) => {
setWorkflow({})
} else {
setWorkflow(innerWorkflow)
- console.log("editing workflow: ", innerWorkflow)
}
setSubmitLoading(true)
@@ -505,7 +515,7 @@ const EditWorkflow = (props) => {
color: "white",
},
}}
- multiLine
+ multiline
rows={3}
color="primary"
defaultValue={innerWorkflow.description}
@@ -537,81 +547,10 @@ const EditWorkflow = (props) => {
-
- {
- setDueDate(newValue)
- }}
- />
-
-
-
+ Publishing
+
+
+
+ Publishing is related to making this workflow itself public. When publishing a workflow, all the details (except sensitive info) become available to anyone. The fields below will help a user and Shuffle's system understand your workflow better. When a workflow is published, you keep the original, and a copy enters the Shuffle workflow search, and is associated with your creator or partner account, if you have one. You can always unpublish the workflow after. When ready to publish, click the three dots next to a workflow on the main workflow page.
+
+ You can always unpublish a workflow after.
+
+
+
+
+ {
+ setDueDate(newValue)
}}
/>
+
-
- : null}
+
+ {modalView}
+ {EnvironmentDistributionModal}
+
+
+
+ )
+});
+
+export default EnvironmentTab;
diff --git a/frontend/src/components/Files.jsx b/frontend/src/components/Files.jsx
index 378bc532..f825fb7f 100644
--- a/frontend/src/components/Files.jsx
+++ b/frontend/src/components/Files.jsx
@@ -89,7 +89,6 @@ const Files = memo((props) => {
console.log('escape pressed')
setRenderTextBox(false);
}
-
}
const changeDistribution = (id, selectedSubOrg) => {
@@ -1051,6 +1050,7 @@ const Files = memo((props) => {
) : null}
+
+
+
+ {showLocationActionModal !== undefined && showLocationActionModal !== null && showLocationActionModal?.open === true ?
+
+ setShowArchived(!showArchived)}
+ />{" "}
+ Show disabled
+ {/*
+
+
If you have scale problems, check the docs or talk to our team: support@shuffler.io. + + Learn more + + +
+
+
+ Runtime Locations
+ + Decides which Orborus runtime location to run your workflows in. Previously called Environments.If you have scale problems, check the docs or talk to our team: support@shuffler.io. + + Learn more + + +
+
+ -
+
+ 
+ +
+ + Last checkin: {environment?.checkin !== undefined && environment.checkin !== null && environment?.checkin > 0 ? new Date(environment?.checkin * 1000).toLocaleString() : "Never"} + + } placement="top"> +
+
+
+
+
+
+
+ {environment.Type === "cloud" ? null :
+
+ }
+
+
+
+ {setIsExpanded(prev => !prev)}}>
+ {listItemExpanded === index ?
+
+
+
+
+
+ Self-Hosted Orborus instance
+
+
+ Orborus is the Shuffle queue handler that runs your hybrid workflows and manages pipelines. It can be run in Docker/k8s container on your server or in your cluster. Follow the steps below, and configure as need be.
+
+
+ {
+ setInstallationTab(inputValue)
+ }}
+ aria-label="disabled tabs example"
+ variant="scrollable"
+ scrollButtons="auto"
+ style={{textAlign: "center", marginTop: 25, }}
+ >
+
+ Verbose (default)
+
+ />
+
+ Scale
+
+ />
+
+ k8s
+
+ />
+
+
+ {installationTab === 2 ?
+
+ Check our Kubernetes documentation for more information on how to run Shuffle on Kubernetes. The status of the node will change when connected.
+
+ :
+
+ 1. Ensure Docker is installed and the target server can reach '{globalUrl}'
+
+ }
+
+
+
+ {installationTab === 2 ? null :
+ "2. Run this command on the server you want to run workflows or store Pipeline data on"}
+
+
+ {installationTab === 2 ? null :
+
+ {installationTab === 2 ? null :
+
+ 3. Verify if the node is running. Try to refresh the page a little while after running the command.
+
+ }
+
+
+ Verbose (default)
+
+ />
+ Scale
+
+ />
+ k8s
+
+ />
+
+ {
+ if (commandController.proxies === undefined) {
+ commandController.proxies = true
+ } else {
+ commandController.proxies = !commandController.proxies
+ }
+
+ setCommandController(commandController)
+ setUpdate(Math.random())
+ }}
+ />
+
+ Disable Pipelines & Data Lake: {
+ if (commandController.pipelines === undefined) {
+ commandController.pipelines = true
+ } else {
+ commandController.pipelines = !commandController.pipelines
+ }
+ setCommandController(commandController)
+ setUpdate(Math.random())
+ }}
+ />
+
+ }
+
+
+
+
+
+ {getOrborusCommand(environment)}
+
+
+
+ {
+ navigator.clipboard.writeText(orborusCommandWrapper())
+ toast("Copied to clipboard")
+ }}
+ >
+
+
+
+
+
+
+ 90% CPU the server(s) hosting the Shuffle App
+ Runner (Orborus) was found.
+
+
+ Need help with High Availability and Scale?{" "}
+
+ Read documentation
+ {" "}
+ and{" "}
+
+ Get in touch
+
+ .
+
+
+
+
+
+
+
+
+ : null }
+
{renderTextBox ?
@@ -1263,7 +1263,7 @@ const Files = memo((props) => {
}
const isDistributed = file?.suborg_distribution?.length > 0 ? true : false;
const filenamesplit = file.filename.split(".")
- const iseditable = file.filesize < 2000000 && file.status === "active" && allowedFileTypes.includes(filenamesplit[filenamesplit.length-1])
+ const iseditable = file.filesize < 2000000 && file.status === "active" && (allowedFileTypes.includes(filenamesplit[filenamesplit.length-1]) || !file?.filename.includes("."))
return (
{
placement="top"
>
{
console.log("Workflow validation: ", workflow.validation)
return (
{
setOpenautomateTab(true);
setOpenSecurityTab(false);
setCurrentOpenTab("workflows");
- } else if ((lastTabOpenByUser === "apps" && currentPath.includes("/search")) || currentPath.includes("/search")) {
+ } else if ((lastTabOpenByUser === "apps" && currentPath.includes("/apps")) || currentPath.includes("/apps")) {
setOpenautomateTab(true);
setOpenSecurityTab(false);
setCurrentOpenTab("apps");
@@ -500,16 +498,6 @@ useEffect(() => {
})
-
-
-
- Version: 2.0.0-rc2
+ Version: 2.0.0
@@ -670,8 +658,8 @@ useEffect(() => {
};
const getRegionTag = (region_url) => {
- //let regiontag = "UK";
- let regiontag = "EU";
+ let regiontag = "UK";
+ //let regiontag = "EU";
if (
region_url !== undefined &&
region_url !== null &&
@@ -704,16 +692,44 @@ useEffect(() => {
const CheckOrgStates = useCallback(() => {
setOrgOptions(
- userdata?.orgs?.map((org) => ({
- id: org.id,
- name: org.name,
- image: org.image,
- region_url: getRegionTag(org.region_url),
- })) || []
+ userdata?.orgs?.map((org) => {
+ let skipOrg = false;
+
+ if (
+ org.creator_org !== undefined &&
+ org.creator_org !== null &&
+ org.creator_org.length > 0
+ ) {
+ // Finds the parent org
+ for (let key in userdata.child_orgs) {
+ if (userdata.child_orgs[key].id === org.creator_org) {
+ skipOrg = true;
+ break;
+ }
+ }
+
+ if (skipOrg) {
+ return null; // Skip this org
+ }
+ }
+
+ return {
+ id: org.id,
+ name: org.name,
+ image: org.image,
+ region_url: getRegionTag(org.region_url),
+ margin_left:
+ org.creator_org !== undefined &&
+ org.creator_org !== null &&
+ org.creator_org.length > 0 ? 20 : 0,
+ };
+ }) || []
);
+
setActiveOrgName(userdata?.active_org?.name || "Select Organization");
setSelectedOrg(userdata?.active_org?.name || "Select Organization");
- },[orgOptions, activeOrgName, selectedOrg]);
+ }, [userdata]);
+
useEffect(() => {
if (typeof userdata?.id === "string" && userdata?.id?.length > 0) {
@@ -735,37 +751,8 @@ useEffect(() => {
fontSize: 18
};
- const modalView = (
-
- );
-
const getRegionFlag = (region_url) => {
- var region = "gb";
+ var region = "UK";
const regionMapping = {
"US": "us",
"EU": "eu",
@@ -801,20 +788,8 @@ useEffect(() => {
zoom: 0.8,
height: "calc((100vh - 32px)*1.2)",
}}
- onMouseLeave={() => {
- if (window?.location?.pathname?.includes("/workflows/")) {
- setExpandLeftNav(false);
- }
- }}
- onMouseOver={() => {
- if (window?.location?.pathname?.includes("/workflows/")) {
- setExpandLeftNav(true);
- }
- }
-
- }
>
- {modalView}
+ {searchBarModalOpen ? {
alignItems: "center",
padding: "24px 16px 24px 27px",
}}
- >
-
- 
-
+ onMouseOver={()=>{
+ if(window?.location?.pathname?.includes("/workflows/")) {
+ setExpandLeftNav(true)
+ }
+ }}
+
+ onMouseLeave={()=>{
+ if(window?.location?.pathname?.includes("/workflows/")) {
+ setExpandLeftNav(false)
+ }
+ }}
+ >
+
+
+
+
+
{
- {!leftSideBarOpenByClick && setExpandLeftNav(true);}} onMouseLeave={()=>{!leftSideBarOpenByClick && setExpandLeftNav(false);setOpenAutocomplete(false);}}>
+ {(!leftSideBarOpenByClick || window?.location?.pathname?.includes("/workflows/")) && setExpandLeftNav(true)}} onMouseLeave={()=>{(!leftSideBarOpenByClick || window?.location?.pathname?.includes("/workflows/")) && setExpandLeftNav(false);setOpenAutocomplete(false)}}>
{
color: currentOpenTab === "apps" && currentPath.includes("/apps") ? "#FFFFFF" : "#C8C8C8",
justifyContent: "flex-start",
textTransform: "none",
- backgroundColor: currentOpenTab === "apps" && expandLeftNav && currentPath.includes("/apps2") ? "#2f2f2f": "transparent",
+ backgroundColor: currentOpenTab === "apps" && expandLeftNav && currentPath.includes("/apps") ? "#2f2f2f": "transparent",
marginLeft: 16,
fontSize: 18
}}
@@ -1153,7 +1161,7 @@ useEffect(() => {
event.currentTarget.style.backgroundColor = "#2f2f2f";
}}
onMouseOut={(event)=>{
- event.currentTarget.style.backgroundColor = currentOpenTab === "apps" && expandLeftNav && currentPath.includes("/search") ? "#2f2f2f": "transparent";
+ event.currentTarget.style.backgroundColor = currentOpenTab === "apps" && expandLeftNav && currentPath.includes("/apps") ? "#2f2f2f": "transparent";
}}
disableRipple={expandLeftNav ? false : true}
>
@@ -1176,7 +1184,7 @@ useEffect(() => {
sx={{
display: "flex",
flexDirection: "row",
- marginTop: 1
+ marginTop: 0
}}
>
@@ -1206,12 +1214,12 @@ useEffect(() => {
: "transparent";
}}
>
-
{
to={"/forms"}
style={{
...hrefStyle,
- pointerEvents: userdata?.support ? "auto" : "none",
+ pointerEvents: "auto",
}}
>
+
+
+
+
+
+
{recentworkflows?.length > 0 ?
@@ -1550,6 +1632,7 @@ useEffect(() => {
padding: option.id === "add_suborg" ? "0" : "12px 16px",
marginTop: index !== 0 ? 8 : 0,
borderRadius: 6,
+ marginLeft: option.margin_left ? option.margin_left : 0,
}}
onMouseOver={(e) => {
e.currentTarget.style.backgroundColor = "#444444";
@@ -1619,12 +1702,15 @@ useEffect(() => {
setAutocompleteValue(newInputValue);
}}
filterOptions={(options, params) => {
+ const normalize = (str) => str.toLowerCase().replace(/[\s-]+/g, "");
+ const input = normalize(params.inputValue);
+
return options.filter((option) =>
- option.name
- .toLowerCase()
- .includes(params.inputValue.toLowerCase())
+ normalize(option.name).includes(input) ||
+ normalize(option.region_url).includes(input)
);
}}
+
value={userOrgs}
renderInput={(params) => (
{
};
export default LeftSideBar;
+
+
+const ModalView = memo(({searchBarModalOpen, setSearchBarModalOpen, globalUrl, serverside, userdata}) => {
+ return (
+ (
+
+ )
+ )
+});
diff --git a/frontend/src/components/LicencePopup.jsx b/frontend/src/components/LicencePopup.jsx
index b8d009a3..c29095e4 100644
--- a/frontend/src/components/LicencePopup.jsx
+++ b/frontend/src/components/LicencePopup.jsx
@@ -869,8 +869,8 @@ const LicencePopup = (props) => {
:
shuffleVariant === 0 ? "price_1PZPSSEJjT17t98NLJoTMYja" : "price_1PZPQuEJjT17t98N3yORUtd9"
- const successUrl = `${window.location.origin}/admin?admin_tab=billing&payment=success`
- const failUrl = `${window.location.origin}/pricing?admin_tab=billing&payment=failure`
+ const successUrl = `${window.location.origin}/admin?admin_tab=billingstats&payment=success`
+ const failUrl = `${window.location.origin}/admin?admin_tab=billingstats&payment=failure`
console.log("Priceitem: ", priceItem, shuffleVariant)
var checkoutObject = {
@@ -888,7 +888,7 @@ const LicencePopup = (props) => {
}
if (stripe === undefined || stripe === null || stripe.redirectToCheckout === undefined) {
- window.open("https://shuffler.io/admin?admin_tab=billing&payment=stripe_error", "_self")
+ window.open("https://shuffler.io/admin?admin_tab=billingstats&payment=stripe_error", "_self")
}
stripe.redirectToCheckout(checkoutObject)
diff --git a/frontend/src/components/NewHeader.jsx b/frontend/src/components/NewHeader.jsx
index e193460c..ed8ef8a1 100644
--- a/frontend/src/components/NewHeader.jsx
+++ b/frontend/src/components/NewHeader.jsx
@@ -465,7 +465,7 @@ const Header = (props) => {
+ {/*
{workflow.errors !== undefined && workflow.errors !== null ?
)
diff --git a/frontend/src/components/LeftSideBar.jsx b/frontend/src/components/LeftSideBar.jsx
index c6944955..432075ec 100644
--- a/frontend/src/components/LeftSideBar.jsx
+++ b/frontend/src/components/LeftSideBar.jsx
@@ -1,4 +1,4 @@
-import React, { useEffect, useRef, useState, useContext, useCallback, useMemo } from "react";
+import React, { useEffect, useRef, useState, useContext, useCallback, useMemo, memo } from "react";
import {
ExpandLess as ExpandLessIcon,
ExpandMore as ExpandMoreIcon,
@@ -7,7 +7,9 @@ import {
Add as AddIcon,
BorderColor,
Close as CloseIcon,
- ConstructionOutlined,
+ ConstructionOutlined as ConstructionOutlinedIcon,
+ Toc as TocIcon,
+ Settings as SettingsIcon
} from "@mui/icons-material";
import SearchBox from "./SearchData.jsx";
import {
@@ -27,11 +29,9 @@ import {
Fade,
Portal,
Collapse,
+ Tooltip,
} from "@mui/material";
import theme from "../theme.jsx";
-import {
- Settings as SettingsIcon
-} from "@mui/icons-material";
import RecentWorkflow from "../components/RecentWorkflow.jsx";
import { useNavigate } from "react-router";
@@ -143,8 +143,6 @@ useEffect(() => {
>
General errors: {workflow.errors.length}
@@ -656,11 +657,8 @@ const FixWorkflowValidationErrors = (props) => {
})}
: null}
-
Validation errors: {workflow.validation.errors.length}
{workflow.validation.errors.map((error, index) => {
@@ -675,10 +673,12 @@ const FixWorkflowValidationErrors = (props) => {
)
})}
- : null}
+ : null*/}
+ {/*