added a new function for user info look up as non-hook. added ability…

… to manually add users to model access
gchq · Nov 13, 2024 · 4f1836c · 4f1836c
1 parent a4509ce
commit 4f1836c
Show file tree

Hide file tree

Showing 2 changed files with 36 additions and 24 deletions.
diff --git a/frontend/actions/user.ts b/frontend/actions/user.ts
@@ -49,9 +49,9 @@ interface UserInformationResponse {
   entity: UserInformation
 }
 
-export function useGetUserInformation(dn: string) {
+export function useGetUserInformation(dn: string, kind?: string) {
   const { data, isLoading, error, mutate } = useSWR<UserInformationResponse, ErrorInfo>(
-    `/api/v2/entity/${dn}/lookup`,
+    `/api/v2/entity/${dn}/lookup${kind ? `?kind=${kind}` : ''}`,
     fetcher,
   )
 
@@ -63,6 +63,12 @@ export function useGetUserInformation(dn: string) {
   }
 }
 
+export function getUserInformation(dn: string) {
+  return fetch(`/api/v2/entity/${dn}/lookup`, {
+    headers: { 'Content-Type': 'application/json' },
+  })
+}
+
 interface GetUserTokensResponse {
   tokens: TokenInterface[]
 }

diff --git a/frontend/src/entry/settings/EntryAccessInput.tsx b/frontend/src/entry/settings/EntryAccessInput.tsx
@@ -5,10 +5,6 @@ import {
   AccordionSummary,
   Autocomplete,
   Button,
-  FormControl,
-  InputLabel,
-  MenuItem,
-  Select,
   Stack,
   Table,
   TableBody,
@@ -18,12 +14,13 @@ import {
   TextField,
   Typography,
 } from '@mui/material'
-import { useListUsers } from 'actions/user'
+import { getUserInformation, useListUsers } from 'actions/user'
 import { debounce } from 'lodash-es'
 import { SyntheticEvent, useCallback, useEffect, useMemo, useState } from 'react'
 import EntityItem from 'src/entry/settings/EntityItem'
 import MessageAlert from 'src/MessageAlert'
 import { CollaboratorEntry, EntityKind, EntityObject, EntryKindKeys, Role } from 'types/types'
+import { getErrorMessage } from 'utils/fetcher'
 import { toSentenceCase } from 'utils/stringUtils'
 
 type EntryAccessInputProps = {
@@ -46,8 +43,8 @@ export default function EntryAccessInput({ value, onUpdate, entryKind, entryRole
   const [open, setOpen] = useState(false)
   const [accessList, setAccessList] = useState<CollaboratorEntry[]>(value)
   const [userListQuery, setUserListQuery] = useState('')
-  const [manualEntityKind, setManualEntityKind] = useState<EntityKind>(EntityKind.USER)
   const [manualEntityName, setManualEntityName] = useState('')
+  const [errorMessage, setErrorMessage] = useState('')
 
   const { users, isUsersLoading, isUsersError } = useListUsers(userListQuery)
 
@@ -96,6 +93,23 @@ export default function EntryAccessInput({ value, onUpdate, entryKind, entryRole
     handleInputChange(event, value)
   }, 500)
 
+  const handleAddEntityManuallyOnClick = useCallback(async () => {
+    setErrorMessage('')
+    if (manualEntityName !== undefined && manualEntityName !== '') {
+      if (accessList.find((collaborator) => collaborator.entity === `${EntityKind.USER}:${manualEntityName}`)) {
+        return setErrorMessage(`The requested user has already been added below.`)
+      }
+      const response = await getUserInformation(manualEntityName)
+      if (!response.ok) {
+        return setErrorMessage(await getErrorMessage(response))
+      }
+      const updatedAccessList = [...accessList]
+      const newAccess = { entity: `${EntityKind.USER}:${manualEntityName}`, roles: [] }
+      updatedAccessList.push(newAccess)
+      setAccessList(updatedAccessList)
+    }
+  }, [accessList, manualEntityName])
+
   const noOptionsText = useMemo(() => {
     if (userListQuery.length < 3) return 'Please enter at least three characters'
     if (isUsersError?.status === 413) return 'Too many results, please refine your search'
@@ -141,34 +155,26 @@ export default function EntryAccessInput({ value, onUpdate, entryKind, entryRole
           aria-controls='manual-user-add-content'
           id='manual-user-add-header'
         >
-          <Typography component='caption'>Trouble finding user / group?</Typography>
+          <Typography sx={{ mr: 1 }} component='caption'>
+            Trouble finding a user? Click here to add them manually
+          </Typography>
         </AccordionSummary>
         <AccordionDetails sx={{ p: 0 }}>
           <Stack spacing={2} direction={{ xs: 'column', sm: 'row' }}>
-            <FormControl sx={{ width: '150px' }}>
-              <InputLabel id='manual-entity-kind-select'>User or group</InputLabel>
-              <Select
-                id='manual-entity-kind-select'
-                value={manualEntityKind}
-                label='User or group'
-                size='small'
-                onChange={(e) => setManualEntityKind(e.target.value as EntityKind)}
-              >
-                <MenuItem value={'user'}>User</MenuItem>
-                <MenuItem value={'group'}>Group</MenuItem>
-              </Select>
-            </FormControl>
             <TextField
               id='manual-entity-name-select'
               placeholder='Joe Bloggs'
               size='small'
               fullWidth
-              label='User or group name'
+              label='User'
               value={manualEntityName}
               onChange={(e) => setManualEntityName(e.target.value)}
             />
-            <Button variant='contained'>Add</Button>
+            <Button variant='contained' onClick={handleAddEntityManuallyOnClick}>
+              Add
+            </Button>
           </Stack>
+          <MessageAlert message={errorMessage} severity='error' />
         </AccordionDetails>
       </Accordion>
       <Table>