Repacked multiple files with old mui to merge together

This commit is contained in:
Frikky
2023-08-15 19:59:32 +02:00
parent 511aea613e
commit 7282185805
13 changed files with 1440 additions and 475 deletions
+7 -3
View File
@@ -23,13 +23,16 @@ import {
Dialog,
Chip,
Avatar,
} from "@material-ui/core";
import {
Button
} from "@mui/material";
} from '@material-ui/core';
import {
Close as CloseIcon,
Delete as DeleteIcon,
} from "@mui/icons-material";
} from "@material-ui/icons";
import * as edgehandles from "cytoscape-edgehandles";
import * as cytoscape from "cytoscape";
@@ -1856,6 +1859,7 @@ const AppFramework = (props) => {
//autounselectify={true}
var usecasediff = -100
const bgColor = color === undefined || color === null || color.length === 0 ? theme.palette.surfaceColor : color
console.log("Background: ", bgColor)
return (
<div style={{margin: "auto", backgroundColor: bgColor, position: "relative", }}>
@@ -1996,7 +2000,7 @@ const AppFramework = (props) => {
{paperTitle.length > 0 ?
<span>
<Typography variant="h6" style={{textAlign: "center"}}>
{paperTitle}
{paperTitle.replace("_", " ", -1)}
</Typography>
<Divider style={{marginTop: 5, marginBottom: 5 }} />
</span>
+4 -40
View File
@@ -1,14 +1,14 @@
import React, { useState, useEffect } from 'react';
import theme from '../theme.jsx';
import ReactGA from 'react-ga4';
import { useTheme } from '@material-ui/core/styles';
import {Link} from 'react-router-dom';
import { useAlert } from "react-alert";
import { Search as SearchIcon, CloudQueue as CloudQueueIcon, Code as CodeIcon } from '@mui/icons-material';
import { Search as SearchIcon, CloudQueue as CloudQueueIcon, Code as CodeIcon } from '@material-ui/icons';
//import algoliasearch from 'algoliasearch/lite';
import algoliasearch from 'algoliasearch';
import { InstantSearch, connectSearchBox, connectHits } from 'react-instantsearch-dom';
import { Grid, Paper, TextField, ButtonBase, InputAdornment, Typography, Button, Tooltip} from '@mui/material';
import { Grid, Paper, TextField, ButtonBase, InputAdornment, Typography, Button, Tooltip} from '@material-ui/core';
import aa from 'search-insights'
const searchClient = algoliasearch("JNSS5CFDZZ", "db08e40265e2941b9a7d8f644b6e5240")
const Appsearch = props => {
@@ -18,6 +18,7 @@ const Appsearch = props => {
const alert = useAlert();
const rowHandler = maxRows === undefined || maxRows === null ? 50 : maxRows
const xs = parsedXs === undefined || parsedXs === null ? 12 : parsedXs
const theme = useTheme();
//const [apps, setApps] = React.useState([]);
//const [filteredApps, setFilteredApps] = React.useState([]);
const [formMail, setFormMail] = React.useState("");
@@ -69,43 +70,6 @@ const Appsearch = props => {
console.log(error);
});
};
const submitContact = (email, message) => {
const data = {
"firstname": "",
"lastname": "",
"title": "",
"companyname": "",
"email": email,
"phone": "",
"message": message,
}
const errorMessage = "Something went wrong. Please contact frikky@shuffler.io directly."
fetch(globalUrl+"/api/v1/contact", {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify(data),
})
.then(response => response.json())
.then(response => {
if (response.success === true) {
setFormMessage(response.reason)
//alert.info("Thanks for submitting!")
} else {
setFormMessage(errorMessage)
}
setFormMail("")
setMessage("")
})
.catch(error => {
setFormMessage(errorMessage)
console.log(error)
});
}
// value={currentRefinement}
const SearchBox = ({currentRefinement, refine, isSearchStalled} ) => {
+85 -66
View File
@@ -3,6 +3,7 @@ import theme from '../theme.jsx';
import { isMobile } from "react-device-detect"
import ChipInput from "material-ui-chip-input";
import UsecaseSearch from "../components/UsecaseSearch.jsx"
import dayjs from 'dayjs';
import {
Badge,
@@ -37,28 +38,35 @@ import {
FormControl,
FormLabel,
} from "@mui/material";
} from "@material-ui/core";
import {
DatePicker,
LocalizationProvider,
} from '@mui/x-date-pickers'
import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs'
import {
ExpandLess as ExpandLessIcon,
ExpandMore as ExpandMoreIcon,
Publish as PublishIcon,
OpenInNew as OpenInNewIcon,
} from "@mui/icons-material";
} from "@material-ui/icons";
const EditWorkflow = (props) => {
const { globalUrl, workflow, setWorkflow, modalOpen, setModalOpen, showUpload, usecases, setNewWorkflow, appFramework, isEditing, userdata, } = props
const [_, setUpdate] = React.useState(""); // Used for rendering, don't remove
const [submitLoading, setSubmitLoading] = React.useState(false);
const [showMoreClicked, setShowMoreClicked] = React.useState(false);
const [innerWorkflow, setInnerWorkflow] = React.useState(workflow)
const [_, setUpdate] = React.useState(""); // Used for rendering, don't remove
const [newWorkflowTags, setNewWorkflowTags] = React.useState(workflow.tags !== undefined && workflow.tags !== null ? JSON.parse(JSON.stringify(workflow.tags)) : [])
const [selectedUsecases, setSelectedUsecases] = React.useState(workflow.usecase_ids !== undefined && workflow.usecase_ids !== null ? JSON.parse(JSON.stringify(workflow.usecase_ids)) : []);
const [foundWorkflowId, setFoundWorkflowId] = React.useState("")
const [name, setName] = React.useState(workflow.name !== undefined ? workflow.name : "")
const [description, setDescription] = React.useState(workflow.description !== undefined ? workflow.description : "")
const [dueDate, setDueDate] = React.useState(workflow.due_date !== undefined && workflow.due_date !== null && workflow.due_date !== 0 ? dayjs(workflow.due_date*1000) : dayjs().subtract(1, 'day'))
// Gets the generated workflow
const getGeneratedWorkflow = (workflow_id) => {
@@ -231,24 +239,26 @@ const EditWorkflow = (props) => {
autoFocus
fullWidth
/>
<TextField
onBlur={(event) => {
setDescription(event.target.value)
}}
InputProps={{
style: {
color: "white",
},
}}
maxRows={4}
color="primary"
defaultValue={innerWorkflow.description}
placeholder="Description"
multiline
label="Description"
margin="dense"
fullWidth
/>
<div style={{display: "flex", }}>
<TextField
onBlur={(event) => {
setDescription(event.target.value)
}}
InputProps={{
style: {
color: "white",
},
}}
maxRows={4}
color="primary"
defaultValue={innerWorkflow.description}
placeholder="Description"
multiline
label="Description"
margin="dense"
fullWidth
/>
</div>
<div style={{display: "flex", marginTop: 10, }}>
<ChipInput
style={{ flex: 1, maxHeight: 40, marginTop: 12, overflow: "auto", }}
@@ -266,8 +276,10 @@ const EditWorkflow = (props) => {
setNewWorkflowTags(newWorkflowTags);
}}
onDelete={(chip, index) => {
console.log("Deleting: ", chip, index)
newWorkflowTags.splice(index, 1);
setNewWorkflowTags(newWorkflowTags);
setUpdate(Math.random());
}}
/>
{usecases !== null && usecases !== undefined && usecases.length > 0 ?
@@ -328,26 +340,41 @@ const EditWorkflow = (props) => {
{showMoreClicked === true ?
<span style={{marginTop: 25, }}>
<div style={{display: "flex"}}>
<FormControl style={{marginTop: 15, }}>
<FormLabel id="demo-row-radio-buttons-group-label">Status</FormLabel>
<RadioGroup
row
aria-labelledby="demo-row-radio-buttons-group-label"
name="row-radio-buttons-group"
defaultValue={innerWorkflow.status}
onChange={(e) => {
console.log("Data: ", e.target.value)
innerWorkflow.workflow_type = e.target.value
setInnerWorkflow(innerWorkflow)
}}
>
<FormControlLabel value="test" control={<Radio />} label="Test" />
<FormControlLabel value="production" control={<Radio />} label="Production" />
<FormControl style={{marginTop: 15, }}>
<FormLabel id="demo-row-radio-buttons-group-label">Status</FormLabel>
<RadioGroup
row
aria-labelledby="demo-row-radio-buttons-group-label"
name="row-radio-buttons-group"
defaultValue={innerWorkflow.status}
onChange={(e) => {
console.log("Data: ", e.target.value)
innerWorkflow.workflow_type = e.target.value
setInnerWorkflow(innerWorkflow)
</RadioGroup>
</FormControl>
<LocalizationProvider dateAdapter={AdapterDayjs}>
<DatePicker
sx={{
marginTop: 3,
marginLeft: 3,
}}
>
<FormControlLabel value="test" control={<Radio />} label="Test" />
<FormControlLabel value="production" control={<Radio />} label="Production" />
</RadioGroup>
</FormControl>
value={dueDate}
label="Due Date"
format="YYYY-MM-DD"
onChange={(newValue) => {
setDueDate(newValue)
}}
/>
</LocalizationProvider>
</div>
<div />
<FormControl style={{marginTop: 15, }}>
@@ -430,38 +457,27 @@ const EditWorkflow = (props) => {
</span>
: null}
<Tooltip color="primary" title={"Add more details"} placement="top">
<IconButton
style={{ color: "white", margin: "auto", marginTop: 10, textAlign: "center", width: 50,}}
onClick={() => {
setShowMoreClicked(!showMoreClicked);
}}
>
{showMoreClicked ? <ExpandLessIcon /> : <ExpandMoreIcon/>}
</IconButton>
</Tooltip>
</div>
{/*newWorkflow === true ?
<div style={{marginLeft: 50, maxWidth: 400, minWidth: 400, position: "relative",}}>
<UsecaseSearch
globalUrl={globalUrl}
appFramework={appFramework}
defaultSearch={undefined}
apps={undefined}
setFoundWorkflowId={setFoundWorkflowId}
userdata={userdata}
/>
</div>
: null*/}
<IconButton
style={{ color: "white", margin: "auto", marginTop: 10, textAlign: "center", width: 50,}}
onClick={() => {
setShowMoreClicked(!showMoreClicked);
}}
>
{showMoreClicked ? <ExpandLessIcon /> : <ExpandMoreIcon/>}
</IconButton>
</Tooltip>
</div>
</DialogContent>
<DialogActions>
<Button
style={{}}
onClick={() => {
if (setNewWorkflow !== undefined) {
setWorkflow({})
}
if (setNewWorkflow !== undefined) {
setWorkflow({})
}
setModalOpen(false)
setModalOpen(false)
}}
color="primary"
>
@@ -482,6 +498,9 @@ const EditWorkflow = (props) => {
innerWorkflow.usecase_ids = selectedUsecases
}
if (dueDate > 0) {
innerWorkflow.due_date = new Date(`${dueDate["$y"]}-${dueDate["$M"]+1}-${dueDate["$D"]}`).getTime()/1000
}
if (setNewWorkflow !== undefined) {
setNewWorkflow(
+3 -3
View File
@@ -15,7 +15,7 @@ import {
Divider,
Select,
MenuItem,
} from "@mui/material";
} from "@material-ui/core";
import {
OpenInNew as OpenInNewIcon,
@@ -27,7 +27,7 @@ import {
Publish as PublishIcon,
Clear as ClearIcon,
Add as AddIcon,
} from "@mui/icons-material";
} from "@material-ui/icons";
import { useAlert } from "react-alert";
import Dropzone from "../components/Dropzone.jsx";
@@ -681,7 +681,7 @@ const Files = (props) => {
<ListItemText
primary=<span style={{ display:"inline"}}>
<Tooltip
title={`Edit File (${allowedFileTypes.join(", ")})`}
title={`Edit File (${allowedFileTypes.join(", ")}). Max size 2MB`}
style={{}}
aria-label={"Edit"}
>
+41 -11
View File
@@ -1,8 +1,8 @@
import React, {useState} from 'react';
import {BrowserView, MobileView} from "react-device-detect";
import theme from '../theme.jsx';
import { useTheme } from '@material-ui/core/styles';
import {Link} from 'react-router-dom';
import { useNavigate, Link } from "react-router-dom";
import ReactGA from 'react-ga4';
import {
@@ -21,7 +21,7 @@ import {
IconButton,
Divider,
LinearProgress,
} from '@mui/material';
} from '@material-ui/core'
import {
MeetingRoom as MeetingRoomIcon,
@@ -34,9 +34,12 @@ import {
Description as DescriptionIcon,
EmojiObjects as EmojiObjectsIcon,
Business as BusinessIcon,
} from '@material-ui/icons';
import {
Analytics as AnalyticsIcon,
Lightbulb as LightbulbIcon,
} from '@mui/icons-material';
} from "@mui/icons-material";
import { useAlert } from "react-alert";
@@ -46,6 +49,7 @@ const hoverOutColor = "#e8eaf6"
const Header = props => {
const { globalUrl, setNotifications, notifications, isLoggedIn, removeCookie, homePage, userdata, serverside, } = props;
const theme = useTheme();
const alert = useAlert()
@@ -57,6 +61,7 @@ const { globalUrl, setNotifications, notifications, isLoggedIn, removeCookie, ho
const [anchorEl, setAnchorEl] = React.useState(null);
const [anchorElAvatar, setAnchorElAvatar] = React.useState(null);
const [subAnchorEl, setSubAnchorEl] = React.useState(null);
let navigate = useNavigate();
const handleClick = (event) => {
@@ -688,7 +693,7 @@ const { globalUrl, setNotifications, notifications, isLoggedIn, removeCookie, ho
{/*
<PolymerIcon style={{marginRight: "5px"}} />
*/}
<Typography style={{marginTop: 5, marginRight: 8, }}>Workflows</Typography>
<span style={{marginTop: 0, marginRight: 8, }}>Workflows</span>
</div>
</Link>
</ListItem>
@@ -698,17 +703,24 @@ const { globalUrl, setNotifications, notifications, isLoggedIn, removeCookie, ho
{/*
<AppsIcon style={{marginRight: "5px"}} />
*/}
<Typography style={{marginTop: 5, marginRight: 5, }}>Apps</Typography>
<span style={{marginTop: 0, marginRight: 5, }}>Apps</span>
</div>
</Link>
</ListItem>
{/*
<ListItem style={{textAlign: "center"}}>
<Link to="/dashboard" style={hrefStyle}>
<div onMouseOver={handleDocsHover} onMouseOut={handleDocsHoverOut} style={{color: DocsHoverColor, cursor: "pointer"}}>Dashboard</div>
</Link>
</ListItem>
*/}
<ListItem style={listItemStyle}>
<Link to="/docs" style={hrefStyle}>
<div onMouseOver={handleDocsHover} onMouseOut={handleDocsHoverOut} style={{color: DocsHoverColor, cursor: "pointer", display: "flex"}}>
{/*
<DescriptionIcon style={{marginRight: "5px"}} />
*/}
<Typography style={{marginTop: 5,}}>Docs</Typography>
<span style={{marginTop: 0,}}>Docs</span>
</div>
</Link>
</ListItem>
@@ -782,14 +794,13 @@ const { globalUrl, setNotifications, notifications, isLoggedIn, removeCookie, ho
</ListItem>
: null*/}
{userdata === undefined || userdata.orgs === undefined || userdata.orgs === null || userdata.orgs.length <= 1 ?
null
:
<span style={{paddingTop: 12, }}>
<Select
disableunderline
disableUnderline
SelectDisplayProps={{
style: {
maxWidth: 50,
@@ -883,13 +894,32 @@ const { globalUrl, setNotifications, notifications, isLoggedIn, removeCookie, ho
</span>
}
{/* Show on cloud, if not suborg and if not customer/pov/internal */}
{isCloud && (userdata.org_status === undefined || userdata.org_status === null || userdata.org_status.length === 0) ?
<ListItem style={{textAlign: "center", marginLeft: 0, marginRight: 7, marginTop: 3, }}>
<Link to ="/pricing?tab=cloud&highlight=true" style={hrefStyle}>
<Button variant="contained" color="primary" style={{textTransform: "none"}} onClick={() => {
ReactGA.event({
category: "header",
action: "pricing_upgrade_click",
label: "",
})
}}>
Upgrade
</Button>
</Link>
</ListItem>
: null}
{userdata === undefined || userdata.app_execution_limit === undefined || userdata.app_execution_usage === undefined || userdata.app_execution_usage < 1000 ?
null
:
<Tooltip title={`Amount of executions left: ${userdata.app_execution_usage} / ${userdata.app_execution_limit}. When the limit is reached, you can still use Shuffle normally, but your Workflow triggers may stop working. Reach out to support@shuffler.io to extend this limit.`}>
<div style={{maxHeight: 30, minHeight: 30, padding: 8, textAlign: "center", cursor: "pointer", borderRadius: theme.palette.borderRadius, marginRight: 10, marginTop: 12, backgroundColor: theme.palette.surfaceColor, minWidth: 60, maxWidth: 60, }} onClick={() => {
<div style={{maxHeight: 30, minHeight: 30, padding: 8, textAlign: "center", cursor: "pointer", borderRadius: theme.palette.borderRadius, marginRight: 10, marginTop: 12, backgroundColor: theme.palette.surfaceColor, minWidth: 60, maxWidth: 60, border: userdata.app_execution_usage/userdata.app_execution_limit >= 0.9 ? "#f86a3e" : null, }} onClick={() => {
console.log(userdata.appe_execution_usage/userdata.app_execution_limit)
if (window.drift !== undefined) {
window.drift.api.startInteraction({ interactionId: 326905 })
navigate("/pricing")
} else {
console.log("Couldn't find drift in window.drift and not .drift-open-chat with querySelector: ", window.drift)
}
+14 -2
View File
@@ -1,5 +1,6 @@
import React, { useRef, useState, useEffect, useLayoutEffect } from "react";
import { useParams, useNavigate, Link } from "react-router-dom";
import { useTheme } from "@material-ui/core/styles";
import theme from '../theme.jsx';
import { useAlert } from "react-alert";
@@ -36,8 +37,8 @@ import {
Breadcrumbs,
CircularProgress,
Switch,
Collapse,
} from "@mui/material";
Fade,
} from "@material-ui/core";
import {
LockOpen as LockOpenIcon,
SupervisorAccount as SupervisorAccountIcon,
@@ -70,6 +71,7 @@ const registeredApps = [
"todoist",
"microsoft_sentinel",
"microsoft_365_defender",
"google_chat",
"google_sheets",
"google_drive",
"google_disk",
@@ -260,6 +262,16 @@ const AuthenticationOauth2 = (props) => {
admin_consent,
"consent",
)
} else if (selectedApp.name.toLowerCase().includes("google_chat") || selectedApp.name.toLowerCase().includes("google_hangout")) {
handleOauth2Request(
"253565968129-6pij4g6ojim4gpum0h9m9u3bc357qsq7.apps.googleusercontent.com",
"",
"https://www.googleapis.com",
["https://www.googleapis.com/auth/chat.messages",],
admin_consent,
"consent",
)
} else if (selectedApp.name.toLowerCase().includes("jira_service_desk") || selectedApp.name.toLowerCase().includes("jira") || selectedApp.name.toLowerCase().includes("jira_service_management")) {
handleOauth2Request(
"AI02egeCQh1Zskm1QAJaaR6dzjR97V2F",
+13 -20
View File
@@ -1,23 +1,17 @@
import React, { useEffect } from "react";
import theme from '../theme.jsx';
import { makeStyles } from "@mui/styles";
import {
Tooltip,
Grid,
Button,
TextField,
Typography,
IconButton,
} from "@mui/material";
import { makeStyles } from "@material-ui/styles";
import { useTheme } from "@material-ui/core/styles";
import Tooltip from "@material-ui/core/Tooltip";
import Grid from "@material-ui/core/Grid";
import Button from "@material-ui/core/Button";
import TextField from "@material-ui/core/TextField";
import Typography from "@material-ui/core/Typography";
import { useAlert } from "react-alert";
import {
ExpandLess as ExpandLessIcon,
ExpandMore as ExpandMoreIcon,
Save as SaveIcon,
} from "@mui/icons-material";
import IconButton from "@material-ui/core/IconButton";
import ExpandLessIcon from "@material-ui/icons/ExpandLess";
import ExpandMoreIcon from "@material-ui/icons/ExpandMore";
import SaveIcon from "@material-ui/icons/Save";
const useStyles = makeStyles({
notchedOutline: {
@@ -39,6 +33,7 @@ const OrgHeader = (props) => {
handleEditOrg,
} = props;
const theme = useTheme();
const alert = useAlert();
const classes = useStyles();
@@ -101,10 +96,9 @@ const OrgHeader = (props) => {
//console.log("USER: ", userdata)
const orgSaveButton = (
<Tooltip title="Save any unsaved data" placement="bottom">
<div>
<Button
style={{ width: 150, height: 55, flex: 1 }}
variant="contained"
variant="outlined"
color="primary"
disabled={
userdata === undefined || userdata === null || userdata.admin !== "true"
@@ -123,7 +117,6 @@ const OrgHeader = (props) => {
>
<SaveIcon />
</Button>
</div>
</Tooltip>
);
+4 -2
View File
@@ -9,13 +9,13 @@ import {
Grid,
Card,
Switch,
} from "@mui/material";
} from "@material-ui/core";
import Priority from "../components/Priority.jsx";
import { useAlert } from "react-alert";
const Priorities = (props) => {
const { globalUrl, userdata, serverside, billingInfo, stripeKey, checkLogin, } = props;
const { globalUrl, userdata, serverside, billingInfo, stripeKey, checkLogin, setAdminTab, setCurTab, } = props;
const [showDismissed, setShowDismissed] = React.useState(false);
const [showRead, setShowRead] = React.useState(false);
@@ -60,6 +60,8 @@ const Priorities = (props) => {
globalUrl={globalUrl}
priority={priority}
checkLogin={checkLogin}
setAdminTab={setAdminTab}
setCurTab={setCurTab}
/>
)
})
+24 -9
View File
@@ -1,5 +1,6 @@
import React, { useState, useEffect } from "react";
import ReactGA from 'react-ga4';
import theme from "../theme.jsx";
import { useNavigate, Link } from "react-router-dom";
import {
@@ -9,7 +10,7 @@ import {
Button,
Grid,
Card,
} from "@mui/material";
} from "@material-ui/core";
// import magic wand icon from material ui icons
import {
@@ -19,9 +20,10 @@ import {
import { useAlert } from "react-alert";
const Priority = (props) => {
const { globalUrl, userdata, serverside, priority, checkLogin, } = props;
const { globalUrl, userdata, serverside, priority, checkLogin, setAdminTab, setCurTab, } = props;
const isCloud = window.location.host === "localhost:3002" || window.location.host === "shuffler.io";
let navigate = useNavigate();
const changeRecommendation = (recommendation, action) => {
const data = {
@@ -101,14 +103,27 @@ const Priority = (props) => {
</div>
<div style={{flex: 1, display: "flex", marginLeft: 30, }}>
<Button style={{height: 50, borderRadius: 25, marginTop: 8, width: 175, marginRight: 10, color: priority.active === false ? "white" : "black", backgroundColor: priority.active === false ? theme.palette.inputColor : "white", }} variant="contained" color="secondary" onClick={() => {
/*
ReactGA.event({
category: "",
action: `partner_${partner.name}_click`,
label: "",
})
*/
if (isCloud) {
ReactGA.event({
category: "recommendation",
action: `click_${priority.name}`,
label: "",
})
}
navigate(priority.url)
if (setAdminTab !== undefined && setCurTab !== undefined) {
if (priority.description.toLowerCase().includes("notification workflow")) {
setCurTab(0)
setAdminTab(0)
}
if (priority.description.toLowerCase().includes("hybrid shuffle")) {
setCurTab(6)
}
}
}}>
explore
</Button>