Dropdown in dropdown (#8911)

Dropdown in dropdown bug
while still fixing scroll issue 
fix #8716
This commit is contained in:
Guillim
2024-12-05 19:07:19 +01:00
committed by GitHub
parent f60ce384c6
commit 4623b6127b

View File

@ -1,3 +1,4 @@
import { ScrollWrapper } from '@/ui/utilities/scroll/components/ScrollWrapper';
import styled from '@emotion/styled';
const StyledDropdownMenuItemsExternalContainer = styled.div<{
@ -26,6 +27,10 @@ const StyledDropdownMenuItemsInternalContainer = styled.div`
width: 100%;
`;
const StyledScrollWrapper = styled(ScrollWrapper)`
width: 100%;
`;
// TODO: refactor this, the dropdown should handle the max height behavior + scroll with the size middleware
// We should instead create a DropdownMenuItemsContainerScrollable or take for granted that it is the default behavior
export const DropdownMenuItemsContainer = ({
@ -42,9 +47,17 @@ export const DropdownMenuItemsContainer = ({
hasMaxHeight={hasMaxHeight}
className={className}
>
<StyledDropdownMenuItemsInternalContainer>
{children}
</StyledDropdownMenuItemsInternalContainer>
{hasMaxHeight ? (
<StyledScrollWrapper contextProviderName="dropdownMenuItemsContainer">
<StyledDropdownMenuItemsInternalContainer>
{children}
</StyledDropdownMenuItemsInternalContainer>
</StyledScrollWrapper>
) : (
<StyledDropdownMenuItemsInternalContainer>
{children}
</StyledDropdownMenuItemsInternalContainer>
)}
</StyledDropdownMenuItemsExternalContainer>
);
};