turn accessTypeLabel and getBadgeColor functions into records

Author: david-crespo

app/pages/SiloAccessPage.tsx

@@ -35,7 +35,7 @@ import { Button } from '~/ui/lib/Button'
 import { EmptyMessage } from '~/ui/lib/EmptyMessage'
 import { PageHeader, PageTitle } from '~/ui/lib/PageHeader'
 import { TableActions, TableEmptyBox } from '~/ui/lib/Table'
-import { accessTypeLabel, getBadgeColor } from '~/util/access'
+import { identityTypeLabel, roleColor } from '~/util/access'
 import { groupBy, isTruthy } from '~/util/array'
 
 const EmptyState = ({ onClick }: { onClick: () => void }) => (
@@ -114,13 +114,13 @@ export function SiloAccessPage() {
       colHelper.accessor('name', { header: 'Name' }),
       colHelper.accessor('identityType', {
         header: 'Type',
-        cell: (props) => accessTypeLabel(props.getValue()),
+        cell: (props) => identityTypeLabel[props.getValue()],
       }),
       colHelper.accessor('siloRole', {
         header: 'Role',
         cell: (props) => {
           const role = props.getValue()
-          return role ? <Badge color={getBadgeColor(role)}>silo.{role}</Badge> : null
+          return role ? <Badge color={roleColor[role]}>silo.{role}</Badge> : null
         },
       }),
       // TODO: tooltips on disabled elements explaining why

app/pages/project/access/ProjectAccessPage.tsx

@@ -40,7 +40,7 @@ import { EmptyMessage } from '~/ui/lib/EmptyMessage'
 import { PageHeader, PageTitle } from '~/ui/lib/PageHeader'
 import { TableActions, TableEmptyBox } from '~/ui/lib/Table'
 import { TipIcon } from '~/ui/lib/TipIcon'
-import { accessTypeLabel, getBadgeColor } from '~/util/access'
+import { identityTypeLabel, roleColor } from '~/util/access'
 import { groupBy, isTruthy, sortBy } from '~/util/array'
 
 const EmptyState = ({ onClick }: { onClick: () => void }) => (
@@ -128,7 +128,7 @@ export function ProjectAccessPage() {
       colHelper.accessor('name', { header: 'Name' }),
       colHelper.accessor('identityType', {
         header: 'Type',
-        cell: (props) => accessTypeLabel(props.getValue()),
+        cell: (props) => identityTypeLabel[props.getValue()],
       }),
       colHelper.accessor('roleBadges', {
         header: () => (
@@ -143,7 +143,7 @@ export function ProjectAccessPage() {
         cell: (props) => (
           <ListPlusCell tooltipTitle="Other roles">
             {props.getValue().map(({ roleName, roleSource }) => (
-              <Badge key={roleSource} color={getBadgeColor(roleName)}>
+              <Badge key={roleSource} color={roleColor[roleName]}>
                 {roleSource}.{roleName}
               </Badge>
             ))}

app/util/access.spec.tsx

@@ -6,17 +6,16 @@
  * Copyright Oxide Computer Company
  */
 
-import type { IdentityType } from '~/api'
+import type { IdentityType, RoleKey } from '~/api'
 import type { BadgeColor } from '~/ui/lib/Badge'
 
-export const accessTypeLabel = (identityType: IdentityType) =>
-  identityType === 'silo_group' ? 'Group' : 'User'
+export const identityTypeLabel: Record<IdentityType, string> = {
+  silo_group: 'Group',
+  silo_user: 'User',
+}
 
-export const getBadgeColor = (role: 'admin' | 'collaborator' | 'viewer'): BadgeColor => {
-  const badgeColor = {
-    admin: 'default',
-    collaborator: 'purple',
-    viewer: 'blue',
-  }
-  return badgeColor[role] as BadgeColor
+export const roleColor: Record<RoleKey, BadgeColor> = {
+  admin: 'default',
+  collaborator: 'purple',
+  viewer: 'blue',
 }