Cloud synced

This commit is contained in:
Frikky
2024-12-20 17:26:41 +02:00
parent 75e99e2232
commit ceb724cfc6
7 changed files with 272 additions and 109 deletions
+2 -2
View File
@@ -303,7 +303,7 @@ const CacheView = memo((props) => {
Key
<TextField
color="primary"
style={{ backgroundColor: theme.palette.inputColor }}
style={{ backgroundColor: theme.palette.textFieldStyle.backgroundColor }}
autoFocus
InputProps={{
style: {
@@ -341,7 +341,7 @@ const CacheView = memo((props) => {
</div>
<TextField
color="primary"
style={{ backgroundColor: theme.palette.inputColor, marginTop: 0, }}
style={{ backgroundColor: theme.palette.textFieldStyle.backgroundColor, marginTop: 0, }}
InputProps={{
style: {
color: "white",
+22 -14
View File
@@ -280,7 +280,7 @@ const Files = memo((props) => {
<DialogContent style={{ color: "rgba(255,255,255,0.65)" }}>
Repository URL (supported: github, gitlab, bitbucket)
<TextField
style={{ backgroundColor: theme.palette.inputColor }}
style={{ backgroundColor: theme.palette.textFieldStyle.backgroundColor }}
variant="outlined"
margin="normal"
defaultValue={downloadUrl}
@@ -301,7 +301,7 @@ const Files = memo((props) => {
Branch (default value is "main"):
</span>
<TextField
style={{ backgroundColor: theme.palette.inputColor }}
style={{ backgroundColor: theme.palette.textFieldStyle.backgroundColor }}
variant="outlined"
margin="normal"
defaultValue={downloadBranch}
@@ -322,7 +322,7 @@ const Files = memo((props) => {
Folder (can use / for subfolders):
</span>
<TextField
style={{ backgroundColor: theme.palette.inputColor }}
style={{ backgroundColor: theme.palette.textFieldStyle.backgroundColor }}
variant="outlined"
margin="normal"
defaultValue={downloadFolder}
@@ -344,7 +344,7 @@ const Files = memo((props) => {
</span>
<div style={{ display: "flex" }}>
<TextField
style={{ flex: 1, backgroundColor: theme.palette.inputColor }}
style={{ flex: 1, backgroundColor: theme.palette.textFieldStyle.backgroundColork }}
variant="outlined"
margin="normal"
InputProps={{
@@ -360,7 +360,7 @@ const Files = memo((props) => {
fullWidth
/>
<TextField
style={{ flex: 1, backgroundColor: theme.palette.inputColor }}
style={{ flex: 1, backgroundColor: theme.palette.textFieldStyle.backgroundColor }}
variant="outlined"
margin="normal"
InputProps={{
@@ -668,7 +668,7 @@ const Files = memo((props) => {
{fileDownloadModal}
<div style={{ marginTop: isSelectedFiles ? 2: 20, marginBottom:20 }}>
<h2 style={{ display: isSelectedFiles ? null : "inline", marginTop: isSelectedFiles?0:null, marginBottom: isSelectedFiles?8:null }}>Files</h2>
<h2 style={{ display: isSelectedFiles ? null : "inline", marginTop: isSelectedFiles?0:null, marginBottom: isSelectedFiles?8:null, color: "#FFFFFF"}}>Files</h2>
<span style={{ marginLeft: isSelectedFiles ? null : 25, color:isSelectedFiles?"#9E9E9E":null}}>
Files from Workflows are a way to store as well as edit files.{" "}
<a
@@ -833,7 +833,7 @@ const Files = memo((props) => {
style={{
marginTop: 20,
marginBottom: 20,
backgroundColor: theme.palette.inputColor,
backgroundColor: theme.palette.textFieldStyle.backgroundColor,
}}
/>}
<div
@@ -1209,20 +1209,28 @@ const Files = memo((props) => {
export default memo(Files);
const DownloadFileIcon = memo(({ setLoadFileModalOpen, isSelectedFiles, }) => {
const { leftSideBarOpenByClick } = useContext(Context)
const DownloadFileIcon = memo(({ setLoadFileModalOpen, isSelectedFiles }) => {
return (
<Tooltip color="primary" title={"Import files to Shuffle from Git"} placement="top">
<IconButton
color="secondary"
style={{position: "absolute", right: 0, top: isSelectedFiles?null:0, left: isSelectedFiles? leftSideBarOpenByClick ? "90%": "85%":null, transition: "left 0.3s ease" }}
variant="text"
onClick={() => setLoadFileModalOpen(true)}
sx={{
position: "absolute",
right: 0,
top: isSelectedFiles ? null : 0,
left: isSelectedFiles
? "93%"
: null,
transition: "left 0.3s ease",
width: 48,
height: 48,
borderRadius: "50%",
}}
>
<CloudDownloadIcon />
</IconButton>
</Tooltip>
)
})
);
});
+5 -6
View File
@@ -93,7 +93,7 @@ const LicencePopup = (props) => {
const paperStyle = {
padding: 20,
borderRadius: theme.palette?.borderRadius,
height: "100%",
height: "100%"
}
billingInfo.subscription = {
@@ -596,6 +596,7 @@ const LicencePopup = (props) => {
</div>
: null}
</div>
{isCloud ? (
<Button
fullWidth
disabled={false}
@@ -626,11 +627,11 @@ const LicencePopup = (props) => {
:
"Add Card Details"
}
</Button>
</Button> ) : null}
<Button
variant="outlined"
style={{
marginTop: 10,
marginTop: isCloud? 10 : 30,
borderRadius: 4,
width: "100%",
cursor: "pointer",
@@ -725,14 +726,13 @@ const LicencePopup = (props) => {
}
const handleChange = (event, newValue) => {
console.log("Event, value: ", event.target, newValue)
if (shuffleVariant === 1) {
setSelectedValue(newValue)
if (newValue === 32) {
setCalculatedCost(`Get A Quote`)
} else {
setCalculatedCost(`$${newValue * 75}`)
setCalculatedCost(`$${newValue * 120}`)
}
} else {
setSelectedValue(newValue)
@@ -1112,7 +1112,6 @@ const LicencePopup = (props) => {
navigate(`/register?view=pricing&message=You need to create a user to continue`)
}
} else {
console.log("window.drift: ", window.drift)
if (window.drift !== undefined) {
window.drift.api.startInteraction({
interactionId: 386403,
+40 -4
View File
@@ -141,6 +141,7 @@ const Header = (props) => {
const [subAnchorEl, setSubAnchorEl] = React.useState(null);
const [upgradeHovered, setUpgradeHovered] = React.useState(false);
const [showTopbar, setShowTopbar] = useState(false) // Set to true to show top bar
const [selectedOrganization, setSelectedOrganization] = useState({});
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();
@@ -222,10 +223,45 @@ const Header = (props) => {
window.location.host === "shuffler.io" ||
window.location.host === "localhost:5002";
const curpath = (typeof window !== "undefined" && window.location && typeof window.location.pathname === "string")
? window.location.pathname
: "";
const handleGetOrg = (orgId) => {
fetch(`${globalUrl}/api/v1/orgs/${orgId}`, {
method: "GET",
credentials: "include",
headers: {
"Content-Type": "application/json",
},
})
.then((response) => {
if (response.status === 401) {
}
return response.json();
})
.then((responseJson) => {
if (responseJson["success"] === false) {
console.log("Error getting org: ", responseJson);
} else {
setSelectedOrganization(responseJson);
}
})
.catch((error) => {
console.log("Error getting org: ", error);
});
};
useEffect(() => {
if (isLoggedIn && userdata?.active_org?.id?.length > 0) {
handleGetOrg(userdata.active_org.id);
}
}, [isLoggedIn]);
// DEBUG HERE
const handleClickLogout = () => {
console.log("SHOULD LOG OUT");
@@ -441,7 +477,7 @@ const Header = (props) => {
})
</MenuItem>
</Link>
<Link to="/usecases2" style={hrefStyle}>
<Link to="/usecases" style={hrefStyle}>
<MenuItem
onClick={(event) => {
handleClose();
@@ -537,9 +573,9 @@ const Header = (props) => {
isLoaded={isLoaded}
isLoggedIn={isLoggedIn}
globalUrl={globalUrl}
selectedOrganization={selectedOrganization}
billingInfo={billingInfo}
isCloud={isCloud}
userdata={userdata}
stripeKey={stripeKey}
setModalOpen={setModalOpen}
@@ -590,7 +626,7 @@ const Header = (props) => {
</List>
<List className={classes.menuList} component="nav">
<ListItem style={{ textAlign: "center", marginLeft: "0px" }}>
<Link to="/usecases2" style={hrefStyle}>
<Link to="/usecases" style={hrefStyle}>
<Button
variant="text"
color="secondary"
+49 -36
View File
@@ -4859,7 +4859,7 @@ const releaseToConnectLabel = "Release to Connect"
// This causes memory referencing to become a nightmare
const data = event.target.data()
if (data.app_name === "Shuffle Workflow") {
if ((data.parameters !== undefined) && (data.parameters.length > 0)) {
if ((data?.parameters !== undefined) && (data?.parameters?.length > 0)) {
getWorkflowApps(data.parameters[0].value)
}
}
@@ -10657,7 +10657,7 @@ const releaseToConnectLabel = "Release to Connect"
return(
<div style={{marginLeft: index !== 0 ? 5 : 0, }}>
<div key={index} style={{marginLeft: index !== 0 ? 5 : 0, }}>
<ParsedAppPaper small={true} action={trigger.name} app={JSON.parse(JSON.stringify(trigger))} />
</div>
)
@@ -11200,7 +11200,7 @@ const releaseToConnectLabel = "Release to Connect"
const minSize = 370
var rightsidebarStyle = {
position: "fixed",
top: appBarSize - 35,
top: workflow?.public && !isLoggedIn ? 100 : showWorkflowRevisions ? 100 : appBarSize - 35,
right: 25,
height: "90vh",
maxWidth: 600,
@@ -13218,7 +13218,7 @@ const releaseToConnectLabel = "Release to Connect"
};
if (Object.getOwnPropertyNames(selectedTrigger).length > 0) {
if (Object.getOwnPropertyNames(selectedTrigger)?.length > 0) {
if (workflow.triggers[selectedTriggerIndex] === undefined) {
return null;
}
@@ -14378,7 +14378,7 @@ const releaseToConnectLabel = "Release to Connect"
// Special SCHEDULE handler
var trigger_header_auth = ""
if (Object.getOwnPropertyNames(selectedTrigger).length > 0 && workflow.triggers !== null && workflow.triggers !== undefined && workflow.triggers.length >= selectedTriggerIndex && workflow.triggers[selectedTriggerIndex] !== undefined ) {
if (Object.getOwnPropertyNames(selectedTrigger)?.length > 0 && workflow?.triggers !== null && workflow?.triggers !== undefined && workflow?.triggers?.length >= selectedTriggerIndex && workflow?.triggers[selectedTriggerIndex] !== undefined ) {
if (selectedTrigger.trigger_type === "SCHEDULE" && workflow.triggers[selectedTriggerIndex].parameters === undefined || workflow.triggers[selectedTriggerIndex].parameters === null) {
console.log("Autofixing schedule")
@@ -14447,7 +14447,7 @@ const releaseToConnectLabel = "Release to Connect"
if (
workflow.triggers[selectedTriggerIndex].parameters === undefined ||
workflow.triggers[selectedTriggerIndex].parameters === null ||
workflow.triggers[selectedTriggerIndex].parameters.length === 0
workflow?.triggers[selectedTriggerIndex]?.parameters?.length === 0
) {
workflow.triggers[selectedTriggerIndex].parameters = [];
workflow.triggers[selectedTriggerIndex].parameters[0] = {
@@ -14485,7 +14485,7 @@ const releaseToConnectLabel = "Release to Connect"
}
}
const WebhookSidebar = Object.getOwnPropertyNames(selectedTrigger).length === 0 || workflow.triggers[selectedTriggerIndex] === undefined || selectedTrigger.trigger_type !== "WEBHOOK" ? null :
const WebhookSidebar =!selectedTrigger || Object.getOwnPropertyNames(selectedTrigger)?.length === 0 || !workflow?.triggers || workflow?.triggers[selectedTriggerIndex] === undefined || selectedTrigger?.trigger_type !== "WEBHOOK" ? null :
<div style={appApiViewStyle}>
<h3 style={{ marginBottom: "5px" }}>
{selectedTrigger.app_name}: {selectedTrigger.status}
@@ -14752,8 +14752,8 @@ const releaseToConnectLabel = "Release to Connect"
</div>
<TextField
style={{
backgroundColor: theme.palette.inputColor,
borderRadius: theme.palette?.borderRadius,
backgroundColor: theme.palette.textFieldStyle.backgroundColor,
borderRadius: theme.palette.textFieldStyle.borderRadius,
}}
id="webhook_uri_field"
onClick={() => {
@@ -15217,7 +15217,7 @@ const releaseToConnectLabel = "Release to Connect"
})
}
const UserinputSidebar = Object.getOwnPropertyNames(selectedTrigger).length === 0 || workflow.triggers[selectedTriggerIndex] === undefined || selectedTrigger.trigger_type !== "USERINPUT" ? null :
const UserinputSidebar = !selectedTrigger || Object.getOwnPropertyNames(selectedTrigger)?.length === 0 || !workflow?.triggers || !workflow?.triggers[selectedTriggerIndex] || !selectedTrigger.trigger_type || selectedTrigger.trigger_type !== "USERINPUT" ? null :
<div style={appApiViewStyle}>
<h3 style={{ marginBottom: "5px" }}>
{selectedTrigger.app_name}
@@ -15378,7 +15378,13 @@ const releaseToConnectLabel = "Release to Connect"
label={<div style={{ color: "white" }}>SMS</div>}
/>
</FormGroup>
{workflow.triggers[selectedTriggerIndex].parameters[2] !== undefined && workflow.triggers[selectedTriggerIndex].parameters[2].value.includes("subflow") ? (
{workflow?.triggers &&
workflow?.triggers[selectedTriggerIndex] &&
workflow?.triggers[selectedTriggerIndex].parameters &&
workflow?.triggers[selectedTriggerIndex].parameters[2] &&
workflow?.triggers[selectedTriggerIndex].parameters[2].value &&
workflow?.triggers[selectedTriggerIndex].parameters[2].value.includes("subflow")
? (
<div style={{ }}>
{workflows === undefined ||
workflows === null ||
@@ -15506,9 +15512,13 @@ const releaseToConnectLabel = "Release to Connect"
</div>
) : null}
{workflow.triggers[selectedTriggerIndex].parameters[2] !==
undefined &&
workflow.triggers[selectedTriggerIndex].parameters[2].value.includes("email") ? (
{workflow?.triggers &&
workflow?.triggers[selectedTriggerIndex] &&
workflow?.triggers[selectedTriggerIndex].parameters &&
workflow?.triggers[selectedTriggerIndex].parameters[2] &&
workflow?.triggers[selectedTriggerIndex].parameters[2].value &&
workflow?.triggers[selectedTriggerIndex].parameters[2].value.includes("email")
? (
<TextField
style={{
backgroundColor: theme.palette.inputColor,
@@ -15538,11 +15548,15 @@ const releaseToConnectLabel = "Release to Connect"
/>
) : null}
{workflow.triggers[selectedTriggerIndex].parameters[2] !==
undefined &&
workflow.triggers[
selectedTriggerIndex
].parameters[2].value.includes("sms") ? (
{workflow?.triggers &&
workflow?.triggers[selectedTriggerIndex] &&
workflow?.triggers[selectedTriggerIndex].parameters &&
workflow?.triggers[selectedTriggerIndex].parameters[2] &&
workflow?.triggers[selectedTriggerIndex].parameters[2].value &&
(
workflow?.triggers[selectedTriggerIndex].parameters[2].value.includes("email") ||
workflow?.triggers[selectedTriggerIndex].parameters[2].value.includes("sms")
) ? (
<TextField
style={{
backgroundColor: theme.palette.inputColor,
@@ -15639,7 +15653,7 @@ const releaseToConnectLabel = "Release to Connect"
selectedTrigger.environment = defaultEnvironment.Name
setSelectedTrigger(selectedTrigger) }
const PipelineSidebar = Object.getOwnPropertyNames(selectedTrigger).length === 0 || workflow.triggers[selectedTriggerIndex] === undefined && selectedTrigger.trigger_type !== "SCHEDULE" ? null :
const PipelineSidebar = !selectedTrigger || Object.getOwnPropertyNames(selectedTrigger)?.length === 0 || !workflow?.triggers || !workflow?.triggers[selectedTriggerIndex] || !selectedTrigger.trigger_type || selectedTrigger.trigger_type !== "SCHEDULE" ? null :
<div style={appApiViewStyle}>
<h3 style={{ marginBottom: "5px" }}>
{selectedTrigger.app_name}: {selectedTrigger.status}
@@ -15901,7 +15915,7 @@ const releaseToConnectLabel = "Release to Connect"
</div>
</div>
const ScheduleSidebar = Object.getOwnPropertyNames(selectedTrigger).length === 0 || workflow.triggers[selectedTriggerIndex] === undefined && selectedTrigger.trigger_type !== "SCHEDULE" ? null :
const ScheduleSidebar = !selectedTrigger || Object.getOwnPropertyNames(selectedTrigger)?.length === 0 || !workflow?.triggers || !workflow?.triggers[selectedTriggerIndex] && (!selectedTrigger.trigger_type || selectedTrigger.trigger_type !== "SCHEDULE") ? null :
<div style={appApiViewStyle}>
<h3 style={{ marginBottom: "5px" }}>
{selectedTrigger.app_name}: {selectedTrigger.status}
@@ -16158,9 +16172,8 @@ const releaseToConnectLabel = "Release to Connect"
position: "absolute",
top: isMobile ? 30 : 25,
left: isMobile ? 20 : leftSideBarOpenByClick ? leftBarSize + 275 : leftBarSize+135,
transition: "left 0.3s ease",
transform: isMobile ? "translateX(20px)" : `translateX(${leftBarSize}px)`,
transition: "all 0.3s ease",
zoom: 0.9,
}
@@ -16922,7 +16935,7 @@ const releaseToConnectLabel = "Release to Connect"
border: "1px solid rgba(255,255,255,0.1)",
position: "absolute",
bottom: 100,
left: leftSideBarOpenByClick ? leftBarSize+300 : leftBarSize+115,
left: leftSideBarOpenByClick ? leftBarSize+270 : leftBarSize+115,
color: "white",
padding: 10,
@@ -17374,8 +17387,8 @@ const releaseToConnectLabel = "Release to Connect"
color="secondary"
variant="text"
style={{
height: workflow.public ? 100 : buttonHeights,
width: workflow.public ? 100 : 64,
height: buttonHeights,
width: 64,
}}
variant={
lastSaved && !workflow.public ? "text" : "contained"
@@ -17776,7 +17789,7 @@ const releaseToConnectLabel = "Release to Connect"
<Typography variant="body1" style={{ marginRight: 10, }}>
Tags
</Typography>
<div style={{ display: "flex" }}>
<div style={{ display: "flex", flexWrap: 'wrap', gap: 5, }}>
{workflow.tags.map((tag, index) => {
if (index >= 3) {
return null;
@@ -17958,9 +17971,8 @@ const releaseToConnectLabel = "Release to Connect"
</Typography>
<Button
color="primary"
variant="contained"
fullWidth
style={{ marginTop: 15, }}
style={{ marginTop: 15, backgroundColor: "#ff8544", color: "#1a1a1a", fontSize: 16, textTransform: "none" }}
onClick={() => {
// Further checks are being done on the backend
// Even if the user can "edit" a workflow on the frontend,
@@ -17990,7 +18002,7 @@ const releaseToConnectLabel = "Release to Connect"
variant="outlined"
disabled={workflow.public !== true}
fullWidth
style={{ marginTop: 15, }}
style={{ marginTop: 15, textTransform: "none", fontSize: 16}}
onClick={() => {
// setEditWorkflowDetails(true)
// workflow.public = false
@@ -20554,7 +20566,7 @@ const releaseToConnectLabel = "Release to Connect"
);
const newView = (
<div style={{ color: "white", marginLeft: leftSideBarOpenByClick ? 280 : 100, transition: "margin-left 0.3s ease", }}>
<div style={{ color: "white", marginLeft: leftSideBarOpenByClick ? workflow?.public ? 210 : 250 : workflow?.public ? isLoggedIn ? 60 : 0 : isLoggedIn ? 100 : 0, transition: "margin-left 0.3s ease", overflow: 'hidden' }}>
<div
style={{ display: "flex", borderTop: "0px solid rgba(91, 96, 100, 1)" }}
>
@@ -20590,8 +20602,8 @@ const releaseToConnectLabel = "Release to Connect"
maxZoom={2.0}
wheelSensitivity={0.25}
style={{
width: cytoscapeWidth,
height: bodyHeight - 5,
width: workflow?.public && !isLoggedIn ? cytoscapeWidth + 50 : cytoscapeWidth ,
height: workflow?.public && !isLoggedIn ? (bodyHeight - 50) : bodyHeight - 2,
backgroundColor: theme.palette.surfaceColor,
}}
stylesheet={cystyle}
@@ -20678,7 +20690,7 @@ const releaseToConnectLabel = "Release to Connect"
{/* Most important: Actions. But these are a lot more complex */}
{rightSideBarOpen && (selectedTrigger.trigger_type === "SCHEDULE" || selectedTrigger.trigger_type === "WEBHOOK" || selectedTrigger.trigger_type === "PIPELINE" || selectedTrigger.trigger_type === "USERINPUT") ?
<div id="rightside_actions" style={rightsidebarStyle}>
{Object.getOwnPropertyNames(selectedTrigger).length > 0 ?
{Object.getOwnPropertyNames(selectedTrigger)?.length > 0 ?
selectedTrigger.trigger_type === "SCHEDULE" ?
ScheduleSidebar
: selectedTrigger.trigger_type === "PIPELINE" ?
@@ -20693,7 +20705,7 @@ const releaseToConnectLabel = "Release to Connect"
: null}
{
rightSideBarOpen && selectedTrigger.trigger_type === "SUBFLOW"&& Object.getOwnPropertyNames(selectedTrigger).length > 0 ?
rightSideBarOpen && selectedTrigger?.trigger_type === "SUBFLOW"&& Object.getOwnPropertyNames(selectedTrigger)?.length > 0 ?
<div id="rightside_actions" style={rightsidebarStyle}>
<SubflowSidebar/>
</div> : null
@@ -22033,6 +22045,7 @@ const releaseToConnectLabel = "Release to Connect"
<Paper
style={{padding: "15px 15px 15px 25px", minHeight: 105, maxHeight: 105, cursor: "pointer", backgroundColor: newrevision.edited === selectedVersion.edited ? "rgba(255,255,255,0.3)" : theme.palette.surfaceColor, border: showBorder === true ? `1px solid ${green}` : "1px solid rgba(255,255,255,0.3)", marginBottom: 10,
}} onClick={(e) => {
setRightSideBarOpen(false)
if (newrevision.edited === selectedVersion.edited) {
console.log("Same revision! No setting.")
return
+44 -5
View File
@@ -1724,6 +1724,22 @@ const Apps2 = (props) => {
setOpenModal(false)
}
const tabStyle = {
textTransform: 'none',
marginRight: 20,
fontFamily: theme?.typography?.fontFamily,
fontSize: 16,
borderBottom: "5px solid transparent",
minHeight: "48px",
padding: "12px 16px",
}
const tabActive = {
borderBottom: "5px solid #FF8544",
borderRadius: "2px",
color: "#FF8544"
}
return (
<div style={{ paddingTop: 70, paddingLeft: leftSideBarOpenByClick ? 200 : 0, transition: "padding-left 0.3s ease", backgroundColor: "#1A1A1A", fontFamily: theme?.typography?.fontFamily, zoom: 0.7, }}>
<InstantSearch searchClient={searchClient} indexName="appsearch">
@@ -1837,12 +1853,35 @@ const Apps2 = (props) => {
<Tabs
value={currTab}
onChange={(event, newTab) => handleTabChange(event, newTab)}
TabIndicatorProps={{ style: { height: '3px', borderRadius: 10, backgroundColor: "#FF8544" } }}
style={{ fontFamily: theme?.typography?.fontFamily, fontSize: 16 }}
style={{
fontFamily: theme?.typography?.fontFamily,
fontSize: 16,
marginBottom: "-2px"
}}
TabIndicatorProps={{ style: { display: 'none' } }}
>
<Tab label="Organization Apps" style={{ textTransform: 'none', marginRight: 20, fontFamily: theme?.typography?.fontFamily, fontSize: 16 }} />
<Tab label="My Apps" style={{ textTransform: 'none', marginRight: 20, fontFamily: theme?.typography?.fontFamily, fontSize: 16 }} />
<Tab label="Discover Apps" style={{ textTransform: 'none', fontFamily: theme?.typography?.fontFamily, fontSize: 16 }} />
<Tab
label="Organization Apps"
style={{
...tabStyle,
...(currTab === 0 ? tabActive : {})
}}
/>
<Tab
label="My Apps"
style={{
...tabStyle,
...(currTab === 1 ? tabActive : {})
}}
/>
<Tab
label="Discover Apps"
style={{
...tabStyle,
marginRight: 0,
...(currTab === 2 ? tabActive : {})
}}
/>
</Tabs>
</div>
<div style={{ display: "flex", justifyContent: "space-between", gap: 10, marginBottom: 20, height: 45, paddingRight: 25 }}>
+88 -20
View File
@@ -3981,6 +3981,12 @@ const Workflows2 = (props) => {
}
const iconButtonDisabledStyle = {
...iconButtonStyle,
cursor: 'not-allowed',
opacity: 0.9, // Reduce opacity
}
const Hits = ({ hits, isSearchStalled, searchQuery }) => {
return (
@@ -4110,7 +4116,7 @@ const Workflows2 = (props) => {
variant="outlined"
displayEmpty
multiple
value={currentRefinement || []} // Ensure currentRefinement is always an array
value={currentRefinement || []}
onChange={handleChange}
style={{
width: "25%",
@@ -4120,7 +4126,24 @@ const Workflows2 = (props) => {
borderRadius: 4,
backgroundColor: "#212121",
fontFamily: theme?.typography?.fontFamily,
color: "#FFFFFF", // White text for better readability
color: "#FFFFFF",
}}
MenuProps={{
anchorOrigin: {
vertical: 'bottom',
horizontal: 'left',
},
transformOrigin: {
vertical: 'top',
horizontal: 'left',
},
PaperProps: {
style: {
backgroundColor: '#212121',
color: '#FFFFFF',
fontFamily: theme?.typography?.fontFamily,
}
}
}}
sx={{
'& .MuiOutlinedInput-root': {
@@ -4154,7 +4177,7 @@ const Workflows2 = (props) => {
)
}
>
<MenuItem disabled value="">
<MenuItem disabled value="" style={{ fontFamily: theme?.typography?.fontFamily, fontSize: 16 }}>
All Usecases
</MenuItem>
{items.map((usecase, index) => (
@@ -4168,12 +4191,12 @@ const Workflows2 = (props) => {
backgroundColor: '#3A3A3A', // Darker background on hover
},
fontFamily: theme?.typography?.fontFamily,
fontSize: "16px"
fontSize: 16
}}
>
<Checkbox
checked={currentRefinement.includes(usecase.label)}
style={{ marginRight: 8, color: '#FFFFFF' }}
style={{ marginRight: 8, color: '#FFFFFF', fontSize: 16 }}
/>
{usecase.label} ({usecase.count})
</MenuItem>
@@ -4183,6 +4206,21 @@ const Workflows2 = (props) => {
};
const CustomCategoryDropdown = connectRefinementList(CategoryDropdown)
const tabStyle = {
textTransform: 'none',
marginRight: 20,
fontFamily: theme?.typography?.fontFamily,
fontSize: 16,
borderBottom: "5px solid transparent",
minHeight: "48px",
padding: "12px 16px",
}
const tabActive = {
borderBottom: "5px solid #FF8544",
borderRadius: "2px",
color: "#FF8544"
}
const WorkflowView = memo(() => {
@@ -4211,13 +4249,36 @@ const Workflows2 = (props) => {
<div style={{ borderBottom: '1px solid gray', marginBottom: 30 }}>
<Tabs
value={currTab}
onChange={handleTabChange}
TabIndicatorProps={{ style: { height: '3px', borderRadius: 10, backgroundColor: "#FF8544" } }}
style={{ fontFamily: theme?.typography?.fontFamily }}
onChange={(event, newTab) => handleTabChange(event, newTab)}
style={{
fontFamily: theme?.typography?.fontFamily,
fontSize: 16,
marginBottom: "-2px"
}}
TabIndicatorProps={{ style: { display: 'none' } }}
>
<Tab label="Organization Workflows" style={{ textTransform: 'none', marginRight: 20, fontFamily: theme?.typography?.fontFamily }} />
<Tab label="My Workflows" style={{ textTransform: 'none', marginRight: 20, fontFamily: theme?.typography?.fontFamily }} />
<Tab label="Discover Workflows" style={{ textTransform: 'none', fontFamily: theme?.typography?.fontFamily }} />
<Tab
label="Organization Apps"
style={{
...tabStyle,
...(currTab === 0 ? tabActive : {})
}}
/>
<Tab
label="My Apps"
style={{
...tabStyle,
...(currTab === 1 ? tabActive : {})
}}
/>
<Tab
label="Discover Apps"
style={{
...tabStyle,
marginRight: 0,
...(currTab === 2 ? tabActive : {})
}}
/>
</Tabs>
</div>
@@ -4435,7 +4496,8 @@ const Workflows2 = (props) => {
<div style={{ width: "50%", minWidth: "50%", maxWidth: "50%", height: 47, display: "flex", gap: 5 }}>
<div style={{
display: "flex", height: "100%",
display: "flex",
height: "100%",
justifyContent: "space-around",
flex: 0.7,
paddingLeft: 1,
@@ -4444,17 +4506,17 @@ const Workflows2 = (props) => {
}}>
<Tooltip title="Explore Workflow Runs" placement="top">
<IconButton
style={iconButtonStyle}
style={currTab === 2 ? iconButtonDisabledStyle : iconButtonStyle}
onClick={() => navigate("/workflows/debug")}
disabled={currTab === 2}
>
<QueryStatsIcon style={{ color: "#F1F1F1" }} />
<QueryStatsIcon style={{ color: currTab === 2 ? "rgba(241, 241, 241, 0.5)" : "#F1F1F1" }} />
</IconButton>
</Tooltip>
<Tooltip title={view === "grid" ? "List view" : "Grid view"} placement="top">
<IconButton
style={iconButtonStyle}
style={currTab === 2 ? iconButtonDisabledStyle : iconButtonStyle}
onClick={() => {
const newView = view === "grid" ? "list" : "grid";
localStorage.setItem("workflowView", newView);
@@ -4462,17 +4524,23 @@ const Workflows2 = (props) => {
}}
disabled={currTab === 2}
>
{view === "grid" ? <ListIcon /> : <GridOnIcon />}
{view === "grid" ?
<ListIcon style={{ color: currTab === 2 ? "rgba(255, 255, 255, 0.5)" : "white" }} /> :
<GridOnIcon style={{ color: currTab === 2 ? "rgba(255, 255, 255, 0.5)" : "white" }} />
}
</IconButton>
</Tooltip>
<Tooltip title="Import workflows" placement="top">
<IconButton
style={iconButtonStyle}
style={currTab === 2 ? iconButtonDisabledStyle : iconButtonStyle}
onClick={() => upload.click()}
disabled={currTab === 2}
>
{submitLoading ? <CircularProgress color="secondary" /> : <PublishIcon />}
{submitLoading ?
<CircularProgress color="secondary" /> :
<PublishIcon style={{ color: currTab === 2 ? "rgba(255, 255, 255, 0.5)" : "white" }} />
}
</IconButton>
</Tooltip>
@@ -4486,11 +4554,11 @@ const Workflows2 = (props) => {
<Tooltip title={`Download ALL workflows (${workflows.length})`} placement="top">
<IconButton
style={{ ...iconButtonStyle, cursor: "pointer" }}
style={(isCloud || currTab === 2) ? iconButtonDisabledStyle : { ...iconButtonStyle, cursor: "pointer" }}
disabled={isCloud || currTab === 2}
onClick={() => exportAllWorkflows(workflows)}
>
<GetAppIcon />
<GetAppIcon style={{ color: (isCloud || currTab === 2) ? "rgba(255, 255, 255, 0.5)" : "white" }} />
</IconButton>
</Tooltip>
</div>