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; +};