text: import React from 'react'
  import TableRow from '@material-ui/core/TableRow'
  import TableCell from '@material-ui/core/TableCell'
  import TableHead from '@material-ui/core/TableHead'
  import TableSortLabel from '@material-ui/core/TableSortLabel'
  
  import CheckboxWidget from '@/widgets/admin/checkbox'
  
  const TableHeader = props => {
      const {columns, classes, onSelectAllClick, order, orderBy, numSelected, rowCount, onRequestSort} = props
      const createSortHandler = property => event => onRequestSort(event, property)
  
      const first = columns[0]
  
      return <TableHead>
          <TableRow>
              <TableCell padding='checkbox' >
                  <CheckboxWidget
                      indeterminate={numSelected > 0 && numSelected < rowCount}
                      checked={rowCount > 0 && numSelected === rowCount}
                      onChange={onSelectAllClick}
                      inputProps={{'aria-label': 'select all'}}/>
              </TableCell>
              <TableCell sortDirection={orderBy === first.id ? order : false}>
                  <TableSortLabel
                      active={orderBy === first.id}
                      direction={orderBy === first.id ? order : 'asc'}
                      onClick={createSortHandler(first.id)}
                  >
                      {first.label}
                      {orderBy === first.id ? <span className={classes.visuallyHidden}>
                          {order === 'desc' ? 'sorted descending' : 'sorted ascending'}
                      </span> : null}
                  </TableSortLabel>
              </TableCell>
              {columns.slice(1).map(column => <TableCell
                  key={column.id}
                  align={column.align}
                  style={{minWidth: column.minWidth}}
                  sortDirection={orderBy === column.id ? order : false}
              >
                  <TableSortLabel
                      active={orderBy === column.id}
                      direction={orderBy === column.id ? order : 'asc'}
                      onClick={createSortHandler(column.id)}
                  >
                      {column.label}
                      {orderBy === column.id ? <span className={classes.visuallyHidden}>
                          {order === 'desc' ? 'sorted descending' : 'sorted ascending'}
                      </span> : null}
                  </TableSortLabel>
              </TableCell>)}
          </TableRow>
      </TableHead>
  }
  
  export default TableHeader