SideNav (SideNavCat/SideNavItem) collapsible issue

Hi, there is a regression issue in V4.4.0 with respect to the SideNav where-in the SideNavItem(s) are not displayed on clicking SideNavCat.

There seems to be an issue while applying correct definition of CSS class "collapsible-body" in V4.4.0, which is preventing the side menu items from being displayed. Please find below my analysis/comparison w.r.t V4.3.0

Version 4.3.0:
1) Source code from SideNavCat.js

<Collapse isOpen = {isOpen} className = "collapsible-body">
<ul>
{children}
</ul>
</Collapse>

2) Generated html element (when side nav category is clicked)
<div class="collapse show collapsible-body">..</div>

3) CSS definition in bootstrap.css

.collapse.show {
display: block;
}

Result: Working as expected(Side Nav items are displayed when parent Side Nav Category is clicked/active)

Version 4.4.0:

1) Source code from SideNavCat.js

<Collapse isOpen = {isOpen}>
<div className="collapsible-body">
<ul>
{children}
</ul>
</div>
</Collapse>

2) Generated html element (when side nav category is clicked)
<div class="collapse show">

<div class="collapsible-body">..</div>

</div>

3) CSS definition
a) Following style is defined in SideNav.css [which is included in SideNavCat.js ->require('./SideNav.css');]

.collapsible-body {
display: block;
}

b) Following style is defined in mdb.css

.collapsible-body {
display: none;
}

Observation:
When running re-pro-4.4.0 as a standalone application, expected style (from SideNav.css is applied) because SideNav.css appears after mdb.css in the index.html file

However, when MDB is included as a dependency in CRA application (and when mdb.css imported in index.js), style defined in mdb.css is applied since it is the last style to be included in index.html

and by principle,
"When multiple rules of the same "specificity level" exist, whichever one appears last wins"

I hope this helps to confirm if this is an issue. Thanks.