booleanField.tsx 1.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172
  1. import InputField from 'sentry/components/deprecatedforms/inputField';
  2. import Tooltip from 'sentry/components/tooltip';
  3. import {IconQuestion} from 'sentry/icons';
  4. import {defined} from 'sentry/utils';
  5. type Props = InputField['props'];
  6. type State = InputField['state'] & {
  7. value: boolean;
  8. };
  9. // XXX: This is ONLY used in GenericField. If we can delete that this can go.
  10. /**
  11. * @deprecated Do not use this
  12. */
  13. export default class BooleanField extends InputField<Props, State> {
  14. coerceValue(initialValue: string | number) {
  15. const value = super.coerceValue(initialValue);
  16. return value ? true : false;
  17. }
  18. onChange = (e: React.ChangeEvent<HTMLInputElement>) => {
  19. const value = e.target.checked;
  20. this.setValue(value);
  21. };
  22. getField() {
  23. return (
  24. <input
  25. id={this.getId()}
  26. type={this.getType()}
  27. checked={this.state.value}
  28. onChange={this.onChange.bind(this)}
  29. disabled={this.props.disabled}
  30. />
  31. );
  32. }
  33. render() {
  34. const {error} = this.state;
  35. let className = this.getClassName();
  36. if (error) {
  37. className += ' has-error';
  38. }
  39. return (
  40. <div className={className}>
  41. <div className="controls">
  42. <label className="control-label">
  43. {this.getField()}
  44. {this.props.label}
  45. {this.props.disabled && this.props.disabledReason && (
  46. <Tooltip title={this.props.disabledReason}>
  47. <IconQuestion size="xs" />
  48. </Tooltip>
  49. )}
  50. </label>
  51. {defined(this.props.help) && <p className="help-block">{this.props.help}</p>}
  52. {error && <p className="error">{error}</p>}
  53. </div>
  54. </div>
  55. );
  56. }
  57. getClassName() {
  58. return 'control-group checkbox';
  59. }
  60. getType() {
  61. return 'checkbox';
  62. }
  63. }