marker/shuffle-cracked
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Synced over a lot of sidebar changes

Browse Source
This commit is contained in:
Frikky
2024-12-04 17:01:33 +01:00
parent 32264ad5fa
commit 24a8c18eb5
30 changed files with 2811 additions and 1831 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/views/Admin2.jsx
+109 -14
View File
@@ -4,13 +4,13 @@ import { toast } from "react-toastify";
const Admin2 = (props) => {
// Destructure props if needed
const { userdata, globalUrl, isCloud, serverside, checkLogin, notifications, setNotifications, stripeKey } = props;
const { userdata, globalUrl, serverside, checkLogin, notifications, setNotifications, stripeKey, isLoaded, isLoggedIn} = props;
const [selectedTab, setSelectedTab] = useState('editdetails');
const [selectedStatus, setSelectedStatus] = React.useState([]);
const [selectedOrganization, setSelectedOrganization] = useState({});
const [organizationFeatures, setOrganizationFeatures] = useState({});
const [orgRequest, setOrgRequest] = React.useState(true);
const isCloud = window.location.host === "localhost:3002" || window.location.host === "shuffler.io";
const handleGetOrg = (orgId) => {
if (
serverside !== true &&
@@ -51,8 +51,11 @@ const Admin2 = (props) => {
.then((responseJson) => {
if (responseJson["success"] === false) {
toast(
"Failed getting your org. If this persists, please contact support.",
"Failed getting your org. If this persists, please contact support. Redirecting to workflows...",
);
setTimeout(() => {
window.location.href = "/workflows";
}, 3000);
} else {
if (
responseJson.sync_features === undefined ||
@@ -151,6 +154,77 @@ const Admin2 = (props) => {
});
};
const urlSearchParams = new URLSearchParams(window.location.search);
const params = Object.fromEntries(urlSearchParams.entries());
const foundOrgID = params["org_id"]
useEffect(() => {
if(foundOrgID !== null && foundOrgID !== undefined && userdata?.support && foundOrgID?.length > 0) {
handleClickChangeOrg(foundOrgID)
}
}, [foundOrgID]);
const handleClickChangeOrg = (orgId) => {
// Don't really care about the logout
//name: org.name,
//orgId = "asd"
const data = {
org_id: orgId,
};
localStorage.setItem("globalUrl", "");
localStorage.setItem("getting_started_sidebar", "open");
fetch(`${globalUrl}/api/v1/orgs/${orgId}/change`, {
mode: "cors",
credentials: "include",
crossDomain: true,
method: "POST",
body: JSON.stringify(data),
withCredentials: true,
headers: {
"Content-Type": "application/json; charset=utf-8",
},
})
.then(function (response) {
if (response.status !== 200) {
console.log("Error in response");
} else {
localStorage.removeItem("apps")
localStorage.removeItem("workflows")
localStorage.removeItem("userinfo")
}
return response.json();
})
.then(function (responseJson) {
if (responseJson.success === true) {
if (responseJson.region_url !== undefined && responseJson.region_url !== null && responseJson.region_url.length > 0) {
localStorage.setItem("globalUrl", responseJson.region_url)
//globalUrl = responseJson.region_url
}
setTimeout(() => {
window.location.reload()
}, 3000);
toast("Successfully changed active organization - refreshing!");
} else {
if (responseJson.reason !== undefined && responseJson.reason !== null) {
if (!responseJson.reason.includes("already")) {
toast("Failed changing org: " + responseJson.reason);
}
} else {
toast("Failed changing org")
}
}
})
.catch((error) => {
console.log("error changing: ", error);
//removeCookie("session_token", {path: "/"})
});
};
const handleEditOrg = (
name,
description,
@@ -159,6 +233,7 @@ const Admin2 = (props) => {
defaults,
sso_config,
lead_info,
{ mfa_required } = {}
) => {
const data = {
name: name,
@@ -168,6 +243,7 @@ const Admin2 = (props) => {
defaults: defaults,
sso_config: sso_config,
lead_info: lead_info,
mfa_required: mfa_required !== undefined ? mfa_required : selectedOrganization?.mfa_required,
};
const url = globalUrl + `/api/v1/orgs/${selectedOrganization.id}`;
@@ -202,21 +278,40 @@ const Admin2 = (props) => {
});
};
// useEffect(() => {
// handleGetOrg();
// }, []);
const handleStatusChange = (event) => {
const { value } = event.target;
setSelectedStatus(value);
handleEditOrg(
"",
"",
selectedOrganization?.name,
selectedOrganization?.description,
selectedOrganization.id,
"",
{},
{},
selectedOrganization?.image,
{
app_download_repo: selectedOrganization?.defaults?.app_download_repo,
app_download_branch: selectedOrganization?.defaults?.app_download_branch,
workflow_download_repo: selectedOrganization?.defaults?.workflow_download_repo,
workflow_download_branch: selectedOrganization?.defaults?.workflow_download_branch,
notification_workflow: selectedOrganization?.defaults?.notification_workflow,
documentation_reference: selectedOrganization?.defaults?.documentation_reference,
workflow_upload_repo: selectedOrganization?.defaults?.workflow_upload_repo,
workflow_upload_branch: selectedOrganization?.defaults?.workflow_upload_branch,
workflow_upload_username: selectedOrganization?.defaults?.workflow_upload_username,
workflow_upload_token: selectedOrganization?.defaults?.workflow_upload_token,
newsletter: !selectedOrganization?.defaults?.newsletter,
weekly_recommendations: selectedOrganization?.defaults?.weekly_recommendations,
},
{
sso_entrypoint: selectedOrganization?.sso_config?.sso_entrypoint,
sso_certificate: selectedOrganization?.sso_config?.sso_certificate,
client_id: selectedOrganization?.sso_config?.client_id,
client_secret: selectedOrganization?.sso_config?.client_secret,
openid_authorization: selectedOrganization?.sso_config?.openid_authorization,
openid_token: selectedOrganization?.sso_config?.openid_token,
SSORequired: selectedOrganization?.sso_config?.SSORequired,
auto_provision: selectedOrganization?.sso_config?.auto_provision,
},
value.length === 0 ? ["none"] : value,
);
};
@@ -228,14 +323,14 @@ const Admin2 = (props) => {
orgRequest
) {
const orgId = userdata.active_org.id
console.log("orgID", orgId)
setOrgRequest(false);
handleGetOrg(orgId);
}
return (
<div style={{ display: 'flex', justifyContent: 'center', paddingTop: 30 }}>
<AdminNavBar userdata={userdata} selectedStatus={selectedStatus} setSelectedStatus={setSelectedStatus} selectedTab={selectedTab} orgId={selectedOrganization.id} handleStatusChange={handleStatusChange} handleEditOrg={handleEditOrg} handleGetOrg={handleGetOrg} setSelectedOrganization={setSelectedOrganization} selectedOrganization={selectedOrganization} setNotifications={setNotifications} stripeKey={stripeKey} notifications={notifications} checkLogin={checkLogin} globalUrl={globalUrl} isCloud={isCloud} serverside={serverside} />
<div style={{ display: 'flex', justifyContent: 'center', paddingTop: 29, zoom: 0.8, }}>
<AdminNavBar userdata={userdata} isLoaded={isLoaded} selectedStatus={selectedStatus} setSelectedStatus={setSelectedStatus} selectedTab={selectedTab} orgId={selectedOrganization.id} handleStatusChange={handleStatusChange} handleEditOrg={handleEditOrg} handleGetOrg={handleGetOrg} setSelectedOrganization={setSelectedOrganization} selectedOrganization={selectedOrganization} setNotifications={setNotifications} stripeKey={stripeKey} notifications={notifications} checkLogin={checkLogin} globalUrl={globalUrl} isCloud={isCloud} serverside={serverside} />
</div>
);
};
frontend/src/views/AngularWorkflow.jsx
+112 -67
View File
@@ -422,7 +422,7 @@ const AngularWorkflow = (defaultprops) => {
const [subworkflow, setSubworkflow] = React.useState({});
const [subworkflowStartnode, setSubworkflowStartnode] = React.useState("");
const [leftViewOpen, setLeftViewOpen] = React.useState(isMobile ? false : true);
const [leftBarSize, setLeftBarSize] = React.useState(isMobile ? 0 : 255)
const [leftBarSize, setLeftBarSize] = React.useState(isMobile ? 0 : 235)
const [creatorProfile, setCreatorProfile] = React.useState({});
const [usecases, setUsecases] = React.useState([]);
const [files, setFiles] = React.useState({
@@ -3813,7 +3813,7 @@ const releaseToConnectLabel = "Release to Connect"
});
}
cy.fit(null, 100);
cy.fit(null, 400);
cy.on("add", "node", (e) => onNodeAdded(e));
cy.on("add", "edge", (e) => onEdgeAdded(e));
} else {
@@ -4052,7 +4052,7 @@ const releaseToConnectLabel = "Release to Connect"
.then(() => {
console.log("DONE: ", workflow_id);
getWorkflow(workflow_id.value, nodedata);
cy.fit(null, 50);
cy.fit(null, 300);
});
}
};
@@ -4180,7 +4180,7 @@ const releaseToConnectLabel = "Release to Connect"
if (nodedata.app_name === "Webhook" || nodedata.app_name === "Schedule" || nodedata.app_name === "Gmail" || nodedata.app_name === "Office365") {
if (!found) {
console.log("Find amount of executions for the specific nodetype: ", nodedata.app_name, "Executions: ", workflowExecutions)
//console.log("Find amount of executions for the specific nodetype: ", nodedata.app_name, "Executions: ", workflowExecutions)
// Find how many executions it has
var executions = 0
const matchingExecutions = workflowExecutions.filter((execution => execution.execution_source === nodedata.app_name.toLowerCase()))
@@ -6121,7 +6121,7 @@ const releaseToConnectLabel = "Release to Connect"
event.target.remove()
//console.log("Found branch already!")
toast.error("Triggers can have exactly one target node")
toast.error("Triggers can point to exactly one start node")
return
@@ -7782,7 +7782,7 @@ const releaseToConnectLabel = "Release to Connect"
const item = typeIds[idkey]
if (item.data.id === nodedata.id) {
//console.log("items: ", item.data.id, nodedata.id)
parsedStyle["border-width"] = "12px"
parsedStyle["border-width"] = "7px"
break
}
}
@@ -8391,7 +8391,7 @@ const releaseToConnectLabel = "Release to Connect"
// Reset view for cytoscape
if (cy !== undefined && cy !== null) {
cy.add(insertedNodes);
cy.fit(null, 200);
cy.fit(null, 400);
} else {
setElements(insertedNodes);
}
@@ -8772,7 +8772,7 @@ const releaseToConnectLabel = "Release to Connect"
}
// preview: true,
cy.fit(null, 200);
cy.fit(null, 400)
cy.on("boxselect", "node", (e) => {
if (e.target.data("isButton") || e.target.data("isDescriptor") || e.target.data("isSuggestion")) {
@@ -9380,7 +9380,9 @@ const releaseToConnectLabel = "Release to Connect"
onChange={handleSetTab}
aria-label="Left sidebar tab"
orientation={isMobile ? "vertical" : "horizontal"}
style={{}}
style={{
display: "flex",
}}
>
<Tab
value={0}
@@ -9421,7 +9423,7 @@ const releaseToConnectLabel = "Release to Connect"
<Grid item>
<FavoriteBorderIcon style={iconStyle} />
</Grid>
{isMobile ? null : <Grid item>Variables</Grid>}
{isMobile ? null : <Grid item>Vars</Grid>}
</Grid>
}
style={tabStyle}
@@ -9776,11 +9778,13 @@ const releaseToConnectLabel = "Release to Connect"
const barHeight = bodyHeight - appBarSize - 50;
const appScrollStyle = {
overflow: "scroll",
maxHeight: isMobile ? bodyHeight - appBarSize * 4 : barHeight-300,
minHeight: isMobile ? bodyHeight - appBarSize * 4 : barHeight-300,
maxHeight: isMobile ? bodyHeight - appBarSize * 4 : barHeight-70,
minHeight: isMobile ? bodyHeight - appBarSize * 4 : barHeight-70,
marginTop: 1,
overflowY: "auto",
overflowX: "hidden",
zoom: 0.9,
}
const handleAppDrag = (e, app) => {
@@ -10568,12 +10572,12 @@ const releaseToConnectLabel = "Release to Connect"
var viewedApps = []
return (
<div style={appViewStyle}>
<div style={{ flex: "1" }}>
<div style={{ flex: "1", zoom: 0.9, }}>
<TextField
style={{
backgroundColor: theme.palette.inputColor,
borderRadius: theme.palette?.borderRadius,
marginTop: 5,
marginTop: 10,
marginRight: 10,
height: 40,
}}
@@ -11193,14 +11197,12 @@ const releaseToConnectLabel = "Release to Connect"
overflowAnchor: "none",
};
const minSize = 370
const minSize = 370
var rightsidebarStyle = {
position: "fixed",
top: appBarSize - 35,
right: 25,
height: "90vh",
width: isMobile ? "100%" : minSize,
minWidth: minSize,
maxWidth: 600,
maxHeight: "100vh",
border: "1px solid rgb(91, 96, 100)",
@@ -11210,6 +11212,9 @@ const releaseToConnectLabel = "Release to Connect"
overflow: "auto",
overflowAnchor: "none",
minWidth: minSize,
width: isMobile ? "100%" : minSize,
zoom: 0.9,
};
const setTriggerFolderWrapperMulti = (event) => {
@@ -16153,13 +16158,15 @@ const releaseToConnectLabel = "Release to Connect"
position: "absolute",
top: isMobile ? 30 : 25,
left: isMobile ? 20 : leftSideBarOpenByClick ? leftBarSize + 275 : leftBarSize+100,
left: isMobile ? 20 : leftSideBarOpenByClick ? leftBarSize + 275 : leftBarSize+135,
transition: "left 0.3s ease",
maxWidth: 500,
zoom: 0.9,
}
const TopCytoscapeBar = (props) => {
const [hovered, setHovered] = useState(false)
if (workflow.public === true) {
return null
}
@@ -16174,12 +16181,30 @@ const releaseToConnectLabel = "Release to Connect"
<div style={topBarStyle}>
<div style={{
margin: "0px 10px 0px 35px",
maxWidth: 500,
}}>
<Typography variant="h6" style={{
margin: 0,
}}>
{workflow.name}
cursor: "pointer",
display: "flex",
borderRadius: theme.palette.borderRadius,
border: hovered ? "1px solid rgba(255,255,255,0.3)" : "1px solid transparent",
paddingRight: 10,
paddingLeft: 10,
position: "relative",
}}
onMouseEnter={() => {
setHovered(true)
}}
onMouseLeave={() => {
setHovered(false)
}}
onClick={() => {
setEditWorkflowModalOpen(true)
setLastSaved(false)
}}
>
<EditIcon style={{position: "absolute", top: 7, height: 20, width: 20, }} />
<span style={{marginLeft: 30, }}>{workflow.name}</span>
</Typography>
{workflowAsCode && (
<Tooltip title="Switch to Code View">
@@ -16204,7 +16229,7 @@ const releaseToConnectLabel = "Release to Connect"
{!distributedFromParent ?
isCorrectOrg ? null :
<Typography variant="body1">
<Typography variant="body2">
<b>Warning</b>: Change <span
style={{color: "#FF8544", cursor: "pointer", pointerEvents: "auto", }}
onClick={() => {
@@ -16275,7 +16300,7 @@ const releaseToConnectLabel = "Release to Connect"
>Active Organization</span> to edit this Workflow.
</Typography>
:
<Typography variant="body1">
<Typography variant="body2" color="textSecondary">
Warning: This workflow is controlled by your parent org and may not be editable.
</Typography>
}
@@ -16285,7 +16310,7 @@ const releaseToConnectLabel = "Release to Connect"
<InputLabel
id="suborg-changer"
style={{ color: "white" }}
style={{ color: "rgba(255,255,255,0.7)", }}
>
Select an Org
</InputLabel>
@@ -16294,10 +16319,15 @@ const releaseToConnectLabel = "Release to Connect"
pointerEvents: "auto",
backgroundColor: theme.palette.inputColor,
color: "white",
height: 50,
maxWidth: 250,
minWidth: 250,
borderRadius: theme.palette?.borderRadius,
height: 40,
}}
InputProps={{
style: {
height: 40,
}
}}
labelId="suborg-changer"
value={workflow.org_id}
@@ -16470,47 +16500,16 @@ const releaseToConnectLabel = "Release to Connect"
</Select>
</FormControl>
}
</div>
<div style={{display: "flex", marginLeft: 10, maxWidth: 250, pointerEvents: "auto", }}>
{parentWorkflows.slice(0,5).map((wf, index) => {
return (
<a href={`/workflows/${wf.id}`} target="_blank" rel="noopener noreferrer" key={index}>
<Tooltip arrow placement="left" title={
<span style={{}}>
{wf.image !== undefined && wf.image !== null && wf.image.length > 0 ?
<img
src={wf.image}
alt={wf.name}
style={{ backgroundColor: theme.palette.surfaceColor, maxHeight: 200, minHeigth: 200, borderRadius: theme.palette?.borderRadius, }}
/>
: null}
<Typography>
Parent workflow: '{wf.name}'
</Typography>
</span>
} placement="bottom">
<span onClick={() => {
console.log("Click: ", wf)
}}>
<img src={theme.palette.defaultImage} style={{height: 25, width: 25, cursor: "pointer", border: 15, marginRight: 5, marginTop: 5, filter: "grayscale(90%)", }} />
</span>
</Tooltip>
</a>
)
})}
</div>
</div>
{showEnvironment === true && environments.length > 1 && selectedActionEnvironment !== undefined && selectedActionEnvironment !== null && selectedActionEnvironment.Name !== undefined && selectedActionEnvironment.Name !== null ?
<FormControl fullWidth style={{marginTop: 15, marginleft: 10, pointerEvents: "auto", maxWidth: 250, }}>
<FormControl fullWidth style={{marginTop: 15, pointerEvents: "auto", maxWidth: 250, }}>
<InputLabel
id="execution_location"
style={{ color: "white" }}
style={{ color: "rgba(255,255,255,0.7)", marginLeft: 40, }}
>
Execution Location
Location
</InputLabel>
<Select
labelId="execution_location"
@@ -16523,6 +16522,11 @@ const releaseToConnectLabel = "Release to Connect"
style: {
},
}}
InputProps={{
style: {
height: 40,
}
}}
onChange={(e) => {
setLastSaved(false)
const env = environments.find((a) => a.Name === e.target.value);
@@ -16539,13 +16543,14 @@ const releaseToConnectLabel = "Release to Connect"
}}
style={{
pointerEvents: "auto",
backgroundColor: theme.palette.inputColor,
color: "white",
height: 50,
maxWidth: 250,
minWidth: 250,
borderRadius: theme.palette?.borderRadius,
marginLeft: 10,
marginLeft: 35,
backgroundColor: theme.palette.inputColor,
height: 40,
}}
>
{environments.map((data, index) => {
@@ -16603,6 +16608,43 @@ const releaseToConnectLabel = "Release to Connect"
</FormControl>
: null}
{parentWorkflows === undefined || parentWorkflows === null || parentWorkflows.length === 0 ? null :
<div style={{display: "flex", marginLeft: 40, maxWidth: 250, pointerEvents: "auto", marginTop: 5, }}>
<Typography variant="body2" color="textSecondary" style={{marginRight: 5, marginTop: 5, }}>
<b>Parent Workflows:</b>
</Typography>
{parentWorkflows.slice(0,5).map((wf, index) => {
return (
<a href={`/workflows/${wf.id}`} target="_blank" rel="noopener noreferrer" key={index}>
<Tooltip arrow placement="left" title={
<span style={{}}>
{wf.image !== undefined && wf.image !== null && wf.image.length > 0 ?
<img
src={wf.image}
alt={wf.name}
style={{ backgroundColor: theme.palette.surfaceColor, maxHeight: 200, minHeigth: 200, borderRadius: theme.palette?.borderRadius, }}
/>
: null}
<Typography>
Parent workflow: '{wf.name}'
</Typography>
</span>
} placement="bottom">
<span onClick={() => {
console.log("Click: ", wf)
}}>
<img src={theme.palette.defaultImage} style={{height: 25, width: 25, cursor: "pointer", border: 15, marginRight: 5, marginTop: 5, filter: "grayscale(90%)", }} />
</span>
</Tooltip>
</a>
)
})}
</div>
}
</div>
);
};
@@ -17210,7 +17252,7 @@ const releaseToConnectLabel = "Release to Connect"
<Tooltip color="primary" title="Stop execution" placement="top">
<span>
<Button
style={{ height: boxSize, width: boxSize }}
style={{ height: boxSize, width: boxSize+5 }}
color="secondary"
variant="contained"
onClick={() => {
@@ -17228,7 +17270,7 @@ const releaseToConnectLabel = "Release to Connect"
workflow.public
|| executionRequestStarted
}
style={{ height: boxSize, width: boxSize, backgroundColor: green, }}
style={{ height: boxSize, width: boxSize+5, backgroundColor: green, }}
color="primary"
variant="contained"
onClick={() => {
@@ -17265,7 +17307,7 @@ const releaseToConnectLabel = "Release to Connect"
{executionButton}
<Tooltip
color="secondary"
title={`Show previous runs (${workflowExecutions.length}) (Ctrl + ')`}
title={`Show previous workflow runs (${workflowExecutions.length}) (Ctrl + ')`}
placement="top-start"
>
<Button
@@ -17492,6 +17534,8 @@ const releaseToConnectLabel = "Release to Connect"
workflow.configuration.exit_on_error !== undefined ? (
<WorkflowMenu />
) : null}
{/*
<Tooltip
color="secondary"
title="Edit workflow details"
@@ -17514,6 +17558,7 @@ const releaseToConnectLabel = "Release to Connect"
</Button>
</span>
</Tooltip>
*/}
<Tooltip
color="secondary"
frontend/src/views/ApiExplorerWrapper.jsx
+7 -4
View File
@@ -1,3 +1,4 @@
import React, { memo, useCallback } from "react";
import { useState, useEffect, useContext, Suspense } from "react";
import { useNavigate, Link, useLocation } from "react-router-dom";
@@ -57,7 +58,7 @@ const ApiExplorer = React.lazy(() => import("../components/ApiExplorer.jsx"));
const ApiExplorerWrapper = (props) => {
const { globalUrl, serverside, userdata, isLoggedIn} = props;
const { globalUrl, serverside, userdata, isLoggedIn, isLoaded} = props;
const isCloud = window.location.host === "localhost:3002" || window.location.host === "shuffler.io"
const location = useLocation();
const navigate = useNavigate();
@@ -1754,7 +1755,7 @@ const ApiExplorerWrapper = (props) => {
)});
return (
<Wrapper userdata={userdata}>
<Wrapper isLoggedIn={isLoggedIn} isLoaded={isLoaded}>
<Suspense fallback={skeletonLoader}>
{authenticationModal}
<ApiExplorer
@@ -1765,6 +1766,8 @@ const ApiExplorerWrapper = (props) => {
HandleApiExecution={HandleApiExecution}
selectedAppData={selectedAppData}
ConfigurationTab={ConfigurationTab}
isLoggedIn={isLoggedIn}
isLoaded={isLoaded}
/>
</Suspense>
</Wrapper>
@@ -1774,13 +1777,13 @@ const ApiExplorerWrapper = (props) => {
export default ApiExplorerWrapper;
const Wrapper = ({children, userdata})=>{
const Wrapper = ({children, isLoaded,isLoggedIn})=>{
const { leftSideBarOpenByClick } = useContext(Context);
return(
<div className="api-explorer-wrapper" style={{ paddingLeft: userdata?.support ? leftSideBarOpenByClick ? 280 : 100 : 0, transition: 'padding-left 0.3s ease' }}>
<div className="api-explorer-wrapper" style={{ paddingLeft: (isLoggedIn && isLoaded) ? leftSideBarOpenByClick ? 280 : 100 : 0, transition: 'padding-left 0.3s ease' }}>
{children}
</div>
)
frontend/src/views/Apps.jsx
+3 -5
View File
@@ -3239,15 +3239,13 @@ const AppsWrapper = memo(({ appView, modalView, userdata, publishModal, generate
));
const SidebarAdjustWrapper = memo(({ userdata, children }) => {
const SidebarAdjustWrapper = memo(({ children }) => {
const {leftSideBarOpenByClick } = useContext(Context)
const marginLeft = userdata?.support
? leftSideBarOpenByClick ? 250 : 80
: 0;
return (
<div style={{ marginLeft, transition: 'margin-left 0.3s ease' }}>
<div style={{ marginLeft: leftSideBarOpenByClick ? 250 : 80, transition: 'margin-left 0.3s ease' }}>
{children}
</div>
);
frontend/src/views/Apps2.jsx
+477 -311
View File
File diff suppressed because it is too large Load Diff
frontend/src/views/CodeWorkflow.jsx
+2 -1
View File
@@ -274,7 +274,8 @@ const CodeWorkflow = (defaultprops) => {
display: 'flex',
flexDirection: 'column',
height: '100vh', // Set to full viewport height
backgroundColor: '#252526'
backgroundColor: '#252526',
marginLeft: '100px',
}}>
{/* IDE-like toolbar */}
<Toolbar
frontend/src/views/DashboardViews.jsx
+16 -4
View File
@@ -337,11 +337,23 @@ const Dashboard = (props) => {
const [, setUpdate] = useState(0);
let navigate = useNavigate();
const isCloud =
window.location.host === "localhost:3002" ||
window.location.host === "shuffler.io";
const isCloud = window.location.host === "localhost:3002" || window.location.host === "shuffler.io";
const path = window.location.pathname
if (path !== undefined && path !== null) {
if (path.includes("/automate")) {
navigate("/usecases")
}
if (path.includes("/security")) {
navigate("/forms")
}
}
useEffect(() => {
// Look for the path. If it is automation, go to usecases
// Handles redirect
const widgetnames = ["app_executions_cloud"]
for (let widgetkey in widgetnames) {
const widgetName = widgetnames[widgetkey]
@@ -859,7 +871,7 @@ const Dashboard = (props) => {
);
const dataWrapper = (
<div style={{ maxWidth: 1366, margin: "auto" }}>{data}</div>
<div style={{ maxWidth: 1366, margin: "auto", paddingTop: 10, }}>{data}</div>
);
return dataWrapper;
frontend/src/views/Docs.jsx
+8 -8
View File
@@ -251,7 +251,7 @@ export const CodeHandler = (props) => {
}
const Docs = (defaultprops) => {
const { globalUrl, selectedDoc, serverside, serverMobile, userdata } = defaultprops;
const { globalUrl, selectedDoc, serverside, serverMobile, isLoggedIn, isLoaded } = defaultprops;
let navigate = useNavigate();
// Quickfix for react router 5 -> 6
const params = useParams();
@@ -1266,7 +1266,7 @@ const Docs = (defaultprops) => {
// Padding and zIndex etc set because of footer in cloud.
const loadedCheck = (
<DocsWrapper userdata={userdata}>
<DocsWrapper isLoggedIn={isLoggedIn} isLoaded={isLoaded}>
<DocsContent postDataBrowser={postDataBrowser} postDataMobile={postDataMobile}/>
</DocsWrapper>
);
@@ -1285,18 +1285,18 @@ const DocsContent = memo(({postDataBrowser, postDataMobile}) => {
</div>
)})
const DocsWrapper = memo(({userdata, children })=>{
const DocsWrapper = memo(({isLoggedIn, isLoaded, children })=>{
const { leftSideBarOpenByClick, windowWidth } = useContext(Context);
return (
<div style={{
minHeight: 1000, zIndex: 1,
maxWidth: Math.min(leftSideBarOpenByClick ? windowWidth - 300 : windowWidth - 200, 1920),
minWidth: isMobile ? null : leftSideBarOpenByClick ? 800 : 900, margin: "auto",
position: leftSideBarOpenByClick ? "relative" : "static",
left: leftSideBarOpenByClick ? 120 : !leftSideBarOpenByClick ? 80 : 0,
marginLeft: windowWidth < 1920 ? leftSideBarOpenByClick ? 160 : !leftSideBarOpenByClick ? 80 : 0 : "auto", width: "100%",
maxWidth: Math.min(!(isLoggedIn && isLoaded) ? 1920 : leftSideBarOpenByClick ? windowWidth - 300 : windowWidth - 200, 1920),
minWidth: isMobile ? null : (isLoggedIn && isLoaded) ? leftSideBarOpenByClick ? 800 : 900 : null, margin: "auto",
position: (isLoggedIn && isLoaded) && leftSideBarOpenByClick ? "relative" : "static",
left: (isLoggedIn && isLoaded) && leftSideBarOpenByClick ? 120 : (isLoggedIn && isLoaded) && !leftSideBarOpenByClick ? 80 : 0,
marginLeft: windowWidth < 1920 ? leftSideBarOpenByClick && (isLoggedIn && isLoaded) ? 160 : (isLoggedIn && isLoaded) && !leftSideBarOpenByClick ? 80 : 0 : "auto", width: "100%",
transition: "left 0.3s ease-in-out, min-width 0.3s ease-in-out, max-width 0.3s ease-in-out, position 0.3s ease-in-out, margin 0.3s ease-in-out, margin-left 0.3s ease"
}}>
{children}
frontend/src/views/RunWorkflow.jsx
+14 -7
View File
@@ -108,7 +108,6 @@ const RunWorkflow = (defaultprops) => {
const boxStyle = {
color: "white",
padding: "25px 50px 50px 50px",
backgroundColor: theme.palette.surfaceColor,
borderRadius: 25,
minHeight: 500,
}
@@ -1116,7 +1115,7 @@ const RunWorkflow = (defaultprops) => {
const ExplorerUi = () => {
return (
<div style={{paddingTop: 50, marginTop: 50, width: 250, itemAlign: "center", textAlign: "center", margin: "auto", }}>
<div style={{paddingTop: 50, marginTop: 50, width: 350, itemAlign: "center", textAlign: "center", margin: "auto", }}>
{forms !== undefined && forms !== null && forms.length > 0 ?
<div>
@@ -1126,9 +1125,14 @@ const RunWorkflow = (defaultprops) => {
<FormList />
</div>
:
<Typography variant="h6" style={{marginTop: 100, marginBottom: 20, }}>
No Form Found
</Typography>
<div>
<Typography variant="h4" style={{marginTop: 125, marginBottom: 25, }}>
No Forms Found
</Typography>
<Typography variant="body1" color="textSecondary">
<b>Every</b> Workflow is a form, and can be accessed by going to /forms/{`{workflow_id}`}. You can control the form by editing the workflow details in the "Forms" section.
</Typography>
</div>
}
</div>
)
@@ -1474,7 +1478,7 @@ const RunWorkflow = (defaultprops) => {
{workflowQuestion !== "" ? null :
<Typography variant="body2" color="textSecondary" align="center" style={{marginTop: 10, }} >
Forms are in late Beta. Form submission data includes your Organization's unique ID while logged in, or a unique identifier for your browser otherwise. Your input will be automatically sanitized.
Form submission data includes your Organization's unique ID while logged in, or a unique identifier for your browser otherwise. Your input will be automatically sanitized.
</Typography>
}
</div>
@@ -1482,7 +1486,7 @@ const RunWorkflow = (defaultprops) => {
// const isCorrectOrg = userdata.active_org.id === undefined || userdata.active_org.id === null || workflow.org_id === null || workflow.org_id === undefined || workflow.org_id.length === 0 || userdata.active_org.id === workflow.org_id
const loadedCheck = isLoaded ?
<div style={{marginTop: 30, }}>
<div style={{paddingTop: 60, }}>
{editWorkflowModalOpen === true ?
<EditWorkflow
saveWorkflow={saveWorkflow}
@@ -1570,6 +1574,7 @@ const RunWorkflow = (defaultprops) => {
<div style={{position: "fixed", top: 10, right: 20, }}>
<Button
disabled={workflow.id === undefined || workflow.id === null}
variant={"outlined"}
color={"secondary"}
style={{marginRight: 10, }}
@@ -1582,6 +1587,7 @@ const RunWorkflow = (defaultprops) => {
</Button>
<Button
disabled={workflow.id === undefined || workflow.id === null}
variant={workflow.sharing === "form" ? "outlined" : "contained"}
color={"secondary"}
style={{marginRight: 10, }}
@@ -1603,6 +1609,7 @@ const RunWorkflow = (defaultprops) => {
</Button>
<Button
disabled={workflow.id === undefined || workflow.id === null}
variant={"contained"}
color={"primary"}
style={{}}
frontend/src/views/Search.jsx
+1 -1
View File
@@ -91,7 +91,7 @@ const Search = (props) => {
userdata={userdata}
/>, [curTab]);
const MemoizedDiscordChat = useMemo(() => <DiscordChat isMobile={isMobile} />)
const MemoizedDiscordChat = useMemo(() => <DiscordChat isMobile={isMobile} />, [curTab])
const useStyles = makeStyles({
hideIndicator: {
frontend/src/views/Usecases2.jsx
+2 -2
View File
@@ -1220,7 +1220,7 @@ const Usecases2 = (props) => {
) : null
const data =
<div className="content" style={{width: isMobile ? "100%": leftSideBarOpenByClick ? 1200: 1000, margin: "auto", paddingBottom: 200, textAlign: "center", paddingLeft: leftSideBarOpenByClick ? 200 : 0, transition: "padding-left 0.3s ease, width 0.3s ease"}}>
<div className="content" style={{width: isMobile ? "100%": leftSideBarOpenByClick ? 1000: 1200, margin: "auto", paddingBottom: 200, textAlign: "center", paddingLeft: leftSideBarOpenByClick ? 200 : 0, transition: "padding-left 0.3s ease, width 0.3s ease"}}>
<UsecaseListComponent
userdata={userdata}
@@ -1241,7 +1241,7 @@ const Usecases2 = (props) => {
const dataWrapper =
<Fade in={true} timeout={1250}>
<div style={{ maxWidth: 1366, margin: "auto", }}>
<div style={{ maxWidth: 1366, margin: "auto", zoom: 0.8, }}>
{data}
</div>
</Fade>
frontend/src/views/Workflows2.jsx
+486 -488
View File
File diff suppressed because it is too large Load Diff