index.js 2.51 KB
import React, { Component } from 'react'
import {
  View,
} from 'react-native'
import { connect } from 'react-redux'
import { Button } from 'react-native-elements'

import { postValoracion } from '../../redux/actions/valoraciones'
import { postReporte } from '../../redux/actions/reportes'

import css from './style'

const SATISFECHO = 'SATISFECHO'
const NO_SATISFECHO = 'NO SATISFECHO'
const INFORMACION_NO_PUBLICADA = 'CONFIDENCIAL'
class BotonValoracion extends Component {

  render() {
    if (this.props.mostrar) {
      const solicitudId = this.props.solicitud.id
      const usuario = this.props.usuario
      const likeName = this.props.valoracion.data === SATISFECHO
        ? 'ios-thumbs-up'
        : 'ios-thumbs-up-outline'

      const dislikeName = this.props.valoracion.data === NO_SATISFECHO
        ? 'ios-thumbs-down'
        : 'ios-thumbs-down-outline'

      const reportName = this.props.reporte.data === INFORMACION_NO_PUBLICADA
        ? 'ios-megaphone'
        : 'ios-megaphone-outline'

      return (
        <View style={[css.buttonFooter]}>
          <Button
            onPress={() => this.props.postReporte(solicitudId, usuario, INFORMACION_NO_PUBLICADA)}
            backgroundColor="white"
            icon={{
              name: reportName,
              size: 27,
              color: 'red',
              type: 'ionicon'
            }}
          />
          <Button
            backgroundColor="white"
            onPress={() => this.props.postValoracion(solicitudId, usuario, SATISFECHO)}
            icon={{
              name: likeName,
              size: 27,
              color: 'red',
              type: 'ionicon'
            }}
          />
          <Button
            onPress={() => this.props.postValoracion(solicitudId, usuario, NO_SATISFECHO)}
            backgroundColor="white"
            icon={{
              name: dislikeName,
              size: 27,
              color: 'red',
              type: 'ionicon'
            }}
          />
        </View>
      )
    }
    return <View />
  }
}

const mapStateToProps = (state) => ({
  solicitud: state.solicitudes.current,
  usuario: state.usuario.datos,
  valoracion: state.valoracion,
  reporte: state.reporte,
})

const mapDispatchToProps = (dispatch) => ({
  postValoracion: (solicitud, usuario, valoracion) =>
    dispatch(postValoracion(solicitud, usuario, valoracion)),
  postReporte: (solicitud, usuario, valoracion) =>
    dispatch(postReporte(solicitud, usuario, valoracion))
})
export default connect(mapStateToProps, mapDispatchToProps)(BotonValoracion)