<commit_before>// @flow
import * as React from 'react'
import {Avatar, Box, Button, ClickableBox, Text, Usernames} from '../../../common-adapters'
import {globalStyles, globalMargins} from '../../../styles'
import {isMobile} from '../../../constants/platform'
import {typeToLabel} from '../../../constants/teams'

export type Props = {
  email: string,
  following: boolean,
  onCancelInvite: () => void,
  role: string,
  teamname: string,
  username: string,
  you: ?string,
}

export const TeamInviteRow = (props: Props) => {
  const {email, following, onCancelInvite, role, username, you} = props
  const user = email || username
  return (
    <ClickableBox
      style={{
        ...globalStyles.flexBoxRow,
        alignItems: 'center',
        flexShrink: 0,
        height: isMobile ? 56 : 48,
        padding: globalMargins.tiny,
        width: '100%',
      }}
    >
      <Box style={{...globalStyles.flexBoxRow, flexGrow: 1}}>
        <Avatar username={username} size={isMobile ? 48 : 32} />
        <Box style={{...globalStyles.flexBoxColumn, marginLeft: globalMargins.small}}>
          <Usernames
            type="BodySemibold"
            colorFollowing={true}
            users={[{following, username: user, you: you === username}]}
          />
          <Box style={globalStyles.flexBoxRow}>
            <Text type="BodySmall">{role && typeToLabel[role]}</Text>
          </Box>
        </Box>
      </Box>
      <Box style={{...globalStyles.flexBoxRow, flexShrink: 1}}>
        <Button label="Cancel invite" onClick={onCancelInvite} type="Danger" />
      </Box>
    </ClickableBox>
  )
}<commit_msg>Use a small button<commit_after>// @flow
import * as React from 'react'
import {Avatar, Box, Button, ClickableBox, Text, Usernames} from '../../../common-adapters'
import {globalStyles, globalMargins} from '../../../styles'
import {isMobile} from '../../../constants/platform'
import {typeToLabel} from '../../../constants/teams'

export type Props = {
  email: string,
  following: boolean,
  onCancelInvite: () => void,
  role: string,
  teamname: string,
  username: string,
  you: ?string,
}

export const TeamInviteRow = (props: Props) => {
  const {email, following, onCancelInvite, role, username, you} = props
  const user = email || username
  return (
    <ClickableBox
      style={{
        ...globalStyles.flexBoxRow,
        alignItems: 'center',
        flexShrink: 0,
        height: isMobile ? 56 : 48,
        padding: globalMargins.tiny,
        width: '100%',
      }}
    >
      <Box style={{...globalStyles.flexBoxRow, flexGrow: 1}}>
        <Avatar username={username} size={isMobile ? 48 : 32} />
        <Box style={{...globalStyles.flexBoxColumn, marginLeft: globalMargins.small}}>
          <Usernames
            type="BodySemibold"
            colorFollowing={true}
            users={[{following, username: user, you: you === username}]}
          />
          <Box style={globalStyles.flexBoxRow}>
            <Text type="BodySmall">{role && typeToLabel[role]}</Text>
          </Box>
        </Box>
      </Box>
      <Box style={{...globalStyles.flexBoxRow, flexShrink: 1}}>
        <Button small={true} label="Cancel invite" onClick={onCancelInvite} type="Danger" />
      </Box>
    </ClickableBox>
  )
}
{'fraction_non_alphanumeric': 0.1627835683629675, 'fraction_numerical': 0.008583690987124463, 'mean_word_length': 2.573932092004381, 'pattern_counts': {'":': 0, '<': 33, '<?xml version=': 0, '>': 37, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '4922989', 'n_tokens_mistral': 1022, 'n_tokens_neox': 1016, 'n_words': 244}