import { h , Component } from 'preact' ; import { mobileClosedMessageAvatarStyle , closedChatAvatarImageStyle } from './style' ; import { IConfiguration } from '../typings' ; export default class ChatFloatingButton extends Component < IChatFloatingButtonProps , any > { render ( { onClick , conf } , { } ) { return ( < div style = { { position : 'relative' , cursor : 'pointer' } } onClick = { this . props . onClick } > < div className = "mobile-closed-message-avatar" style = { { background : conf . bubbleBackground , ... mobileClosedMessageAvatarStyle } } > { ( conf . bubbleAvatarUrl === '' ) ? < svg style = { { paddingTop : 4 } } fill = "#FFFFFF" height = "24" viewBox = "0 0 24 24" width = "24" xmlns = "http://www.w3.org/2000/svg" > < path d = "M20 2H4c-1.1 0-1.99.9-1.99 2L2 22l4-4h14c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zM6 9h12v2H6V9zm8 5H6v-2h8v2zm4-6H6V6h12v2z" / > < path d = "M0 0h24v24H0z" fill = "none" / > < /svg> : ( ( conf . bubbleAvatarUrl . indexOf ( '/' ) !== - 1 ) ? < img src = { conf . bubbleAvatarUrl } style = { { ... closedChatAvatarImageStyle } } /> : <div style={{ display: 'flex', alignItems: 'center' }}><br / > { conf . bubbleAvatarUrl } < /div>)} < /div> < /div>); } } interface IChatFloatingButtonProps { onClick : any ; conf : IConfiguration ; }