Ready to edit admin roles

src/ui/accountSettings/GeneralSettings.tsx

@@ -11,7 +11,7 @@ import { snackbar, matAlert } from "../widgets/DialogsProvider";
 import { SettingsSection } from "./SettingsSection";
 
 export class GeneralSettings extends React.Component<
-	{ admin: AdminAccount },
+	{ admin: AdminAccount; editable: boolean },
 	{ newName: string; newEmail: string }
 > {
 	constructor(p: any) {
@@ -66,6 +66,7 @@ export class GeneralSettings extends React.Component<
 						value={this.state.newName}
 						onChange={this.changedName}
 						style={{ width: "100%", paddingBottom: "20px" }}
+						disabled={!this.props.editable}
 					/>
 
 					<TextField
@@ -75,12 +76,13 @@ export class GeneralSettings extends React.Component<
 						onChange={this.changedEmail}
 						type="mail"
 						style={{ width: "100%", paddingBottom: "20px" }}
+						disabled={!this.props.editable}
 					/>
 
 					<div style={{ textAlign: "right" }}>
 						<Button
 							style={{ alignSelf: "end", marginRight: "10px" }}
-							disabled={!this.isValid}
+							disabled={!this.isValid || !this.props.editable}
 							onClick={this.handleSubmit}
 						>
 							Update

src/ui/accountSettings/RoleSettingsSection.tsx

@@ -0,0 +1,18 @@
+/**
+ * Role settings section
+ *
+ * @author Pierre Hubert
+ */
+
+import React from "react";
+import { AdminAccount } from "../../helpers/AccountHelper";
+import { SettingsSection } from "./SettingsSection";
+
+export class RoleSettingsSection extends React.Component<{
+	admin: AdminAccount;
+	editable: boolean;
+}> {
+	render() {
+		return <SettingsSection title="Roles">Soon : roles</SettingsSection>;
+	}
+}

src/ui/routes/AccountSettingsRoute.tsx

@@ -8,8 +8,10 @@ import { Grid } from "@material-ui/core";
 import React from "react";
 import { useParams } from "react-router-dom";
 import { AccountHelper, AdminAccount } from "../../helpers/AccountHelper";
+import { adminID, canManageAdmins } from "../../utils/AccountUtils";
 import { GeneralSettings } from "../accountSettings/GeneralSettings";
 import { KeySettingsSection } from "../accountSettings/KeySettingsSection";
+import { RoleSettingsSection } from "../accountSettings/RoleSettingsSection";
 import { AsyncWidget } from "../widgets/AsyncWidget";
 import { PageTitle } from "../widgets/PageTitle";
 
@@ -62,11 +64,21 @@ class AccountSettingsRouteInner extends React.Component<
 				<Grid container spacing={2}>
 					<GeneralSettings
 						admin={this.state.account}
-					></GeneralSettings>
+						editable={
+							this.props.id == adminID() || canManageAdmins()
+						}
+					/>
 
-					<KeySettingsSection
+					{this.props.id == adminID() || canManageAdmins() ? (
+						<KeySettingsSection admin={this.state.account} />
+					) : (
+						<div></div>
+					)}
+
+					<RoleSettingsSection
 						admin={this.state.account}
-					></KeySettingsSection>
+						editable={canManageAdmins()}
+					/>
 				</Grid>
 			</div>
 		);

src/utils/AccountUtils.ts

@@ -6,6 +6,10 @@
 
 import { AccountHelper } from "../helpers/AccountHelper";
 
+export function adminID(): number {
+	return AccountHelper.currentAccount.id;
+}
+
 export function canManageAdmins(): boolean {
 	return AccountHelper.currentAccount.roles.includes("manage_admins");
 }