React table with mui - mui kitchen sink example - data not visible

[EgomL]

i'm tryning to play with the react table mui kitchen sink and do not understand why the value aren't visible . the Header is visible when switching to JSON it's the data in the table not visible anymore. on the console.log, data and data1 have the same structure.

  const columns = React.useMemo(
    () => [
      {
        Header: 'ID',
        accessor: 'id',
      },
      {
        Header: 'LICENSE PLATE',
        accessor: 'licenseplate',
      },
      {
        Header: 'DRIVER NAME',
        accessor: 'driver',
      },
      {
        Header: 'SUBMITTED ON',
        accessor: 'submittionDate',
      },
      {
        Header: 'NOTES',
        accessor: 'notes',
      },
      {
        Header: 'STATUS',
        accessor: 'status',
      },
    ],
    []
  )
 const NoteList = Object.keys(NOTES).map(key => ({ ...NOTES[key], id: key }))
  const [data1, setData1] = React.useState(React.useMemo(() => makeData(10), []))
  const [data, setData] = React.useState(React.useMemo(() => NoteList), [])
  const [skipPageReset, setSkipPageReset] = React.useState(false)


  useEffect(() => {
    // This gets called after every render, by default
    // (the first one, and every one after that)
    // console.log('NOTES', NOTES);
    // console.log('NOTESLIST', NoteList);
    console.log('DATA', data);
    console.log('DATA1', data1);

  }, [])

i don't know where's the mistake.

thanks for the help

[EgomL]

no help? MOCK_DATA are coming as a JSON file.

[EgomL]

after some hours, the mistake ha sbeen solve. the acessor name have to match the name attribute in the json file. an there's no need to use the object.key function. the use of useMemo is enough.