React-select on change not triggered inside bootstrap dropdown

I am very puzzled by this and probably missing something really stupid. I have to selects inside a bootstrap dropdown, one is generic select and other is a react-select component. When I use the generic select and change the selected value, the onChange get triggered and works perfectly. When I change the value of the react-select, nothing happens at all. If I take it out of the dropdown, it does trigger as it should….

Any pointers on how to solve would be greqatly appreciated!

import React from 'react'
import Select from 'react-select'

export function Filter({ headerGroups }: { headerGroups: any }) {
    return (
        <>
            <button
                type="button"
                className="input-group-addon btn input-sm dropdown-toggle icon-filter"
                data-toggle="dropdown"
            />
            <ul
                id="dropdown-toggle"
                className="dropdown-menu pull-right dropdown-menu"
                data-autoclose="false"
            >
                <li>
                    {headerGroups.map((headerGroup) =>
                        headerGroup.headers.map((column) =>
                            column.canFilter ? (
                                <fieldset
                                    key={column.id}
                                    style={{ float: 'left' }}
                                >
                                    <legend>{column.Header}</legend>
                                    <Select
                                        key={column.id + Math.random()}
                                        id={column.id}
                                        isSearchable
                                        options={options}
                                        value={column.filterValue}
                                        closeMenuOnSelect
                                        onChange={(e) => handleChange(e)}
                                    />
                                    <select
                                        key={column.id + 'gjwi'}
                                        id={column.id}
                                        value={column.filterValue}
                                        onChange={(e) => handleChange(e)}
                                    >
                                        {options.map((option) => {
                                            return (
                                                <option
                                                    key={
                                                        option.value +
                                                        Math.random()
                                                    }
                                                    value={option.value}
                                                >
                                                    {option.label}
                                                </option>
                                            )
                                        })}
                                    </select>
                                </fieldset>
                            ) : null
                        )
                    )}
                </li>
            </ul>
        </>
    )
}