export function ConditionalChildren()

in src/stories/ActionList2/fixtures.stories.tsx [773:808]

• 36 lines of code
• 5 McCabe index (conditional complexity)

export function ConditionalChildren(): JSX.Element {
  type reviewerType = {name: string; id?: string; type?: string; login?: string; slug?: string; members?: number}
  const potentialReviewers: reviewerType[] = [...teams, ...users]
  return (
    <>
      <h1>Conditional Children</h1>
      <ErsatzOverlay>
        <ActionList showDividers>
          {potentialReviewers.map((reviewer, index) => (
            <ActionList.Item key={index}>
              <ActionList.LeadingVisual>
                {reviewer.type === 'team' ? (
                  <Avatar src={`https://avatars.githubusercontent.com/t/${reviewer.id}`} />
                ) : (
                  <Avatar src={`https://avatars.githubusercontent.com/${reviewer.login}`} />
                )}
              </ActionList.LeadingVisual>
              {reviewer.login || reviewer.slug}
              {reviewer.type === 'team' ? (
                <ActionList.Description variant="block">{reviewer.name}</ActionList.Description>
              ) : (
                <ActionList.Description>{reviewer.name}</ActionList.Description>
              )}
              {reviewer.type === 'team' && (
                <ActionList.TrailingVisual>
                  <PeopleIcon />
                  {reviewer.members}
                </ActionList.TrailingVisual>
              )}
            </ActionList.Item>
          ))}
        </ActionList>
      </ErsatzOverlay>
    </>
  )
}