minor improvements

This commit is contained in:
Roman 2024-05-02 14:45:24 +02:00
parent fb353d1bc8
commit 5abbbac2b6
11 changed files with 44 additions and 43 deletions

@ -5,7 +5,7 @@ import {
Box, CssBaseline, Divider,
IconButton, List, ListItem, ListItemButton, ListItemIcon, ListItemText,
Select, Drawer,
styled, MenuItem, Menu,
styled, MenuItem, Menu, useTheme,
} from "@mui/material";
import { Dropdown } from '@mui/base/Dropdown';
import ChevronRightIcon from '@mui/icons-material/ChevronRight';
@ -100,6 +100,7 @@ export default function Sidebar(props) {
const [fetchLanguages, setFetchLanguages] = useState(true);
const [drawerOpen, setDrawerOpen] = useState(window.screen.width >= 1000);
const [anchorEl, setAnchorEl] = useState(null);
const theme = useTheme();
const navigate = useNavigate();
const currentPath = useCurrentPath();

@ -159,9 +159,9 @@ export default function AccessControlList(props) {
rows.push(
<TableRow key={"perm-" + index}>
<TableCell>
<div style={{display: "grid", gridTemplateColumns: "60px auto"}}>
<div style={{alignSelf: "center"}}>
<IconButton style={{padding: 0}} size={"small"} color={"primary"}
<Grid container>
<Grid item xs={1} alignContent={"center"}>
<IconButton size={"small"} color={"primary"}
disabled={isRestricted(permission.method)}
onClick={() => setDialogData({
open: true,
@ -172,25 +172,25 @@ export default function AccessControlList(props) {
{ type: "label", value: L("permissions.description") + ":" },
{ type: "text", name: "description", value: permission.description, maxLength: 128 }
],
onOption: (option, inputData) => option === 0 ? onUpdatePermission(inputData, permission.groups) : true })} >
onOption: (option, inputData) => option === 1 ? onUpdatePermission(inputData, permission.groups) : true })} >
<Edit />
</IconButton>
<IconButton style={{padding: 0}} size={"small"} color={"secondary"}
<IconButton size={"small"} color={"error"}
disabled={isRestricted(permission.method)}
onClick={() => setDialogData({
open: true,
title: L("permissions.delete_permission_confirm"),
message: L("permissions.method") + ": " + permission.method,
onOption: (option) => option === 0 ? onDeletePermission(permission.method) : true
onOption: (option) => option === 1 ? onDeletePermission(permission.method) : true
})} >
<Delete />
</IconButton>
</div>
<div>
</Grid>
<Grid item>
<b>{permission.method}</b><br />
<i>{permission.description}</i>
</div>
</div>
</Grid>
</Grid>
</TableCell>
<BorderedColumn key={"perm-" + index + "-everyone"} align={"center"}>
<Checkbox checked={!permission.groups.length}
@ -250,7 +250,7 @@ export default function AccessControlList(props) {
placeholder: L("permissions.description")
}
],
onOption: (option, inputData) => option === 0 ? onUpdatePermission(inputData, []) : true
onOption: (option, inputData) => option === 1 ? onUpdatePermission(inputData, []) : true
})}>
{L("general.add")}
</Button>
@ -279,6 +279,6 @@ export default function AccessControlList(props) {
message={dialogData.message}
onOption={dialogData.onOption}
inputs={dialogData.inputs}
options={[L("general.ok"), L("general.cancel")]}/>
options={[L("general.cancel"), L("general.ok")]}/>
</ViewContent>
}

