One of the final syncs before merges start happening for 2.0

This commit is contained in:
Frikky
2025-02-24 17:50:42 +01:00
parent 5703ce40e4
commit 1ffae87420
20 changed files with 647 additions and 495 deletions
+16 -16
View File
@@ -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,7 +414,7 @@ const AppGrid = (props) => {
scrollbarColor: "#494949 #2f2f2f",
}}
>
{hits.map((data, index) => {
{hits?.map((data, index) => {
const appUrl =
isCloud === true ?
`/apps/${data.objectID}`
@@ -556,7 +556,7 @@ const AppGrid = (props) => {
}}
>
<span>
{data.tags.slice(0, 1).map((tag, tagIndex) => (
{data?.tags?.slice(0, 1)?.map((tag, tagIndex) => (
<span key={tagIndex}>
{normalizedString(tag)}
{tagIndex < 1 ? ", " : ""}
@@ -569,7 +569,7 @@ const AppGrid = (props) => {
) : (
<div style={{ width: 230, textOverflow: "ellipsis", overflow: 'hidden', whiteSpace: 'nowrap', }}>
{data.tags &&
data.tags.map((tag, tagIndex) => (
data?.tags?.map((tag, tagIndex) => (
<span key={tagIndex}>
{normalizedString(tag)}
{tagIndex < data.tags.length - 1 ? ", " : ""}
@@ -760,7 +760,7 @@ const AppGrid = (props) => {
};
const transformRefinementListItems = items =>
items.map(item => ({
items?.map(item => ({
...item,
label: item.label === 'true' ? 'App Editor' : 'Python',
}));
@@ -1103,7 +1103,7 @@ const AppGrid = (props) => {
}
});
const categoryArray = Object.keys(categoryCountMap).map((category) => ({
const categoryArray = Object.keys(categoryCountMap)?.map((category) => ({
category,
count: categoryCountMap[category],
}));
@@ -1169,7 +1169,7 @@ const AppGrid = (props) => {
{!isLoading && (
<Collapse in={isCategoreListExpanded}>
<div style={{ display: 'flex', flexDirection: 'column', alignItems: 'flex-start', width: '100%' }}>
{topCategories.map((data, index) => (
{topCategories?.map((data, index) => (
<Button
key={data.category}
style={{
@@ -1247,7 +1247,7 @@ const AppGrid = (props) => {
});
}
const tagArray = Object.keys(tagCountMap).map((tag) => ({
const tagArray = Object.keys(tagCountMap)?.map((tag) => ({
tag,
count: tagCountMap[tag],
}));
@@ -1308,7 +1308,7 @@ const AppGrid = (props) => {
</Button>
<Collapse in={isActionLabelExpanded}>
<div style={{ display: 'flex', flexDirection: 'column', alignItems: 'flex-start', width: '100%', }}>
{topTags && topTags.length > 0 && topTags.map((data, index) => (
{topTags && topTags.length > 0 && topTags?.map((data, index) => (
<Button
key={index}
onClick={() => handleCheckboxChange(index)}
@@ -1419,7 +1419,7 @@ const AppGrid = (props) => {
<Collapse in={isCreatedWithExpanded}>
<div style={{ display: 'flex', flexDirection: 'column', alignItems: 'flex-start', width: '100%' }}>
{AppCreatedWithOptions.map((data, index) => (
{AppCreatedWithOptions?.map((data, index) => (
<Button
style={{
display: "inline-flex",
@@ -1689,7 +1689,7 @@ const AppGrid = (props) => {
maxHeight: 570,
}}
>
{filteredUserAppdata.map((data, index) => {
{filteredUserAppdata?.map((data, index) => {
const isMouseOverOnCloudIcon = false;
const xs = 12;
const rowHandler = 12;
@@ -1847,8 +1847,8 @@ const AppGrid = (props) => {
<div style={{minWidth: 120, overflow: "hidden", }}>
{data.generated !== true ?
<div>
{data.tags &&
data.tags.slice(0,2).map((tag, tagIndex) => (
{data?.tags &&
data?.tags?.slice(0,2)?.map((tag, tagIndex) => (
<span key={tagIndex}>
{normalizedString(tag)}
{tagIndex < data.tags.length - 1 ? ", " : ""}
@@ -1888,7 +1888,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 Deactivated Successfully. Reload UI to see updated changes.")
+1 -1
View File
@@ -179,7 +179,7 @@ const AppSearchButtons = (props) => {
return (
<Grid item xs={xsValue} style={{ alignItems: "center", marginTop: 5, }}
<Grid item xs={xsValue} style={{ alignItems: "center", marginTop: 5, maxWidth: "50%", minWidth: "50%" }}
onMouseEnter={handleMouseEnter}
onMouseLeave={handleMouseLeave}
>
+27 -4
View File
@@ -191,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 (
<Drawer
anchor={"right"}
@@ -622,6 +626,7 @@ const EditWorkflow = (props) => {
All
</MenuItem>
{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
@@ -629,6 +634,8 @@ const EditWorkflow = (props) => {
return null
}
const correctRegion = data?.region_url === userdata?.region_url
const imagesize = 22
const imageStyle = {
width: imagesize,
@@ -662,7 +669,11 @@ const EditWorkflow = (props) => {
return (
<MenuItem key={index} value={data.id}>
<MenuItem
key={index}
value={data.id}
disabled={isCloud && !correctRegion}
>
<Checkbox checked={innerWorkflow.suborg_distribution !== undefined && innerWorkflow.suborg_distribution !== null && innerWorkflow.suborg_distribution.includes(data.id)} />
{image}{" "}
<span style={{ marginLeft: 8 }}>
@@ -1170,9 +1181,21 @@ const EditWorkflow = (props) => {
setInnerWorkflow(innerWorkflow)
}}
>
<FormControlLabel value="trigger" control={<Radio />} label="Trigger" />
<FormControlLabel value="subflow" control={<Radio />} label="Subflow" />
<FormControlLabel value="standalone" control={<Radio />} label="Standalone" />
<Tooltip title="Agentic workflows takes an input based on input questions (forms) and performs actions based on it by itself, using Large Action Models & Singul">
<FormControlLabel value="agentic" control={<Radio />} label="Agentic" />
</Tooltip>
<Tooltip title="Trigger workflows are typically running a schedule to get some data, doing some deduplication before sending it to a subflow or standalone workflow.">
<FormControlLabel value="trigger" control={<Radio />} label="Trigger" />
</Tooltip>
<Tooltip title="Subflow workflows are typically used to subprocess some data, and in some cases return the result to the parent workflow.">
<FormControlLabel value="subflow" control={<Radio />} label="Subflow" />
</Tooltip>
<Tooltip title="Standalone is default. This has no impact on Shuffle as a system.">
<FormControlLabel value="standalone" control={<Radio />} label="Standalone" />
</Tooltip>
</RadioGroup>
</FormControl>
+1 -5
View File
@@ -721,11 +721,7 @@ useEffect(() => {
margin_left:
org.creator_org !== undefined &&
org.creator_org !== null &&
org.creator_org.length > 0
? org.id === userdata.active_org.id
? 0
: 20
: 0,
org.creator_org.length > 0 ? 20 : 0,
};
}) || []
);
+207 -202
View File
@@ -74,7 +74,7 @@ const OrgHeaderexpandedNew = (props) => {
getContentAnchorEl: () => null,
};
const [orgName, setOrgName] = useState(selectedOrganization?.name);
const [orgName, setOrgName] = useState(selectedOrganization?.name);
const [orgDescription, setOrgDescription] = React.useState(
selectedOrganization.description
);
@@ -180,41 +180,41 @@ const [orgName, setOrgName] = useState(selectedOrganization?.name);
const [uploadUsername, setUploadUsername] = React.useState(selectedOrganization.defaults === undefined ? "" : selectedOrganization.defaults.workflow_upload_username === undefined || selectedOrganization.defaults.workflow_upload_username.length === 0 ? "" : selectedOrganization.defaults.workflow_upload_username)
const [uploadToken, setUploadToken] = React.useState(selectedOrganization.defaults === undefined ? "" : selectedOrganization.defaults.workflow_upload_token === undefined || selectedOrganization.defaults.workflow_upload_token.length === 0 ? "" : selectedOrganization.defaults.workflow_upload_token)
const [regionStatus, setRegionStatus] = useState();
useEffect(() => {
if (documentationReference !== selectedOrganization?.defaults?.documentation_reference) {
setDocumentationReference(selectedOrganization?.defaults?.documentation_reference)
}
if (uploadRepo !== selectedOrganization?.defaults?.workflow_upload_repo){
if (uploadRepo !== selectedOrganization?.defaults?.workflow_upload_repo) {
setUploadRepo(selectedOrganization?.defaults?.workflow_upload_repo)
}
if (uploadBranch !== selectedOrganization?.defaults?.workflow_upload_branch){
if (uploadBranch !== selectedOrganization?.defaults?.workflow_upload_branch) {
setUploadBranch(selectedOrganization?.defaults?.workflow_upload_branch)
}
if (uploadUsername !== selectedOrganization?.defaults?.workflow_upload_username){
if (uploadUsername !== selectedOrganization?.defaults?.workflow_upload_username) {
setUploadUsername(selectedOrganization?.defaults?.workflow_upload_username)
}
if (uploadToken !== selectedOrganization?.defaults?.workflow_upload_token){
if (uploadToken !== selectedOrganization?.defaults?.workflow_upload_token) {
setUploadToken(selectedOrganization?.defaults?.workflow_upload_token)
}
}, [selectedOrganization])
useEffect(() => {
if (selectedOrganization !== undefined && selectedOrganization !== null) {
if((orgName === undefined || orgName === null || orgName.length === 0) && selectedOrganization?.name !== orgName) {
if ((orgName === undefined || orgName === null || orgName.length === 0) && selectedOrganization?.name !== orgName) {
setOrgName(selectedOrganization?.name)
}
if((orgDescription === undefined || orgDescription === null || orgDescription.length === 0) && selectedOrganization?.description !== orgDescription) {
if ((orgDescription === undefined || orgDescription === null || orgDescription.length === 0) && selectedOrganization?.description !== orgDescription) {
setOrgDescription(selectedOrganization?.description)
}
}
}, [selectedOrganization])
const handleEditOrg = (
name,
description,
@@ -262,21 +262,21 @@ const [orgName, setOrgName] = useState(selectedOrganization?.name);
});
}
const handleSendChangeRegionMail = (region)=> {
if(selectedOrganization === undefined || selectedOrganization === null){
const handleSendChangeRegionMail = (region) => {
if (selectedOrganization === undefined || selectedOrganization === null) {
toast.error("Failed to send request for changing region. Please contact support@shuffler.io.")
return
}
let destinationRegion = region;
if (region === "US") {
destinationRegion = "us-west2";
} else if (region === "EU") {
destinationRegion = "europe-west3";
} else if (region === "CA") {
destinationRegion = "northamerica-northeast1";
} else if (region === "UK") {
destinationRegion = "europe-west2";
}
const regionToCloudRegion = {
'US': 'us-west2',
'EU': 'europe-west3',
'CA': 'northamerica-northeast1',
'UK': 'europe-west2',
'EU-2': 'europe-west3'
};
const destinationRegion = regionToCloudRegion[region] || region;
var data = {
dst_region: destinationRegion
@@ -284,7 +284,7 @@ const [orgName, setOrgName] = useState(selectedOrganization?.name);
toast.info("Sending request for changing region to " + region)
fetch(`${globalUrl}/api/v1/orgs/${selectedOrganization?.id}/change/region/request`,{
fetch(`${globalUrl}/api/v1/orgs/${selectedOrganization?.id}/change/region/request`, {
method: "POST",
headers: {
"Content-Type": "application/json",
@@ -292,13 +292,13 @@ const [orgName, setOrgName] = useState(selectedOrganization?.name);
},
credentials: "include",
body: JSON.stringify(data),
}).then((response)=>{
if(response.status !== 200){
}).then((response) => {
if (response.status !== 200) {
toast.error("Failed to send request for changing region. Please contact support@shuffler.io.")
}else{
toast.success("successfully send request for changing region. We will contact you shortly.")
} else {
toast.success("Successfully sent request for region change. We will process the move and contact you shortly.")
}
}).catch((err)=>{
}).catch((err) => {
console.log(err)
toast.error("Failed to send request for changing region. Please contact support@shuffler.io.")
})
@@ -307,13 +307,13 @@ const [orgName, setOrgName] = useState(selectedOrganization?.name);
const setSelectedRegion = (region) => {
// send a POST request to /api/v1/orgs/{org_id}/region with the region as the body
if(region === "US") {
if (region === "US") {
region = "us-west2"
} else if(region === "EU") {
} else if (region === "EU") {
region = "europe-west2"
} else if(region === "CA") {
} else if (region === "CA") {
region = "northamerica-northeast1"
} else if(region === "UK") {
} else if (region === "UK") {
region = "europe-west2"
} else if (region === "EU-2") {
region = "europe-west3"
@@ -355,7 +355,7 @@ const [orgName, setOrgName] = useState(selectedOrganization?.name);
const orgSaveButton = (
<Tooltip title="Save any unsaved data" placement="bottom">
<Button
style={{ width: 244, height: 51, display: 'flex', justifyContent:'center', textTransform: 'capitalize', padding: "16px, 24px, 16px, 24px", borderRadius: 4, backgroundColor: "#ff8544", color: "#1a1a1a", fontSize: 16, }}
style={{ width: 244, height: 51, display: 'flex', justifyContent: 'center', textTransform: 'capitalize', padding: "16px, 24px, 16px, 24px", borderRadius: 4, backgroundColor: "#ff8544", color: "#1a1a1a", fontSize: 16, }}
variant="contained"
color="primary"
disabled={
@@ -444,29 +444,29 @@ const [orgName, setOrgName] = useState(selectedOrganization?.name);
<div style={{ flex: "3", color: "white" }}>
<div style={{ marginTop: 8, display: "flex" }} />
<div style={{ display: "flex" }}>
<div style={{width: "100%", maxWidth: 434, marginRight: 10}}>
<div style={{ width: "100%", maxWidth: 434, marginRight: 10 }}>
Name
<TextField
required
style={{
flex: "1",
display: "flex",
height: 35,
width: "100%",
maxWidth: 434,
marginTop: "5px",
marginRight: "15px",
backgroundColor: isEditOrgTab ? "#212121" : theme.palette.inputColor,
}}
fullWidth={true}
placeholder="Name"
type="name"
id="standard-required"
margin="normal"
variant="outlined"
value={orgName}
onBlur={() => {
if((orgName !== selectedOrganization?.name) && (orgName !== "")) {
<TextField
required
style={{
flex: "1",
display: "flex",
height: 35,
width: "100%",
maxWidth: 434,
marginTop: "5px",
marginRight: "15px",
backgroundColor: isEditOrgTab ? "#212121" : theme.palette.inputColor,
}}
fullWidth={true}
placeholder="Name"
type="name"
id="standard-required"
margin="normal"
variant="outlined"
value={orgName}
onBlur={() => {
if ((orgName !== selectedOrganization?.name) && (orgName !== "")) {
handleEditOrg(
orgName,
orgDescription,
@@ -497,61 +497,62 @@ const [orgName, setOrgName] = useState(selectedOrganization?.name);
auto_provision: selectedOrganization?.sso_config?.auto_provision,
}
)
}}}
onChange={(e) => {
if (e.target.value.length > 100) {
toast("Choose a shorter name.");
return;
}
}
}}
onChange={(e) => {
if (e.target.value.length > 100) {
toast("Choose a shorter name.");
return;
}
setOrgName(e.target.value);
}}
color="primary"
InputProps={{
style: {
color: "white",
height: "35px",
fontSize: "1em",
borderRadius: 4,
},
classes: {
notchedOutline: isEditOrgTab ? null : classes.notchedOutline,
},
}}
/>
setOrgName(e.target.value);
}}
color="primary"
InputProps={{
style: {
color: "white",
height: "35px",
fontSize: "1em",
borderRadius: 4,
},
classes: {
notchedOutline: isEditOrgTab ? null : classes.notchedOutline,
},
}}
/>
</div>
{userdata?.support ? (
<div style={{ alignItems: 'center' }}>
<div style={{ marginRight: '12px', color: 'white' }}>Status</div>
<FormControl style={{ width: 220, height: 35 }}>
<Select
style={{ minWidth: 220, marginTop: 5, maxWidth: 220, height: 35, borderRadius: 4 }}
id="multiselect-status"
multiple
value={selectedStatus}
onChange={(event) => {handleStatusChange(event);setSelectedStatus(event.target.value)}}
input={<OutlinedInput />}
renderValue={(selected) => selected.join(', ')}
MenuProps={MenuProps}
>
{["contacted", "lead", "demo done", "pov", "customer", "open source", "student", "internal", "creator", "tech partner", "old customer", "old lead"].map((name) => (
<MenuItem key={name} value={name}>
<Checkbox checked={selectedStatus.indexOf(name) > -1} />
<ListItemText primary={name} />
</MenuItem>
))}
</Select>
</FormControl>
</div>
): null}
<div style={{ marginRight: '12px', color: 'white' }}>Status</div>
<FormControl style={{ width: 220, height: 35 }}>
<Select
style={{ minWidth: 220, marginTop: 5, maxWidth: 220, height: 35, borderRadius: 4 }}
id="multiselect-status"
multiple
value={selectedStatus}
onChange={(event) => { handleStatusChange(event); setSelectedStatus(event.target.value) }}
input={<OutlinedInput />}
renderValue={(selected) => selected.join(', ')}
MenuProps={MenuProps}
>
{["contacted", "lead", "demo done", "pov", "customer", "open source", "student", "internal", "creator", "tech partner", "old customer", "old lead"].map((name) => (
<MenuItem key={name} value={name}>
<Checkbox checked={selectedStatus.indexOf(name) > -1} />
<ListItemText primary={name} />
</MenuItem>
))}
</Select>
</FormControl>
</div>
) : null}
{isCloud ? (
<div style={{ marginLeft: 13, fontSize: 16, color: "#9E9E9E" }} >
Region
<RegionChangeModal selectedOrganization={selectedOrganization} setSelectedRegion={setSelectedRegion} userdata={userdata} handleSendChangeRegionMail={handleSendChangeRegionMail}/>
</div>
): null}
Region
<RegionChangeModal selectedOrganization={selectedOrganization} setSelectedRegion={setSelectedRegion} userdata={userdata} handleSendChangeRegionMail={handleSendChangeRegionMail} />
</div>
) : null}
</div>
<div style={{ marginTop: "10px" }} />
About
@@ -575,38 +576,40 @@ const [orgName, setOrgName] = useState(selectedOrganization?.name);
variant="outlined"
placeholder="A description for the organization"
value={orgDescription}
onBlur={() => {if((orgDescription !== selectedOrganization?.description) && (orgDescription !== "")) {
handleEditOrg(
orgName,
orgDescription,
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: !newsletter,
weekly_recommendations: !weeklyRecommendations,
},
{
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,
}
)
}}}
onBlur={() => {
if ((orgDescription !== selectedOrganization?.description) && (orgDescription !== "")) {
handleEditOrg(
orgName,
orgDescription,
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: !newsletter,
weekly_recommendations: !weeklyRecommendations,
},
{
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,
}
)
}
}}
onChange={(e) => {
setOrgDescription(e.target.value);
}}
@@ -626,7 +629,7 @@ const [orgName, setOrgName] = useState(selectedOrganization?.name);
</div>
</div>
<Typography variant="h5" style={{ color: "rgba(241, 241, 241, 1)", fontSize: 24, fontWeight: 600, marginTop: 40, textAlign: "left" }}>
<Typography variant="h5" style={{ color: "rgba(241, 241, 241, 1)", fontSize: 24, fontWeight: 600, marginTop: 40, textAlign: "left" }}>
Preferences
</Typography>
@@ -647,9 +650,9 @@ const [orgName, setOrgName] = useState(selectedOrganization?.name);
</Grid>
<Grid item xs={12}>
<span>
<Typography style={{ fontWeight: 400, fontSize: 16 }}>Org Documentation reference</Typography>
<Typography style={{ fontWeight: 400, fontSize: 16 }}>Org Documentation reference</Typography>
<Typography variant="body2" color="textSecondary" style={{ fontWeight: 400, fontSize: 16, marginTop: 8 }}>
<Typography variant="body2" color="textSecondary" style={{ fontWeight: 400, fontSize: 16, marginTop: 8 }}>
Add a URL that is added as a link, pointing to any external documentation page you want.
</Typography>
@@ -672,7 +675,7 @@ const [orgName, setOrgName] = useState(selectedOrganization?.name);
placeholder="Paste a URL to an external reference for this implementation"
value={documentationReference}
onBlur={() => {
if(documentationReference !== selectedOrganization?.defaults?.documentation_reference) {
if (documentationReference !== selectedOrganization?.defaults?.documentation_reference) {
handleEditOrg(
orgName,
orgDescription,
@@ -714,7 +717,7 @@ const [orgName, setOrgName] = useState(selectedOrganization?.name);
},
style: {
color: "white",
fontWeight: 400,
fontSize: 16,
borderRadius: 4,
@@ -728,16 +731,16 @@ const [orgName, setOrgName] = useState(selectedOrganization?.name);
globalUrl={globalUrl}
userdata={userdata}
serverside={false}
/>
/>
<Grid item xs={12} style={{ marginTop: 20, }}>
<Typography variant="h4" style={{ textAlign: "left", color: "rgba(241, 241, 241, 1)", fontSize: 24, fontWeight: 600, }}>Workflow Backup Repository</Typography>
<Typography variant="body2" style={{ textAlign: "left", marginTop: 8, color: "#9E9E9E", fontSize: 16, fontWeight: 400 }}>
Decide where workflows are backed up in a Git repository. Will create logs and notifications if upload fails. The repository and branch must already have been initialized. Files will show up in the repo root in the /orgId/workflow-status/workflowId.json format. <b>MSSP:</b> If suborg exists, this will automatically be applied for them as well (not retroactive). <a href="/docs/configuration#environment-variables" style={{textDecoration: "none", color: "#f86a3e"}} target="_blank">Credentials are encrypted.</a>
<Typography variant="h4" style={{ textAlign: "left", color: "rgba(241, 241, 241, 1)", fontSize: 24, fontWeight: 600, }}>Workflow Backup Repository</Typography>
<Typography variant="body2" style={{ textAlign: "left", marginTop: 8, color: "#9E9E9E", fontSize: 16, fontWeight: 400 }}>
Decide where workflows are backed up in a Git repository. Will create logs and notifications if upload fails. The repository and branch must already have been initialized. Files will show up in the repo root in the /orgId/workflow-status/workflowId.json format. <b>MSSP:</b> If suborg exists, this will automatically be applied for them as well (not retroactive). <a href="/docs/configuration#environment-variables" style={{ textDecoration: "none", color: "#f86a3e" }} target="_blank">Credentials are encrypted.</a>
</Typography>
<Grid container style={{ marginTop: 10, }} spacing={2}>
<Grid item xs={6} style={{}}>
<span>
<Typography style={{ fontWeight: 400, fontSize: 16 }}>Repository for workflow backup</Typography>
<Typography style={{ fontWeight: 400, fontSize: 16 }}>Repository for workflow backup</Typography>
<TextField
required
style={{
@@ -765,7 +768,7 @@ const [orgName, setOrgName] = useState(selectedOrganization?.name);
},
style: {
color: "white",
fontWeight: 400,
fontSize: 16,
borderRadius: 4,
@@ -777,7 +780,7 @@ const [orgName, setOrgName] = useState(selectedOrganization?.name);
</Grid>
<Grid item xs={6} style={{}}>
<span>
<Typography style={{ fontWeight: 400, fontSize: 16 }}>Branch</Typography>
<Typography style={{ fontWeight: 400, fontSize: 16 }}>Branch</Typography>
<TextField
required
style={{
@@ -805,7 +808,7 @@ const [orgName, setOrgName] = useState(selectedOrganization?.name);
},
style: {
color: "white",
fontWeight: 400,
fontSize: 16,
borderRadius: 4,
@@ -819,7 +822,7 @@ const [orgName, setOrgName] = useState(selectedOrganization?.name);
<Grid container style={{ marginTop: 10, }} spacing={2}>
<Grid item xs={6} style={{}}>
<span>
<Typography style={{ fontWeight: 400, fontSize: 16 }}>Username for backup of workflows</Typography>
<Typography style={{ fontWeight: 400, fontSize: 16 }}>Username for backup of workflows</Typography>
<TextField
required
style={{
@@ -847,7 +850,7 @@ const [orgName, setOrgName] = useState(selectedOrganization?.name);
},
style: {
color: "white",
fontWeight: 400,
fontSize: 16,
borderRadius: 4,
@@ -859,7 +862,7 @@ const [orgName, setOrgName] = useState(selectedOrganization?.name);
</Grid>
<Grid item xs={6} style={{}}>
<span>
<Typography style={{ fontWeight: 400, fontSize: 16 }}>Git token/password</Typography>
<Typography style={{ fontWeight: 400, fontSize: 16 }}>Git token/password</Typography>
<TextField
required
style={{
@@ -886,7 +889,7 @@ const [orgName, setOrgName] = useState(selectedOrganization?.name);
},
style: {
color: "white",
fontWeight: 400,
fontSize: 16,
borderRadius: 4,
@@ -930,7 +933,7 @@ const [orgName, setOrgName] = useState(selectedOrganization?.name);
},
style: {
color: "white",
fontWeight: 400,
fontSize: 16,
borderRadius: 4,
@@ -970,7 +973,7 @@ const [orgName, setOrgName] = useState(selectedOrganization?.name);
},
style: {
color: "white",
fontWeight: 400,
fontSize: 16,
borderRadius: 4,
@@ -1010,7 +1013,7 @@ const [orgName, setOrgName] = useState(selectedOrganization?.name);
},
style: {
color: "white",
fontWeight: 400,
fontSize: 16,
borderRadius: 4,
@@ -1050,7 +1053,7 @@ const [orgName, setOrgName] = useState(selectedOrganization?.name);
},
style: {
color: "white",
fontWeight: 400,
fontSize: 16,
borderRadius: 4,
@@ -1080,14 +1083,14 @@ const [orgName, setOrgName] = useState(selectedOrganization?.name);
export default OrgHeaderexpandedNew;
const RegionChangeModal = memo(({selectedOrganization, setSelectedRegion, userdata, handleSendChangeRegionMail}) => {
const RegionChangeModal = memo(({ selectedOrganization, setSelectedRegion, userdata, handleSendChangeRegionMail }) => {
// Show from options: "us-west2", "europe-west2", "europe-west3", "northamerica-northeast1"
// var regions = ["us-west2", "europe-west2", "europe-west3", "northamerica-northeast1"]
const regionMapping = {
"US": "us",
"EU-2": "eu",
"CA": "ca",
"UK": "gb"
"UK": "gb",
};
//let regiontag = "UK";
@@ -1095,6 +1098,7 @@ const RegionChangeModal = memo(({selectedOrganization, setSelectedRegion, userda
let regionCode = "gb";
const regionsplit = selectedOrganization?.region_url?.split(".");
if (regionsplit?.length > 2 && !regionsplit[0]?.includes("shuffler")) {
const namesplit = regionsplit[0]?.split("/");
regiontag = namesplit[namesplit.length - 1];
@@ -1103,58 +1107,59 @@ const RegionChangeModal = memo(({selectedOrganization, setSelectedRegion, userda
regiontag = "US";
regionCode = "us";
} else if (regiontag === "frankfurt") {
regiontag = "EU";
regiontag = "EU-2";
regionCode = "eu";
} else if (regiontag === "ca") {
regiontag = "CA";
regionCode = "ca";
}
}
return (
<FormControl style={{ display: "flex", flexDirection: "column", marginTop: 5, alignItems: "center" }} >
{/* <InputLabel id="demo-simple-select-label">Region</InputLabel> */}
<Select
labelId="demo-simple-select-label"
id="demo-simple-select"
value={regiontag}
style={{minWidth: 120, height: 35, borderRadius: 4 }}
onChange={(e) => {
if(userdata?.support){
setSelectedRegion(e.target.value)
}else{
handleSendChangeRegionMail(e.target.value)
}
}}
>
{Object.keys(regionMapping).map((region, index) => {
const regionImageCode = regionMapping[region];
// Set the default region if selectedOrganization.region is not set
if (selectedOrganization.region === undefined) {
selectedOrganization.region = "europe-west2";
}
// Check if the current region matches the selected region
if (region === selectedOrganization.region) {
// If the region matches, set the MenuItem as selected
return (
<MenuItem value={region} key={index} disabled>
{/* show region image through cdn */}
<img src={`https://flagcdn.com/48x36/${regionImageCode}.png`} alt={region} style={{ marginRight: 10 }} />
return (
<FormControl style={{ display: "flex", flexDirection: "column", marginTop: 5, alignItems: "center" }} >
{/* <InputLabel id="demo-simple-select-label">Region</InputLabel> */}
<Select
labelId="demo-simple-select-label"
id="demo-simple-select"
value={regiontag}
style={{ minWidth: 120, height: 35, borderRadius: 4 }}
onChange={(e) => {
if (userdata?.support) {
setSelectedRegion(e.target.value)
} else {
handleSendChangeRegionMail(e.target.value)
}
}}
>
{Object.keys(regionMapping).map((region, index) => {
const regionImageCode = regionMapping[region];
// Set the default region if selectedOrganization.region is not set
if (selectedOrganization.region === undefined) {
selectedOrganization.region = "europe-west2";
}
// Check if the current region matches the selected region
if (region === selectedOrganization.region) {
// If the region matches, set the MenuItem as selected
return (
<MenuItem value={region} key={index} disabled>
{/* show region image through cdn */}
<img src={`https://flagcdn.com/48x36/${regionImageCode}.png`} alt={region} style={{ marginRight: 10 }} />
{region}
</MenuItem>
);
} else {
return <MenuItem sx={{ display: 'flex' }} key={index} value={region}>
<img
src={`https://flagcdn.com/48x36/${regionImageCode}.png`}
alt={region}
style={{ marginRight: 10, width: 20, height: 18, }}
/>
{region}
</MenuItem>
);
} else {
return <MenuItem sx={{display: 'flex'}} key={index} value={region}>
<img
src={`https://flagcdn.com/48x36/${regionImageCode}.png`}
alt={region}
style={{ marginRight: 10, width: 20, height: 18,}}
/>
{region}
</MenuItem>;
}
})}
</Select>
</FormControl>
);
}
})}
</Select>
</FormControl>
);
})
+29 -5
View File
@@ -214,6 +214,20 @@ const ParsedAction = (props) => {
}
}, [expansionModalOpen])
/*
useEffect(() => {
// This will have the OLD selectedAction, not the new one huh?
// How do we map the fields correctly?
if (selectedAction === undefined || selectedAction === null) {
console.log("Selected action is undefined")
return
}
console.log("Selected action: ", selectedAction?.name, selectedAction)
}, [selectedAction])
*/
useEffect(() => {
// Changes the order of params to show in order:
// auth, required, optional
@@ -347,7 +361,7 @@ const ParsedAction = (props) => {
}
if (keyorder.join(",") !== newkeyorder.join(",")) {
//toast("KEYORDER CHANGED!")
console.log("KEYORDER CHANGED! DID ACTION AS WELL?", keyorder, newkeyorder)
setSelectedActionParameters(newparams)
selectedAction.parameters = newparams
@@ -872,7 +886,7 @@ const ParsedAction = (props) => {
}
}
return { ...param, value: paramvalue, error: message }
});
})
setSelectedActionParameters(newParameters)
setActionlist(newActionList)
@@ -3645,6 +3659,14 @@ const ParsedAction = (props) => {
);
if ((multiline === undefined || multiline === false) && ((data?.autocompleted === true || data?.field_active === true) || data.name.startsWith("${") && data.name.endsWith("}"))) {
multiline = true
}
if (data?.autocompleted === true || data?.field_active === true) {
rows = "1"
}
var datafield = (
<Tooltip
title={tooltipDescription}
@@ -3725,7 +3747,8 @@ const ParsedAction = (props) => {
setScrollConfig(scrollConfig)
}
}}
rows={data.name.startsWith("${") && data.name.endsWith("}") ? 2 : rows}
minRows={rows}
maxRows={6}
color="primary"
// defaultValue={data.value}
value={
@@ -4034,7 +4057,8 @@ const ParsedAction = (props) => {
helperText={returnHelperText(data.name, data.value)}
fullWidth
multiline={multiline}
rows={"3"}
minRows={3}
maxRows={6}
color="primary"
defaultValue={data.value}
type={"text"}
@@ -4580,7 +4604,7 @@ const ParsedAction = (props) => {
data.field_active === true ?
<Tooltip
color="primary"
title={"This is an Simplified field to make the body easier to use. NOT required according to the API documentation. If this is filled, it will be overridden in the Advanced Body"}
title={"This is a Simplified Field to make the body easier to use. NOT required according to the API documentation. If this is filled, it will be overridden in the Advanced Body"}
placement="top"
>
<PriorityHighIcon
+4 -19
View File
@@ -354,13 +354,13 @@ const RuntimeDebugger = (props) => {
var imageSource = "";
if (params?.row?.org?.id?.length > 0) {
if (params?.row?.org?.image?.length > 0){
imageSource = params.row.org.image
imageSource = params?.row.org?.image
}else {
imageSource = "/images/no_image.png"
}
}else {
if (userdata.active_org.image?.length > 0){
imageSource = userdata.active_org.image
imageSource = userdata?.active_org?.image
}else {
imageSource = "/images/no_image.png"
}
@@ -370,7 +370,7 @@ const RuntimeDebugger = (props) => {
<span style={{}} onClick={() => {
//setStatus(params.row.status)
}}>
{userdata?.active_org?.creator_org?.length === 0 ? (
{userdata?.active_org?.creator_org?.length === 0 && suborgWorkflowRuns ? (
<img src={imageSource} alt={source} style={{borderRadius: theme.palette?.borderRadius, height: imageSize, width: imageSize, }} />
) : null}
<Tooltip title={source} placement="top">
@@ -924,28 +924,13 @@ const RuntimeDebugger = (props) => {
onClick={() => setSearchQuery('')}
/>
)}
<button
type="button"
style={{
color: "#1A1A1A",
border: "none",
padding: "10px 20px",
width: 100,
height: 35,
borderRadius: 4,
backgroundColor: "#FF8544",
cursor: "pointer",
}}
>
Search
</button>
</InputAdornment>
),
}}
onChange={(e)=>{handleQueryChange(e)}}
color="primary"
placeholder="Filter by Workflow Name, Status, Execution Argument, Results.."
placeholder="Filter by Workflow Name, Status, Execution Argument, Results"
id="shuffle_search_field"
/>
</div>
+6
View File
@@ -109,6 +109,12 @@ const SearchData = props => {
}
}, [searchOpen]);
useEffect(() => {
if (currentRefinement !== inputValue) {
refine(inputValue);
}
}, [currentRefinement]);
return (
<form id="search_form" noValidate type="searchbox" action="" role="search" onClick={() => {
@@ -27,6 +27,7 @@ import { SetJsonDotnotation } from "../views/AngularWorkflow.jsx";
import Draggable from "react-draggable";
import {
Storage as StorageIcon,
FullscreenExit as FullscreenExitIcon,
Extension as ExtensionIcon,
Apps as AppsIcon,
@@ -90,7 +91,7 @@ const pythonFilters = [
{ "name": "Using Shuffle variables", "value": `import json\nnodevalue = r\"\"\"$exec\"\"\"\nif not nodevalue:\n nodevalue = r\"\"\"{\"sample\": \"string\", \"int\": 1}\"\"\"\n \njsondata = json.loads(nodevalue)\nprint(jsondata)`, "example": `` },
{ "name": "Print Execution ID", "value": `print(self.current_execution_id)`, "example": `` },
{ "name": "Get full execution details", "value": `print(self.full_execution)`, "example": `` },
{ "name": "Use files", "value": `# Create a sample file\nfiles = [{\n \"name\": \"test.txt\",\n \"data\": \"Testdata\"\n}]\nret = self.set_files(files)\n\n# Get the content of the file from Shuffle storage\n# Originally a byte string in the \"data\" key\nfile_content = (self.get_file(ret[0])[\"data\"]).decode()\nprint(file_content)`, "example": `` },
{ "name": "Use files", "value": `# Create a sample file\nfiles = [{\n \"filename\": \"test.txt\",\n \"data\": \"Testdata\"\n}]\nret = self.set_files(files)\n\n# Get the content of the file from Shuffle storage\n# Originally a byte string in the \"data\" key\nfile_content = (self.get_file(ret[0])[\"data\"]).decode()\nprint(file_content)`, "example": `` },
{ "name": "Use datastore", "value": `key = \"testkey\"\nvalue = \"The value of the testkey\"\n\nself.set_cache(key, value)\n\n# Print the details of the key after it's been updated\n# To get the value, use self.get_cache(key)[\"value\"]\nprint(self.get_cache(key))`, "example": `` },
{ "name": "Run an App Action", "value": `response = shuffle.run_app(app_id="app", action="action_name", auth="authentication_id", params={})\nprint(response)`, "example": ``, "disabled": true, },
@@ -1805,9 +1806,11 @@ const CodeEditor = (props) => {
) : innerdata.type === "workflow_variable" ||
innerdata.type === "execution_variable" ? (
<FavoriteBorderIcon style={{ marginRight: 10 }} />
) : (
) :
innerdata.type === "Shuffle DB" ?
<StorageIcon style={{ marginRight: 10, }} />
:
<ScheduleIcon style={{ marginRight: 10 }} />
);
const handleExecArgumentHover = (inside) => {
var exec_text_field = document.getElementById(
@@ -1877,8 +1880,6 @@ const CodeEditor = (props) => {
menuPosition1.left = 0
}
//console.log("POS1: ", menuPosition1)
return parsedPaths.length > 0 ? (
<NestedMenuItem
key={innerdata.name}
+11 -1
View File
@@ -1335,7 +1335,7 @@ const UserManagmentTab = memo((props) => {
}}
>
<ListItem style={{ width: "100%", padding: "10px 10px 10px 0px", verticalAlign: 'middle', borderBottom: "1px solid #494949", display: "table-row" }}>
{["Username", "API Key", "Role", "Active", "Type", "MFA", ...(selectedOrganization?.child_orgs?.length > 0 ? ["Suborgs"]: []), "Actions", "Last Login"].map((header, index) => (
{["Username", /*"API Key",*/ "Role", /*"Active",*/ "Type", "MFA", ...(selectedOrganization?.child_orgs?.length > 0 ? ["Suborgs"]: []), "Actions", "Last Login"].map((header, index) => (
<ListItemText
key={index}
primary={header}
@@ -1458,6 +1458,8 @@ const UserManagmentTab = memo((props) => {
}}
style={{display:'table-cell', verticalAlign: 'middle' }}
/>
{/*
<ListItemText
style={{
textAlign: "center",
@@ -1488,6 +1490,8 @@ const UserManagmentTab = memo((props) => {
)
}
/>
*/}
<ListItemText
primary={
<Select
@@ -1552,10 +1556,12 @@ const UserManagmentTab = memo((props) => {
}
style={{ display:'table-cell', verticalAlign: 'middle' }}
/>
<ListItemText
primary={data.active ? "True" : "False"}
style={{display:'table-cell',verticalAlign: 'middle' , padding: "8px", textAlign: "center", color: data.active ? "#02CB70" : "#F53434" }}
/>
<ListItemText
primary={
data.login_type === undefined ||
@@ -1566,6 +1572,8 @@ const UserManagmentTab = memo((props) => {
}
style={{ display:'table-cell',verticalAlign: 'middle', padding: "8px", }}
/>
{/*
<ListItemText
primary={
data?.mfa_info !== undefined &&
@@ -1576,6 +1584,8 @@ const UserManagmentTab = memo((props) => {
}
style={{ display:'table-cell', verticalAlign: 'middle',padding: "8px", color: data.mfa_info.active ? "#02CB70" : "#F53434" }}
/>
*/}
{selectedOrganization?.child_orgs !== undefined &&
selectedOrganization?.child_orgs !== null &&
selectedOrganization?.child_orgs?.length > 0 ? (