2018-06-29 16:14:00 +00:00
|
|
|
import React from 'react'
|
|
|
|
import './Controls.css'
|
2018-09-11 14:14:46 +00:00
|
|
|
import emoji from 'react-easy-emoji'
|
|
|
|
import { connect } from 'react-redux'
|
|
|
|
import { startConversation } from 'Actions/actions'
|
2018-06-29 16:14:00 +00:00
|
|
|
|
2018-09-11 14:14:46 +00:00
|
|
|
function Controls({ blockingInputControls, controls, startConversation }) {
|
|
|
|
return (
|
2018-09-11 15:33:11 +00:00
|
|
|
<div id="controlsBlock">
|
2018-09-11 14:14:46 +00:00
|
|
|
{blockingInputControls && (
|
2018-09-11 15:33:11 +00:00
|
|
|
<p id="blockingControl">{blockingInputControls[0].message}</p>
|
2018-09-11 14:14:46 +00:00
|
|
|
)}
|
|
|
|
{!blockingInputControls &&
|
|
|
|
controls.length > 0 && (
|
|
|
|
<>
|
|
|
|
{emoji('⚠️')}
|
2018-09-11 15:33:11 +00:00
|
|
|
<ul id="controls">
|
2018-09-11 14:14:46 +00:00
|
|
|
{controls.map(({ test, action }) => (
|
|
|
|
<li key={test}>
|
|
|
|
<p>{test}</p>
|
|
|
|
{action && (
|
|
|
|
<button
|
|
|
|
key={action.cible}
|
|
|
|
className="ui__ link-button"
|
|
|
|
onClick={() => startConversation(action.cible)}>
|
|
|
|
{action.texte}
|
|
|
|
</button>
|
|
|
|
)}
|
|
|
|
</li>
|
|
|
|
))}
|
|
|
|
</ul>
|
|
|
|
</>
|
|
|
|
)}
|
|
|
|
</div>
|
|
|
|
)
|
|
|
|
}
|
|
|
|
|
|
|
|
export default connect(
|
|
|
|
(state, props) => ({ key: props.language }),
|
|
|
|
{
|
|
|
|
startConversation
|
|
|
|
}
|
|
|
|
)(Controls)
|