@ -159,7 +159,7 @@ export default function EditGroupView(props) {
}
],
onOption: (option) => {
if(option === 0) {
if(option === 1) {
onAddMember()
} else {
selectedUserRef.current = null
@ -227,12 +227,12 @@ export default function EditGroupView(props) {
</Button>
{ !isNewGroup &&
<Button startIcon={<Delete/>} disabled={!api.hasPermission("groups/delete")}
variant={"outlined"} color={"secondary"}
variant={"outlined"} color={"error"}
onClick={() => setDialogData({
open: true,
title: L("account.delete_group_title"),
message: L("account.delete_group_text"),
onOption: option => option === 0 ? onDeleteGroup() : true
onOption: option => option === 1 ? onDeleteGroup() : true
})}>
{L("general.delete")}
</Button>
@ -262,12 +262,12 @@ export default function EditGroupView(props) {
label: L("general.remove"),
element: Delete,
disabled: !api.hasPermission("groups/removeMember"),
color: "secondary",
color: "error",
onClick: (entry) => setDialogData({
open: true,
title: L("account.remove_group_member_title"),
message: sprintf(L("account.remove_group_member_text"), entry.fullName || entry.name),
onOption: (option) => option === 0 ? onRemoveMember(entry.id) : true
onOption: (option) => option === 1 ? onRemoveMember(entry.id) : true
})
}
]),
@ -293,6 +293,6 @@ export default function EditGroupView(props) {
message={dialogData.message}
onOption={dialogData.onOption}
inputs={dialogData.inputs}
options={[L("general.ok"), L("general.cancel")]} />
options={[L("general.cancel"), L("general.ok")]} />
</>
}

@ -76,12 +76,12 @@ const StatBox = (props) => <StyledStatBox variant={"filled"} icon={false}
const StatusLine = (props) => {
const {enabled, text, ...other} = props;
if (enabled) {
return <Box display="grid" gridTemplateColumns={"30px auto"}>
return <Box display="grid" gridTemplateColumns={"30px auto"} alignItems={"center"}>
<CheckCircle color={"primary"} title={text} /> {text}
</Box>
} else {
return <Box display="grid" gridTemplateColumns={"30px auto"}>
<HighlightOff color={"secondary"} title={text} /> {text}
return <Box display="grid" gridTemplateColumns={"30px auto"} alignItems={"center"}>
<HighlightOff color={"error"} title={text} /> {text}
</Box>
}
}
@ -127,25 +127,25 @@ export default function Overview(props) {
<Link key={"home"} to={"/admin/dashboard"}>Home</Link>
]}>
<Grid container spacing={2}>
<Grid item xs={3}>
<Grid item xs={6} lg={3}>
<StatBox color={"info"} count={stats?.userCount}
text={L("admin.users_registered")}
icon={<People/>}
link={"/admin/users"}/>
</Grid>
<Grid item xs={3}>
<Grid item xs={6} lg={3}>
<StatBox color={"success"} count={stats?.groupCount}
text={L("admin.available_groups")}
icon={<Groups/>}
link={"/admin/groups"}/>
</Grid>
<Grid item xs={3}>
<Grid item xs={6} lg={3}>
<StatBox color={"warning"} count={stats?.pageCount}
text={L("admin.routes_defined")}
icon={<LibraryBooks/>}
link={"/admin/routes"}/>
</Grid>
<Grid item xs={3}>
<Grid item xs={6} lg={3}>
<StatBox color={"error"} count={stats?.errorCount}
text={L("admin.error_count")}
icon={<BugReport />}

@ -76,7 +76,7 @@ export default function EditProfilePicture(props) {
},
],
onOption: (option) => {
if (option === 0 && file) {
if (option === 1 && file) {
onUploadPicture(file)
}
@ -115,13 +115,13 @@ export default function EditProfilePicture(props) {
</Button>
{profile.profilePicture &&
<Button variant="outlined" size="small"
startIcon={<Delete />} color="secondary"
startIcon={<Delete />} color={"error"}
onClick={() => setDialogData({
show: true,
title: L("account.picture_remove_title"),
message: L("account.picture_remove_text"),
options: [L("general.confirm"), L("general.cancel")],
onOption: (option) => option === 0 ? onRemoveImage() : true
onOption: (option) => option === 1 ? onRemoveImage() : true
})}>
{L("account.remove_picture")}
</Button>

@ -106,7 +106,7 @@ export default function GpgBox(props) {
<GpgFingerprintBox mb={2}>
{ profile.gpgKey.confirmed ?
<CheckCircle color="info" title={L("account.gpg_key_confirmed")} /> :
<ErrorOutline color="secondary" title={L("account.gpg_key_pending")} />
<ErrorOutline color="error" title={L("account.gpg_key_pending")} />
}
GPG-Fingerprint: <code title={L("general.click_to_copy")}
onClick={() => navigator.clipboard.writeText(profile.gpgKey.fingerprint)}>
@ -124,7 +124,7 @@ export default function GpgBox(props) {
</FormControl>
</SpacedFormGroup>
<Button startIcon={isGpgKeyRemoving ? <CircularProgress size={12} /> : <Remove />}
color="secondary" onClick={onRemoveGpgKey}
color="error" onClick={onRemoveGpgKey}
variant="outlined" size="small"
disabled={isGpgKeyRemoving || !api.hasPermission("gpgKey/remove")}>
{isGpgKeyRemoving ? L("general.removing") + "…" : L("general.remove")}

@ -82,7 +82,7 @@ export default function MultiFactorBox(props) {
</FormControl>
</SpacedFormGroup>
<Button startIcon={is2FARemoving ? <CircularProgress size={12} /> : <Remove />}
color="secondary" onClick={onRemove2FA}
color="danger" onClick={onRemove2FA}
variant="outlined" size="small"
disabled={is2FARemoving || !api.hasPermission("tfa/remove")}>
{is2FARemoving ? L("general.removing") + "…" : L("general.remove")}

@ -37,8 +37,8 @@ export default function MfaTotp(props) {
sx: { "& input": { textAlign: "center", fontFamily: "monospace" } },
}
],
options: [L("general.ok"), L("general.cancel")],
onOption: (option, data) => option === 0 ? onConfirmTOTP(data.code) : true
options: [L("general.cancel"), L("general.ok")],
onOption: (option, data) => option === 1 ? onConfirmTOTP(data.code) : true
})
}
}, [api, onConfirmTOTP]);

@ -104,9 +104,9 @@ export default function RouteForm(props) {
onChange={e => setRoute({...route, extra: minifyJson(e.target.value)})}/>
<Box mt={1} fontStyle={"italic"} display={"grid"} gridTemplateColumns={"30px auto"}>{
extraArgs === null ?
<><ErrorRounded color={"secondary"}/><span>{L("routes.json_err")}</span></> :
<><ErrorRounded color={"error"}/><span>{L("routes.json_err")}</span></> :
(type !== "object" ?
<><ErrorRounded color={"secondary"}/><span>{L("routes.json_not_object")}</span></> :
<><ErrorRounded color={"error"}/><span>{L("routes.json_not_object")}</span></> :
<><CheckCircle color={"primary"} /><span>{L("routes.json_ok")}</span></>)
}</Box>
</RouteFormControl>

@ -178,7 +178,7 @@ export default function RouteListView(props) {
</IconButton>
<IconButton size={"small"} title={L("general.delete")}
disabled={!api.hasPermission("routes/remove")}
color={"secondary"}
color={"error"}
onClick={() => setDialogData({
open: true,
title: L("routes.delete_route_title"),
@ -186,8 +186,8 @@ export default function RouteListView(props) {
inputs: [
{ type: "text", name: "pattern", value: route.pattern, disabled: true}
],
options: [L("general.ok"), L("general.cancel")],
onOption: btn => btn === 0 ? onDeleteRoute(route.id) : true
options: [L("general.cancel"), L("general.ok")],
onOption: btn => btn === 1 ? onDeleteRoute(route.id) : true
})}>
<Delete />
</IconButton>
@ -207,6 +207,6 @@ export default function RouteListView(props) {
message={dialogData.message}
onOption={dialogData.onOption}
inputs={dialogData.inputs}
options={[L("general.ok"), L("general.cancel")]} />
options={[L("general.cancel"), L("general.ok")]} />
</>
}

@ -341,7 +341,7 @@ export default function SettingsView(props) {
</TableCell>
<TableCell align={"center"}>
<IconButton onClick={() => onDeleteKey(key)}
color={"secondary"}>
color={"error"}>
<Delete />
</IconButton>
</TableCell>
@ -404,7 +404,7 @@ export default function SettingsView(props) {
variant={"outlined"} title={L(hasChanged ? "general.unsaved_changes" : "general.save")}>
{isSaving ? L("general.saving") + "…" : (L("general.save") + (hasChanged ? " *" : ""))}
</Button>
<Button color={"secondary"}
<Button color={"error"}
onClick={onReset}
disabled={isSaving}
startIcon={<RestartAlt />}