Animated the Sidebar Objects Tree view opening/closing (#9287)

closes #6485 


https://github.com/user-attachments/assets/79efca87-1d9b-4fa2-a457-3117be679c6e

---------

Co-authored-by: Félix Malfait <felix.malfait@gmail.com>
This commit is contained in:
nitin
2025-01-08 19:36:49 +05:30
committed by GitHub
parent bec7911d59
commit 973ec83e71
19 changed files with 419 additions and 333 deletions

View File

@ -9,7 +9,7 @@ import { getNavigationSubItemLeftAdornment } from '@/ui/navigation/navigation-dr
import { View } from '@/views/types/View';
import { getObjectMetadataItemViews } from '@/views/utils/getObjectMetadataItemViews';
import { useLocation } from 'react-router-dom';
import { useIcons } from 'twenty-ui';
import { AnimatedExpandableContainer, useIcons } from 'twenty-ui';
export type NavigationDrawerItemForObjectMetadataItemProps = {
objectMetadataItem: ObjectMetadataItem;
@ -66,8 +66,14 @@ export const NavigationDrawerItemForObjectMetadataItem = ({
Icon={getIcon(objectMetadataItem.icon)}
active={isActive}
/>
{shouldSubItemsBeDisplayed &&
sortedObjectMetadataViews.map((view, index) => (
<AnimatedExpandableContainer
isExpanded={shouldSubItemsBeDisplayed}
dimension="height"
mode="fit-content"
containAnimation
>
{sortedObjectMetadataViews.map((view, index) => (
<NavigationDrawerSubItem
label={view.name}
to={`/objects/${objectMetadataItem.namePlural}?view=${view.id}`}
@ -81,6 +87,7 @@ export const NavigationDrawerItemForObjectMetadataItem = ({
key={view.id}
/>
))}
</AnimatedExpandableContainer>
</NavigationDrawerItemsCollapsableContainer>
);
};