You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

PollAnswer.js 2.2KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869
  1. // @flow
  2. import { Checkbox } from '@atlaskit/checkbox';
  3. import React from 'react';
  4. import AbstractPollAnswer from '../AbstractPollAnswer';
  5. import type { AbstractProps } from '../AbstractPollAnswer';
  6. const PollAnswer = (props: AbstractProps) => {
  7. const {
  8. checkBoxStates,
  9. poll,
  10. setCheckbox,
  11. skipAnswer,
  12. submitAnswer,
  13. t
  14. } = props;
  15. return (
  16. <div className = 'poll-answer'>
  17. <div className = 'poll-header'>
  18. <div className = 'poll-question'>
  19. <span>{ poll.question }</span>
  20. </div>
  21. </div>
  22. <ol className = 'poll-answer-list'>
  23. {
  24. poll.answers.map((answer, index) => (
  25. <li
  26. className = 'poll-answer-container'
  27. key = { index }>
  28. <Checkbox
  29. isChecked = { checkBoxStates[index] }
  30. key = { index }
  31. label = { <span>{ answer.name }</span> }
  32. // eslint-disable-next-line react/jsx-no-bind
  33. onChange = { ev => setCheckbox(index, ev.target.checked) }
  34. size = 'large' />
  35. </li>
  36. ))
  37. }
  38. </ol>
  39. <div className = { 'poll-footer' }>
  40. <button
  41. aria-label = { t('polls.answer.skip') }
  42. className = { 'poll-small-secondary-button' }
  43. onClick = { skipAnswer } >
  44. <span>{t('polls.answer.skip')}</span>
  45. </button>
  46. <button
  47. aria-label = { t('polls.answer.submit') }
  48. className = { 'poll-small-primary-button' }
  49. onClick = { submitAnswer }>
  50. <span>{t('polls.answer.submit')}</span>
  51. </button>
  52. </div>
  53. </div>
  54. );
  55. };
  56. /*
  57. * We apply AbstractPollAnswer to fill in the AbstractProps common
  58. * to both the web and native implementations.
  59. */
  60. // eslint-disable-next-line new-cap
  61. export default AbstractPollAnswer(PollAnswer);