Show a tooltip on planning removing button

superdesk · Apr 3, 2017 · 4f9d42f · 4f9d42f
1 parent bdad9df
commit 4f9d42f
Showing 1 changed file with 6 additions and 1 deletion.
diff --git a/client/components/PlanningItem.jsx b/client/components/PlanningItem.jsx
@@ -2,6 +2,9 @@ import React, { PropTypes } from 'react'
 import moment from 'moment'
 import { get } from 'lodash'
 import { ListItem } from './index'
+import { OverlayTrigger, Tooltip } from 'react-bootstrap'
+
+const removeTooltip = <Tooltip id="tooltip">Remove the planning</Tooltip>
 
 export const PlanningItem = ({ item, event, onClick, active, onDelete }) => {
     const location = get(event, 'location[0].name')
@@ -22,7 +25,9 @@ export const PlanningItem = ({ item, event, onClick, active, onDelete }) => {
                 }
             </div>
             <span className="ListItem__actions">
-                <i className="icon-trash" onClick={(e)=>{e.stopPropagation(); onDelete(item)}}/>
+                <OverlayTrigger placement="left" overlay={removeTooltip}>
+                    <i className="icon-trash" onClick={(e)=>{e.stopPropagation(); onDelete(item)}}/>
+                </OverlayTrigger>
             </span>
         </ListItem>
     )