diff --git a/packages/twenty-front/src/modules/favorites/components/CurrentWorkspaceMemberFavoritesFolders.tsx b/packages/twenty-front/src/modules/favorites/components/CurrentWorkspaceMemberFavoritesFolders.tsx index 77ac10ae16..81d1e08aff 100644 --- a/packages/twenty-front/src/modules/favorites/components/CurrentWorkspaceMemberFavoritesFolders.tsx +++ b/packages/twenty-front/src/modules/favorites/components/CurrentWorkspaceMemberFavoritesFolders.tsx @@ -43,11 +43,15 @@ export const CurrentWorkspaceMemberFavoritesFolders = () => { ); const loading = useIsPrefetchLoading(); - const { toggleNavigationSection, isNavigationSectionOpenState } = - useNavigationSection('Favorites'); + const { + toggleNavigationSection, + isNavigationSectionOpenState, + openNavigationSection, + } = useNavigationSection('Favorites'); const isNavigationSectionOpen = useRecoilValue(isNavigationSectionOpenState); const toggleNewFolder = () => { + openNavigationSection(); setIsFavoriteFolderCreating((current) => !current); }; const shouldDisplayFavoritesWithFeatureFlagEnabled = true; diff --git a/packages/twenty-front/src/modules/favorites/favorite-folder-picker/components/FavoriteFolderPickerFooter.tsx b/packages/twenty-front/src/modules/favorites/favorite-folder-picker/components/FavoriteFolderPickerFooter.tsx index e97a8d9d51..0d9f3d379b 100644 --- a/packages/twenty-front/src/modules/favorites/favorite-folder-picker/components/FavoriteFolderPickerFooter.tsx +++ b/packages/twenty-front/src/modules/favorites/favorite-folder-picker/components/FavoriteFolderPickerFooter.tsx @@ -2,9 +2,11 @@ import { FAVORITE_FOLDER_PICKER_DROPDOWN_ID } from '@/favorites/favorite-folder- import { isFavoriteFolderCreatingState } from '@/favorites/states/isFavoriteFolderCreatingState'; import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer'; import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown'; +import { useNavigationSection } from '@/ui/navigation/navigation-drawer/hooks/useNavigationSection'; +import { isNavigationDrawerExpandedState } from '@/ui/navigation/states/isNavigationDrawerExpanded'; import { useTheme } from '@emotion/react'; import styled from '@emotion/styled'; -import { useRecoilState } from 'recoil'; +import { useRecoilState, useSetRecoilState } from 'recoil'; import { IconPlus, MenuItem } from 'twenty-ui'; const StyledFooter = styled.div` @@ -18,6 +20,10 @@ export const FavoriteFolderPickerFooter = () => { const [, setIsFavoriteFolderCreating] = useRecoilState( isFavoriteFolderCreatingState, ); + const setIsNavigationDrawerExpanded = useSetRecoilState( + isNavigationDrawerExpandedState, + ); + const { openNavigationSection } = useNavigationSection('Favorites'); const theme = useTheme(); const { closeDropdown } = useDropdown(FAVORITE_FOLDER_PICKER_DROPDOWN_ID); @@ -27,6 +33,8 @@ export const FavoriteFolderPickerFooter = () => { { + setIsNavigationDrawerExpanded(true); + openNavigationSection(); setIsFavoriteFolderCreating(true); closeDropdown(); }} diff --git a/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/NavigationDrawerInput.tsx b/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/NavigationDrawerInput.tsx index dd8ba6d507..0e0cee09fb 100644 --- a/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/NavigationDrawerInput.tsx +++ b/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/NavigationDrawerInput.tsx @@ -44,7 +44,7 @@ const StyledItem = styled.div<{ isNavigationDrawerExpanded: boolean }>` const StyledItemElementsContainer = styled.span` align-items: center; - + gap: ${({ theme }) => theme.spacing(2)}; display: flex; width: 100%; `; @@ -53,6 +53,7 @@ const StyledTextInput = styled.input` ${TEXT_INPUT_STYLE} margin: 0; width: 100%; + padding: 0; `; export const NavigationDrawerInput = ({ @@ -115,7 +116,9 @@ export const NavigationDrawerInput = ({ {Icon && (