sentry/static/app/views/settings/account/notifications/parentLabel.tsx

import styled from '@emotion/styled';

import Avatar from 'sentry/components/avatar';
import space from 'sentry/styles/space';
import {OrganizationSummary, Project} from 'sentry/types';
import {getParentKey} from 'sentry/views/settings/account/notifications/utils';

type Props = {
  notificationType: string;
  parent: OrganizationSummary | Project;
};

// TODO(mgaeta): Infer parentKey from parent.
const ParentLabel = ({notificationType, parent}: Props) => (
  <FieldLabel>
    <Avatar
      {...{
        [getParentKey(notificationType)]: parent,
      }}
    />
    <span>{parent.slug}</span>
  </FieldLabel>
);

const FieldLabel = styled('div')`
  display: flex;
  gap: ${space(0.5)};
  line-height: 16px;
`;

export default ParentLabel;