diff --git a/striker-ui/components/StrikerConfig/ComplexOperationsPanel.tsx b/striker-ui/components/StrikerConfig/ComplexOperationsPanel.tsx
index 417ba9e9..68fcbb86 100644
--- a/striker-ui/components/StrikerConfig/ComplexOperationsPanel.tsx
+++ b/striker-ui/components/StrikerConfig/ComplexOperationsPanel.tsx
@@ -1,16 +1,15 @@
import { FC } from 'react';
-import FlexBox from '../FlexBox';
-import { ExpandablePanel, Panel } from '../Panels';
-import { BodyText } from '../Text';
+import ConfigPeersForm from './ConfigPeersForm';
+import ManageChangedSSHKeysForm from './ManageChangedSSHKeysForm';
+import ManageUsersForm from './ManageUsersForm';
+import { Panel } from '../Panels';
const ComplexOperationsPanel: FC = () => (
- Configure striker peers}>
-
- Inbound connections
-
-
+
+
+
);
diff --git a/striker-ui/components/StrikerConfig/ManageUsersForm.tsx b/striker-ui/components/StrikerConfig/ManageUsersForm.tsx
new file mode 100644
index 00000000..4af37416
--- /dev/null
+++ b/striker-ui/components/StrikerConfig/ManageUsersForm.tsx
@@ -0,0 +1,55 @@
+import { FC, useEffect } from 'react';
+
+import api from '../../lib/api';
+import handleAPIError from '../../lib/handleAPIError';
+import List from '../List';
+import MessageBox, { Message } from '../MessageBox';
+import { ExpandablePanel } from '../Panels';
+import { BodyText } from '../Text';
+import useProtect from '../../hooks/useProtect';
+import useProtectedState from '../../hooks/useProtectedState';
+
+const ManageUsersForm: FC = () => {
+ const { protect } = useProtect();
+
+ const [listMessage, setListMessage] = useProtectedState(
+ { children: `No users found.` },
+ protect,
+ );
+ const [users, setUsers] = useProtectedState<
+ UserOverviewMetadataList | undefined
+ >(undefined, protect);
+
+ useEffect(() => {
+ if (!users) {
+ api
+ .get('/user')
+ .then(({ data }) => {
+ setUsers(data);
+ })
+ .catch((error) => {
+ // Initialize to prevent infinite fetch.
+ setUsers({});
+ setListMessage(handleAPIError(error));
+ });
+ }
+ }, [setListMessage, setUsers, users]);
+
+ return (
+ Manage users}
+ loading={!users}
+ >
+
}
+ listItems={users}
+ renderListItem={(userUUID, { userName }) => (
+ {userName}
+ )}
+ />
+
+ );
+};
+
+export default ManageUsersForm;
diff --git a/striker-ui/types/APIUser.d.ts b/striker-ui/types/APIUser.d.ts
new file mode 100644
index 00000000..4f09b7ac
--- /dev/null
+++ b/striker-ui/types/APIUser.d.ts
@@ -0,0 +1,8 @@
+type UserOverviewMetadata = {
+ userName: string;
+ userUUID: string;
+};
+
+type UserOverviewMetadataList = {
+ [userUUID: string]: UserOverviewMetadata;
+};