import { h, Component } from 'preact';

class WBTable extends Component {
  render({ columns, rows, headerClasses, verticalHeader }) {
    return (
      <table class="table table-striped table-hover">
        <thead class="thead-light">
          <tr>
            { columns.map((c, i) => <th class={ headerClasses[i] }>{ c }</th>) }
          </tr>
        </thead>
        <tbody>
          { rows.map(r => (
            <tr>
              { columns.map((_, idx) => (
                (idx == 0 && verticalHeader) ? (
                  <th scope="row">{ r[idx] }</th>
                ) : (
                  <td>{ r[idx] }</td>
                )
              )) }
            </tr>
          )) }
        </tbody>
      </table>
    );
  }
}

WBTable.defaultProps = {
  'headerClasses': []
};

export default WBTable;