import React from "react";
import Header from "./legend-header";

class LegendItemMultiple extends React.Component {
  render() {
    const { layer, images } = this.props;

    return (
      <div>
      <li className="cm-list-group-item corpsmap-legend-item-multiple">
        <Header layer={layer} />
        {images.map((image, i) => {
          return (
            <div key={i}>
              {typeof image === "string" ? (
                image
              ) : (
                <img alt={image.alt} src={image.src}></img>
              )}
              {layer.type === "WMS" ? null : image.title}
              <br></br>
              {layer.attributions ? <div><label><strong>Credits: {layer.attributions}</strong> </label></div> : null}
            </div>
          );
        })}
      </li>
      
      </div>
    );
  }
}
export default LegendItemMultiple;
