const React = require('react')
const prettyBytes = require('pretty-bytes')
const getFileContentType = require('../utils/getFileContentType')

const e = React.createElement

const formatTime = time => new Date(time).toISOString()

const DirectoryListing = ({ dir, entries }) => {
  const rows = entries.map(({ file, stats }, index) => {
    const isDir = stats.isDirectory()
    const href = file + (isDir ? '/' : '')

    return e(
      'tr',
      { key: file, className: index % 2 ? 'odd' : 'even' },
      e('td', null, e('a', { title: file, href }, file)),
      e('td', null, isDir ? '-' : getFileContentType(file)),
      e('td', null, isDir ? '-' : prettyBytes(stats.size)),
      e('td', null, isDir ? '-' : formatTime(stats.mtime))
    )
  })

  if (dir !== '/')
    rows.unshift(
      e(
        'tr',
        { key: '..', className: 'odd' },
        e('td', null, e('a', { title: 'Parent directory', href: '../' }, '..')),
        e('td', null, '-'),
        e('td', null, '-'),
        e('td', null, '-')
      )
    )

  return e(
    'table',
    null,
    e(
      'thead',
      null,
      e(
        'tr',
        null,
        e('th', null, 'Name'),
        e('th', null, 'Type'),
        e('th', null, 'Size'),
        e('th', null, 'Last Modified')
      )
    ),
    e('tbody', null, rows)
  )
}

module.exports = DirectoryListing