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.

NotificationButton.js 1.0KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152
  1. // @flow
  2. import React, { useCallback } from 'react';
  3. import { useDispatch } from 'react-redux';
  4. type Props = {
  5. /**
  6. * Action to be dispatched on click.
  7. */
  8. action: Function,
  9. /**
  10. * The text of the button.
  11. */
  12. children: React$Node,
  13. /**
  14. * CSS class of the button.
  15. */
  16. className: string,
  17. /**
  18. * The `data-testid` used for the button.
  19. */
  20. testId: string,
  21. /**
  22. * The participant.
  23. */
  24. participant: Object
  25. }
  26. /**
  27. * Component used to display an approve/reject button.
  28. *
  29. * @returns {React$Element<'button'>}
  30. */
  31. export default function({ action, children, className, testId, participant }: Props) {
  32. const dispatch = useDispatch();
  33. const onClick = useCallback(() => dispatch(action(participant.id)), [ dispatch, participant ]);
  34. return (
  35. <button
  36. className = { className }
  37. data-testid = { testId }
  38. onClick = { onClick }
  39. type = 'button'>
  40. { children }
  41. </button>
  42. );
  43. }