AviZi | 280f801 | 2017-06-09 02:39:56 +0300 | [diff] [blame] | 1 | import React from 'react'; |
Avi Ziv | b8e2faf | 2017-07-18 19:45:38 +0300 | [diff] [blame] | 2 | import SVGIcon from 'sdc-ui/lib/react/SVGIcon.js'; |
AviZi | 280f801 | 2017-06-09 02:39:56 +0300 | [diff] [blame] | 3 | import OverlayTrigger from 'react-bootstrap/lib/OverlayTrigger.js'; |
| 4 | import Tooltip from 'react-bootstrap/lib/Tooltip.js'; |
| 5 | |
| 6 | function tooltip (msg) { |
| 7 | return ( |
| 8 | <Tooltip className='select-action-table-error-tooltip' id='error-tooltip'>{msg}</Tooltip> |
| 9 | ); |
| 10 | }; |
| 11 | |
| 12 | const IconWithOverlay = ({overlayMsg}) => ( |
| 13 | <OverlayTrigger placement='bottom' overlay={tooltip(overlayMsg)}> |
az2497 | 644017c | 2017-08-10 17:49:40 +0300 | [diff] [blame] | 14 | <SVGIcon name='errorCircle' color='negative'/> |
AviZi | 280f801 | 2017-06-09 02:39:56 +0300 | [diff] [blame] | 15 | </OverlayTrigger> |
| 16 | ); |
| 17 | |
Avi Ziv | b8e2faf | 2017-07-18 19:45:38 +0300 | [diff] [blame] | 18 | function renderErrorOrCheck({hasError, overlayMsg}) { |
| 19 | if (hasError === undefined) { |
| 20 | return <SVGIcon name='angleRight' className='dummy-icon' />; |
| 21 | } |
| 22 | |
| 23 | if (hasError) { |
az2497 | 644017c | 2017-08-10 17:49:40 +0300 | [diff] [blame] | 24 | return overlayMsg ? <IconWithOverlay overlayMsg={overlayMsg}/> : <SVGIcon color='negative' name='errorCircle'/>; |
Avi Ziv | b8e2faf | 2017-07-18 19:45:38 +0300 | [diff] [blame] | 25 | } |
| 26 | |
az2497 | 644017c | 2017-08-10 17:49:40 +0300 | [diff] [blame] | 27 | return <SVGIcon name='checkCircle' color='positive'/>; |
Avi Ziv | b8e2faf | 2017-07-18 19:45:38 +0300 | [diff] [blame] | 28 | } |
| 29 | |
talig | 8e9c065 | 2017-12-20 14:30:43 +0200 | [diff] [blame] | 30 | const SelectActionTableRow = ({children, actionIcon, onAction, showAction, hasError, hasErrorIndication, overlayMsg}) => ( |
AviZi | 280f801 | 2017-06-09 02:39:56 +0300 | [diff] [blame] | 31 | <div className='select-action-table-row-wrapper'> |
| 32 | <div className={`select-action-table-row ${hasError ? 'has-error' : ''}`}> |
| 33 | {children} |
| 34 | </div> |
talig | 8e9c065 | 2017-12-20 14:30:43 +0200 | [diff] [blame] | 35 | {onAction && <SVGIcon color='secondary' name={actionIcon} data-test-id={`select-action-table-${actionIcon}`} onClick={onAction} iconClassName={(showAction) ? '' : 'hideDelete'}/>} |
Avi Ziv | b8e2faf | 2017-07-18 19:45:38 +0300 | [diff] [blame] | 36 | {hasErrorIndication && renderErrorOrCheck({hasError, overlayMsg})} |
AviZi | 280f801 | 2017-06-09 02:39:56 +0300 | [diff] [blame] | 37 | </div> |
| 38 | ); |
| 39 | |
| 40 | export default SelectActionTableRow; |