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

Fixed most of the new MUI problems. Missing /admin and other button disabled issues

Browse Source
This commit is contained in:
Frikky
2023-07-13 01:53:27 +02:00
parent b812f54b0f
commit b9a25ee537
26 changed files with 175 additions and 1011 deletions
Download Patch File Download Diff File Expand all files Collapse all files
backend/go-app/README.md
+20
View File
@@ -0,0 +1,20 @@
# Run
go run main.go walkoff.go docker.go
## Modify
- Make sure it's connected with the latest version of the shuffle-shared library, which is used to get resources from Shuffle
## Database
- The database is Opensearch and can be modified with the SHUFFLE_OPENSEARCH_URL environment variable. See .env in the root directory for more. This requires Opensearch to be running (typically started from docker-compose.yml)
```
docker-compose up -d
docker stop shuffle-backend
docker stop shuffle-frontend
docker stop shuffle-orborus
```
## Caching
- To handle caching, it by default runs it in memory of the application itself. If you want to offload this, it can be done using the SHUFFLE_MEMCACHED environment variable, connecting to a memcached instance.
```
docker run --name shuffle-cache -p 11211:11211 -d memcached -m 1024
```
backend/go-app/main.go
+1 -2
View File
@@ -1064,7 +1064,6 @@ func handleInfo(resp http.ResponseWriter, request *http.Request) {
}
org, err := shuffle.GetOrg(ctx, item)
_ = err
if len(org.Id) > 0 {
userOrgs = append(userOrgs, shuffle.OrgMini{
Id: org.Id,
@@ -1073,7 +1072,7 @@ func handleInfo(resp http.ResponseWriter, request *http.Request) {
Image: org.Image,
})
} else {
log.Printf("[WARNING] Failed to get org %s for user %s", item, userInfo.Username)
log.Printf("[WARNING] Failed to get org %s (%s) for user %s. Error: %#v", org.Name, item, userInfo.Username, err)
}
}
frontend/package.json
+17 -24
View File
@@ -4,30 +4,25 @@
"version": "1.3.0",
"private": true,
"dependencies": {
"@codemirror/commands": "^6.2.2",
"@codemirror/commands": "^6.2.4",
"@emotion/is-prop-valid": "^1.1.1",
"@emotion/react": "^11.7.0",
"@emotion/styled": "^11.6.0",
"@emotion/react": "^11.11.1",
"@emotion/styled": "^11.11.0",
"@lezer/highlight": "^1.1.3",
"@metamask/detect-provider": "^1.2.0",
"@mui/icons-material": "^5.14.0",
"@mui/material": "^5.2.3",
"@mui/material": "^5.14.0",
"@mui/styles": "^5.14.0",
"@mui/x-data-grid": "^5.17.11",
"@uiw/codemirror-themes": "^4.19.9",
"@uiw/react-codemirror": "^3.2.1",
"@uiw/codemirror-themes": "^4.21.7",
"@uiw/react-codemirror": "^4.21.7",
"@use-it/interval": "^1.0.0",
"algoliasearch": "^4.13.1",
"calculate-size": "^1.1.1",
"class-transformer": "^0.4.0",
"create-react-app": "^5.0.1",
"cytoscape": "^3.15.1",
"cytoscape-clipboard": "^2.2.1",
"cytoscape-cxtmenu": "^3.1.1",
"cytoscape-edgehandles": "^3.6.0",
"cytoscape-grid-guide": "~2.3.3",
"cytoscape-node-html-label": "^1.1.5",
"cytoscape-panzoom": "^2.5.2",
"cytoscape-undo-redo": "^1.3.2",
"d3": "^7.1.1",
"dotenv": "^6.1.0",
"downshift": "^3.3.5",
@@ -51,43 +46,41 @@
"mui-nested-menu": "^3.2.1",
"process": "^0.11.10",
"react": "^18.2.0",
"react-alert": "^5.5.0",
"react-alert": "^7.0.3",
"react-alert-template-basic": "^1.0.0",
"react-alice-carousel": "^2.6.4",
"react-avatar-editor": "^11.1.0",
"react-beforeunload": "^2.2.1",
"react-chartjs-2": "^2.11.1",
"react-cookie": "^4.0.1",
"react-cytoscapejs": "^1.2.0",
"react-device-detect": "^1.9.10",
"react-cytoscapejs": "^2.0.0",
"react-device-detect": "^2.2.3",
"react-dom": "^18.2.0",
"react-draggable": "^3.3.2",
"react-driftjs": "^1.2.2",
"react-dropzone": "^10.1.10",
"react-dropzone": "^14.2.3",
"react-ga4": "^2.0.0",
"react-iframe": "^1.8.0",
"react-instantsearch-dom": "^6.28.0",
"react-json-pretty": "^2.2.0",
"react-json-view": "^1.19.1",
"react-json-view": "^1.21.3",
"react-markdown": "^8.0.7",
"react-markdown-github": "^3.3.1",
"react-powerhooks": "0.0.7",
"react-router": "6.2.1",
"react-router-dom": "6.2.1",
"react-router": "^6.14.1",
"react-router-dom": "^6.14.1",
"react-scripts": "^5.0.1",
"react-shepherd": "^3.3.6",
"reactstrap": "^7.1.0",
"reaviz": "^12.1.0",
"reaviz": "^14.9.4",
"search-insights": "^2.2.1",
"shellwords": "^0.1.1",
"simplebar": "^4.2.3",
"styled-components": "^4.4.0",
"yaml": "^1.7.2",
"yamljs": "^0.3.0",
"zone.js": "~0.11.4"
"zone.js": "^0.13.1"
},
"scripts": {
"start": "HTTPS=false&&PORT=3000 react-scripts --openssl-legacy-provider start",
"start": "HTTPS=false&&PORT=3000 GENERATE_SOURCEMAP=false react-scripts --openssl-legacy-provider start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject",
frontend/src/App.jsx
+19 -132
View File
@@ -30,6 +30,7 @@ import SettingsPage from "./views/SettingsPage";
import KeepAlive from "./views/KeepAlive.jsx";
import { ThemeProvider } from "@mui/material/styles";
import CssBaseline from '@mui/material/CssBaseline';
import UpdateAuthentication from "./views/UpdateAuthentication.jsx";
import FrameworkWrapper from "./views/FrameworkWrapper.jsx";
@@ -38,7 +39,6 @@ import AlertTemplate from "./components/AlertTemplate";
import { useAlert, positions, Provider } from "react-alert";
import { isMobile } from "react-device-detect";
import detectEthereumProvider from "@metamask/detect-provider";
import Drift from "react-driftjs";
// Production - backend proxy forwarding in nginx
@@ -143,120 +143,6 @@ const App = (message, props) => {
}
// Handling Ethereum update
{/*
detectEthereumProvider().then((provider) => {
if (
provider &&
userInfo.eth_info !== undefined &&
userInfo.eth_info !== null
) {
if (
userInfo.eth_info.account !== undefined &&
userInfo.eth_info.account !== null &&
userInfo.eth_info.account.length === 0
) {
userInfo.eth_info = {};
var method = "eth_requestAccounts";
var params = [];
provider
.request({
method: method,
params,
})
.then((result) => {
if (
result !== undefined &&
result !== null &&
result.length > 0
) {
userInfo.eth_info.account = result[0];
// Getting and setting balance for the current user
method = "eth_getBalance";
params = [userInfo.eth_info.account, "latest"];
provider
.request({
method: method,
params,
})
.then((result) => {
if (
result !== undefined &&
result !== null &&
result.length > 0
) {
userInfo.parsed_balance =
result / 1000000000000000000;
} else {
alert.error("Couldn't find balance: ", result);
}
// The result varies by RPC method.
// For example, this method will return a transaction hash hexadecimal string on success.
})
.catch((error) => {
// If the request fails, the Promise will reject with an error.
alert.error(
"Failed getting info from ethereum API: " + error
);
});
} else {
alert.error("Couldn't find any user: ", result);
}
})
.catch((error) => {
// If the request fails, the Promise will reject with an error.
alert.error(
"Failed getting info from ethereum API: " + error
);
});
}
// Register hooks here
provider.on("message", (event) => {
alert.info("Message from MetaMask: ", event);
});
provider.on("chainChanged", (chainId) => {
console.log("Changed chain to: ", chainId);
method = "eth_getBalance";
params = [userInfo.eth_info.account, "latest"];
provider
.request({
method: method,
params,
})
.then((result) => {
console.log("Got result: ", result);
if (result !== undefined && result !== null) {
userInfo.eth_info.balance = result;
userInfo.eth_info.parsed_balance =
result / 1000000000000000000;
console.log("INFO: ", userInfo);
setUserData(userInfo);
} else {
alert.error("Couldn't find balance: ", result);
}
})
.catch((error) => {
// If the request fails, the Promise will reject with an error.
alert.error(
"Failed getting info from ethereum API: " + error
);
});
});
}
});
if (
userInfo.eth_info !== undefined &&
userInfo.eth_info.balance !== undefined
) {
//console.log(userInfo.eth_info.balance)
userInfo.eth_info.parsed_balance =
userInfo.eth_info.balance / 1000000000000000000;
}
*/}
//console.log("USER: ", userInfo)
setUserData(userInfo);
@@ -529,8 +415,8 @@ const App = (message, props) => {
/>
}
/>
<Route exact path="/workflows/:key/run" element={<RunWorkflow userdata={userdata} globalUrl={globalUrl} isLoaded={isLoaded} isLoggedIn={isLoggedIn} surfaceColor={theme.palette.surfaceColor} inputColor={theme.palette.inputColor}{...props} /> } />
<Route exact path="/workflows/:key/execute" element={<RunWorkflow userdata={userdata} globalUrl={globalUrl} isLoaded={isLoaded} isLoggedIn={isLoggedIn} surfaceColor={theme.palette.surfaceColor} inputColor={theme.palette.inputColor}{...props} /> } />
<Route exact path="/workflows/:key/run" element={<RunWorkflow userdata={userdata} globalUrl={globalUrl} isLoaded={isLoaded} isLoggedIn={isLoggedIn} surfaceColor={theme.palette.surfaceColor} inputColor={theme.palette.inputColor}{...props} /> } />
<Route exact path="/workflows/:key/execute" element={<RunWorkflow userdata={userdata} globalUrl={globalUrl} isLoaded={isLoaded} isLoggedIn={isLoggedIn} surfaceColor={theme.palette.surfaceColor} inputColor={theme.palette.inputColor}{...props} /> } />
<Route
exact
path="/docs/:key"
@@ -631,22 +517,22 @@ const App = (message, props) => {
/>
}
/>
<Route
exact
path="/welcome"
element={
<Welcome
cookies={cookies}
removeCookie={removeCookie}
isLoaded={isLoaded}
isLoggedIn={isLoggedIn}
globalUrl={globalUrl}
cookies={cookies}
userdata={userdata}
{...props}
/>
}
<Route
exact
path="/welcome"
element={
<Welcome
cookies={cookies}
removeCookie={removeCookie}
isLoaded={isLoaded}
isLoggedIn={isLoggedIn}
globalUrl={globalUrl}
cookies={cookies}
userdata={userdata}
{...props}
/>
}
/>
<Route
exact
path="/"
@@ -668,6 +554,7 @@ const App = (message, props) => {
return (
<ThemeProvider theme={theme}>
<CssBaseline />
<CookiesProvider>
<BrowserRouter>
<Provider template={AlertTemplate} {...options}>
frontend/src/components/ConfigureWorkflow.jsx
+1 -1
View File
@@ -14,7 +14,7 @@ import {
List,
ListItem,
ListItemText,
Fade,
Collapse,
} from "@mui/material";
import {
FavoriteBorder as FavoriteBorderIcon,
frontend/src/components/Dropzone.jsx
+9 -1
View File
@@ -56,7 +56,11 @@ const Dropzone = ({ children, style, onDrop }) => {
};
useEffect(() => {
if (!dropzoneRef.current) return;
if (dropzoneRef === null || dropzoneRef === undefined || dropzoneRef.current === null || dropzoneRef.current === undefined) {
return
}
// Check if event listene exists for dropzoneRef.current
dropzoneRef.current.addEventListener("dragover", handleDragOver);
dropzoneRef.current.addEventListener("dragenter", handleDragEnter);
@@ -64,6 +68,10 @@ const Dropzone = ({ children, style, onDrop }) => {
dropzoneRef.current.addEventListener("drop", handleDrop);
return () => {
if (dropzoneRef.current === null || dropzoneRef.current === undefined) {
return
}
dropzoneRef.current.removeEventListener("dragover", handleDragOver);
dropzoneRef.current.removeEventListener("dragenter", handleDragEnter);
dropzoneRef.current.removeEventListener("dragleave", handleDragLeave);
frontend/src/components/Header.jsx
+3 -3
View File
@@ -688,7 +688,7 @@ const { globalUrl, setNotifications, notifications, isLoggedIn, removeCookie, ho
{/*
<PolymerIcon style={{marginRight: "5px"}} />
*/}
<span style={{marginTop: 0, marginRight: 8, }}>Workflows</span>
<Typography style={{marginTop: 0, marginRight: 8, }}>Workflows</Typography>
</div>
</Link>
</ListItem>
@@ -698,7 +698,7 @@ const { globalUrl, setNotifications, notifications, isLoggedIn, removeCookie, ho
{/*
<AppsIcon style={{marginRight: "5px"}} />
*/}
<span style={{marginTop: 0, marginRight: 5, }}>Apps</span>
<Typography style={{marginTop: 0, marginRight: 5, }}>Apps</Typography>
</div>
</Link>
</ListItem>
@@ -715,7 +715,7 @@ const { globalUrl, setNotifications, notifications, isLoggedIn, removeCookie, ho
{/*
<DescriptionIcon style={{marginRight: "5px"}} />
*/}
<span style={{marginTop: 0,}}>Docs</span>
<Typography style={{marginTop: 0,}}>Docs</Typography>
</div>
</Link>
</ListItem>
frontend/src/components/Oauth2Auth.jsx
+1 -1
View File
@@ -36,7 +36,7 @@ import {
Breadcrumbs,
CircularProgress,
Switch,
Fade,
Collapse,
} from "@mui/material";
import {
LockOpen as LockOpenIcon,
frontend/src/components/OrgHeader.jsx
-1
View File
@@ -1,7 +1,6 @@
import React, { useEffect } from "react";
import theme from '../theme.jsx';
import { makeStyles } from "@mui/styles";
import { useTheme } from "@material-ui/core/styles";
import Tooltip from "@material-ui/core/Tooltip";
import Grid from "@material-ui/core/Grid";
frontend/src/components/ParsedAction.jsx
+1 -1
View File
@@ -43,7 +43,7 @@ import {
Breadcrumbs,
CircularProgress,
Switch,
Fade,
Collapse,
Autocomplete
} from "@mui/material";
frontend/src/components/Searchfield.jsx
+5 -3
View File
@@ -206,11 +206,12 @@ const SearchField = props => {
const avatar = baseImage
var parsedUrl = isCloud ? `/workflows/${hit.objectID}` : `https://shuffler.io/workflows/${hit.objectID}`
parsedUrl += `?queryID=${hit.__queryID}`
// <a rel="noopener noreferrer" href="https://www.algolia.com/" target="_blank" style={{textDecoration: "none", color: "white"}}>
return (
<Link key={hit.objectID} to={{ pathname: parsedUrl }} rel="noopener noreferrer" style={{textDecoration: "none", color: "white",}} onClick={(event) => {
<Link key={hit.objectID} to={parsedUrl} rel="noopener noreferrer" style={{textDecoration: "none", color: "white",}} onClick={(event) => {
//console.log("CLICK")
setSearchOpen(true)
@@ -402,7 +403,7 @@ const SearchField = props => {
parsedUrl += `?queryID=${hit.__queryID}`
return (
<Link key={hit.objectID} to={{ pathname: parsedUrl }} style={{textDecoration: "none", color: "white",}} onClick={(event) => {
<Link key={hit.objectID} to={parsedUrl} style={{textDecoration: "none", color: "white",}} onClick={(event) => {
console.log("CLICK")
setSearchOpen(true)
@@ -558,7 +559,8 @@ const SearchField = props => {
if (parsedUrl.includes("/apps/")) {
const extraHash = hit.url_hash === undefined ? "" : `#${hit.url_hash}`
parsedUrl = `/apps/${hit.filename}?tab=docs&queryID=${hit.__queryID}${extraHash}`
parsedUrl = `/apps/${hit.filename}`
parsedUrl += `?tab=docs&queryID=${hit.__queryID}${extraHash}`
}
return (
frontend/src/components/ShuffleCodeEditor.jsx
+4 -4
View File
@@ -46,10 +46,10 @@ import ReactJson from "react-json-view";
import PaperComponent from "../components/PaperComponent.jsx";
import CodeMirror from '@uiw/react-codemirror';
import 'codemirror/keymap/sublime';
import 'codemirror/addon/selection/mark-selection.js'
import 'codemirror/theme/gruvbox-dark.css';
import 'codemirror/theme/duotone-light.css';
//import 'codemirror/keymap/sublime';
//import 'codemirror/addon/selection/mark-selection.js'
//import 'codemirror/theme/gruvbox-dark.css';
//import 'codemirror/theme/duotone-light.css';
import {indentWithTab} from "@codemirror/commands"
import { padding, textAlign } from '@mui/system';
import data from '../frameworkStyle.jsx';
frontend/src/components/WelcomeForm2.jsx
+7 -7
View File
@@ -16,7 +16,7 @@ import ArrowForwardIosIcon from '@mui/icons-material/ArrowForwardIos';
import theme from '../theme.jsx';
import {
Button,
Fade,
Collapse,
IconButton,
FormGroup,
FormControl,
@@ -506,7 +506,7 @@ const WelcomeForm = (props) => {
switch (step) {
case 0:
return (
<Fade in={true}>
<Collapse in={true}>
<Grid container spacing={1} style={{margin: "auto", maxWidth: 500, minWidth: 500, minHeight: sizing, maxHeight: sizing, }}>
{/*isCloud ? null :
<Typography variant="body1" style={{marginLeft: 8, marginTop: 10, marginRight: 30, }} color="textSecondary">
@@ -587,11 +587,11 @@ const WelcomeForm = (props) => {
</FormControl>
</Grid>
</Grid>
</Fade>
</Collapse>
)
case 1:
return (
<Fade in={true}>
<Collapse in={true}>
<div style={{minHeight: sizing, maxHeight: sizing, marginTop: 20, maxWidth: 500, }}>
<Typography variant="body1" style={{marginLeft: 8, marginTop: 50, marginRight: 30, marginBottom: 0, }} color="textSecondary">
Apps for each category are shown based on your activity and can be changed by clicking their icon. We will help you connect them later.
@@ -684,11 +684,11 @@ const WelcomeForm = (props) => {
</Grid>
*/}
</div>
</Fade>
</Collapse>
)
case 2:
return (
<Fade in={true}>
<Collapse in={true}>
<div style={{marginTop: 0, maxWidth: 700, minWidth: 700, margin: "auto", minHeight: sizing, maxHeight: sizing, }}>
<Typography variant="body1" style={{marginTop: 15, marginBottom: 0, maxWidth: 500, margin: "auto", marginBottom: 15, }} color="textSecondary">
These are some of our Workflow templates, used to start new Workflows. Use the right and left buttons to find <a href="/usecases" target="_blank" rel="norefferer" style={{color: "#f86a3e", textDecoration: "none", }}>new Usecases</a>, and click the orange button to build it.
@@ -755,7 +755,7 @@ const WelcomeForm = (props) => {
</div>
</div>
</div>
</Fade>
</Collapse>
)
default:
return "unknown step"
frontend/src/defaultCytoscapeStyle.js
-432
View File
@@ -1,432 +0,0 @@
const data = [
{
selector: "node",
css: {
label: "data(label)",
"text-valign": "center",
"font-family":
"Segoe UI, Tahoma, Geneva, Verdana, sans-serif, sans-serif",
"font-weight": "lighter",
"margin-right": "10px",
"font-size": "18px",
width: "80px",
height: "80px",
color: "white",
padding: "10px",
margin: "5px",
"border-width": "1px",
"text-margin-x": "10px",
"z-index": 5001,
},
},
{
selector: "edge",
css: {
"target-arrow-shape": "triangle",
"target-arrow-color": "grey",
"curve-style": "unbundled-bezier",
label: "data(label)",
"text-margin-y": "-15px",
width: "5px",
color: "white",
"line-fill": "linear-gradient",
"line-gradient-stop-positions": ["0.0", "100"],
"line-gradient-stop-colors": ["grey", "grey"],
"z-index": 5001,
},
},
{
selector: `node[type="ACTION"]`,
css: {
shape: "roundrectangle",
"background-color": "#213243",
"border-color": "#81c784",
"background-width": "100%",
"background-height": "100%",
"border-radius": "5px",
"z-index": 5001,
},
},
{
selector: `node[type="COMMENT"]`,
css: {
shape: "roundrectangle",
color: "data(color)",
width: "data(width)",
height: "data(height)",
padding: "0px",
margin: "0px",
"background-color": "data(backgroundcolor)",
"background-image": "data(backgroundimage)",
"border-color": "#ffffff",
"text-margin-x": "0px",
"z-index": 4999,
"border-radius": "5px",
"background-opacity": "0.5",
"text-wrap": "wrap",
},
},
{
selector: `node[app_name="Shuffle Tools"]`,
css: {
width: "30px",
height: "30px",
"z-index": 5000,
"font-size": "0px",
"background-width": "75%",
"background-height": "75%",
"background-color": "data(iconBackground)",
"background-fill": "data(fillstyle)",
"background-gradient-direction": "to-right",
"background-gradient-stop-colors": "data(fillGradient)",
},
},
{
selector: `node[app_name="Testing"]`,
css: {
width: "30px",
height: "30px",
"z-index": 5000,
"font-size": "0px",
},
},
{
selector: `node[?small_image]`,
css: {
"background-image": "data(small_image)",
"text-halign": "right",
},
},
{
selector: `node[?large_image]`,
css: {
"background-image": "data(large_image)",
"text-halign": "right",
},
},
{
selector: `node[type="CONDITION"]`,
css: {
shape: "diamond",
"border-color": "##FFEB3B",
padding: "30px",
},
},
{
selector: `node[type="eventAction"]`,
css: {
"background-color": "#edbd21",
},
},
{
selector: `node[type="TRIGGER"]`,
css: {
shape: "octagon",
"border-radius": "5px",
"border-color": "orange",
"background-color": "#213243",
"background-width": "100%",
"background-height": "100%",
},
},
{
selector: `node[status="running"]`,
css: {
"border-color": "#81c784",
},
},
{
selector: `node[status="stopped"]`,
css: {
"border-color": "orange",
},
},
{
selector: 'node[type="mq"]',
css: {
"background-color": "#edbd21",
},
},
{
selector: "node[?isButton]",
css: {
shape: "ellipse",
width: "15px",
height: "15px",
"z-index": "5002",
"font-size": "0px",
border: "1px solid rgba(255,255,255,0.9)",
"background-image": "data(icon)",
"background-color": "data(iconBackground)",
},
},
{
selector: "node[?isSuggestion]",
css: {
shape: "ellipse",
width: "50px",
height: "50px",
"z-index": "5002",
"font-size": "0px",
border: "1px solid rgba(255,255,255,0.9)",
"background-image": "data(large_image)",
"background-color": "data(iconBackground)",
label: "data(label)",
},
},
{
selector: "node[?canConnect]",
css: {
"border-color": "#f86a3e",
"border-width": "10px",
"z-index": "5002",
"background-color": "#f86a3e",
},
},
{
selector: "node[?isDescriptor]",
css: {
shape: "ellipse",
"border-color": "#80deea",
width: "5px",
height: "5px",
"z-index": "5002",
"font-size": "10px",
"text-valign": "center",
"text-halign": "center",
border: "1px solid black",
"margin-right": "0px",
"text-margin-x": "0px",
"background-color": "data(imageColor)",
"background-image": "data(image)",
},
},
{
selector: "node[?isStartNode]",
css: {
shape: "ellipse",
"border-color": "#80deea",
width: "80px",
height: "80px",
"font-size": "18px",
"background-width": "100%",
"background-height": "100%",
},
},
{
selector: "node[!is_valid]",
css: {
"border-color": "red",
"border-width": "10px",
},
},
{
selector: ":selected",
css: {
"background-color": "#77b0d0",
"border-color": "#77b0d0",
"border-width": "20px",
},
},
{
selector: ".skipped-highlight",
css: {
"background-color": "grey",
"border-color": "grey",
"border-width": "8px",
"transition-property": "background-color",
"transition-duration": "0.5s",
},
},
{
selector: ".success-highlight",
css: {
"background-color": "#41dcab",
"border-color": "#41dcab",
"border-width": "5px",
"transition-property": "background-color",
"transition-duration": "0.5s",
},
},
{
selector: ".hover-highlight",
css: {
"background-color": "#5f9265",
"border-color": "#5f9265",
"border-width": "5px",
"transition-property": "background-color",
"transition-duration": "0.5s",
},
},
{
selector: ".failure-highlight",
css: {
"background-color": "#8e3530",
"border-color": "#8e3530",
"border-width": "5px",
"transition-property": "background-color",
"transition-duration": "0.5s",
},
},
{
selector: ".not-executing-highlight",
css: {
"background-color": "grey",
"border-color": "grey",
"border-width": "5px",
"transition-property": "#ffef47",
"transition-duration": "0.25s",
},
},
{
selector: ".executing-highlight",
css: {
"background-color": "#ffef47",
"border-color": "#ffef47",
"border-width": "8px",
"transition-property": "border-width",
"transition-duration": "0.25s",
},
},
{
selector: ".awaiting-data-highlight",
css: {
"background-color": "#f4ad42",
"border-color": "#f4ad42",
"border-width": "5px",
"transition-property": "border-color",
"transition-duration": "0.5s",
},
},
{
selector: ".shuffle-hover-highlight",
css: {
"background-color": "#f85a3e",
"border-color": "#f85a3e",
"border-width": "12px",
"transition-property": "border-width",
"transition-duration": "0.25s",
label: "data(label)",
"font-size": "18px",
color: "white",
},
},
{
selector: "$node > node",
css: {
"padding-top": "10px",
"padding-left": "10px",
"padding-bottom": "10px",
"padding-right": "10px",
},
},
{
selector: "edge.executing-highlight",
css: {
width: "5px",
"target-arrow-color": "#ffef47",
"line-color": "#ffef47",
"transition-property": "line-color, width",
"transition-duration": "0.25s",
},
},
{
selector: `edge[?decorator]`,
css: {
width: "1px",
"line-style": "dashed",
"line-fill": "linear-gradient",
"target-arrow-color": "#f34079",
"line-gradient-stop-positions": ["0.0", "100"],
"line-gradient-stop-colors": ["#f86a3e", "#f34079"],
},
},
{
selector: "edge.success-highlight",
css: {
width: "5px",
"target-arrow-color": "#41dcab",
"line-color": "#41dcab",
"transition-property": "line-color, width",
"transition-duration": "0.5s",
"line-fill": "linear-gradient",
"line-gradient-stop-positions": ["0.0", "100"],
"line-gradient-stop-colors": ["#41dcab", "#41dcab"],
},
},
{
selector: ".eh-handle",
style: {
"background-color": "#337ab7",
width: "1px",
height: "1px",
shape: "circle",
"border-width": "1px",
"border-color": "black",
},
},
{
selector: ".eh-source",
style: {
"border-width": "3",
"border-color": "#337ab7",
},
},
{
selector: ".eh-target",
style: {
"border-width": "3",
"border-color": "#337ab7",
},
},
{
selector: ".eh-preview, .eh-ghost-edge",
style: {
"background-color": "#337ab7",
"line-color": "#337ab7",
"target-arrow-color": "#337ab7",
"source-arrow-color": "#337ab7",
},
},
{
selector: "edge:selected",
css: {
"target-arrow-color": "#f85a3e",
},
},
{
selector: `edge[?source_workflow]`,
css: {
"background-opacity": "1",
"font-size": "0px",
},
},
{
selector: `node[?source_workflow]`,
css: {
"background-opacity": "0",
"font-size": "0px",
},
},
{
selector: "node:selected",
css: {
"border-color": "#f86a3e",
"border-width": "7px",
},
},
];
//{
// selector: 'edge[?hasErrors]',
// css: {
// 'target-arrow-color': '#991818',
// 'line-color': '#991818',
// 'line-style': 'dashed',
// "line-fill": "linear-gradient",
// "line-gradient-stop-positions": ["0.0", "100"],
// "line-gradient-stop-colors": ["#991818", "#991818"],
// },
//},
export default data;
frontend/src/theme.js
-102
View File
File diff suppressed because one or more lines are too long
frontend/src/theme.jsx
+16 -30
View File
@@ -1,11 +1,11 @@
import React from "react";
import { createTheme } from "@mui/material/styles";
import { createTheme, adaptV4Theme } from "@mui/material/styles";
const theme = createTheme({
const theme = createTheme(adaptV4Theme({
palette: {
primary: {
main: "#F86743",
contrastText: "#ffffff",
contrastText: "#ffffff",
},
secondary: {
main: "#e8eaf6",
@@ -71,34 +71,20 @@ const theme = createTheme({
},
},
MuiCssBaseline: {
'@global': {
/*
scrollbarColor: "#6b6b6b #2b2b2b",
"&::-webkit-scrollbar, & *::-webkit-scrollbar": {
backgroundColor: "#2b2b2b",
},
"&::-webkit-scrollbar-thumb, & *::-webkit-scrollbar-thumb": {
borderRadius: 8,
backgroundColor: "#6b6b6b",
minHeight: 24,
border: "3px solid #2b2b2b",
},
"&::-webkit-scrollbar-thumb:focus, & *::-webkit-scrollbar-thumb:focus": {
backgroundColor: "#959595",
},
"&::-webkit-scrollbar-thumb:active, & *::-webkit-scrollbar-thumb:active": {
backgroundColor: "#959595",
},
"&::-webkit-scrollbar-thumb:hover, & *::-webkit-scrollbar-thumb:hover": {
backgroundColor: "#959595",
},
"&::-webkit-scrollbar-corner, & *::-webkit-scrollbar-corner": {
backgroundColor: "#2b2b2b",
},
*/
}
MuiCssBaseline: {
styleOverrides: `
@font-face {
font-family: 'roboto';
font-style: normal;
font-display: swap;
font-weight: 400;
src: local('roboto'), local('roboto'), format('truetype');
unicodeRange: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF;
}
`,
},
},
},
});
}));
export default theme;
frontend/src/views/Admin.jsx
+27 -29
View File
@@ -2343,22 +2343,6 @@ Let me know if you're interested, or set up a call here: https://drift.me/${user
</div>
) : (
<div>
{/*
<Tooltip
title={"Go to Organization document"}
style={{}}
aria-label={"Organization doc"}
>
<IconButton
style={{ top: -10, right: 50, position: "absolute" }}
onClick={() => {
console.log("Should go to icon")
}}
>
<FileCopyIcon style={{ color: "rgba(255,255,255,0.8)" }} />
</IconButton>
</Tooltip>
*/}
{userdata.support === true ?
<span style={{display: "flex", top: -10, right: 50, position: "absolute"}}>
@@ -2407,6 +2391,7 @@ Let me know if you're interested, or set up a call here: https://drift.me/${user
style={{}}
aria-label={"Copy orgid"}
>
<div>
<IconButton
style={{ top: -10, right: 0, position: "absolute" }}
onClick={() => {
@@ -2436,6 +2421,7 @@ Let me know if you're interested, or set up a call here: https://drift.me/${user
>
<FileCopyIcon style={{ color: "rgba(255,255,255,0.8)" }} />
</IconButton>
</div>
</Tooltip>
{selectedOrganization.defaults !== undefined && selectedOrganization.defaults.documentation_reference !== undefined && selectedOrganization.defaults.documentation_reference !== null && selectedOrganization.defaults.documentation_reference.includes("http") ?
<Tooltip
@@ -2443,6 +2429,7 @@ Let me know if you're interested, or set up a call here: https://drift.me/${user
style={{ top: -10, right: 50, position: "absolute" }}
aria-label={"Open org docs"}
>
<div>
<a href={selectedOrganization.defaults.documentation_reference} target="_blank" style={{ textDecoration: "none", }} rel="noopener noreferrer">
<IconButton
style={{ top: -10, right: 50, position: "absolute" }}
@@ -2450,6 +2437,7 @@ Let me know if you're interested, or set up a call here: https://drift.me/${user
<DescriptionIcon style={{ color: "rgba(255,255,255,0.8)" }} />
</IconButton>
</a>
</div>
</Tooltip>
: null}
{selectedOrganization.name.length > 0 ? (
@@ -2764,8 +2752,10 @@ Let me know if you're interested, or set up a call here: https://drift.me/${user
};
return (
<Zoom key={index}>
<GridItem data={griditem} />
<Zoom in={true} key={index}>
<div>
<GridItem data={griditem} />
</div>
</Zoom>
);
})}
@@ -3107,6 +3097,7 @@ Let me know if you're interested, or set up a call here: https://drift.me/${user
style={{}}
aria-label={"Copy APIkey"}
>
<div>
<IconButton
style={{}}
onClick={() => {
@@ -3143,6 +3134,7 @@ Let me know if you're interested, or set up a call here: https://drift.me/${user
style={{ color: "rgba(255,255,255,0.8)" }}
/>
</IconButton>
</div>
</Tooltip>
)
}
@@ -3715,17 +3707,19 @@ Let me know if you're interested, or set up a call here: https://drift.me/${user
title="Set in EVERY workflow"
placement="top"
>
<IconButton
style={{ marginRight: 10 }}
disabled={data.defined === false}
onClick={() => {
editAuthenticationConfig(data.id);
}}
>
<SelectAllIcon
color={data.defined ? "primary" : "secondary"}
/>
</IconButton>
<div>
<IconButton
style={{ marginRight: 10 }}
disabled={data.defined === false}
onClick={() => {
editAuthenticationConfig(data.id);
}}
>
<SelectAllIcon
color={data.defined ? "primary" : "secondary"}
/>
</IconButton>
</div>
</Tooltip>
) : (
<Tooltip
@@ -3733,6 +3727,7 @@ Let me know if you're interested, or set up a call here: https://drift.me/${user
title="Must edit before you can set in all workflows"
placement="top"
>
<div>
<IconButton
style={{ marginRight: 10 }}
onClick={() => {}}
@@ -3741,6 +3736,7 @@ Let me know if you're interested, or set up a call here: https://drift.me/${user
color={data.defined ? "primary" : "secondary"}
/>
</IconButton>
</div>
</Tooltip>
)}
<IconButton
@@ -3952,6 +3948,7 @@ Let me know if you're interested, or set up a call here: https://drift.me/${user
style={{}}
aria-label={"Copy orborus command"}
>
<div>
<IconButton
style={{}}
disabled={environment.Type === "cloud"}
@@ -3988,6 +3985,7 @@ Let me know if you're interested, or set up a call here: https://drift.me/${user
>
<FileCopyIcon disabled={environment.Type === "cloud"} style={{ color: environment.Type === "cloud" ? "rgba(255,255,255,0.2)" : "rgba(255,255,255,0.8)" }} />
</IconButton>
</div>
</Tooltip>
}
/>
frontend/src/views/AngularWorkflow.jsx
+11 -11
View File
@@ -51,7 +51,7 @@ import {
IconButton,
Menu,
Input,
Fade,
Collapse,
FormGroup,
FormControlLabel,
Typography,
@@ -119,14 +119,14 @@ import {
import * as cytoscape from "cytoscape";
import * as edgehandles from "cytoscape-edgehandles";
import * as clipboard from "cytoscape-clipboard";
//import * as clipboard from "cytoscape-clipboard";
//import undoRedo from "cytoscape-undo-redo";
//import cxtmenu from "cytoscape-cxtmenu";
import CytoscapeComponent from "react-cytoscapejs";
import undoRedo from "cytoscape-undo-redo";
import Draggable from "react-draggable";
import cytoscapestyle from "../defaultCytoscapeStyle.jsx";
import cxtmenu from "cytoscape-cxtmenu";
import { validateJson, GetIconInfo } from "./Workflows.jsx";
import { GetParsedPaths } from "./Apps.jsx";
@@ -232,9 +232,9 @@ const inputColor = "#383B40";
// http://apps.cytoscape.org/apps/yfileslayoutalgorithms
cytoscape.use(edgehandles);
cytoscape.use(clipboard);
cytoscape.use(undoRedo);
cytoscape.use(cxtmenu);
//cytoscape.use(clipboard);
//cytoscape.use(undoRedo);
//cytoscape.use(cxtmenu);
// Adds specific text to items
//import popper from 'cytoscape-popper';
@@ -12880,11 +12880,11 @@ const AngularWorkflow = (defaultprops) => {
{defaultReturn}
</SwipeableDrawer>
:
<Fade in={true} style={{ transitionDelay: `$0ms` }}>
<Collapse in={true} style={{ transitionDelay: `$0ms` }}>
<div id="rightside_actions" style={rightsidebarStyle}>
{defaultReturn}
</div>
</Fade>
</Collapse>
);
//return null;
@@ -14960,7 +14960,7 @@ const AngularWorkflow = (defaultprops) => {
</Typography>
</div>
) : (
<Fade in={true} timeout={1000} style={{ transitionDelay: `${150}ms` }}>
<Collapse in={true} timeout={1000} style={{ transitionDelay: `${150}ms` }}>
<CytoscapeComponent
elements={elements}
minZoom={0.35}
@@ -14983,7 +14983,7 @@ const AngularWorkflow = (defaultprops) => {
setCy(incy);
}}
/>
</Fade>
</Collapse>
)}
</div>
{executionModal}
frontend/src/views/Apps.jsx
+13 -13
View File
@@ -1893,27 +1893,27 @@ const Apps = (props) => {
filteredApps.length > 0 ? (
<div style={{ height: "75vh", overflowY: "auto" }}>
{filteredApps.map((app, index) => {
if (firstLoad) {
appDelay += 75
} else {
//return returnData
if (firstLoad) {
appDelay += 75
} else {
//return returnData
return <AppPaper app={app} />
}
}
return (
<Zoom key={index} in={true} style={{ transitionDelay: `${appDelay}ms` }}>
<span>
<AppPaper app={app} />
</span>
</Zoom>
)
<Zoom key={index} in={true} style={{ transitionDelay: `${appDelay}ms` }}>
<div>
<AppPaper app={app} />
</div>
</Zoom>
)
})}
{cursearch.length > 0
? null
: searchableApps.map((app, index) => {
return (
<AppPaper app={app} />
)
<AppPaper app={app} />
)
})}
</div>
) : (
frontend/src/views/Dashboard.jsx
+1 -1
View File
@@ -1,7 +1,7 @@
import React, { useState, useEffect } from "react";
import { useInterval } from "react-powerhooks";
import AppFramework from "../components/AppFramework.jsx";
import { makeStyles, useTheme } from "@mui/styles";
import { makeStyles, } from "@mui/styles";
// nodejs library that concatenates classes
import classNames from "classnames";
import theme from '../theme.jsx';
frontend/src/views/DashboardViews.jsx
+1 -1
View File
@@ -1,6 +1,6 @@
import React, { useState, useEffect } from "react";
import { useInterval } from "react-powerhooks";
import { makeStyles, useTheme } from "@mui/styles";
import { makeStyles, } from "@mui/styles";
// nodejs library that concatenates classes
import classNames from "classnames";
import theme from '../theme.jsx';
frontend/src/views/SettingsPage.jsx
-192
View File
@@ -12,8 +12,6 @@ import {
} from "@mui/material";
import { useAlert } from "react-alert";
import detectEthereumProvider from "@metamask/detect-provider";
const Settings = (props) => {
const { globalUrl, isLoaded, userdata, setUserData } = props;
const alert = useAlert();
@@ -814,65 +812,6 @@ const Settings = (props) => {
) : null}
</div>
<div style={{ flex: 1, marginTop: 20 }}>
{/*userdata !== undefined &&
userdata.eth_info !== undefined &&
userdata.eth_info.account !== undefined &&
userdata.eth_info.account.length > 0 ? (
<div style={{ width: "100%", textAlign: "left" }}>
<Typography variant="body2">Network: TBD</Typography>
<Typography variant="body2">
Address: {userdata.eth_info.account}
</Typography>
{loadedWorkflowCollections.length > 0 ? (
<Typography variant="body2">
Collections:&nbsp;
{loadedWorkflowCollections.map((data, index) => {
var collectionname = data.toLowerCase();
collectionname = collectionname.replaceAll("#", "");
collectionname = collectionname.replaceAll(" ", "-");
return (
<span key={index}>
<a
rel="noopener noreferrer"
target="_blank"
href={`https://opensea.io/collection/${collectionname}`}
style={{ textDecoration: "none", color: "#f85a3e" }}
>
{data}
</a>
&nbsp;
</span>
);
})}
</Typography>
) : null}
<Button
style={{ height: 40, marginTop: 10 }}
variant="contained"
color="primary"
fullWidth={true}
onClick={() => {
//handleEthereumTokenCreation()
loadWorkflowOwnership();
}}
>
Validate ownership
</Button>
</div>
) : (
<Button
style={{ height: 40, marginTop: 10 }}
variant="outlined"
color="primary"
fullWidth={true}
onClick={() => {
handleEthereumConnection();
}}
>
Authenticate Metamask Wallet
</Button>
)*/}
</div>
</div>
@@ -986,137 +925,6 @@ const Settings = (props) => {
//saveWorkflow(workflow);
}
const handleEthereumTokenCreation = async () => {
const provider = await detectEthereumProvider();
if (!provider) {
console.log("Please install MetaMask!");
alert.error(
"Please download the MetaMask browser extension to authenticate fully!"
);
return;
}
if (!provider.isMetaMask) {
alert.error("Only MetaMask is supported as of now.");
return;
}
if (!provider.isConnected()) {
alert.error("Metamask is not connected.");
return;
}
console.log("Should make a token");
};
const handleEthereumConnection = async () => {
const provider = await detectEthereumProvider();
if (!provider) {
console.log("Please install MetaMask!");
alert.error(
"Please download the MetaMask browser extension to authenticate fully!"
);
return;
}
if (!provider.isMetaMask) {
alert.error("Only MetaMask is supported as of now.");
return;
}
// Find the ethereum network
// Get the users' account(s)
//alert.info("Connecting to MetaMask")
//console.log("Connected: ", provider.isConnected())
if (!provider.isConnected()) {
alert.error("Metamask is not connected.");
return;
}
provider.on("message", (event) => {
alert.info("Ethereum message: ", event);
});
/*
params: [
{
from: '0xb60e8dd61c5d32be8058bb8eb970870f07233155',
to: '0xd46e8dd67c5d32be8058bb8eb970870f07244567',
gas: '0x76c0', // 30400
gasPrice: '0x9184e72a000', // 10000000000000
value: '0x9184e72a', // 2441406250
data:
'0xd46e8dd67c5d32be8d46e8dd67c5d32be8058bb8eb970870f072445675058bb8eb970870f072445675',
},
]
*/
// https://docs.metamask.io/guide/rpc-api.html
// Gets accounts - requires previous permissions
//const method = "eth_accounts"
//const params = []
//
// Asks for permission, and gets the accounts
var method = "eth_requestAccounts";
var params = [];
provider
.request({
method: method,
params,
})
.then((result) => {
if (result !== undefined && result !== null && result.length > 0) {
userdata.eth_info.account = result[0];
// Getting and setting balance for the current user
method = "eth_getBalance";
params = [userdata.eth_info.account, "latest"];
provider
.request({
method: method,
params,
})
.then((result) => {
if (
result !== undefined &&
result !== null &&
result.length > 0
) {
userdata.eth_info.balance = result;
userdata.eth_info.parsed_balance = result / 1000000000000000000;
console.log(userdata.eth_info);
setUserData(userdata.eth_info);
// Updating
//if (userdata.eth_info !== userdata.userdata.eth_info) {
//}
setUser(userdata.id, "eth_info", userdata.eth_info);
userdata.userdata.eth_info = userdata.eth_info;
} else {
alert.error("Couldn't find balance: ", result);
}
// The result varies by RPC method.
// For example, this method will return a transaction hash hexadecimal string on success.
})
.catch((error) => {
// If the request fails, the Promise will reject with an error.
//setEthInfo(userdata.eth_info)
alert.error("Failed getting info from ethereum API: " + error);
});
} else {
alert.error("Couldn't find any user: ", result);
}
})
.catch((error) => {
// If the request fails, the Promise will reject with an error.
alert.error("Failed getting info from ethereum API: " + error);
});
// Gets the users' balance in WEI (one quintilionth ETH)
};
const loadedCheck =
isLoaded && !firstrequest ? (
<div style={bodyDivStyle}>{landingpageData}</div>
frontend/src/views/Welcome.jsx
+5 -5
View File
@@ -11,7 +11,7 @@ import ArrowBackIosIcon from '@mui/icons-material/ArrowBackIos';
import {
Grid,
Container,
Fade,
Collapse,
Typography,
Paper,
Button,
@@ -417,7 +417,7 @@ const Welcome = (props) => {
<Typography variant="h6" style={{textAlign: "center", marginBottom: 25, }}>
App Framework
</Typography>
<Fade>
<Collapse>
<AppFramework
inputUsecase={inputUsecase}
frameworkData={frameworkData}
@@ -435,13 +435,13 @@ const Welcome = (props) => {
inputUsecases={usecases}
setInputUsecases={setUsecases}
/>
</Fade>
</Collapse>
</div>
}
</Grid>
</div>
:
<Fade in={true}>
<Collapse in={true}>
<div style={{maxWidth: 700, margin: "auto", marginTop: 50, }}>
{/*
<div style={{display:"flex"}}>
@@ -537,7 +537,7 @@ const Welcome = (props) => {
</Typography>
</div>
</div>
</Fade>
</Collapse>
}
</div>
)
frontend/src/views/Workflows.jsx
+11 -13
View File
@@ -8,7 +8,7 @@ import { Navigate } from "react-router-dom";
import SecurityFramework from '../components/SecurityFramework.jsx';
import EditWorkflow from "../components/EditWorkflow.jsx"
import { ShepherdTour, ShepherdTourContext } from 'react-shepherd'
//import { ShepherdTour, ShepherdTourContext } from 'react-shepherd'
import Priority from "../components/Priority.jsx";
import { isMobile } from "react-device-detect"
@@ -3459,10 +3459,11 @@ const Workflows = (props) => {
return returnData
}
/*<Zoom key={index} in={true} style={{ transitionDelay: `${appDelay}ms` }}>*/
return (
<Zoom key={index} in={true} style={{ transitionDelay: `${appDelay}ms` }}>
{returnData}
</Zoom>
<span>
{returnData}
</span>
);
})}
</div>
@@ -3499,13 +3500,11 @@ const Workflows = (props) => {
/>
: null}
{/*<Zoom in={true} style={{ transitionDelay: `${workflowDelay}ms` }}>*/}
<div style={{marginTop: 15, marginBottom: 50, }}>
{view === "grid" ? (
<Grid container spacing={filteredWorkflows.length === 0 ? 12 : filteredWorkflows.length === 1 ? 6 : 4} style={paperAppContainer}>
<Zoom in={true} style={{ transitionDelay: `${workflowDelay}ms` }}>
<NewWorkflowPaper />
</Zoom>
<NewWorkflowPaper />
{filteredWorkflows.map((data, index) => {
// Shouldn't be a part of this list
if (data.public === true) {
@@ -3522,12 +3521,11 @@ const Workflows = (props) => {
)
}
/*<Zoom key={index} in={true} style={{ transitionDelay: `${workflowDelay}ms` }}>*/
return (
<Zoom key={index} in={true} style={{ transitionDelay: `${workflowDelay}ms` }}>
<Grid item xs={isMobile ? 12 : 4} style={{ padding: "12px 10px 12px 10px" }}>
<WorkflowPaper key={index} data={data} />
</Grid>
</Zoom>
<Grid item xs={isMobile ? 12 : 4} style={{ padding: "12px 10px 12px 10px" }}>
<WorkflowPaper key={index} data={data} />
</Grid>
)
})}
</Grid>
functions/onprem/orborus/build.sh
+1 -1
View File
@@ -1,5 +1,5 @@
NAME=shuffle-orborus
VERSION=1.2.1
VERSION=1.2.2
echo "Running docker build with $NAME:$VERSION"
#docker rmi frikky/shuffle:$NAME --force
functions/onprem/worker/build.sh
+1 -1
View File
@@ -1,5 +1,5 @@
NAME=shuffle-worker
VERSION=1.2.0
VERSION=1.2.1
echo "Running docker build with $NAME:$VERSION"
#CGO_ENABLED=0 GOOS=linux go build -a -installsuffix cgo -o worker.bin .