From 01a23bff414fa0b3c56253d384a78e01497b58db Mon Sep 17 00:00:00 2001 From: Frikky Date: Fri, 18 Oct 2024 10:24:40 +0200 Subject: [PATCH] Fixed a bunch of form deploy systems --- .../src/components/AuthenticationNormal.jsx | 3 +- .../src/components/AuthenticationWindow.jsx | 19 +- frontend/src/components/Billing.jsx | 12 +- frontend/src/components/EditWorkflow.jsx | 27 +- frontend/src/components/NewHeader.jsx | 58 +- frontend/src/components/Oauth2Auth.jsx | 21 +- frontend/src/components/OrgHeaderexpanded.jsx | 42 +- frontend/src/components/ParsedAction.jsx | 38 +- frontend/src/components/SearchData.jsx | 14 +- frontend/src/components/Searchfield.jsx | 22 +- .../components/WorkflowValidationTimeline.jsx | 2 - frontend/src/views/AngularWorkflow.jsx | 174 ++++-- frontend/src/views/Docs.jsx | 2 + frontend/src/views/RunWorkflow.jsx | 528 ++++++++++++++---- frontend/src/views/SetAuthentication.jsx | 22 +- frontend/src/views/Workflows.jsx | 156 ++++-- 16 files changed, 730 insertions(+), 410 deletions(-) diff --git a/frontend/src/components/AuthenticationNormal.jsx b/frontend/src/components/AuthenticationNormal.jsx index 271dc59a..de0f5cfe 100644 --- a/frontend/src/components/AuthenticationNormal.jsx +++ b/frontend/src/components/AuthenticationNormal.jsx @@ -344,12 +344,13 @@ const AuthenticationData = (props) => { onClick={() => { setAuthenticationModalOpen(false); }} - color="primary" + color="secondary" > Cancel ) : ( @@ -1368,7 +1367,7 @@ const Billing = (props) => { diff --git a/frontend/src/components/NewHeader.jsx b/frontend/src/components/NewHeader.jsx index a3ce311c..32fa14fd 100644 --- a/frontend/src/components/NewHeader.jsx +++ b/frontend/src/components/NewHeader.jsx @@ -142,7 +142,7 @@ const Header = (props) => { const [anchorElAvatar, setAnchorElAvatar] = React.useState(null); const [subAnchorEl, setSubAnchorEl] = React.useState(null); const [upgradeHovered, setUpgradeHovered] = React.useState(false); - const [showTopbar, setShowTopbar] = useState(false) + const [showTopbar, setShowTopbar] = useState(false) // Set to true to show top bar const stripeKey = typeof window === 'undefined' || window.location === undefined ? "" : window.location.origin === "https://shuffler.io" ? "pk_live_51PXYYMEJjT17t98N20qEqItyt1fLQjrnn41lPeG2PjnSlZHTDNKHuisAbW00s4KAn86nGuqB9uSVU4ds8MutbnMU00DPXpZ8ZD" : "pk_test_51PXYYMEJjT17t98NbDkojZ3DRvsFUQBs35LGMx3i436BXwEBVFKB9nCvHt0Q3M4MG3dz4mHheuWvfoYvpaL3GmsG00k1Rb2ksO" let navigate = useNavigate(); const classes = useStyles(); @@ -171,15 +171,13 @@ const Header = (props) => { setTooltipOpen(true); }; - const topbar_var = "topbar_closed4" - + const topbar_var = "topbar_closed5" useEffect(() => { + // Manually setShowTopbar(true) to show topbar by default const topbar = localStorage.getItem(topbar_var) if (topbar === "true") { setShowTopbar(false) - } else { - setShowTopbar(true) - } + } }, []) const hoverColor = "#f85a3e"; @@ -433,29 +431,18 @@ const Header = (props) => { - - { - handleClose(); - }} - > - Notifications ({ - notifications === undefined || notifications === null ? 0 : - notifications?.filter((notification) => notification.read === false).length - }) - - - {/* - - { - handleClose(); - }} - > - Get Started - - - */} + + { + handleClose(); + }} + > + Notifications ({ + notifications === undefined || notifications === null ? 0 : + notifications?.filter((notification) => notification.read === false).length + }) + + { @@ -466,19 +453,8 @@ const Header = (props) => { - {/*userdata?.public_username === undefined || userdata?.public_username === null || userdata?.public_username.length <= 0 ? null : - - { - handleClose(); - }} - > - Creator page - - - */} - + { diff --git a/frontend/src/components/Oauth2Auth.jsx b/frontend/src/components/Oauth2Auth.jsx index 17d8d6d2..61d5cda0 100755 --- a/frontend/src/components/Oauth2Auth.jsx +++ b/frontend/src/components/Oauth2Auth.jsx @@ -460,16 +460,16 @@ const AuthenticationOauth2 = (props) => { } - if ( - authenticationType.refresh_uri !== undefined && - authenticationType.refresh_uri !== null && - authenticationType.refresh_uri.length > 0 - ) { - state += `%26refresh_uri%3d${authenticationType.refresh_uri}`; + if (authenticationType.refresh_uri !== undefined && authenticationType.refresh_uri !== null && authenticationType.refresh_uri.length > 0) { + state += `%26refresh_uri%3d${authenticationType.refresh_uri}` } else { - state += `%26refresh_uri%3d${authentication_url}`; + state += `%26refresh_uri%3d${authentication_url}` } + if (workflow.org_id !== undefined && workflow.org_id !== null && workflow.org_id.length > 0) { + state += `%26org_id%3d${workflow.org_id}` + } + // FIXME: Should this be =consent? var defaultPrompt = "login" if (prompt !== undefined && prompt !== null && prompt.length > 0) { @@ -524,7 +524,12 @@ const AuthenticationOauth2 = (props) => { //alert('"Secure Payment" window closed!'); if (getAppAuthentication !== undefined) { - getAppAuthentication(true, true, true, selectedAction.id) + // This should be orgId, not action Id as to load auth properly + if (workflow !== undefined && workflow !== null && workflow.org_id !== undefined && workflow.org_id !== null && workflow.org_id.length > 0) { + getAppAuthentication(true, true, true, workflow.org_id) + } else { + getAppAuthentication(true, true, true) + } } toast("Authentication successful!") diff --git a/frontend/src/components/OrgHeaderexpanded.jsx b/frontend/src/components/OrgHeaderexpanded.jsx index efc40719..7c1b5aa5 100644 --- a/frontend/src/components/OrgHeaderexpanded.jsx +++ b/frontend/src/components/OrgHeaderexpanded.jsx @@ -382,46 +382,8 @@ const OrgHeaderexpanded = (props) => { }) .catch((err) => { console.log("error for sso test is: ", err); - }); - }; - - - const HandleTestSSO = () => { - const url = `${globalUrl}/api/v1/orgs/${selectedOrganization?.id}/change`; - const data = { - org_id: selectedOrganization?.id, - sso_test: true, - } - fetch(url, { - mode: "cors", - credentials: "include", - crossDomain: true, - method: "POST", - body: JSON.stringify(data), - withCredentials: true, - headers: { - "Content-Type": "application/json; charset=utf-8", - }, - }).then((response) => { - if (response.status !== 200) { - toast.error("Failed to test sso. Please try again later or contact support@shuffler.io if issue persist.") - return - } - return response.json(); - }).then((responjson) => { - if (responjson["reason"] === "SSO_REDIRECT") { - setTimeout(() => { - toast.info("Redirecting to SSO login page as SSO is required for this organization.") - window.location.href = responjson["url"]; - return - }, 2000) - } else { - toast.error("No SSO found for this org. Please set up sso for this org.") - } - }).catch((err) => { - console.log("error for sso test is: ", err) - }) - } + }) + } return (
diff --git a/frontend/src/components/ParsedAction.jsx b/frontend/src/components/ParsedAction.jsx index d1a9a228..e1869125 100755 --- a/frontend/src/components/ParsedAction.jsx +++ b/frontend/src/components/ParsedAction.jsx @@ -207,7 +207,6 @@ const ParsedAction = (props) => { } }, [expansionModalOpen]) - useEffect(() => { if (selectedActionEnvironment === undefined || selectedActionEnvironment === null || Object.keys(selectedActionEnvironment).length === 0) { @@ -224,20 +223,6 @@ const ParsedAction = (props) => { } }, []) - /* - useEffect(() => { - setParamValues(selectedAction.parameters.map((param) => { - return { - name: param.name, - value: param.value, - } - })) - },[ - selectedAction, selectedApp,setNewSelectedAction, workflow, - ]) - */ - - useEffect(() => { if (selectedAction.parameters === null || selectedAction.parameters === undefined) { return @@ -1855,6 +1840,7 @@ const ParsedAction = (props) => {
)} + {selectedApp.name !== undefined && selectedAction.authentication !== null && selectedAction.authentication !== undefined && @@ -1937,8 +1923,8 @@ const ParsedAction = (props) => { selectedAction.parameters[key].value = "" } } - setSelectedAction(selectedAction); - setUpdate(Math.random()); + setSelectedAction(selectedAction) + setUpdate(Math.random()) } else if (e.target.value === "authgroups") { if (authGroups !== undefined && authGroups !== null && authGroups.length === 0) { @@ -2051,14 +2037,6 @@ const ParsedAction = (props) => { - {/* - - - curaction.authentication = authenticationOptions - if (curaction.selectedAuthentication === null || curaction.selectedAuthentication === undefined || curaction.selectedAuthentication.length === "") - */} { /*
*/ } - const buttonTitle = `Authenticate ${selectedApp.name.replaceAll("_", " ")}` + const buttonTitle = `Authenticate API ${selectedApp.name.replaceAll("_", " ")}` const hasAutocomplete = data?.autocompleted === true if (data.variant === undefined || data.variant === null) { data.variant = "STATIC_VALUE" } - /* - if (data?.configuration === true) { - if (data?.name === "url" && authenticationType?.type === "oauth2-app") { - data.configuration = false - } - } - */ - return (
{/* {hideBodyButton} */} diff --git a/frontend/src/components/SearchData.jsx b/frontend/src/components/SearchData.jsx index 89ab2050..6e619652 100644 --- a/frontend/src/components/SearchData.jsx +++ b/frontend/src/components/SearchData.jsx @@ -47,7 +47,7 @@ const chipStyle = { const searchClient = algoliasearch("JNSS5CFDZZ", "db08e40265e2941b9a7d8f644b6e5240") const SearchData = props => { - const { serverside, globalUrl, userdata, setModalOpen, modalOpen } = props + const { serverside, globalUrl, userdata, searchBarModalOpen, setSearchBarModalOpen } = props let navigate = useNavigate(); const borderRadius = 3 const node = useRef() @@ -56,8 +56,8 @@ const SearchData = props => { const [value, setValue] = useState(""); const handleLinkClick = () => { - if (modalOpen) { - setModalOpen(false); // Assuming setModalOpen is defined correctly + if (searchBarModalOpen) { + setSearchBarModalOpen(false); // Assuming setModalOpen is defined correctly } else { console.log("Condition not met, staying on the same page"); } @@ -95,7 +95,7 @@ const SearchData = props => { const trimmedValue = inputValue.trim(); if (trimmedValue !== '') { navigate(`/search?q=${trimmedValue}`, { state: trimmedValue, replace: true }); - setModalOpen(false); + setSearchBarModalOpen(false); } } }; @@ -249,7 +249,7 @@ const SearchData = props => { { //console.log("CLICK") setSearchOpen(true) - setModalOpen(false) + setSearchBarModalOpen(false) aa('init', { appId: searchClient.appId, apiKey: searchClient.transporter.queryParameters["x-algolia-api-key"] @@ -498,7 +498,7 @@ const SearchData = props => { return ( { setSearchOpen(true) - setModalOpen(false) + setSearchBarModalOpen(false) aa('init', { appId: searchClient.appId, apiKey: searchClient.transporter.queryParameters["x-algolia-api-key"] @@ -702,7 +702,7 @@ const SearchData = props => { console.log("CLICK") setSearchOpen(true) - setModalOpen(false) + setSearchBarModalOpen(false) }}> { setMouseHoverIndex(index) diff --git a/frontend/src/components/Searchfield.jsx b/frontend/src/components/Searchfield.jsx index 6b3c50ae..83fb7675 100644 --- a/frontend/src/components/Searchfield.jsx +++ b/frontend/src/components/Searchfield.jsx @@ -1,9 +1,11 @@ -import React, { useState, useEffect, useRef } from 'react'; +import React, { useState, useEffect, useRef, useContext } from 'react'; import theme from '../theme.jsx'; import { useNavigate, Link, useParams } from "react-router-dom"; import SearchBox from "../components/SearchData.jsx"; +import { Context } from '../Context/contextApi.js'; + import { Chip, IconButton, @@ -45,20 +47,22 @@ const chipStyle = { const SearchField = props => { const { serverside, userdata, isMobile, isLoaded, globalUrl, isHeader, isLoggedIn, small, rounded } = props + const {searchBarModalOpen, setSearchBarModalOpen} = useContext(Context); + let navigate = useNavigate(); const borderRadius = 3 const node = useRef() const [searchOpen, setSearchOpen] = useState(false) - const [modalOpen, setModalOpen] = React.useState(false); + // const [modalOpen, setModalOpen] = React.useState(false); const [oldPath, setOldPath] = useState("") const [value, setValue] = useState(""); useEffect(() => { Mousetrap.bind(['command+k', 'ctrl+k'], () => { - setModalOpen(true); + setSearchBarModalOpen(true); return false; // Prevent the default action }); Mousetrap.bind(['esc'], () => { - setModalOpen(false); + setSearchBarModalOpen(false); return false; // Prevent the default action }); @@ -72,9 +76,9 @@ const SearchField = props => { // console.log("key:", dataValue.key), //console.log("value:",dataValue.value), { - setModalOpen(false); + setSearchBarModalOpen(false); }} PaperProps={{ style: { @@ -92,12 +96,12 @@ const SearchField = props => { {isHeader ?
Search for Docs, Apps, Workflows and more
: null} - + @@ -155,7 +159,7 @@ const SearchField = props => { color="primary" placeholder="Search Apps, Workflows, Docs..." onClick={(event) => { - setModalOpen(true) + setSearchBarModalOpen(true) }} limit={5} /> diff --git a/frontend/src/components/WorkflowValidationTimeline.jsx b/frontend/src/components/WorkflowValidationTimeline.jsx index a0dc2ca0..5e20c8d9 100644 --- a/frontend/src/components/WorkflowValidationTimeline.jsx +++ b/frontend/src/components/WorkflowValidationTimeline.jsx @@ -261,8 +261,6 @@ const WorkflowValidationTimeline = (props) => { relevantactions.push(...newactions) } - console.log("Relevant actions (return null if 0-1): ", relevantactions) - if (relevantactions.length <= 1) { return null } diff --git a/frontend/src/views/AngularWorkflow.jsx b/frontend/src/views/AngularWorkflow.jsx index 5754f00e..d5146d66 100755 --- a/frontend/src/views/AngularWorkflow.jsx +++ b/frontend/src/views/AngularWorkflow.jsx @@ -141,7 +141,7 @@ import cytoscapestyle from "../defaultCytoscapeStyle.jsx"; import ShuffleCodeEditor from "../components/ShuffleCodeEditor1.jsx"; import WorkflowValidationTimeline from "../components/WorkflowValidationTimeline.jsx" -import { validateJson, GetIconInfo } from "../views/Workflows.jsx"; +import { validateJson, collapseField, GetIconInfo } from "../views/Workflows.jsx"; import { GetParsedPaths, internalIds, } from "../views/Apps.jsx"; import ConfigureWorkflow from "../components/ConfigureWorkflow.jsx"; import AuthenticationOauth2 from "../components/Oauth2Auth.jsx"; @@ -1242,12 +1242,18 @@ const releaseToConnectLabel = "Release to Connect" }; const setNewAppAuth = (appAuthData, refresh) => { + var headers = { + "Content-Type": "application/json", + "Accept": "application/json", + } + + if (workflow.org_id !== undefined && workflow.org_id !== null && workflow.org_id.length > 0) { + headers["Org-Id"] = workflow.org_id + } + fetch(globalUrl + "/api/v1/apps/authentication", { method: "PUT", - headers: { - "Content-Type": "application/json", - Accept: "application/json", - }, + headers: headers, body: JSON.stringify(appAuthData), credentials: "include", }) @@ -2522,13 +2528,11 @@ const releaseToConnectLabel = "Release to Connect" } } - selectedAction.authentication = authenticationOptions; - if ( - selectedAction.selectedAuthentication === null || - selectedAction.selectedAuthentication === undefined || - selectedAction.selectedAuthentication.length === "" - ) { - selectedAction.selectedAuthentication = {}; + console.log("auth options: ", authenticationOptions) + + selectedAction.authentication = authenticationOptions + if (selectedAction.selectedAuthentication === null || selectedAction.selectedAuthentication === undefined || selectedAction.selectedAuthentication.length === "") { + selectedAction.selectedAuthentication = {} } if (appUpdates === true) { @@ -2555,7 +2559,7 @@ const releaseToConnectLabel = "Release to Connect" } } else { - setAppAuthentication([]); + setAppAuthentication([]) shouldClose = true } @@ -5274,7 +5278,10 @@ const releaseToConnectLabel = "Release to Connect" authenticationOptions[latestindex].last_modified = true } - curaction.authentication = authenticationOptions; + + console.log("auth options 2: ", authenticationOptions) + + curaction.authentication = authenticationOptions if ( curaction.selectedAuthentication === null || curaction.selectedAuthentication === undefined || @@ -5283,7 +5290,9 @@ const releaseToConnectLabel = "Release to Connect" curaction.selectedAuthentication = {}; } } else { - curaction.authentication = []; + console.log("auth option 3") + + curaction.authentication = [] curaction.authentication_id = ""; curaction.selectedAuthentication = {}; } @@ -7022,9 +7031,9 @@ const releaseToConnectLabel = "Release to Connect" const px = parentNode.position("x") + 0; const py = parentNode.position("y") + 100; - const parentlabel = parentNode.data("label").toLowerCase().replace(" ", "_") - const parentname = parentNode.data("app_name").toLowerCase().replace(" ", "_") - if (!parentlabel.startsWith(parentname)+"_") { + const parentlabel = parentNode.data("label")?.toLowerCase().replace(" ", "_") + const parentname = parentNode.data("app_name")?.toLowerCase().replace(" ", "_") + if (!parentlabel?.startsWith(parentname)+"_") { return } @@ -7855,6 +7864,7 @@ const releaseToConnectLabel = "Release to Connect" return node }) + // What are these again? Where are they used? const decoratorNodes = inputworkflow.actions.map((action) => { if (!action.isStartNode) { if (action.app_name === "Testing") { @@ -7866,11 +7876,20 @@ const releaseToConnectLabel = "Release to Connect" } } + if (action.id === undefined || action.id === null) { + return null + } + + if (action.position === undefined || action.position === null || action.position.x === undefined || action.position.x === null || action.position.y === undefined || action.position.y === null) { + return null + } + const iconInfo = GetIconInfo(action); const svg_pin = ``; const svgpin_Url = encodeURI("data:image/svg+xml;utf-8," + svg_pin); const offset = action.isStartNode ? 36 : 44; + const decoratorNode = { position: { x: action.position.x + offset, @@ -7886,9 +7905,9 @@ const releaseToConnectLabel = "Release to Connect" imageColor: iconInfo.iconBackgroundColor, attachedTo: action.id, }, - }; - return decoratorNode; - }); + } + return decoratorNode + }) const foundtriggers = inputworkflow.triggers.map((trigger) => { @@ -9371,6 +9390,7 @@ const releaseToConnectLabel = "Release to Connect" } } } else { + newAppData.authentication = []; newAppData.authentication_id = ""; newAppData.selectedAuthentication = {}; @@ -9505,11 +9525,9 @@ const releaseToConnectLabel = "Release to Connect" } var parsedEnvironments = - environments === null || environments === [] - ? "cloud" - : environments[defaultEnvironmentIndex] === undefined - ? "cloud" - : environments[defaultEnvironmentIndex].Name + environments === undefined || environments === null || environments === [] + ? isCloud ? "cloud" : "Shuffle" : environments[defaultEnvironmentIndex] === undefined + ? isCloud ? "cloud" : "Shuffle" : environments[defaultEnvironmentIndex].Name // Basic automatic auth mapping var authId = "" @@ -10512,6 +10530,10 @@ const releaseToConnectLabel = "Release to Connect" // description // ACTION select const selectedNameChange = (appActionName) => { + if (appActionName === undefined || appActionName === null) { + return + } + appActionName = appActionName.replaceAll("(", ""); appActionName = appActionName.replaceAll(")", ""); appActionName = appActionName.replaceAll("]", ""); @@ -18142,7 +18164,10 @@ const releaseToConnectLabel = "Release to Connect" src={validate.result} theme={theme.palette.jsonTheme} style={theme.palette.reactJsonStyle} - collapsed={true} + collapsed={false} + shouldCollapse={(jsonField) => { + return collapseField(jsonField) + }} iconStyle={theme.palette.jsonIconStyle} collapseStringsAfterLength={theme.palette.jsonCollapseStringsAfterLength} displayArrayKey={false} @@ -18483,12 +18508,12 @@ const releaseToConnectLabel = "Release to Connect" theme={theme.palette.jsonTheme} style={theme.palette.reactJsonStyle} collapsed={parsedCollapse} + shouldCollapse={(jsonField) => { + return collapseField(jsonField) + }} iconStyle={theme.palette.jsonIconStyle} collapseStringsAfterLength={theme.palette.jsonCollapseStringsAfterLength} displayArrayKey={false} - shouldCollapse={(field) => { - console.log("FIELD: ", field) - }} enableClipboard={(copy) => { handleReactJsonClipboard(copy); }} @@ -19799,7 +19824,10 @@ const releaseToConnectLabel = "Release to Connect" src={validate.result} theme={theme.palette.jsonTheme} style={theme.palette.reactJsonStyle} - collapsed={true} + collapsed={false} + shouldCollapse={(jsonField) => { + return collapseField(jsonField) + }} iconStyle={theme.palette.jsonIconStyle} collapseStringsAfterLength={theme.palette.jsonCollapseStringsAfterLength} displayArrayKey={false} @@ -19959,6 +19987,9 @@ const releaseToConnectLabel = "Release to Connect" theme={theme.palette.jsonTheme} style={theme.palette.reactJsonStyle} collapsed={data.value.length < 10000 ? false : true} + shouldCollapse={(jsonField) => { + return collapseField(jsonField) + }} iconStyle={theme.palette.jsonIconStyle} collapseStringsAfterLength={theme.palette.jsonCollapseStringsAfterLength} displayArrayKey={false} @@ -20379,6 +20410,9 @@ const releaseToConnectLabel = "Release to Connect" theme={theme.palette.jsonTheme} style={theme.palette.reactJsonStyle} collapsed={selectedResult.result.length < 10000 ? false : true} + shouldCollapse={(jsonField) => { + return collapseField(jsonField) + }} iconStyle={theme.palette.jsonIconStyle} collapseStringsAfterLength={theme.palette.jsonCollapseStringsAfterLength} displayArrayKey={false} @@ -21098,13 +21132,13 @@ const releaseToConnectLabel = "Release to Connect" } } - console.log("Action: ", selectedAction); selectedAction.authentication_id = authenticationOption.id; selectedAction.selectedAuthentication = authenticationOption; - if ( - selectedAction.authentication === undefined || - selectedAction.authentication === null - ) { + + console.log("auth option 4: ", authenticationOption) + + if (selectedAction.authentication === undefined || selectedAction.authentication === null) { + selectedAction.authentication = [authenticationOption] } else { @@ -21115,7 +21149,7 @@ const releaseToConnectLabel = "Release to Connect" } } - setSelectedAction(selectedAction); + setSelectedAction(selectedAction) var newAuthOption = JSON.parse(JSON.stringify(authenticationOption)); var newFields = []; @@ -21128,21 +21162,18 @@ const releaseToConnectLabel = "Release to Connect" }); } - newAuthOption.fields = newFields; - setNewAppAuth(newAuthOption); + newAuthOption.fields = newFields + setNewAppAuth(newAuthOption) if (configureWorkflowModalOpen) { - setSelectedAction({}); + setSelectedAction({}) } - setUpdate(authenticationOption.id); - }; + setUpdate(authenticationOption.id) + } - if ( - authenticationOption.label === null || - authenticationOption.label === undefined - ) { - authenticationOption.label = selectedApp.name + " authentication"; + if (authenticationOption.label === null || authenticationOption.label === undefined) { + authenticationOption.label = selectedApp.name + " authentication"; } return ( @@ -21164,7 +21195,7 @@ const releaseToConnectLabel = "Release to Connect"
These are required fields for authenticating with {selectedApp.name}
- Name - what is this used for? + Label for you to remember
: null} + { // Check if event.target.value is an array. If it is, split with comma - console.log("1 - SELECTED ACTION: ", selectedAction) - console.log("1 - DATA: ", data) if (data.startsWith("${") && data.endsWith("}")) { // PARAM FIX - Gonna use the ID field, even though it's a hack diff --git a/frontend/src/views/Docs.jsx b/frontend/src/views/Docs.jsx index 3cbeb077..e05a7d90 100755 --- a/frontend/src/views/Docs.jsx +++ b/frontend/src/views/Docs.jsx @@ -152,6 +152,8 @@ export const OuterLink = (props) => { export const Img = (props) => { + // Find parent container and check width + var height = "auto" var width = 750 if (props.height !== undefined && props.height !== null) { diff --git a/frontend/src/views/RunWorkflow.jsx b/frontend/src/views/RunWorkflow.jsx index e8f3617d..9d741300 100644 --- a/frontend/src/views/RunWorkflow.jsx +++ b/frontend/src/views/RunWorkflow.jsx @@ -6,7 +6,7 @@ import ReactJson from "react-json-view-ssr"; import { green, yellow, red, grey} from "./AngularWorkflow.jsx"; import { CodeHandler, Img, OuterLink, } from "../views/Docs.jsx"; import { useNavigate, Link, useParams } from "react-router-dom"; -import { validateJson, GetIconInfo } from "./Workflows.jsx"; +import { validateJson, collapseField, GetIconInfo } from "./Workflows.jsx"; import EditWorkflow from "../components/EditWorkflow.jsx" import { toast } from "react-toastify" import { makeStyles } from '@mui/material/styles'; @@ -15,6 +15,7 @@ import { isMobile } from "react-device-detect"; import Markdown from "react-markdown"; import theme from '../theme.jsx'; import rehypeRaw from "rehype-raw"; +import RecentWorkflow from "../components/RecentWorkflow.jsx"; import { Tooltip, @@ -39,6 +40,9 @@ import { ContentCopy as ContentCopyIcon, ArrowBack as ArrowBackIcon, ArrowForward as ArrowForwardIcon, + Lock as LockIcon, + LockOpen as LockOpenIcon, + OpenInNew as OpenInNewIcon, } from '@mui/icons-material'; const hrefStyle = { @@ -75,12 +79,30 @@ const RunWorkflow = (defaultprops) => { const [editWorkflowModalOpen, setEditWorkflowModalOpen] = React.useState(false) const [sharingOpen, setSharingOpen] = React.useState(false) const [realtimeMarkdown, setRealtimeMarkdown] = React.useState("") + const [forms, setForms] = React.useState([]) + + const IframeWrapper = (props) => { + var propsCopy = JSON.parse(JSON.stringify(props)) + propsCopy.width = 400 + propsCopy.height = 225 + + return