import React, { Component } from react

class MyComponent extends Component {
  render = () => {
    return (
<div id="yield">
  <div className='centerContent'>
    <br />
    <table>
      <tr>
        <th>Name</th>
        <th>Icon</th>
        <th>Color</th>
        <th></th>
        <th></th>
      </tr>

    { @metacodes.each do |metacode| }
      <tr>
        <td>{ metacode.name }</td>
        <td className="iconURL">{ metacode.icon }</td>
        { if metacode.color }
          <td className="iconColor" style="background-color: { metacode.color }">
            { metacode.color }
          </td>
        { else }
          <td></td>
        { end }
        <td>{ image_tag metacode.icon, width: 40 }</td>
        <td>{ link_to 'Edit', edit_metacode_path(metacode) }</td>
      </tr>
    { end }
    </table>
  </div>
</div>
    )
  }
}

export default MyComponent