Simple table issues

{
    id: 'eb4a87e1-a55b-49c3-97b9-72efaae0c868',
    title: 'New Document Group',
    organizationId: 'cdfcc629-097d-43c5-8fd0-21e53116ee19',
    createdBy: null,
    isPublic: false,
    multiDocument: false,
    createdAt: 2024-01-09T23:06:12.010Z,
    updatedAt: 2024-01-09T23:06:12.010Z,
    deletedAt: null,
    documents: [ [Object] ]
  },

const columns: ColumnDef<GroupWithDocs>[] = [
    columHelper.display({
      id: 'checkbox',
      header: () => <input type="checkbox" />,
      cell: () => <input type="checkbox" />,
    }),
    columHelper.accessor((row) => row.title, {
      id: 'title',
      cell: (props) => props.getValue(),
      header: () => 'Name',
    }),
    columHelper.accessor('createdBy', {
      header: () => 'Created By',
      cell: (props) => props.getValue(),
    }),
    columHelper.accessor('updatedAt', {
      header: () => 'Last Modified',
      cell: (props) => props.getValue(),
    }),
    columHelper.display({
      id: 'favorite',
      cell: (props) => <span>''</span>,
    }),
  ];