import React from "react"
import { Chip } from "@material-ui/core";
import { pedido, camion, bloqueo, almacen } from './EtiquetaData'
import Brightness1Icon from '@material-ui/icons/Brightness1';

const etiquetaStyle = color => ({
  fontWeight: 'bold',
  color: '#FFF',
  backgroundColor: color
});


//Etiquetas
export function etiqueta(tipo , estado) { // eslint-disable-line
  let {color, text, icon} = ""
  switch(tipo){
    case 'etiq_pedido': 
      text = pedido[Object.keys(pedido)[estado]].text
      color = pedido[Object.keys(pedido)[estado]].color
      break;
    case 'etiq_camion': 
      text = camion[Object.keys(camion)[estado]].text
      color = camion[Object.keys(camion)[estado]].color
      break;
    case 'etiq_bloqueo': 
      text = bloqueo[Object.keys(bloqueo)[estado]].text
      color = bloqueo[Object.keys(bloqueo)[estado]].color
      break;
    case 'etiq_alma': 
      console.log("entre?")
      text = almacen[Object.keys(almacen)[estado]].text
      color = almacen[Object.keys(almacen)[estado]].color
      icon = almacen[Object.keys(almacen)[estado]].icon
      break;
  }

  return (
    tipo == "etiq_alma" ?
      <Chip label={text} icon = {<Brightness1Icon style={{ fontSize: icon, color: "#B1ABAB" }}/>} style={{fontWeight: 'bold', backgroundColor: color}}/> :
      <Chip label={text} style={etiquetaStyle(color)}/>
  )
}