saw.js

import React, { useEffect } from 'react'
import Tablesaw from 'tablesaw'
import Layout from '../components/layout'
import 'tablesaw/dist/tablesaw.css'

export default () => {
  useEffect(() => {
    Tablesaw.init()
  }, [])

  return (
    <Layout>
      <table data-tablesaw-sortable>
        <thead>
          <tr>
            <th data-tablesaw-sortable-col data-tablesaw-sortable-default-col>
              Rank
            </th>
            <th data-tablesaw-sortable-col>Movie Title</th>
            <th data-tablesaw-sortable-col data-tablesaw-sortable-numeric>
              Year
            </th>
            <th data-tablesaw-sortable-col data-tablesaw-sortable-numeric>
              <abbr title="Rotten Tomato Rating">Rating</abbr>
            </th>

            <th>Reviews</th>
          </tr>
        </thead>
        <tbody>
          <tr>
            <td>1</td>
            <td>1</td>
            <td>1</td>
            <td>1</td>
          </tr>
          <tr>
            <td>2</td>
            <td>test</td>
            <td>um</td>
            <td>2</td>
          </tr>
        </tbody>
      </table>
    </Layout>
  )
}