Overleaf/services/web/frontend/js/shared/components/form/form-feedback.tsx

import { Form } from 'react-bootstrap'
import FormText from '@/shared/components/form/form-text'
import { ComponentProps } from 'react'

export type FormFeedbackProps = Pick<
  ComponentProps<typeof Form.Control.Feedback>,
  'type' | 'className' | 'children'
> & { unfilled?: boolean }

function FormFeedback({ unfilled, ...props }: FormFeedbackProps) {
  return (
    <Form.Control.Feedback {...props}>
      <FormText
        type={props.type === 'invalid' ? 'error' : 'success'}
        unfilled={unfilled}
      >
        {props.children}
      </FormText>
    </Form.Control.Feedback>
  )
}

export default FormFeedback