Доступ к состоянию компонента с помощью таблицы реакции

Question

Это мой первый вопрос, и мне просто нужно понять, почему я не могу получить доступ к фактическому состоянию компонента при обработке изменений в Checkbox, переданных в хук useTable в таблице реакции.

const {
    getTableProps,
    getTableBodyProps,
    headerGroups,
    rows,
    prepareRow,
}: ITableInstance = useTable(
    {
        columns: tableColumns,
        data,
    },
    useRowSelect,
    (hooks: Hooks<any>) => {
            hooks.visibleColumns.push((tableColumns) => [
                {
                    id: 'selection',
                    Header: (headerCell: THeaderProps) => (
                        <Checkbox
                            {...headerCell.getToggleAllRowsSelectedProps()}
                            onChange={handleSelectAllRows(headerCell)}
                        />
                    ),
                    Cell: ({row}: TCellProps) => (
                        <Checkbox
                            {...row.getToggleRowSelectedProps()}
                            onChange={() => handleSelect((row.original as TSelectableTableRowData).selectionValue)}
                        />
                    ),
                },
                ...tableColumns,
            ]);
    }
);

Вот состояние моего компонента таблицы и обратный вызов при изменении:

const [selected, setSelected] = React.useState<string[]>([]);

const handleSelect = (selectedValue: string) => {
    setSelected(selected.concat([selectedValue])); // When I reach here, state is always = [], but it must have one item, when I check second checkbox.
};

Кажется, что каждый обработчик событий флажка использует собственное состояние реакции. Есть идеи, почему это так? Благодарность!