admin/twenty
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Dropdown in dropdown (#8911)

Browse Source 
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
1 changed files with 16 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownMenuItemsContainer.tsx
View File

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