Minor left sidebar fixes for notification discovery

This commit is contained in:
Frikky
2025-06-05 00:30:30 +02:00
parent 1faa157fac
commit afe052fc48
2 changed files with 115 additions and 62 deletions
+93 -45
View File
@@ -562,7 +562,7 @@ const LeftSideBar = ({ userdata, serverside, globalUrl, notifications, }) => {
"& .MuiPaper-root": { "& .MuiPaper-root": {
backgroundColor: theme.palette.backgroundColor, backgroundColor: theme.palette.backgroundColor,
color: theme.palette.text.primary, color: theme.palette.text.primary,
borderRadius: 1, borderRadius: theme.palette.borderRadius/3,
}, },
"& .MuiList-root": { "& .MuiList-root": {
backgroundColor: theme.palette.backgroundColor, backgroundColor: theme.palette.backgroundColor,
@@ -602,6 +602,7 @@ const LeftSideBar = ({ userdata, serverside, globalUrl, notifications, }) => {
aria-label="theme" aria-label="theme"
style={{display: 'flex', justifyContent: "center", marginBottom: 10, }} style={{display: 'flex', justifyContent: "center", marginBottom: 10, }}
> >
<ToggleButton value="light" aria-label="light theme" style={{ backgroundColor: currentSelectedTheme === "light" ? theme.palette.hoverColor : theme.palette.backgroundColor }}> <ToggleButton value="light" aria-label="light theme" style={{ backgroundColor: currentSelectedTheme === "light" ? theme.palette.hoverColor : theme.palette.backgroundColor }}>
<LightModeIcon style={{ color: themeMode === "light" ? darkText : lightText }} /> <LightModeIcon style={{ color: themeMode === "light" ? darkText : lightText }} />
</ToggleButton> </ToggleButton>
@@ -622,7 +623,7 @@ const LeftSideBar = ({ userdata, serverside, globalUrl, notifications, }) => {
}} }}
style={{fontSize: 18}} style={{fontSize: 18}}
> >
<BusinessIcon style={{ marginRight: 5 }} /> Organization <BusinessIcon style={{ marginRight: 5 }} /> Org Admin
</MenuItem> </MenuItem>
</Link> </Link>
<Link to="/settings" style={hrefStyle}> <Link to="/settings" style={hrefStyle}>
@@ -632,11 +633,13 @@ const LeftSideBar = ({ userdata, serverside, globalUrl, notifications, }) => {
}} }}
style={{fontSize: 18}} style={{fontSize: 18}}
> >
<SettingsIcon style={{ marginRight: 5 }} /> Account <SettingsIcon style={{ marginRight: 5 }} /> User Account
</MenuItem> </MenuItem>
</Link> </Link>
<Divider style={{ marginTop: 10, marginBottom: 10, }} /> <Divider style={{ marginTop: 10, marginBottom: 10, }} />
{/*
<Link to="/admin?admin_tab=notifications" style={hrefStyle}> <Link to="/admin?admin_tab=notifications" style={hrefStyle}>
<MenuItem <MenuItem
onClick={(event) => { onClick={(event) => {
@@ -644,7 +647,7 @@ const LeftSideBar = ({ userdata, serverside, globalUrl, notifications, }) => {
}} }}
style={{fontSize: 18}} style={{fontSize: 18}}
> >
<NotificationsIcon style={{ marginRight: 5 }} /> Notifications ({ <NotificationsIcon style={{ marginRight: 5 }} /> Org Notifications ({
notifications === undefined || notifications === null ? 0 : notifications === undefined || notifications === null ? 0 :
notifications?.filter((notification) => notification.read === false).length notifications?.filter((notification) => notification.read === false).length
}) })
@@ -652,6 +655,7 @@ const LeftSideBar = ({ userdata, serverside, globalUrl, notifications, }) => {
</Link> </Link>
<Divider style={{ marginTop: 10, marginBottom: 10, }} /> <Divider style={{ marginTop: 10, marginBottom: 10, }} />
*/}
<Link to={userdata && userdata?.org_status?.includes("integration_partner") && userdata?.active_org?.branding?.documentation_link?.length > 0 ? userdata?.active_org?.branding?.documentation_link : "/docs" } target={userdata?.active_org?.branding?.documentation_link?.length > 0 && userdata?.org_status?.includes("integration_partner") ? "_blank" : "_self" } style={hrefStyle}> <Link to={userdata && userdata?.org_status?.includes("integration_partner") && userdata?.active_org?.branding?.documentation_link?.length > 0 ? userdata?.active_org?.branding?.documentation_link : "/docs" } target={userdata?.active_org?.branding?.documentation_link?.length > 0 && userdata?.org_status?.includes("integration_partner") ? "_blank" : "_self" } style={hrefStyle}>
<MenuItem <MenuItem
@@ -1425,6 +1429,7 @@ const LeftSideBar = ({ userdata, serverside, globalUrl, notifications, }) => {
</span> </span>
</Button> </Button>
</span> </span>
<IconButton <IconButton
onClick={() => { onClick={() => {
setOpenSecurityTab((prev) => !prev); setOpenSecurityTab((prev) => !prev);
@@ -1456,10 +1461,11 @@ const LeftSideBar = ({ userdata, serverside, globalUrl, notifications, }) => {
)} )}
</IconButton> </IconButton>
</Box> </Box>
<Collapse in={openSecurityTab} timeout="auto" unmountOnExit > <Collapse in={openSecurityTab} timeout="auto" unmountOnExit >
<Box <Box
style={{ style={{
maxHeight: openSecurityTab && expandLeftNav ? 150 : 0, maxHeight: openSecurityTab && expandLeftNav ? 185 : 0,
overflow: "hidden", overflow: "hidden",
transition: "max-height 0.3s ease, opacity 0.3s ease", transition: "max-height 0.3s ease, opacity 0.3s ease",
display: "flex", display: "flex",
@@ -1592,46 +1598,88 @@ const LeftSideBar = ({ userdata, serverside, globalUrl, notifications, }) => {
</Button> </Button>
</span> </span>
<span style={{ display: "inline-block", width: "100%" }}> <span style={{ display: "inline-block", width: "100%" }}>
<Button <Button
component={Link} component={Link}
to="/admin?tab=locations" to="/admin?admin_tab=notifications"
onClick={(event) => { onClick={(event) => {
setCurrentOpenTab("locations"); setCurrentOpenTab("notifications");
localStorage.setItem("lastTabOpenByUser", "locations"); localStorage.setItem("lastTabOpenByUser", "notifications");
}} }}
variant="text" variant="text"
sx={{ sx={{
width: "100%", width: "100%",
height: 35, height: 35,
color: themeMode === "dark" ? lightText : darkText, color: themeMode === "dark" ? lightText : darkText,
justifyContent: "flex-start", justifyContent: "flex-start",
textTransform: "none", textTransform: "none",
backgroundColor: backgroundColor:
currentOpenTab === "locations" currentOpenTab === "notifications"
? themeMode === "dark" ? darkHoverColor : lightHoverColor ? themeMode === "dark" ? darkHoverColor : lightHoverColor
: "transparent", : "transparent",
"&:hover": { "&:hover": {
backgroundColor: themeMode === "dark" ? darkHoverColor : lightHoverColor, backgroundColor: themeMode === "dark" ? darkHoverColor : lightHoverColor,
}, },
cursor: "pointer", cursor: "pointer",
}} }}
> >
<span style={{ position: "relative", left: !expandLeftNav ? 10 : 0, marginRight: 10, fontSize: 18 }}> <span style={{ position: "relative", left: !expandLeftNav ? 10 : 0, marginRight: 10, fontSize: 18 }}>
• •
</span> </span>
<span <span
style={{ style={{
display: expandLeftNav ? "inline" : "none", display: expandLeftNav ? "inline" : "none",
opacity: expandLeftNav ? 1 : 0, opacity: expandLeftNav ? 1 : 0,
transition: "opacity 0.3s ease", transition: "opacity 0.3s ease",
fontSize: 18, fontSize: 18,
color: themeMode === "dark" ? currentOpenTab === "locations" ? theme.palette.text.primary : lightText : darkText, color: themeMode === "dark" ? currentOpenTab === "notifications" ? theme.palette.text.primary : lightText : darkText,
}} }}
> >
Hybrid Locations Notifications
</span> </span>
</Button> </Button>
</span>
<span style={{ display: "inline-block", width: "100%" }}>
<Button
component={Link}
to="/admin?tab=locations"
onClick={(event) => {
setCurrentOpenTab("locations");
localStorage.setItem("lastTabOpenByUser", "locations");
}}
variant="text"
sx={{
width: "100%",
height: 35,
color: themeMode === "dark" ? lightText : darkText,
justifyContent: "flex-start",
textTransform: "none",
backgroundColor:
currentOpenTab === "locations"
? themeMode === "dark" ? darkHoverColor : lightHoverColor
: "transparent",
"&:hover": {
backgroundColor: themeMode === "dark" ? darkHoverColor : lightHoverColor,
},
cursor: "pointer",
}}
>
<span style={{ position: "relative", left: !expandLeftNav ? 10 : 0, marginRight: 10, fontSize: 18 }}>
•
</span>
<span
style={{
display: expandLeftNav ? "inline" : "none",
opacity: expandLeftNav ? 1 : 0,
transition: "opacity 0.3s ease",
fontSize: 18,
color: themeMode === "dark" ? currentOpenTab === "locations" ? theme.palette.text.primary : lightText : darkText,
}}
>
Runtime Locations
</span>
</Button>
</span> </span>
</>): null} </>): null}
</Box> </Box>
+22 -17
View File
@@ -1983,6 +1983,8 @@ const AppCreator = (defaultprops) => {
const schemes = [splitBase[0]]; const schemes = [splitBase[0]];
const basePath = "/" + splitBase.slice(3).join("/"); const basePath = "/" + splitBase.slice(3).join("/");
const newBaseUrl = baseUrl.replaceAll("http//", "http://").replaceAll("https//", "https://")
const data = { const data = {
openapi: "3.0.0", openapi: "3.0.0",
info: { info: {
@@ -1991,7 +1993,7 @@ const AppCreator = (defaultprops) => {
version: "1.0", version: "1.0",
"x-logo": fileBase64, "x-logo": fileBase64,
}, },
servers: [{ url: baseUrl }], servers: [{ url: newBaseUrl }],
host: host, host: host,
basePath: basePath, basePath: basePath,
schemes: schemes, schemes: schemes,
@@ -2637,12 +2639,17 @@ const AppCreator = (defaultprops) => {
credentials: "include", credentials: "include",
}) })
.then((response) => { .then((response) => {
setAppBuilding(false)
if (response.status === 403) { if (response.status === 403) {
var urlParams = new URLSearchParams(window.location.search) var urlParams = new URLSearchParams(window.location.search)
if (urlParams.has("id")) { if (urlParams.has("id")) {
toast.error(`Please log in to build this app. If this error persists, please contact ${supportEmail}`) toast.error(`Please log in to build this app. If this error persists, please contact ${supportEmail}`)
} else { } else {
toast.error("Failed to save the app as you are not the owner. Redirecting you to the forking page. When there, save again.") toast.error("Failed to save the app as you are not the owner. Redirecting you to the forking page. If this does not load, please download and re-import the app.", {
autoClose: 10000
})
if (props.match.params.appid !== undefined && props.match.params.appid !== null && props.match.params.appid.length > 0) { if (props.match.params.appid !== undefined && props.match.params.appid !== null && props.match.params.appid.length > 0) {
setTimeout(() => { setTimeout(() => {
window.open(`/apps/new?id=${props.match.params.appid}`, "_blank") window.open(`/apps/new?id=${props.match.params.appid}`, "_blank")
@@ -2658,19 +2665,16 @@ const AppCreator = (defaultprops) => {
//throw new Error("NOT 200 :O") //throw new Error("NOT 200 :O")
} }
setAppBuilding(false);
return response.json(); return response.json();
}) })
.then((responseJson) => { .then((responseJson) => {
if (!responseJson.success) { if (responseJson?.success !== true) {
if (responseJson.extra !== undefined && responseJson.extra !== null) { if (responseJson?.extra !== undefined && responseJson?.extra !== null) {
toast("Failed building: " + responseJson.extra); toast("Failed building: " + responseJson.extra);
} } else if (responseJson?.reason !== undefined) {
if (responseJson.reason !== undefined) {
setErrorCode(responseJson.reason); setErrorCode(responseJson.reason);
if (responseJson.details !== undefined && responseJson.details !== null) { if (responseJson?.details !== undefined && responseJson?.details !== null) {
toast.error("Failed to build - contact support@shuffler.io: " + responseJson.details, { toast.error("Failed to build - contact support@shuffler.io: " + responseJson.details, {
autoClose: 60000 autoClose: 60000
}) })
@@ -2679,7 +2683,8 @@ const AppCreator = (defaultprops) => {
autoClose: 10000 autoClose: 10000
}) })
} }
} } else {
}
} else { } else {
toast.success("Successfully built openapi app! Added job to rebuild it in your hybrid runtime locations (Orborus)."); toast.success("Successfully built openapi app! Added job to rebuild it in your hybrid runtime locations (Orborus).");
if (window.location.pathname.includes("/new")) { if (window.location.pathname.includes("/new")) {
@@ -6117,7 +6122,7 @@ const AppCreator = (defaultprops) => {
value={baseUrl} value={baseUrl}
helperText={ helperText={
<span style={{ color: theme.palette.text.primary, marginBottom: "2px" }}> <span style={{ color: theme.palette.text.primary, marginBottom: "2px" }}>
Must start with http(s):// and CANT end with /.{" "} Must start with http(s):// and can NOT end with /.{" "}
</span> </span>
} }
placeholder="https://api.example.com" placeholder="https://api.example.com"
@@ -6136,12 +6141,12 @@ const AppCreator = (defaultprops) => {
toast("URL must start with http(s)://"); toast("URL must start with http(s)://");
} }
if (tmpstring.includes("?")) { if (tmpstring.includes("?")) {
var newtmp = tmpstring.split("?") var newtmp = tmpstring.split("?")
if (tmpstring.length > 1) { if (tmpstring.length > 1) {
tmpstring = newtmp[0] tmpstring = newtmp[0]
} }
} }
setBaseUrl(tmpstring); setBaseUrl(tmpstring);
}} }}