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

Remove favorite folder related feature flags (#9178)

Browse Source 
Co-authored-by: Weiko <corentin@twenty.com>
This commit is contained in:
nitin
2024-12-23 20:26:56 +05:30
committed by GitHub
parent 061c92069f
commit 3eff317b59
16 changed files with 56 additions and 184 deletions
Download Patch File Download Diff File Expand all files Collapse all files

47
packages/twenty-front/src/modules/favorites/components/CurrentWorkspaceMemberFavoritesFolders.tsx
View File

@ -1,29 +1,27 @@
import { useRecoilState, useRecoilValue } from 'recoil';
import { IconFolderPlus, LightIconButton, isDefined } from 'twenty-ui';
import { currentWorkspaceMemberState } from '@/auth/states/currentWorkspaceMemberState';
import { CurrentWorkspaceMemberOrphanFavorites } from '@/favorites/components/CurrentWorkspaceMemberOrphanFavorites';
import { FavoritesDragProvider } from '@/favorites/components/FavoritesDragProvider';
import { FavoriteFolders } from '@/favorites/components/FavoritesFolders';
import { FavoritesSkeletonLoader } from '@/favorites/components/FavoritesSkeletonLoader';
import { useFavorites } from '@/favorites/hooks/useFavorites';
import { useFavoritesByFolder } from '@/favorites/hooks/useFavoritesByFolder';
import { isFavoriteFolderCreatingState } from '@/favorites/states/isFavoriteFolderCreatingState';
import { useIsPrefetchLoading } from '@/prefetch/hooks/useIsPrefetchLoading';
import { NavigationDrawerAnimatedCollapseWrapper } from '@/ui/navigation/navigation-drawer/components/NavigationDrawerAnimatedCollapseWrapper';
import { NavigationDrawerSection } from '@/ui/navigation/navigation-drawer/components/NavigationDrawerSection';
import { NavigationDrawerSectionTitle } from '@/ui/navigation/navigation-drawer/components/NavigationDrawerSectionTitle';
import { useNavigationSection } from '@/ui/navigation/navigation-drawer/hooks/useNavigationSection';
import { useIsFeatureEnabled } from '@/workspace/hooks/useIsFeatureEnabled';
import { useRecoilState, useRecoilValue } from 'recoil';
import { IconFolderPlus, LightIconButton, isDefined } from 'twenty-ui';
export const CurrentWorkspaceMemberFavoritesFolders = () => {
const currentWorkspaceMember = useRecoilValue(currentWorkspaceMemberState);
const { sortedFavorites: favorites } = useFavorites();
const { favoritesByFolder } = useFavoritesByFolder();
const [isFavoriteFolderCreating, setIsFavoriteFolderCreating] =
useRecoilState(isFavoriteFolderCreatingState);
const isFavoriteFolderEnabled = useIsFeatureEnabled(
'IS_FAVORITE_FOLDER_ENABLED',
);
const loading = useIsPrefetchLoading();
const {
@ -38,21 +36,15 @@ export const CurrentWorkspaceMemberFavoritesFolders = () => {
setIsFavoriteFolderCreating((current) => !current);
};
const shouldDisplayFavoritesWithFeatureFlagEnabled = true;
//todo: remove this logic once feature flag gating is removed
const shouldDisplayFavoritesWithoutFeatureFlagEnabled =
favorites.length > 0 || isFavoriteFolderCreating;
const shouldDisplayFavorites = isFavoriteFolderEnabled
? shouldDisplayFavoritesWithFeatureFlagEnabled
: shouldDisplayFavoritesWithoutFeatureFlagEnabled;
if (loading && isDefined(currentWorkspaceMember)) {
return <FavoritesSkeletonLoader />;
}
if (!shouldDisplayFavorites) {
if (
(!favorites || favorites.length === 0) &&
!isFavoriteFolderCreating &&
(!favoritesByFolder || favoritesByFolder.length === 0)
) {
return null;
}
@ -63,24 +55,17 @@ export const CurrentWorkspaceMemberFavoritesFolders = () => {
label="Favorites"
onClick={toggleNavigationSection}
rightIcon={
isFavoriteFolderEnabled ? (
<LightIconButton
Icon={IconFolderPlus}
onClick={toggleNewFolder}
accent="tertiary"
/>
) : undefined
<LightIconButton
Icon={IconFolderPlus}
onClick={toggleNewFolder}
accent="tertiary"
/>
}
/>
</NavigationDrawerAnimatedCollapseWrapper>
{isNavigationSectionOpen && (
<FavoritesDragProvider>
{isFavoriteFolderEnabled && (
<FavoriteFolders
isNavigationSectionOpen={isNavigationSectionOpen}
/>
)}
<FavoriteFolders isNavigationSectionOpen={isNavigationSectionOpen} />
<CurrentWorkspaceMemberOrphanFavorites />
</FavoritesDragProvider>
)}

7
packages/twenty-front/src/modules/favorites/components/FavoritesFolders.tsx
View File

@ -1,13 +1,12 @@
import { useState } from 'react';
import { useRecoilState } from 'recoil';
import { IconFolder } from 'twenty-ui';
import { CurrentWorkspaceMemberFavorites } from '@/favorites/components/CurrentWorkspaceMemberFavorites';
import { FavoriteFolderHotkeyScope } from '@/favorites/constants/FavoriteFolderRightIconDropdownHotkeyScope';
import { useCreateFavoriteFolder } from '@/favorites/hooks/useCreateFavoriteFolder';
import { useFavoritesByFolder } from '@/favorites/hooks/useFavoritesByFolder';
import { isFavoriteFolderCreatingState } from '@/favorites/states/isFavoriteFolderCreatingState';
import { NavigationDrawerInput } from '@/ui/navigation/navigation-drawer/components/NavigationDrawerInput';
import { useState } from 'react';
import { useRecoilState } from 'recoil';
import { IconFolder } from 'twenty-ui';
type FavoriteFoldersProps = {
isNavigationSectionOpen: boolean;

9
packages/twenty-front/src/modules/prefetch/components/PrefetchDataProvider.tsx
View File

@ -1,17 +1,10 @@
import { PrefetchRunQueriesEffect } from '@/prefetch/components/PrefetchRunQueriesEffect';
import React from 'react';
import { PrefetchFavoriteFoldersRunQueriesEffect } from '@/prefetch/components/PrefetchFavortiteFoldersRunQueriesEffect';
import { PrefetchRunQueriesEffect } from '@/prefetch/components/PrefetchRunQueriesEffect';
import { useIsFeatureEnabled } from '@/workspace/hooks/useIsFeatureEnabled';
export const PrefetchDataProvider = ({ children }: React.PropsWithChildren) => {
const isFavoriteFolderEnabled = useIsFeatureEnabled(
'IS_FAVORITE_FOLDER_ENABLED',
);
return (
<>
<PrefetchRunQueriesEffect />
{isFavoriteFolderEnabled && <PrefetchFavoriteFoldersRunQueriesEffect />}
{children}
</>
);

45
packages/twenty-front/src/modules/prefetch/components/PrefetchFavortiteFoldersRunQueriesEffect.tsx
View File

@ -1,45 +0,0 @@
import { currentUserState } from '@/auth/states/currentUserState';
import { FavoriteFolder } from '@/favorites/types/FavoriteFolder';
import { useObjectMetadataItems } from '@/object-metadata/hooks/useObjectMetadataItems';
import { useCombinedFindManyRecords } from '@/object-record/multiple-objects/hooks/useCombinedFindManyRecords';
import { PREFETCH_CONFIG } from '@/prefetch/constants/PrefetchConfig';
import { usePrefetchRunQuery } from '@/prefetch/hooks/internal/usePrefetchRunQuery';
import { PrefetchKey } from '@/prefetch/types/PrefetchKey';
import { useEffect } from 'react';
import { useRecoilValue } from 'recoil';
import { isDefined } from '~/utils/isDefined';
// TODO: Remove this component once we merge it with PrefetchRunQueriesEffect (once we remove feature flag)
export const PrefetchFavoriteFoldersRunQueriesEffect = () => {
const currentUser = useRecoilValue(currentUserState);
const { upsertRecordsInCache: upsertFavoritesFoldersInCache } =
usePrefetchRunQuery<FavoriteFolder>({
prefetchKey: PrefetchKey.AllFavoritesFolders,
});
const { objectMetadataItems } = useObjectMetadataItems();
const operationSignatures = Object.values(PREFETCH_CONFIG)
.filter(({ objectNameSingular }) => objectNameSingular === 'favoriteFolder')
.map(({ objectNameSingular, operationSignatureFactory }) => {
const objectMetadataItem = objectMetadataItems.find(
(item) => item.nameSingular === objectNameSingular,
);
return operationSignatureFactory({ objectMetadataItem });
});
const { result } = useCombinedFindManyRecords({
operationSignatures,
skip: !currentUser,
});
useEffect(() => {
if (isDefined(result.favoriteFolders)) {
upsertFavoritesFoldersInCache(result.favoriteFolders as FavoriteFolder[]);
}
}, [result, upsertFavoritesFoldersInCache]);
return null;
};

22
packages/twenty-front/src/modules/prefetch/components/PrefetchRunQueriesEffect.tsx
View File

@ -3,6 +3,7 @@ import { useRecoilValue } from 'recoil';
import { currentUserState } from '@/auth/states/currentUserState';
import { Favorite } from '@/favorites/types/Favorite';
import { FavoriteFolder } from '@/favorites/types/FavoriteFolder';
import { useObjectMetadataItems } from '@/object-metadata/hooks/useObjectMetadataItems';
import { useCombinedFindManyRecords } from '@/object-record/multiple-objects/hooks/useCombinedFindManyRecords';
import { PREFETCH_CONFIG } from '@/prefetch/constants/PrefetchConfig';
@ -23,15 +24,14 @@ export const PrefetchRunQueriesEffect = () => {
usePrefetchRunQuery<Favorite>({
prefetchKey: PrefetchKey.AllFavorites,
});
const { upsertRecordsInCache: upsertFavoritesFoldersInCache } =
usePrefetchRunQuery<FavoriteFolder>({
prefetchKey: PrefetchKey.AllFavoritesFolders,
});
const { objectMetadataItems } = useObjectMetadataItems();
const operationSignatures = Object.values(PREFETCH_CONFIG)
.filter(
({ objectNameSingular }) =>
// TODO: Remove this filter once we merge PrefetchFavortiteFoldersRunQueriesEffect with this component
objectNameSingular !== 'favoriteFolder',
)
.map(({ objectNameSingular, operationSignatureFactory }) => {
const objectMetadataItem = objectMetadataItems.find(
(item) => item.nameSingular === objectNameSingular,
@ -53,7 +53,15 @@ export const PrefetchRunQueriesEffect = () => {
if (isDefined(result.favorites)) {
upsertFavoritesInCache(result.favorites as Favorite[]);
}
}, [result, upsertViewsInCache, upsertFavoritesInCache]);
if (isDefined(result.favoriteFolders)) {
upsertFavoritesFoldersInCache(result.favoriteFolders as FavoriteFolder[]);
}
}, [
result,
upsertViewsInCache,
upsertFavoritesInCache,
upsertFavoritesFoldersInCache,
]);
return <></>;
};

6
packages/twenty-front/src/modules/prefetch/hooks/useIsPrefetchLoading.ts
View File

@ -1,12 +1,8 @@
import { prefetchIsLoadedFamilyState } from '@/prefetch/states/prefetchIsLoadedFamilyState';
import { PrefetchKey } from '@/prefetch/types/PrefetchKey';
import { useIsFeatureEnabled } from '@/workspace/hooks/useIsFeatureEnabled';
import { useRecoilValue } from 'recoil';
export const useIsPrefetchLoading = () => {
const isFavoriteFolderEnabled = useIsFeatureEnabled(
'IS_FAVORITE_FOLDER_ENABLED',
);
const isFavoriteFoldersPrefetched = useRecoilValue(
prefetchIsLoadedFamilyState(PrefetchKey.AllFavoritesFolders),
);
@ -21,6 +17,6 @@ export const useIsPrefetchLoading = () => {
return (
!areViewsPrefetched ||
!areFavoritesPrefetched ||
(isFavoriteFolderEnabled && !isFavoriteFoldersPrefetched)
!isFavoriteFoldersPrefetched
);
};

8
packages/twenty-front/src/modules/views/view-picker/components/ViewPickerDropdown.tsx
View File

@ -22,7 +22,6 @@ import { ViewPickerListContent } from '@/views/view-picker/components/ViewPicker
import { VIEW_PICKER_DROPDOWN_ID } from '@/views/view-picker/constants/ViewPickerDropdownId';
import { useUpdateViewFromCurrentState } from '@/views/view-picker/hooks/useUpdateViewFromCurrentState';
import { useViewPickerMode } from '@/views/view-picker/hooks/useViewPickerMode';
import { useIsFeatureEnabled } from '@/workspace/hooks/useIsFeatureEnabled';
import { isDefined } from '~/utils/isDefined';
const StyledDropdownLabelAdornments = styled.span`
@ -51,9 +50,6 @@ const StyledViewName = styled.span`
export const ViewPickerDropdown = () => {
const theme = useTheme();
const isFavoriteFolderEnabled = useIsFeatureEnabled(
'IS_FAVORITE_FOLDER_ENABLED',
);
const { currentViewWithCombinedFiltersAndSorts } = useGetCurrentView();
@ -110,9 +106,7 @@ export const ViewPickerDropdown = () => {
case 'list':
return <ViewPickerListContent />;
case 'favorite-folders-picker':
return (
isFavoriteFolderEnabled && <ViewPickerFavoriteFoldersDropdown />
);
return <ViewPickerFavoriteFoldersDropdown />;
case 'create-empty':
case 'create-from-current':
return (

24
packages/twenty-front/src/modules/views/view-picker/components/ViewPickerOptionDropdown.tsx
View File

@ -8,7 +8,6 @@ import { View } from '@/views/types/View';
import { useDeleteViewFromCurrentState } from '@/views/view-picker/hooks/useDeleteViewFromCurrentState';
import { useViewPickerMode } from '@/views/view-picker/hooks/useViewPickerMode';
import { viewPickerReferenceViewIdComponentState } from '@/views/view-picker/states/viewPickerReferenceViewIdComponentState';
import { useIsFeatureEnabled } from '@/workspace/hooks/useIsFeatureEnabled';
import { useState } from 'react';
import {
IconHeart,
@ -41,10 +40,6 @@ export const ViewPickerOptionDropdown = ({
);
const { setViewPickerMode } = useViewPickerMode();
const isFavoriteFolderEnabled = useIsFeatureEnabled(
'IS_FAVORITE_FOLDER_ENABLED',
);
const { sortedFavorites: favorites } = useFavorites();
const { createFavorite } = useCreateFavorite();
@ -86,22 +81,19 @@ export const ViewPickerOptionDropdown = ({
dropdownContent={
<DropdownMenuItemsContainer>
{isIndexView ? (
isFavoriteFolderEnabled && (
<MenuItem
LeftIcon={IconHeart}
text={isFavorite ? 'Manage favorite' : 'Add to Favorite'}
onClick={handleAddToFavorites}
/>
) : (
<>
<MenuItem
LeftIcon={IconHeart}
text={isFavorite ? 'Manage favorite' : 'Add to Favorite'}
onClick={handleAddToFavorites}
/>
)
) : (
<>
{isFavoriteFolderEnabled && (
<MenuItem
LeftIcon={IconHeart}
text={isFavorite ? 'Manage favorite' : 'Add to Favorite'}
onClick={handleAddToFavorites}
/>
)}
<MenuItem
LeftIcon={IconPencil}
text="Edit"

1
packages/twenty-front/src/modules/workspace/types/FeatureFlagKey.ts
View File

@ -17,6 +17,5 @@ export type FeatureFlagKey =
| 'IS_MICROSOFT_SYNC_ENABLED'
| 'IS_ADVANCED_FILTERS_ENABLED'
| 'IS_AGGREGATE_QUERY_ENABLED'
| 'IS_FAVORITE_FOLDER_ENABLED'
| 'IS_VIEW_GROUPS_ENABLED'
| 'IS_PAGE_HEADER_V2_ENABLED';

28
packages/twenty-front/src/pages/object-record/RecordShowPageBaseHeader.tsx
View File

@ -5,7 +5,6 @@ import { ObjectMetadataItem } from '@/object-metadata/types/ObjectMetadataItem';
import { ObjectRecord } from '@/object-record/types/ObjectRecord';
import { PageHeaderOpenCommandMenuButton } from '@/ui/layout/page-header/components/PageHeaderOpenCommandMenuButton';
import { ShowPageAddButton } from '@/ui/layout/show-page/components/ShowPageAddButton';
import { useIsFeatureEnabled } from '@/workspace/hooks/useIsFeatureEnabled';
import { useIsMobile } from 'twenty-ui';
type RecordShowPageBaseHeaderProps = {
@ -23,31 +22,20 @@ export const RecordShowPageBaseHeader = ({
objectNameSingular,
handleFavoriteButtonClick,
}: RecordShowPageBaseHeaderProps) => {
const isFavoriteFolderEnabled = useIsFeatureEnabled(
'IS_FAVORITE_FOLDER_ENABLED',
);
const isMobile = useIsMobile();
return (
<>
{!isMobile && (
<>
{isFavoriteFolderEnabled ? (
isFavorite ? (
<PageFavoriteFoldersDropdown
key={FAVORITE_FOLDER_PICKER_DROPDOWN_ID}
dropdownId={FAVORITE_FOLDER_PICKER_DROPDOWN_ID}
isFavorite={isFavorite}
record={record}
objectNameSingular={objectNameSingular}
/>
) : (
<PageFavoriteButton
isFavorite={isFavorite}
onClick={handleFavoriteButtonClick}
/>
)
{isFavorite ? (
<PageFavoriteFoldersDropdown
key={FAVORITE_FOLDER_PICKER_DROPDOWN_ID}
dropdownId={FAVORITE_FOLDER_PICKER_DROPDOWN_ID}
isFavorite={isFavorite}
record={record}
objectNameSingular={objectNameSingular}
/>
) : (
<PageFavoriteButton
isFavorite={isFavorite}