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

Minor fixes to e.g. creator grid

Browse Source
This commit is contained in:
frikky
2022-08-22 15:50:07 +02:00
parent 909a364445
commit 41945f79b2
8 changed files with 132 additions and 71 deletions
Download Patch File Download Diff File Expand all files Collapse all files
backend/app_sdk/build.sh
+1 -1
View File
@@ -2,7 +2,7 @@
### DEFAULT
NAME=shuffle-app_sdk
VERSION=1.0.5
VERSION=1.0.6
docker rmi docker.pkg.github.com/frikky/shuffle/$NAME:$VERSION --force
docker build . -f Dockerfile -t frikky/shuffle:app_sdk -t frikky/$NAME:$VERSION -t docker.pkg.github.com/frikky/shuffle/$NAME:$VERSION -t ghcr.io/frikky/$NAME:$VERSION -t ghcr.io/frikky/$NAME:nightly
frontend/src/components/CreatorGrid.jsx
+44 -19
View File
@@ -26,6 +26,11 @@ import {
CardActionArea,
} from '@material-ui/core';
import {
Avatar,
AvatarGroup,
} from "@mui/material"
import {
SkipNext as SkipNextIcon,
SkipPrevious as SkipPreviousIcon,
@@ -143,7 +148,6 @@ const CreatorGrid = props => {
marginTop: 5,
}
var workflowDelay = -50
const Hits = ({ hits }) => {
const [mouseHoverIndex, setMouseHoverIndex] = useState(-1)
var counted = 0
@@ -151,8 +155,6 @@ const CreatorGrid = props => {
return (
<Grid container spacing={4} style={paperAppContainer}>
{hits.map((data, index) => {
workflowDelay += 50
if (counted === 12/xs*rowHandler) {
return null
}
@@ -160,16 +162,48 @@ const CreatorGrid = props => {
counted += 1
return (
<Zoom key={index} in={true} style={{ transitionDelay: `${workflowDelay}ms` }}>
<Zoom key={index} in={true} style={{}}>
<Grid item xs={xs} style={{ padding: "12px 10px 12px 10px" }}>
<Card>
<CardActionArea component={Link} to={"/creators/"+data.username} style={{padding: "5px 10px 5px 10px", display: "flex"}}>
<Card style={{border: "1px solid rgba(255,255,255,0.3)"}}>
<CardActionArea component={Link} to={"/creators/"+data.username} style={{padding: "5px 10px 5px 10px", }}>
<CardContent sx={{ flex: '1 0 auto', minWidth: 160, maxWidth: 160, overflow: "hidden", padding: 0, }}>
<Typography component="div" variant="h6">
{data.username}
</Typography>
<div style={{display: "flex"}}>
<img style={{height: 74, width: 74, borderRadius: 100, }} alt={"Creator profile of "+data.username} src={data.image} />
<Typography component="div" variant="body1" style={{marginTop: 20, marginLeft: 15, }}>
@{data.username}
</Typography>
</div>
<Typography variant="body1" color="textSecondary" style={{marginTop: 10, }}>
<b>10</b> apps <span style={{marginLeft: 15, }}/><b>23</b> workflows
</Typography>
{data.specialized_apps !== undefined && data.specialized_apps !== null && data.specialized_apps.length > 0 ?
<AvatarGroup max={10} style={{flexDirection: "row", padding: 0, margin: 0, itemAlign: "left", textAlign: "left",}}>
{data.specialized_apps.map((app, index) => {
// Putting all this in secondary of ListItemText looked weird.
return (
<div
key={index}
style={{
height: 24,
width: 24,
filter: "brightness(0.6)",
cursor: "pointer",
}}
onClick={() => {
console.log("Click")
//navigate("/apps/"+app.id)
}}
>
<Tooltip color="primary" title={app.name} placement="bottom">
<Avatar alt={app.name} src={app.image} style={{width: 24, height: 24}}/>
</Tooltip>
</div>
)
})}
</AvatarGroup>
:
null}
</CardContent>
<img style={{height: 100, width: 100, borderRadius: 100, }} alt={"Creator profile of "+data.username} src={data.image} />
</CardActionArea>
</Card>
@@ -251,15 +285,6 @@ const CreatorGrid = props => {
</div>
: null
}
<span style={{position: "absolute", display: "flex", textAlign: "right", float: "right", right: 0, bottom: 120, }}>
<Typography variant="body2" color="textSecondary" style={{}}>
Search by
</Typography>
<a rel="noopener noreferrer" href="https://www.algolia.com/" target="_blank" style={{textDecoration: "none", color: "white"}}>
<img src={"/images/logo-algolia-nebula-blue-full.svg"} alt="Algolia logo" style={{height: 17, marginLeft: 5, marginTop: 3,}} />
</a>
</span>
</div>
)
}
frontend/src/components/EditWorkflow.jsx
+53 -24
View File
@@ -15,7 +15,6 @@ import {
Divider,
Button,
TextField,
FormControl,
IconButton,
Menu,
MenuItem,
@@ -32,6 +31,11 @@ import {
OutlinedInput,
Checkbox,
ListItemText,
Radio,
RadioGroup,
FormControl,
FormLabel,
} from "@material-ui/core";
import {
@@ -107,6 +111,7 @@ const EditWorkflow = (props) => {
required
margin="dense"
defaultValue={innerWorkflow.name}
label="Name"
autoFocus
fullWidth
/>
@@ -124,6 +129,7 @@ const EditWorkflow = (props) => {
defaultValue={innerWorkflow.description}
placeholder="Description"
multiline
label="Description"
margin="dense"
fullWidth
/>
@@ -206,30 +212,50 @@ const EditWorkflow = (props) => {
{showMoreClicked === true ?
<span style={{marginTop: 25, }}>
<TextField
onBlur={(event) => {
if (event.target.value.toLowerCase() === "test") {
innerWorkflow.status = "test"
} else if (event.target.value.toLowerCase() === "production" || event.target.value.toLowerCase() === "prod") {
innerWorkflow.status = "production"
} else {
innerWorkflow.status = "test"
}
setInnerWorkflow(innerWorkflow)
}}
InputProps={{
style: {
color: "white",
},
}}
color="primary"
defaultValue={innerWorkflow.status}
placeholder="The status of the workflow. Can be test or production."
rows="1"
margin="dense"
fullWidth
/>
<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" />
</RadioGroup>
</FormControl>
<div />
<FormControl style={{marginTop: 15, }}>
<FormLabel id="demo-row-radio-buttons-group-label">Type</FormLabel>
<RadioGroup
row
aria-labelledby="demo-row-radio-buttons-group-label"
name="row-radio-buttons-group"
defaultValue={innerWorkflow.workflow_type}
onChange={(e) => {
console.log("Data: ", e.target.value)
innerWorkflow.workflow_type = e.target.value
setInnerWorkflow(innerWorkflow)
}}
>
<FormControlLabel value="trigger" control={<Radio />} label="Trigger" />
<FormControlLabel value="subflow" control={<Radio />} label="Subflow" />
<FormControlLabel value="standalone" control={<Radio />} label="Standalone" />
</RadioGroup>
</FormControl>
<TextField
onBlur={(event) => {
innerWorkflow.blogpost = event.target.value
@@ -244,6 +270,7 @@ const EditWorkflow = (props) => {
defaultValue={innerWorkflow.blogpost}
placeholder="A blogpost or other reference for how this work workflow was built, and what it's for."
rows="1"
label="blogpost"
margin="dense"
fullWidth
/>
@@ -261,6 +288,7 @@ const EditWorkflow = (props) => {
defaultValue={innerWorkflow.video}
placeholder="A youtube or loom link to the video"
rows="1"
label="Video"
margin="dense"
fullWidth
/>
@@ -279,6 +307,7 @@ const EditWorkflow = (props) => {
placeholder="Default return value (used for Subflows if the subflow fails)"
rows="3"
multiline
label="Default return value"
margin="dense"
fullWidth
/>
frontend/src/components/Oauth2Auth.jsx
+3 -2
View File
@@ -59,6 +59,7 @@ const registeredApps = [
"webex",
"zoho_desk",
"outlook_graph",
"outlook_office365",
"microsoft_teams",
"microsoft_teams_user_access",
]
@@ -367,9 +368,9 @@ const AuthenticationOauth2 = (props) => {
// Hardcode some stuff?
// This could prolly be added to the app itself with a "default" client ID
console.log("APP: ", selectedApp)
if (selectedApp.name.toLowerCase() == "outlook_graph") {
if (selectedApp.name.toLowerCase() == "outlook_graph" || selectedApp.name.toLowerCase() == "outlook_office365") {
handleOauth2Request(
"bb4bff85-0d0b-4f5d-8a69-3cee8029b11a",
"efe4c3fe-84a1-4821-a84f-23a6cfe8e72d",
"",
"https://graph.microsoft.com",
["Mail.ReadWrite"],
frontend/src/components/Searchfield.js
+7 -1
View File
@@ -535,7 +535,8 @@ const SearchField = props => {
}
var name = hit.name === undefined ?
hit.filename.charAt(0).toUpperCase() + hit.filename.slice(1).replaceAll("_", " ") + " - " + hit.title :
hit.filename.charAt(0).toUpperCase() + hit.filename.slice(1).replaceAll("_", " ") + " - " + hit.title
:
(hit.name.charAt(0).toUpperCase()+hit.name.slice(1)).replaceAll("_", " ")
if (name.length > 30) {
@@ -552,6 +553,11 @@ const SearchField = props => {
var parsedUrl = hit.urlpath !== undefined ? hit.urlpath : ""
parsedUrl += `?queryID=${hit.__queryID}`
if (parsedUrl.includes("/apps/")) {
const extraHash = hit.url_hash === undefined ? "" : `#${hit.url_hash}`
parsedUrl = `/apps/${hit.filename}?tab=docs&queryID=${hit.__queryID}${extraHash}`
}
return (
<Link key={hit.objectID} to={parsedUrl} style={{textDecoration: "none", color: "white",}} onClick={(event) => {
frontend/src/components/ShuffleCodeEditor.jsx
+4 -4
View File
@@ -379,10 +379,10 @@ const CodeEditor = (props) => {
const expectedOutput = (input) => {
const found = input.match(/[$]{1}([a-zA-Z0-9_-]+\.?){1}([a-zA-Z0-9#_-]+\.?){0,}/g)
if (found === null || found === undefined) {
console.log("No output found!")
return
}
//if (found === null || found === undefined) {
// console.log("No output found!")
// return
//}
//console.log(found)
frontend/src/views/AngularWorkflow.jsx
+1 -1
View File
@@ -11277,7 +11277,7 @@ const AngularWorkflow = (defaultprops) => {
group: "nodes",
data: {
id: newId,
label: "Your comment :)",
label: "Click to write a comment",
type: "COMMENT",
is_valid: true,
decorator: true,
frontend/src/views/Docs.jsx
+19 -19
View File
@@ -29,7 +29,6 @@ const Body = {
//minWidth: 768,
maxWidth: "100%",
minWidth: "100%",
margin: "auto",
display: "flex",
height: "100%",
color: "white",
@@ -105,17 +104,19 @@ const Docs = (defaultprops) => {
padding: 30,
paddingTop: 15,
marginTop: 15,
minHeight: "50vh",
minHeight: "80vh",
//height: "50vh",
};
const SideBar = {
minWidth: 250,
maxWidth: 300,
position: "absolute",
top: 15,
borderRight: "1px solid rgba(255,255,255,0.3)",
left: 0,
maxHeight: "83vh",
position: "sticky",
top: 50,
minHeight: "90vh",
maxHeight: "90vh",
overflowX: "hidden",
overflowY: "auto",
zIndex: 1000,
@@ -155,7 +156,11 @@ const Docs = (defaultprops) => {
.then((responseJson) => {
if (responseJson.success) {
setData(responseJson.reason);
document.title = "Shuffle " + docId + " documentation";
if (docId === undefined) {
document.title = "Shuffle documentation introduction";
} else {
document.title = "Shuffle " + docId + " documentation";
}
if (responseJson.reason !== undefined && responseJson.reason !== null && responseJson.reason.includes("404: Not Found")) {
navigate("/docs")
@@ -349,11 +354,8 @@ const Docs = (defaultprops) => {
const markdownStyle = {
color: "rgba(255, 255, 255, 0.65)",
maxWidth: mobile ? "100%" : 750,
overflow: "hidden",
paddingBottom: 100,
maxWidth: 750,
minWidth: 750,
margin: "auto",
};
@@ -419,7 +421,7 @@ const Docs = (defaultprops) => {
display: "flex",
}}
>
<div style={{ flex: 3, display: "flex", vAlign: "center" }}>
<div style={{ flex: 3, display: "flex", vAlign: "center", position: "sticky", top: 50, }}>
{mobile ? null : (
<Typography style={{ display: "inline", marginTop: 6 }}>
<a
@@ -599,8 +601,6 @@ const Docs = (defaultprops) => {
marginTop: 50,
textAlign: "center",
margin: "auto",
maxWidth: mobile ? "100%" : 900,
maxWidth: mobile ? "100%" : 900,
marginTop: 50,
}}>
<Typography variant="h4" style={{textAlign: "center",}}>
@@ -766,11 +766,11 @@ const Docs = (defaultprops) => {
</List>
</Paper>
</div>
{props.match.params.key === undefined ?
mainpageInfo
:
<div id="markdown_wrapper_outer" style={markdownStyle}>
<div style={{maxWidth: 750, minWidth: 750, marginTop: 50, }}>
<div style={{maxWidth: 750, minWidth: 750, margin: "auto", overflow: "hidden", marginTop: 50, }}>
{props.match.params.key === undefined ?
mainpageInfo
:
<div id="markdown_wrapper_outer" style={markdownStyle}>
<ReactMarkdown
id="markdown_wrapper"
escapeHtml={false}
@@ -784,8 +784,8 @@ const Docs = (defaultprops) => {
}}
/>
</div>
</div>
}
}
</div>
</div>
);