put display names back for users (#1003)

oxidecomputer · Jun 29, 2022 · d2619df · d2619df · vercel · Jun 29, 2022
1 parent b3ed5e3
commit d2619df
Show file tree

Hide file tree

Showing 9 changed files with 116 additions and 18 deletions.
diff --git a/OMICRON_VERSION b/OMICRON_VERSION
@@ -1 +1 @@
-0d2410071711d7ecdd3c115ebfb93b3ea3e1e16b
+703b2a31b0d0b061f0759f631ccfb434d4007619
diff --git a/app/forms/org-access.tsx b/app/forms/org-access.tsx
@@ -38,7 +38,7 @@ export function OrgAccessAddUserSideModal({
   const orgParams = useParams('orgName')
 
   const users = useUsersNotInPolicy(policy)
-  const userItems = users.map((u) => ({ value: u.id, label: u.id }))
+  const userItems = users.map((u) => ({ value: u.id, label: u.displayName }))
 
   const queryClient = useApiQueryClient()
   const updatePolicy = useApiMutation('organizationPutPolicy', {

diff --git a/app/forms/project-access.tsx b/app/forms/project-access.tsx
@@ -39,7 +39,7 @@ export function ProjectAccessAddUserSideModal({
   const projectParams = useParams('orgName', 'projectName')
 
   const users = useUsersNotInPolicy(policy)
-  const userItems = users.map((u) => ({ value: u.id, label: u.id }))
+  const userItems = users.map((u) => ({ value: u.id, label: u.displayName }))
 
   const queryClient = useApiQueryClient()
   const updatePolicy = useApiMutation('organizationProjectsPutProjectPolicy', {

diff --git a/app/pages/__tests__/org-access.e2e.ts b/app/pages/__tests__/org-access.e2e.ts
@@ -8,7 +8,7 @@ test('Click through org access page', async ({ page }) => {
   // page is there, we see AL but not FDR
   await page.click('role=link[name*="Access & IAM"]')
   await expectVisible(page, ['role=heading[name*="Access & IAM"]'])
-  await expectRowVisible(page, 'user-1', ['user-1', '', 'admin'])
+  await expectRowVisible(page, 'user-1', ['user-1', 'Hannah Arendt', 'admin'])
   await expectNotVisible(page, ['role=cell[name="user-2"]'])
 
   // Add FDR as collab
@@ -17,10 +17,10 @@ test('Click through org access page', async ({ page }) => {
 
   await page.click('role=button[name="User"]')
   // only users not already on the org should be visible
-  await expectNotVisible(page, ['role=option[name="user-1"]'])
-  await expectVisible(page, ['role=option[name="user-2"]'])
+  await expectNotVisible(page, ['role=option[name="Hannah Arendt"]'])
+  await expectVisible(page, ['role=option[name="Hans Jonas"]'])
 
-  await page.click('role=option[name="user-2"]')
+  await page.click('role=option[name="Hans Jonas"]')
 
   await page.click('role=button[name="Role"]')
   await expectVisible(page, [
@@ -33,7 +33,7 @@ test('Click through org access page', async ({ page }) => {
   await page.click('role=button[name="Add user"]')
 
   // FDR shows up in the table
-  await expectRowVisible(page, 'user-2', ['user-2', '', 'collaborator'])
+  await expectRowVisible(page, 'user-2', ['user-2', 'Hans Jonas', 'collaborator'])
 
   // now change FDR's role from collab to viewer
   await page
@@ -49,7 +49,7 @@ test('Click through org access page', async ({ page }) => {
   await page.click('role=option[name="Viewer"]')
   await page.click('role=button[name="Update role"]')
 
-  await expectRowVisible(page, 'user-2', ['user-2', '', 'viewer'])
+  await expectRowVisible(page, 'user-2', ['user-2', 'Hans Jonas', 'viewer'])
 
   // now delete FDR
   await page

diff --git a/app/pages/__tests__/project-access.e2e.ts b/app/pages/__tests__/project-access.e2e.ts
@@ -8,7 +8,7 @@ test('Click through project access page', async ({ page }) => {
   // page is there, we see AL but not FDR
   await page.click('role=link[name*="Access & IAM"]')
   await expectVisible(page, ['role=heading[name*="Access & IAM"]'])
-  await expectRowVisible(page, 'user-1', ['user-1', '', 'admin'])
+  await expectRowVisible(page, 'user-1', ['user-1', 'Hannah Arendt', 'admin'])
   await expectNotVisible(page, ['role=cell[name="user-2"]'])
 
   // Add FDR as collab
@@ -17,10 +17,10 @@ test('Click through project access page', async ({ page }) => {
 
   await page.click('role=button[name="User"]')
   // only users not already on the project should be visible
-  await expectNotVisible(page, ['role=option[name="user-1"]'])
-  await expectVisible(page, ['role=option[name="user-2"]'])
+  await expectNotVisible(page, ['role=option[name="Hannah Arendt"]'])
+  await expectVisible(page, ['role=option[name="Hans Jonas"]'])
 
-  await page.click('role=option[name="user-2"]')
+  await page.click('role=option[name="Hans Jonas"]')
 
   await page.click('role=button[name="Role"]')
   await expectVisible(page, [
@@ -33,7 +33,7 @@ test('Click through project access page', async ({ page }) => {
   await page.click('role=button[name="Add user"]')
 
   // FDR shows up in the table
-  await expectRowVisible(page, 'user-2', ['user-2', '', 'collaborator'])
+  await expectRowVisible(page, 'user-2', ['user-2', 'Hans Jonas', 'collaborator'])
 
   // now change FDR's role from collab to viewer
   await page
@@ -49,7 +49,7 @@ test('Click through project access page', async ({ page }) => {
   await page.click('role=option[name="Viewer"]')
   await page.click('role=button[name="Update role"]')
 
-  await expectRowVisible(page, 'user-2', ['user-2', '', 'viewer'])
+  await expectRowVisible(page, 'user-2', ['user-2', 'Hans Jonas', 'viewer'])
 
   // now delete FDR
   await page

diff --git a/libs/api-mocks/user.ts b/libs/api-mocks/user.ts
@@ -4,10 +4,12 @@ import type { Json } from './json-type'
 
 export const user1: Json<User> = {
   id: 'user-1',
+  display_name: 'Hannah Arendt',
 }
 
 export const user2: Json<User> = {
   id: 'user-2',
+  display_name: 'Hans Jonas',
 }
 
 export const users = [user1, user2]
diff --git a/libs/api/__generated__/Api.ts b/libs/api/__generated__/Api.ts
diff --git a/libs/api/__generated__/OMICRON_VERSION b/libs/api/__generated__/OMICRON_VERSION
diff --git a/libs/api/roles.ts b/libs/api/roles.ts
@@ -110,17 +110,29 @@ export function useUserAccessRows<Role extends string>(
   policy: Policy<Role> | undefined,
   roleOrder: Record<Role, number>
 ): UserAccessRow<Role>[] {
+  // TODO: this hits /users, which returns system users, not silo users. We need
+  // an endpoint to list silo users. I'm hoping we might end up using /users for
+  // that. See https://github.com/oxidecomputer/omicron/issues/1235
+  const { data: users } = useApiQuery('siloUsersGet', { limit: 200 })
+
+  // HACK: because the policy has no names, we are fetching ~all the users,
+  // putting them in a dictionary, and adding the names to the rows
+  const usersDict = useMemo(
+    () => Object.fromEntries((users?.items || []).map((u) => [u.id, u])),
+    [users]
+  )
+
   return useMemo(() => {
     const roleAssignments = policy?.roleAssignments || []
     const groups = groupBy(roleAssignments, (u) => u.identityId)
     return Object.entries(groups).map(([userId, groupRoleAssignments]) => ({
       id: userId,
-      name: '', // placeholder until we get names, obviously
+      name: usersDict[userId]?.displayName || '', // placeholder until we get names, obviously
       // assert non-null because we know there has to be one, otherwise there
       // wouldn't be a group
       roleName: getMainRole(roleOrder)(groupRoleAssignments.map((ra) => ra.roleName))!,
     }))
-  }, [policy, roleOrder])
+  }, [policy, usersDict, roleOrder])
 }
 
 /**
Original file line number	Diff line number	Diff line change
		@@ -1 +1 @@
		0d2410071711d7ecdd3c115ebfb93b3ea3e1e16b
		703b2a31b0d0b061f0759f631ccfb434d4007619