Can delete a user account

src/helpers/ComunicUsersHelper.ts

@@ -82,4 +82,15 @@ export class ComunicUsersHelper {
 			})
 		).url;
 	}
+
+	/**
+	 * Delete a user account
+	 */
+	static async DeleteUserAccount(id: number): Promise<string> {
+		return (
+			await serverRequest("users/delete_account", {
+				user_id: id,
+			})
+		).url;
+	}
 }

src/ui/routes/ComunicUserRoute.tsx

@@ -1,3 +1,6 @@
+import DeleteIcon from "@mui/icons-material/Delete";
+import EmailIcon from "@mui/icons-material/Email";
+import LinkIcon from "@mui/icons-material/Link";
 import {
 	Avatar,
 	Button,
@@ -7,12 +10,12 @@ import {
 	TableCell,
 	TableRow,
 } from "@mui/material";
-import EmailIcon from "@mui/icons-material/Email";
 import React from "react";
 import {
 	ComunicUser,
 	ComunicUsersHelper,
 } from "../../helpers/ComunicUsersHelper";
+import { CopyToClipboard } from "../../utils/ClipboardUtils";
 import { validateEmail } from "../../utils/StringsUtils";
 import { AsyncWidget } from "../widgets/AsyncWidget";
 import { CustomCard } from "../widgets/CustomCard";
@@ -24,8 +27,7 @@ import {
 } from "../widgets/DialogsProvider";
 import { PageTitle } from "../widgets/PageTitle";
 import { TimestampWidget } from "../widgets/TimestampWidget";
-import LinkIcon from "@mui/icons-material/Link";
-import { CopyToClipboard } from "../../utils/ClipboardUtils";
+
 interface UserProperty {
 	name: string;
 	value?: string | number;
@@ -50,6 +52,7 @@ export class ComunicUserRoute extends React.Component<
 
 		this.changeEmailAddress = this.changeEmailAddress.bind(this);
 		this.createPasswordResetLink = this.createPasswordResetLink.bind(this);
+		this.deleteAccount = this.deleteAccount.bind(this);
 	}
 
 	get user(): ComunicUser {
@@ -186,6 +189,31 @@ export class ComunicUserRoute extends React.Component<
 		}
 	}
 
+	async deleteAccount() {
+		try {
+			if (
+				!(await matConfirm(
+					"Do you really want to delete the account of " +
+						this.fullName +
+						"?"
+				)) ||
+				!(await matConfirm(
+					"LAST CHANCE TO COME BACK!!!\nDo you really want to delete the account of " +
+						this.fullName +
+						"?"
+				))
+			)
+				return;
+
+			await ComunicUsersHelper.DeleteUserAccount(this.userID);
+
+			snackbar("The account has been successfully deleted!");
+		} catch (e) {
+			console.error(e);
+			matAlert("Failed to delete user account!");
+		}
+	}
+
 	build() {
 		const properties = this.userProperties.map((p) => {
 			return (
@@ -254,7 +282,7 @@ export class ComunicUserRoute extends React.Component<
 							>
 								<Button
 									variant="outlined"
-									color="secondary"
+									color="primary"
 									startIcon={<EmailIcon />}
 									style={{
 										width: "100%",
@@ -268,13 +296,25 @@ export class ComunicUserRoute extends React.Component<
 
 								<Button
 									variant="outlined"
-									color="secondary"
+									color="primary"
 									startIcon={<LinkIcon />}
 									style={{ width: "100%" }}
 									onClick={this.createPasswordResetLink}
 								>
 									Create password reset link
 								</Button>
+
+								<div>&nbsp;</div>
+
+								<Button
+									variant="outlined"
+									color="secondary"
+									startIcon={<DeleteIcon />}
+									style={{ width: "100%" }}
+									onClick={this.deleteAccount}
+								>
+									Delete user account
+								</Button>
 							</div>
 						</CustomCard>
 					</Grid>

src/ui/widgets/DialogsProvider.tsx

@@ -265,7 +265,7 @@ export class ApplicationDialogsProvider extends React.Component<
 						</DialogContentText>
 					</DialogContent>
 					<DialogActions>
-						<Button onClick={this.rejectConfirm} color="secondary">
+						<Button onClick={this.rejectConfirm} color="primary">
 							Cancel
 						</Button>
 						<Button onClick={this.acceptConfirm} color="secondary">