diff --git a/packages/compass-indexes/src/components/regular-indexes-table/status-field.tsx b/packages/compass-indexes/src/components/regular-indexes-table/status-field.tsx index 4222de85844..845cb23b225 100644 --- a/packages/compass-indexes/src/components/regular-indexes-table/status-field.tsx +++ b/packages/compass-indexes/src/components/regular-indexes-table/status-field.tsx @@ -18,23 +18,26 @@ const statusFieldStyles = css({ alignItems: 'baseline', }); -const iconBadgeStyles = css({ - gap: spacing[200], -}); - -const ErrorBadgeWithTooltip: React.FunctionComponent<{ +const BadgeWithTooltip: React.FunctionComponent<{ ['data-testid']?: string; - text: string; tooltip?: string | null; darkMode?: boolean; -}> = ({ ['data-testid']: dataTestId, text, tooltip, darkMode }) => { + variant?: BadgeVariant; + children: React.ReactNode; +}> = ({ + ['data-testid']: dataTestId, + children, + tooltip, + darkMode, + variant, +}) => { return ( - {text} + + {children} } > @@ -63,13 +66,13 @@ const StatusField: React.FunctionComponent = ({ )} {status === 'building' && ( - Building - + )} {status === 'inprogress' && ( @@ -79,12 +82,14 @@ const StatusField: React.FunctionComponent = ({ )} {status === 'failed' && ( - + variant={BadgeVariant.Red} + > + Failed + )} );