Add explanation for built-in user

app/api/roles.spec.ts

@@ -147,11 +147,26 @@ describe('getEffectiveRole', () => {
 })
 
 test('byGroupThenName sorts as expected', () => {
- const a = { identityType: 'silo_group' as const, name: 'a' }
- const b = { identityType: 'silo_group' as const, name: 'b' }
- const c = { identityType: 'silo_user' as const, name: 'c' }
- const d = { identityType: 'silo_user' as const, name: 'd' }
- const e = { identityType: 'silo_user' as const, name: 'e' }
+ const a = {
+ identityType: 'silo_group' as const,
+ name: { kind: 'real' as const, name: 'a' },
+ }
+ const b = {
+ identityType: 'silo_group' as const,
+ name: { kind: 'real' as const, name: 'b' },
+ }
+ const c = {
+ identityType: 'silo_user' as const,
+ name: { kind: 'real' as const, name: 'a' },
+ }
+ const d = {
+ identityType: 'silo_user' as const,
+ name: { kind: 'stranger' as const, id: 'aa' },
+ }
+ const e = {
+ identityType: 'silo_user' as const,
+ name: { kind: 'built-in' as const },
+ }
 
  expect([c, e, b, d, a].sort(byGroupThenName)).toEqual([a, b, c, d, e])
 })

app/api/roles.ts

@@ -13,9 +13,11 @@
  */
 import { useMemo } from 'react'
 import * as R from 'remeda'
+import { match } from 'ts-pattern'
 
 import type { FleetRole, IdentityType, ProjectRole, SiloRole } from './__generated__/Api'
 import { api, q, usePrefetchedQuery } from './client'
