[Bug] Bad view for ReactBSTable when adding filters inputs

[Daniel-Raz-Supersmart]

Hi, I have a problem when I add filters to the table. The input is too large and does not adjust to the size of the column, the same thing happens in the rows themselves that the columns override each other and do not fit the required width here's my code: `const columns = [ { dataField: "id", text: "User ID", sort: true, filter: textFilter() }, { dataField: "userName", text: "User", sort: true, filter: textFilter() }, { dataField: "name", text: "Name", sort: true, filter: textFilter() }, { dataField: "email", text: "E-mail", sort: true, filter: dateFilter() }, { dataField: "systemRoles[0]", text: "Roles", sort: true, filter: numberFilter() }, { dataField: "enabled", text: "Enabled", sort: true, }, { dataField: "businessUnit[name]", text: "Store Name", sort: true, }, ]

return ( <>

        <Container className="mt--5" >
            <Row>
                <div className="col">
                    <Card>

                        <BootstrapTable
                            data={data}
                            columns={columns}
                            keyField={"id"}
                            bootstrap4={true}
                            pagination={
                                paginationFactory({
                                    page: page,
                                    sizePerPage: sizePerPage,
                                    totalSize: totalSize,
                                    alwaysShowAllBtns: true,
                                    showTotal: true,
                                    withFirstAndLast: false,
                                })}
                            loading={true}
                            noDataIndication={()=><div>Loading...</div>}
                            striped
                            remote
                            bordered={false}
                            hover
                            onTableChange={handleTableChange}
                            filter={filterFactory()}
                        />
                    </Card>
                </div>
            </Row>
        </Container>
    </>
)`

and a photo of how it looks:

[github-actions[bot]]

@Daniel-Raz-Supersmart this issue was automatically closed because it did not follow our rules:

IMPORTANT: Please use the following link to create a new issue:

https://www.creative-tim.com/new-issue/ct-argon-dashboard-pro-react

**If your issue was not created using the app above, it will be closed immediately.**

Love Creative Tim? Do you need Angular, React, Vuejs or HTML? You can visit:
👉  https://www.creative-tim.com/bundles
👉  https://www.creative-tim.com