Started react 16->18 migration and material-ui->mui migration

This commit is contained in:
Frikky
2023-07-12 01:28:07 +02:00
parent 8bde1e6a42
commit 5b72c8d517
45 changed files with 624 additions and 139 deletions
+21 -16
View File
@@ -7,9 +7,7 @@ import CodeEditor from "../components/ShuffleCodeEditor.jsx";
import getLocalCodeData from "../components/ShuffleCodeEditor.jsx";
import CacheView from "../components/CacheView.jsx";
import theme from "../theme.jsx";
import AddIcon from "@mui/icons-material/Add";
import ClearIcon from '@mui/icons-material/Clear';
import StorageIcon from '@mui/icons-material/Storage';
//import ToggleButton from '@mui/material/ToggleButton';
import {
FormControl,
@@ -57,7 +55,7 @@ import {
OpenInNew as OpenInNewIcon,
CloudDownload as CloudDownloadIcon,
Description as DescriptionIcon,
Polymer as PolymerIcon,
Code as CodeIcon,
CheckCircle as CheckCircleIcon,
Close as CloseIcon,
Apps as AppsIcon,
@@ -66,13 +64,15 @@ import {
Cached as CachedIcon,
AccessibilityNew as AccessibilityNewIcon,
Lock as LockIcon,
Eco as EcoIcon,
Schedule as ScheduleIcon,
Cloud as CloudIcon,
Business as BusinessIcon,
Visibility as VisibilityIcon,
VisibilityOff as VisibilityOffIcon,
} from "@material-ui/icons";
Visibility as VisibilityIcon,
VisibilityOff as VisibilityOffIcon,
Add as AddIcon,
Clear as ClearIcon,
Storage as StorageIcon,
} from "@mui/icons-material";
import { useAlert } from "react-alert";
import Dropzone from "../components/Dropzone.jsx";
@@ -182,6 +182,11 @@ const Admin = (props) => {
const [billingInfo, setBillingInfo] = React.useState({});
const [selectedStatus, setSelectedStatus] = React.useState([]);
useEffect(() => {
getUsers()
}, []);
useEffect(() => {
if (isDropzone) {
//redirectOpenApi();
@@ -987,6 +992,10 @@ Let me know if you're interested, or set up a call here: https://drift.me/${user
leads.push("student")
}
if (responseJson.lead_info.internal) {
leads.push("internal")
}
setSelectedStatus(leads)
}
@@ -1485,10 +1494,6 @@ Let me know if you're interested, or set up a call here: https://drift.me/${user
});
};
useEffect(() => {
getUsers()
}, []);
const getSettings = () => {
fetch(globalUrl + "/api/v1/getsettings", {
method: "GET",
@@ -2186,7 +2191,7 @@ Let me know if you're interested, or set up a call here: https://drift.me/${user
primary: "Workflows",
secondary: "",
active: true,
icon: <PolymerIcon style={{ color: itemColor }} />,
icon: <CodeIcon style={{ color: itemColor }} />,
},
{
primary: "Apps",
@@ -2386,7 +2391,7 @@ Let me know if you're interested, or set up a call here: https://drift.me/${user
renderValue={(selected) => selected.join(', ')}
MenuProps={MenuProps}
>
{["contacted", "lead", "pov", "demo done", "customer", "student", ].map((name) => (
{["contacted", "lead", "pov", "demo done", "customer", "student", "internal"].map((name) => (
<MenuItem key={name} value={name}>
<Checkbox checked={selectedStatus.indexOf(name) > -1} />
<ListItemText primary={name} />
@@ -2755,7 +2760,7 @@ Let me know if you're interested, or set up a call here: https://drift.me/${user
item.usage === null ? 0 : item.usage,
data_collection: "None",
active: item.active,
icon: <PolymerIcon style={{ color: itemColor }} />,
icon: <CodeIcon style={{ color: itemColor }} />,
};
return (
@@ -4356,7 +4361,7 @@ Let me know if you're interested, or set up a call here: https://drift.me/${user
<Tab
disabled={userdata.admin !== "true"}
label=<span>
<EcoIcon style={iconStyle} />
<CodeIcon style={iconStyle} />
Environments
</span>
/>
+6 -7
View File
@@ -10,7 +10,7 @@ import { useNavigate, Link, useParams } from "react-router-dom";
// import { Prompt } from "react-router"; // FIXME
import { useBeforeunload } from "react-beforeunload";
import ReactJson from "react-json-view";
import NestedMenuItem from "material-ui-nested-menu-item";
import { NestedMenuItem } from "mui-nested-menu"
import ReactMarkdown from "react-markdown";
import { useAlert } from "react-alert";
import theme from '../theme.jsx';
@@ -87,7 +87,7 @@ import {
ArrowLeft as ArrowLeftIcon,
Cached as CachedIcon,
DirectionsRun as DirectionsRunIcon,
Polymer as PolymerIcon,
Code as CodeIcon,
FormatListNumbered as FormatListNumberedIcon,
PlayArrow as PlayArrowIcon,
AspectRatio as AspectRatioIcon,
@@ -108,15 +108,12 @@ import {
AddComment as AddCommentIcon,
Edit as EditIcon,
Send as SendIcon,
} from "@material-ui/icons";
import {
Preview as PreviewIcon,
ContentCopy as ContentCopyIcon,
Circle as CircleIcon,
SquareFoot as SquareFootIcon,
AutoFixHigh as AutoFixHighIcon,
} from '@mui/icons-material';
} from "@mui/icons-material";
import Autocomplete from "@material-ui/lab/Autocomplete";
@@ -4998,6 +4995,8 @@ const AngularWorkflow = (defaultprops) => {
const edgeData = event.target.data();
if (edgeData.decorator === true) {
return;
}
const cytoscapeElement = document.getElementById("cytoscape_view")
@@ -12162,7 +12161,7 @@ const AngularWorkflow = (defaultprops) => {
margin: "0px 0px 0px 0px",
}}
>
<PolymerIcon style={{ marginRight: 10 }} />
<CodeIcon style={{ marginRight: 10 }} />
Workflows
</h2>
</Link>
+1 -4
View File
@@ -39,11 +39,8 @@ import {
ZoomInOutlined as ZoomInOutlinedIcon,
ZoomOutOutlined as ZoomOutOutlinedIcon,
Loop as LoopIcon,
} from "@material-ui/icons";
import {
AddPhotoAlternate as AddPhotoAlternateIcon,
} from '@mui/icons-material';
} from "@mui/icons-material";
import { v4 as uuidv4 } from "uuid";
import { Link, useParams } from "react-router-dom";
+1 -1
View File
@@ -46,7 +46,7 @@ import {
Search as SearchIcon,
Folder as FolderIcon,
LibraryBooks as LibraryBooksIcon,
} from "@material-ui/icons";
} from "@mui/icons-material";
import {
ForkRight as ForkRightIcon,
+1 -1
View File
@@ -33,7 +33,7 @@ import {
CheckBox as CheckBoxIcon,
CheckBoxOutlineBlank as CheckBoxOutlineBlankIcon,
OpenInNew as OpenInNewIcon,
} from "@material-ui/icons";
} from "@mui/icons-material";
import WorkflowPaper from "../components/WorkflowPaper.jsx"
import { removeParam } from "../views/AngularWorkflow.jsx"
+1 -1
View File
@@ -33,7 +33,7 @@ import {
CheckBox as CheckBoxIcon,
CheckBoxOutlineBlank as CheckBoxOutlineBlankIcon,
OpenInNew as OpenInNewIcon,
} from "@material-ui/icons";
} from "@mui/icons-material";
import WorkflowPaper from "../components/WorkflowPaper.jsx"
import { removeParam } from "../views/AngularWorkflow.jsx"
+1 -1
View File
@@ -23,7 +23,7 @@ import {
import {
Link as LinkIcon,
Edit as EditIcon,
} from "@material-ui/icons";
} from "@mui/icons-material";
const Body = {
//maxWidth: 1000,
+2 -2
View File
@@ -3,7 +3,7 @@ import {isMobile} from "react-device-detect";
import {Link} from 'react-router-dom';
import {Divider, List, ListItem, ListItemText, Card, CardContent, Grid, Typography, Button, ButtonGroup, FormControl, Dialog, DialogTitle, DialogActions, DialogContent, Tooltip} from '@material-ui/core';
import {ExpandMore as ExpandMoreIcon, ExpandLess as ExpandLessIcon} from '@material-ui/icons';
import {ExpandMore as ExpandMoreIcon, ExpandLess as ExpandLessIcon} from '@mui/icons-material';
const hrefStyle = {
textDecoration: "none",
@@ -255,4 +255,4 @@ const Faq = (props) => {
)
}
export default Faq;
export default Faq;
-8
View File
@@ -58,7 +58,6 @@ import {
CloudDownload as CloudDownloadIcon,
} from "@mui/icons-material";
import NestedMenuItem from "material-ui-nested-menu-item";
//import {Search as SearchIcon, ArrowUpward as ArrowUpwardIcon, Visibility as VisibilityIcon, Done as DoneIcon, Close as CloseIcon, Error as ErrorIcon, FindReplace as FindreplaceIcon, ArrowLeft as ArrowLeftIcon, Cached as CachedIcon, DirectionsRun as DirectionsRunIcon, Add as AddIcon, Polymer as PolymerIcon, FormatListNumbered as FormatListNumberedIcon, Create as CreateIcon, PlayArrow as PlayArrowIcon, AspectRatio as AspectRatioIcon, MoreVert as MoreVertIcon, Apps as AppsIcon, Schedule as ScheduleIcon, FavoriteBorder as FavoriteBorderIcon, Pause as PauseIcon, Delete as DeleteIcon, AddCircleOutline as AddCircleOutlineIcon, Save as SaveIcon, KeyboardArrowLeft as KeyboardArrowLeftIcon, KeyboardArrowRight as KeyboardArrowRightIcon, ArrowBack as ArrowBackIcon, Settings as SettingsIcon, LockOpen as LockOpenIcon, ExpandMore as ExpandMoreIcon, VpnKey as VpnKeyIcon} from '@material-ui/icons';
//https://next.material-ui.com/components/material-icons/
@@ -1061,13 +1060,6 @@ const GettingStarted = (props) => {
<FileCopyIcon style={{ marginLeft: 0, marginRight: 8 }} />
{"Duplicate Workflow"}
</MenuItem>
{/*<NestedMenuItem disabled={userdata.orgs === undefined || userdata.orgs === null || userdata.orgs.length === 1 || userdata.orgs.length >= 0} style={{backgroundColor: inputColor, color: "white"}} onClick={() => {
//copyWorkflow(data)
//setOpen(false)
}} key={"duplicate"}>
<FileCopyIcon style={{marginLeft: 0, marginRight: 8}}/>
{"Copy to Child Org"}
</NestedMenuItem>*/}
<MenuItem
style={{ backgroundColor: inputColor, color: "white" }}
onClick={() => {
+5 -3
View File
@@ -4,9 +4,11 @@ import Paper from "@material-ui/core/Paper";
import Button from "@material-ui/core/Button";
import Divider from "@material-ui/core/Divider";
import { BrowserView, MobileView } from "react-device-detect";
import ScheduleIcon from "@material-ui/icons/Schedule";
import Web from "@material-ui/icons/Web";
import AccountTree from "@material-ui/icons/AccountTree";
import {
Schedule as ScheduleIcon,
Web as WebIcon,
AccountTree as AccountTreeIcon,
} from "@mui/icons-material";
const bodyDivStyle = {
margin: "auto",
+10 -8
View File
@@ -11,12 +11,14 @@ import Divider from "@material-ui/core/Divider";
import Grid from "@material-ui/core/Grid";
import { BrowserView, MobileView } from "react-device-detect";
import ScheduleIcon from "@material-ui/icons/Schedule";
import Web from "@material-ui/icons/Web";
import AccountTree from "@material-ui/icons/AccountTree";
import InfoIcon from "@material-ui/icons/Info";
import ArrowForwardIcon from "@material-ui/icons/ArrowForward";
import CreateIcon from "@material-ui/icons/Create";
import {
Schedule as ScheduleIcon,
Web as WebIcon,
AccountTree as AccountTreeIcon,
Info as InfoIcon,
ArrowForward as ArrowForwardIcon,
Create as CreateIcon,
} from "@mui/icons-material";
const bodyDivStyle = {
margin: "auto",
@@ -86,7 +88,7 @@ const LandingPage = (props) => {
"Simple integrations",
"Easily use others' or create your own integration",
"/docs/features",
<Web
<WebIcon
style={{ fontSize: iconSize, marginTop: "20px", color: iconColor }}
/>
),
@@ -94,7 +96,7 @@ const LandingPage = (props) => {
"Workflows",
"Access the power of automation within minutes, whether its on premise or in the cloud",
"/docs/features",
<AccountTree
<AccountTreeIcon
style={{ fontSize: iconSize, marginTop: "20px", color: iconColor }}
/>
),
+3 -3
View File
@@ -15,10 +15,10 @@ import {
import {
Apps as AppsIcon,
Polymer as PolymerIcon,
Code as CodeIcon,
EmojiObjects as EmojiObjectsIcon,
Description as DescriptionIcon,
} from "@material-ui/icons";
} from "@mui/icons-material";
const bodyDivStyle = {
@@ -137,7 +137,7 @@ const Search = (props) => {
/>
<Tab
label=<span>
<PolymerIcon style={iconStyle} /> Workflows
<CodeIcon style={iconStyle} /> Workflows
</span>
/>
<Tab
+1 -1
View File
@@ -3,7 +3,7 @@ import React, {useState } from 'react';
import { useNavigate, Link, useParams } from "react-router-dom";
import {isMobile} from "react-device-detect";
import {Done as DoneIcon, Clear as ClearIcon} from '@material-ui/icons';
import {Done as DoneIcon, Clear as ClearIcon} from '@mui/icons-material';
import {Paper, Divider, List, ListItem, ListItemText, Card, CardContent, Grid, Typography, Button, ButtonGroup, FormControl, Dialog, DialogTitle, DialogActions, DialogContent, Tooltip} from '@material-ui/core';
import FAQ from "./Faq.jsx";
import Newsletter from "../components/Newsletter.jsx";
+2 -2
View File
@@ -79,7 +79,7 @@ import {
RadioButtonUnchecked as RadioButtonUncheckedIcon,
ArrowLeft as ArrowLeftIcon,
ArrowRight as ArrowRightIcon,
} from "@material-ui/icons";
} from "@mui/icons-material";
//import NestedMenuItem from "material-ui-nested-menu-item";
//import {Search as SearchIcon, ArrowUpward as ArrowUpwardIcon, Visibility as VisibilityIcon, Close as CloseIcon, Error as ErrorIcon, FindReplace as FindreplaceIcon, ArrowLeft as ArrowLeftIcon, Cached as CachedIcon, DirectionsRun as DirectionsRunIcon, Add as AddIcon, Polymer as PolymerIcon, FormatListNumbered as FormatListNumberedIcon, Create as CreateIcon, PlayArrow as PlayArrowIcon, AspectRatio as AspectRatioIcon, MoreVert as MoreVertIcon, Apps as AppsIcon, Schedule as ScheduleIcon, FavoriteBorder as FavoriteBorderIcon, Pause as PauseIcon, Delete as DeleteIcon, AddCircleOutline as AddCircleOutlineIcon, Save as SaveIcon, KeyboardArrowLeft as KeyboardArrowLeftIcon, KeyboardArrowRight as KeyboardArrowRightIcon, ArrowBack as ArrowBackIcon, Settings as SettingsIcon, LockOpen as LockOpenIcon, ExpandMore as ExpandMoreIcon, VpnKey as VpnKeyIcon} from '@material-ui/icons';
@@ -3468,7 +3468,7 @@ const Workflows = (props) => {
</div>
) : null}
{userdata.priorities !== undefined && userdata.priorities !== null && userdata.priorities.length > 0 && userdata.priorities[0].name.includes("CPU") ?
{userdata.priorities !== undefined && userdata.priorities !== null && userdata.priorities.length > 0 && userdata.priorities[0].name.includes("CPU") && userdata.priorities[0].active === true ?
<div style={{border: "1px solid rgba(255,255,255,0.1)", borderRadius: theme.palette.borderRadius, marginTop: 10, marginBottom: 10, padding: 15, textAlign: "center", height: 70, textAlign: "left", backgroundColor: theme.palette.surfaceColor, display: "flex", }}>
<div style={{flex: 2, overflow: "hidden",}}>
<Typography variant="body1" >