+import { USER_TEST_PRIVILEGED_ID } from './util'
 
 /**
  * Union of all the specific roles, which used to all be the same until we added
@@ -90,10 +92,40 @@ export function deleteRole<Role extends RoleKey>(
  return { roleAssignments }
 }
 
+export type UserName =
+ | { kind: 'real'; name: string }
+ | { kind: 'stranger'; id: string }
+ | { kind: 'built-in' }
+
+export const displayUserName = (name: UserName): string =>
+ match(name)
+ .with({ kind: 'real' }, ({ name }) => name)
+ .with({ kind: 'stranger' }, ({ id }) => id)
+ .with({ kind: 'built-in' }, () => 'Built-in user')
+ .exhaustive()
+
+const getUserName = (
+ dict: Record<string, { displayName: string }>,
+ id: string
+): UserName => {
+ if (id in dict) {
+ return { kind: 'real', name: dict[id].displayName }
+ } else if (id === USER_TEST_PRIVILEGED_ID) {
+ // The built-in user has no name, but a known id. Eventually it should be
+ // removed; see omicron#2305.
+ return { kind: 'built-in' }
+ } else {
+ // A user's name might not appear here if they are not in the current
+ // user's silo. This could happen in a fleet policy, which might have users
+ // from different silos.
+ return { kind: 'stranger', id }
+ }
+}
+
 type UserAccessRow<Role extends RoleKey = RoleKey> = {
  id: string
  identityType: IdentityType
- name: string
+ name: UserName
  roleName: Role
  roleSource: string
 }
@@ -120,18 +152,14 @@ export function useUserRows<Role extends RoleKey = RoleKey>(
  return roleAssignments.map((ra) => ({
  id: ra.identityId,
  identityType: ra.identityType,
- // A user might not appear here if they are not in the current user's
- // silo. This could happen in a fleet policy, which might have users from
- // different silos. Hence the ID fallback. The code that displays this
- // detects when we've fallen back and includes an explanatory tooltip.
- name: usersDict[ra.identityId]?.displayName || ra.identityId,
+ name: getUserName(usersDict, ra.identityId),
  roleName: ra.roleName,
  roleSource,
  }))
  }, [roleAssignments, roleSource, users, groups])
 }
 
-type SortableUserRow = { identityType: IdentityType; name: string }
+type SortableUserRow = { identityType: IdentityType; name: UserName }
 
 /**
  * Comparator for array sort. Group groups and users, then sort by name within
@@ -140,7 +168,7 @@ type SortableUserRow = { identityType: IdentityType; name: string }
 export function byGroupThenName(a: SortableUserRow, b: SortableUserRow) {
  const aGroup = Number(a.identityType === 'silo_group')
  const bGroup = Number(b.identityType === 'silo_group')
- return bGroup - aGroup || a.name.localeCompare(b.name)
+ return bGroup - aGroup || displayUserName(a.name).localeCompare(displayUserName(b.name))
 }
 
 export type Actor = {

app/api/util.ts

@@ -343,3 +343,6 @@ export function synthesizeData(
 }
 
 export const OXQL_GROUP_BY_ERROR = 'Input tables to a `group_by` must be aligned'
+
+// https://github.com/oxidecomputer/omicron/blob/b260af8/nexus/db-fixed-data/src/silo_user.rs#L22
+export const USER_TEST_PRIVILEGED_ID = '001de000-05e4-4000-8000-000000004007'

app/pages/SiloAccessPage.tsx

@@ -12,13 +12,15 @@ import {
  api,
  byGroupThenName,
  deleteRole,
+ displayUserName,
  q,
  queryClient,
  useApiMutation,
  usePrefetchedQuery,
  useUserRows,
  type IdentityType,
  type RoleKey,
+ type UserName,
 } from '@oxide/api'
 import { Access16Icon, Access24Icon } from '@oxide/design-system/icons/react'
 import { Badge } from '@oxide/design-system/ui'
@@ -74,7 +76,7 @@ export const handle = { crumb: 'Silo Access' }
 type UserRow = {
  id: string
  identityType: IdentityType
- name: string
+ name: UserName
  siloRole: RoleKey | undefined
 }
 
@@ -120,7 +122,10 @@ export default function SiloAccessPage() {
 
  const columns = useMemo(
  () => [
- colHelper.accessor('name', { header: 'Name' }),
+ colHelper.accessor('name', {
+ header: 'Name',
+ cell: (info) => displayUserName(info.getValue()),
+ }),
  colHelper.accessor('identityType', {
  header: 'Type',
  cell: (info) => identityTypeLabel[info.getValue()],
@@ -146,7 +151,7 @@ export default function SiloAccessPage() {
  doDelete: () => updatePolicy({ body: deleteRole(row.id, siloPolicy) }),
  label: (
  <span>
- the <HL>{row.siloRole}</HL> role for <HL>{row.name}</HL>
+ the <HL>{row.siloRole}</HL> role for <HL>{displayUserName(row.name)}</HL>
  </span>
  ),
  resourceKind: 'role assignment',
@@ -202,7 +207,7 @@ export default function SiloAccessPage() {
  <SiloAccessEditUserSideModal
  onDismiss={() => setEditingUserRow(null)}
  policy={siloPolicy}
- name={editingUserRow.name}
+ name={displayUserName(editingUserRow.name)}
  identityId={editingUserRow.id}
  identityType={editingUserRow.identityType}
  defaultValues={{ roleName: editingUserRow.siloRole }}

app/pages/project/access/ProjectAccessPage.tsx

@@ -15,6 +15,7 @@ import {
  api,
  byGroupThenName,
  deleteRole,
+ displayUserName,
  q,
  queryClient,
  roleOrder,
@@ -23,6 +24,7 @@ import {
  useUserRows,
  type IdentityType,
  type RoleKey,
+ type UserName,
 } from '@oxide/api'
 import { Access16Icon, Access24Icon } from '@oxide/design-system/icons/react'
 import { Badge } from '@oxide/design-system/ui'
@@ -85,7 +87,7 @@ export const handle = { crumb: 'Project Access' }
 type UserRow = {
  id: string
  identityType: IdentityType
- name: string
+ name: UserName
  projectRole: RoleKey | undefined
  roleBadges: { roleSource: string; roleName: RoleKey }[]
 }
@@ -140,7 +142,10 @@ export default function ProjectAccessPage() {
 
  const columns = useMemo(
  () => [
- colHelper.accessor('name', { header: 'Name' }),
+ colHelper.accessor('name', {
+ header: 'Name',
+ cell: (info) => displayUserName(info.getValue()),
+ }),
  colHelper.accessor('identityType', {
  header: 'Type',
  cell: (info) => identityTypeLabel[info.getValue()],
@@ -189,7 +194,7 @@ export default function ProjectAccessPage() {
  // role of X. However we would have to look at their groups too.
  label: (
  <span>
- the <HL>{row.projectRole}</HL> role for <HL>{row.name}</HL>
+ the <HL>{row.projectRole}</HL> role for <HL>{displayUserName(row.name)}</HL>
  </span>
  ),
  resourceKind: 'role assignment',
@@ -243,7 +248,7 @@ export default function ProjectAccessPage() {
  <ProjectAccessEditUserSideModal
  onDismiss={() => setEditingUserRow(null)}
  policy={projectPolicy}
- name={editingUserRow.name}
+ name={displayUserName(editingUserRow.name)}
  identityId={editingUserRow.id}
  identityType={editingUserRow.identityType}
  defaultValues={{ roleName: editingUserRow.projectRole }}

app/pages/system/FleetAccessPage.tsx

@@ -14,6 +14,7 @@ import {
  api,
  byGroupThenName,
  deleteRole,
+ displayUserName,
  getEffectiveRole,
  q,
  queryClient,
@@ -22,6 +23,7 @@ import {
  useUserRows,
  type FleetRole,
  type IdentityType,
+ type UserName,
 } from '@oxide/api'
 import { Access16Icon, Access24Icon } from '@oxide/design-system/icons/react'
 import { Badge } from '@oxide/design-system/ui'
@@ -85,7 +87,7 @@ type AssignmentRow = {
  kind: 'assignment'
  id: string
  identityType: IdentityType
- name: string
+ name: UserName
  fleetRole: FleetRole
 }
 
@@ -151,20 +153,27 @@ export default function FleetAccessPage() {
  header: 'Name',
  cell: (info) =>
  match(info.row.original)
- .with({ kind: 'assignment' }, (row) =>
- row.name === row.id ? (
- <span className="flex items-center gap-1">
- {row.id}
- <TipIcon>
- Can't resolve name because{' '}
- {row.identityType === 'silo_user' ? 'user' : 'group'} is not in your
- silo
- </TipIcon>
- </span>
- ) : (
- row.name
- )
- )
+ .with({ kind: 'assignment' }, (row) => (
+ <span className="flex items-center gap-1">
+ {displayUserName(row.name)}
+ {match(row.name)
+ .with({ kind: 'real' }, () => null)
+ .with({ kind: 'stranger' }, () => (
+ <TipIcon>
+ Can't resolve name because{' '}
+ {row.identityType === 'silo_user' ? 'user' : 'group'} is not in your
+ silo
+ </TipIcon>
+ ))
+ .with({ kind: 'built-in' }, () => (
+ <TipIcon>
+ This is a system account for bootstrapping before configuring your
+ identity provider. It cannot be used to log in.
+ </TipIcon>
+ ))
+ .exhaustive()}
+ </span>
+ ))
  .with({ kind: 'mapping' }, (row) => (
  <span className="flex items-center gap-1.5">
  Any{' '}
@@ -225,7 +234,8 @@ export default function FleetAccessPage() {
  doDelete: () => updatePolicy({ body: deleteRole(row.id, fleetPolicy) }),
  label: (
  <span>
- the <HL>{row.fleetRole}</HL> role for <HL>{row.name}</HL>
+ the <HL>{row.fleetRole}</HL> role for{' '}
+ <HL>{displayUserName(row.name)}</HL>
  </span>
  ),
  resourceKind: 'role assignment',
@@ -282,7 +292,7 @@ export default function FleetAccessPage() {
  <FleetAccessEditUserSideModal
  onDismiss={() => setEditingUserRow(null)}
  policy={fleetPolicy}
- name={editingUserRow.name}
+ name={displayUserName(editingUserRow.name)}
  identityId={editingUserRow.id}
  identityType={editingUserRow.identityType}
  defaultValues={{ roleName: editingUserRow.fleetRole }}

mock-api/role-assignment.ts

@@ -5,7 +5,12 @@
  *
  * Copyright Oxide Computer Company
  */
-import { FLEET_ID, type IdentityType, type RoleKey } from '@oxide/api'
+import {
+ FLEET_ID,
+ USER_TEST_PRIVILEGED_ID,
+ type IdentityType,
+ type RoleKey,
+} from '@oxide/api'
 
 import { project, projectAdorno, projectAnscombe, projectKosman } from './project'
 import { defaultSilo, myriadSilo, noPoolsSilo, pelerinesSilo, thraxSilo } from './silo'
@@ -73,6 +78,13 @@ export const roleAssignments: DbRoleAssignment[] = [
  identity_type: 'silo_group',
  role_name: 'viewer',
  },
+ {
+ resource_type: 'fleet',
+ resource_id: FLEET_ID,
+ identity_id: USER_TEST_PRIVILEGED_ID,
+ identity_type: 'silo_user',
+ role_name: 'admin',
+ },
  {
  resource_type: 'silo',
  resource_id: defaultSilo.id,