Unhandled Rejection (TypeError): setGlobalFilter is not a function

[leo4707]

I am trying to use the global filter, but i don't know how to fix the problem.

This is customTable.js
`
import React from 'react';
import { useTable, useGlabalFilter, useAsyncDebounce, useFilters } from 'react-table'
import './customTable.css'
import GlobalFilter from './globalFilter'

function CustomTable(props) {
function Table({ columns, data }) {
const {
getTableProps,
getTableBodyProps,
headerGroups,
rows,
prepareRow,
state,
setGlobalFilter
} = useTable({
columns,
data
},useGlabalFilter)

return (
  <>
    <span>
      <GlobalFilter globalFilter = { state.globalFilter } setGlobalFilter = { setGlobalFilter } />
    </span>
    
    <table {...getTableProps()}>
      <thead>
        {headerGroups.map(headerGroup => (
          <tr {...headerGroup.getHeaderGroupProps()}>
            {headerGroup.headers.map(column => (
              <th {...column.getHeaderProps()}>{column.render('Header')}</th>
            ))}
          </tr>
        ))}
      </thead>
      <tbody {...getTableBodyProps()}>
        {rows.map((row, i) => {
          prepareRow(row)
          return (
            <tr {...row.getRowProps()}>
              {row.cells.map(cell => {
                return <td {...cell.getCellProps()}>{cell.render('Cell')}</td>
              })}
            </tr>
          )
        })}
      </tbody>
    </table>
  </>
)

}

return (
    <Table columns = { props.columns } data = { props.data } />
);

}

export default CustomTable;
`

And this is globalFilter.js
`
import React from 'react';

function GlobalFilter({ globalFilter, setGlobalFilter }) {
return (

Search: {' '}
<input value = { globalFilter || '' } onChange = { e => setGlobalFilter(e.target.value || undefined) } />

);
}

export default GlobalFilter;
`