diff --git a/src/ui/routes/AccountsListRoute.tsx b/src/ui/routes/AccountsListRoute.tsx
index b52b7f4..387e991 100644
--- a/src/ui/routes/AccountsListRoute.tsx
+++ b/src/ui/routes/AccountsListRoute.tsx
@@ -5,21 +5,24 @@
*/
import {
- TableContainer,
+ IconButton,
Paper,
Table,
+ TableBody,
+ TableCell,
+ TableContainer,
TableHead,
TableRow,
- TableCell,
- TableBody,
- IconButton,
} from "@material-ui/core";
-import React from "react";
-import { AccountHelper, AdminAccount } from "../../helpers/AccountHelper";
-import { AsyncWidget } from "../widgets/AsyncWidget";
-import { TimestampWidget } from "../widgets/TimestampWidget";
+import AddIcon from "@material-ui/icons/Add";
import SettingsIcon from "@material-ui/icons/Settings";
+import React from "react";
import { Link } from "react-router-dom";
+import { AccountHelper, AdminAccount } from "../../helpers/AccountHelper";
+import { canManageAdmins } from "../../utils/AccountUtils";
+import { AsyncWidget } from "../widgets/AsyncWidget";
+import { PageTitle } from "../widgets/PageTitle";
+import { TimestampWidget } from "../widgets/TimestampWidget";
export class AccountsListRoute extends React.Component<
{},
@@ -55,44 +58,69 @@ export class AccountsListRoute extends React.Component<
build() {
return (
-
-
-
-
- ID
- Name
- Email address
-
- Account creation
-
- Roles
-
-
-
-
- {this.state.list.map((row) => (
-
- {row.id}
- {row.name}
- {row.email}
+
+
+
+
+ ) : (
+
+ )
+ }
+ />
+
+
+
+
+
+ ID
+ Name
-
+ Email address
- {row.roles.length}
-
-
-
-
-
-
-
+ Account creation
+ Roles
+
- ))}
-
-
-
+
+
+ {this.state.list.map((row) => (
+
+
+ {row.id}
+
+
+ {row.name}
+
+
+ {row.email}
+
+
+
+
+
+ {row.roles.length}
+
+
+
+
+
+
+
+
+
+ ))}
+
+
+
+
);
}
}
diff --git a/src/ui/widgets/PageTitle.tsx b/src/ui/widgets/PageTitle.tsx
index 4a0c44e..0b04029 100644
--- a/src/ui/widgets/PageTitle.tsx
+++ b/src/ui/widgets/PageTitle.tsx
@@ -5,13 +5,21 @@ import { Typography } from "@material-ui/core";
*
* @author Pierre Hubert
*/
-export function PageTitle(p: { name: string }) {
+export function PageTitle(p: { name: string; actions?: React.ReactNode }) {
return (
-
- {p.name}
-
+
+ {p.name}
+
+
+
{p.actions}
+
);
}