From 4542199e5ce51fa085692b3c1df50ca049a1bb39 Mon Sep 17 00:00:00 2001 From: Charles Bochet Date: Mon, 27 Jan 2025 21:25:02 +0100 Subject: [PATCH] Fix object metadata view creation issue (#9875) Fixes https://github.com/twentyhq/core-team-issues/issues/26 Fixes https://github.com/twentyhq/twenty/issues/9350 --- .../components/WorkspaceFavorites.tsx | 7 ++-- .../favorites/hooks/useWorkspaceFavorites.ts | 28 ++++++++++++++- ...ObjectMetadataItemsInWorkspaceFavorites.ts | 36 ------------------- .../NavigationDrawerOpenedSection.tsx | 5 ++- .../hooks/useCreateOneObjectMetadataItem.ts | 17 +-------- .../object-record/hooks/useFindManyRecords.ts | 12 ++++--- .../useUpsertRecordsInCacheForPrefetchKey.ts | 1 + .../ui/input/components/TextInputV2.tsx | 2 +- .../settings/data-model/SettingsNewObject.tsx | 5 +-- .../SettingsObjectNewFieldConfigure.tsx | 8 ++--- 10 files changed, 48 insertions(+), 73 deletions(-) delete mode 100644 packages/twenty-front/src/modules/navigation/hooks/useObjectMetadataItemsInWorkspaceFavorites.ts diff --git a/packages/twenty-front/src/modules/favorites/components/WorkspaceFavorites.tsx b/packages/twenty-front/src/modules/favorites/components/WorkspaceFavorites.tsx index b975799fd..58df61ddc 100644 --- a/packages/twenty-front/src/modules/favorites/components/WorkspaceFavorites.tsx +++ b/packages/twenty-front/src/modules/favorites/components/WorkspaceFavorites.tsx @@ -1,11 +1,10 @@ -import { useFilteredObjectMetadataItemsForWorkspaceFavorites } from '@/navigation/hooks/useObjectMetadataItemsInWorkspaceFavorites'; +import { useWorkspaceFavorites } from '@/favorites/hooks/useWorkspaceFavorites'; import { NavigationDrawerSectionForObjectMetadataItems } from '@/object-metadata/components/NavigationDrawerSectionForObjectMetadataItems'; import { NavigationDrawerSectionForObjectMetadataItemsSkeletonLoader } from '@/object-metadata/components/NavigationDrawerSectionForObjectMetadataItemsSkeletonLoader'; import { useIsPrefetchLoading } from '@/prefetch/hooks/useIsPrefetchLoading'; export const WorkspaceFavorites = () => { - const { activeObjectMetadataItems: objectMetadataItemsToDisplay } = - useFilteredObjectMetadataItemsForWorkspaceFavorites(); + const { workspaceFavoritesObjectMetadataItems } = useWorkspaceFavorites(); const loading = useIsPrefetchLoading(); @@ -16,7 +15,7 @@ export const WorkspaceFavorites = () => { return ( ); diff --git a/packages/twenty-front/src/modules/favorites/hooks/useWorkspaceFavorites.ts b/packages/twenty-front/src/modules/favorites/hooks/useWorkspaceFavorites.ts index 7ba499b04..04d52cb22 100644 --- a/packages/twenty-front/src/modules/favorites/hooks/useWorkspaceFavorites.ts +++ b/packages/twenty-front/src/modules/favorites/hooks/useWorkspaceFavorites.ts @@ -1,4 +1,5 @@ import { sortFavorites } from '@/favorites/utils/sortFavorites'; +import { useFilteredObjectMetadataItems } from '@/object-metadata/hooks/useFilteredObjectMetadataItems'; import { useGetObjectRecordIdentifierByNameSingular } from '@/object-metadata/hooks/useGetObjectRecordIdentifierByNameSingular'; import { useObjectMetadataItem } from '@/object-metadata/hooks/useObjectMetadataItem'; import { objectMetadataItemsState } from '@/object-metadata/states/objectMetadataItemsState'; @@ -13,6 +14,7 @@ import { usePrefetchedFavoritesData } from './usePrefetchedFavoritesData'; export const useWorkspaceFavorites = () => { const { workspaceFavorites } = usePrefetchedFavoritesData(); + const { records: views } = usePrefetchedData(PrefetchKey.AllViews); const objectMetadataItems = useRecoilValue(objectMetadataItemsState); const { objectMetadataItem: favoriteObjectMetadataItem } = @@ -52,5 +54,29 @@ export const useWorkspaceFavorites = () => { ], ); - return { sortedWorkspaceFavorites }; + const workspaceFavoriteIds = new Set( + sortedWorkspaceFavorites.map((favorite) => favorite.recordId), + ); + + const favoriteViewObjectMetadataIds = new Set( + views.reduce((acc, view) => { + if (workspaceFavoriteIds.has(view.id)) { + acc.push(view.objectMetadataId); + } + return acc; + }, []), + ); + + const { activeObjectMetadataItems } = useFilteredObjectMetadataItems(); + + const activeObjectMetadataItemsInWorkspaceFavorites = + activeObjectMetadataItems.filter((item) => + favoriteViewObjectMetadataIds.has(item.id), + ); + + return { + workspaceFavorites: sortedWorkspaceFavorites, + workspaceFavoritesObjectMetadataItems: + activeObjectMetadataItemsInWorkspaceFavorites, + }; }; diff --git a/packages/twenty-front/src/modules/navigation/hooks/useObjectMetadataItemsInWorkspaceFavorites.ts b/packages/twenty-front/src/modules/navigation/hooks/useObjectMetadataItemsInWorkspaceFavorites.ts deleted file mode 100644 index fa616a912..000000000 --- a/packages/twenty-front/src/modules/navigation/hooks/useObjectMetadataItemsInWorkspaceFavorites.ts +++ /dev/null @@ -1,36 +0,0 @@ -import { useWorkspaceFavorites } from '@/favorites/hooks/useWorkspaceFavorites'; -import { useFilteredObjectMetadataItems } from '@/object-metadata/hooks/useFilteredObjectMetadataItems'; -import { usePrefetchedData } from '@/prefetch/hooks/usePrefetchedData'; -import { PrefetchKey } from '@/prefetch/types/PrefetchKey'; -import { View } from '@/views/types/View'; - -export const useFilteredObjectMetadataItemsForWorkspaceFavorites = () => { - const { records: views } = usePrefetchedData(PrefetchKey.AllViews); - - const { sortedWorkspaceFavorites: workspaceFavorites } = - useWorkspaceFavorites(); - - const workspaceFavoriteIds = new Set( - workspaceFavorites.map((favorite) => favorite.recordId), - ); - - const favoriteViewObjectMetadataIds = new Set( - views.reduce((acc, view) => { - if (workspaceFavoriteIds.has(view.id)) { - acc.push(view.objectMetadataId); - } - return acc; - }, []), - ); - - const { activeObjectMetadataItems } = useFilteredObjectMetadataItems(); - - const activeObjectMetadataItemsInWorkspaceFavorites = - activeObjectMetadataItems.filter((item) => - favoriteViewObjectMetadataIds.has(item.id), - ); - - return { - activeObjectMetadataItems: activeObjectMetadataItemsInWorkspaceFavorites, - }; -}; diff --git a/packages/twenty-front/src/modules/object-metadata/components/NavigationDrawerOpenedSection.tsx b/packages/twenty-front/src/modules/object-metadata/components/NavigationDrawerOpenedSection.tsx index 915b882fe..32a6e11b2 100644 --- a/packages/twenty-front/src/modules/object-metadata/components/NavigationDrawerOpenedSection.tsx +++ b/packages/twenty-front/src/modules/object-metadata/components/NavigationDrawerOpenedSection.tsx @@ -1,6 +1,6 @@ import { useParams } from 'react-router-dom'; -import { useFilteredObjectMetadataItemsForWorkspaceFavorites } from '@/navigation/hooks/useObjectMetadataItemsInWorkspaceFavorites'; +import { useWorkspaceFavorites } from '@/favorites/hooks/useWorkspaceFavorites'; import { NavigationDrawerSectionForObjectMetadataItems } from '@/object-metadata/components/NavigationDrawerSectionForObjectMetadataItems'; import { NavigationDrawerSectionForObjectMetadataItemsSkeletonLoader } from '@/object-metadata/components/NavigationDrawerSectionForObjectMetadataItemsSkeletonLoader'; import { useFilteredObjectMetadataItems } from '@/object-metadata/hooks/useFilteredObjectMetadataItems'; @@ -14,8 +14,7 @@ export const NavigationDrawerOpenedSection = () => { const loading = useIsPrefetchLoading(); - const { activeObjectMetadataItems: workspaceFavoritesObjectMetadataItems } = - useFilteredObjectMetadataItemsForWorkspaceFavorites(); + const { workspaceFavoritesObjectMetadataItems } = useWorkspaceFavorites(); const { objectNamePlural: currentObjectNamePlural, diff --git a/packages/twenty-front/src/modules/object-metadata/hooks/useCreateOneObjectMetadataItem.ts b/packages/twenty-front/src/modules/object-metadata/hooks/useCreateOneObjectMetadataItem.ts index c55596049..1ad8af448 100644 --- a/packages/twenty-front/src/modules/object-metadata/hooks/useCreateOneObjectMetadataItem.ts +++ b/packages/twenty-front/src/modules/object-metadata/hooks/useCreateOneObjectMetadataItem.ts @@ -1,7 +1,5 @@ -import { useApolloClient, useMutation } from '@apollo/client'; +import { useMutation } from '@apollo/client'; -import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular'; -import { useFindManyRecordsQuery } from '@/object-record/hooks/useFindManyRecordsQuery'; import { CreateObjectInput, CreateOneObjectMetadataItemMutation, @@ -15,14 +13,9 @@ import { useApolloMetadataClient } from './useApolloMetadataClient'; export const useCreateOneObjectMetadataItem = () => { const apolloMetadataClient = useApolloMetadataClient(); - const apolloClient = useApolloClient(); const { refreshObjectMetadataItems } = useRefreshObjectMetadataItems('network-only'); - const { findManyRecordsQuery } = useFindManyRecordsQuery({ - objectNameSingular: CoreObjectNameSingular.View, - }); - const [mutate] = useMutation< CreateOneObjectMetadataItemMutation, CreateOneObjectMetadataItemMutationVariables @@ -42,15 +35,7 @@ export const useCreateOneObjectMetadataItem = () => { return createdObjectMetadata; }; - const findManyRecordsCache = async () => { - await apolloClient.query({ - query: findManyRecordsQuery, - fetchPolicy: 'network-only', - }); - }; - return { createOneObjectMetadataItem, - findManyRecordsCache, }; }; diff --git a/packages/twenty-front/src/modules/object-record/hooks/useFindManyRecords.ts b/packages/twenty-front/src/modules/object-record/hooks/useFindManyRecords.ts index 30dd397b1..65295a050 100644 --- a/packages/twenty-front/src/modules/object-record/hooks/useFindManyRecords.ts +++ b/packages/twenty-front/src/modules/object-record/hooks/useFindManyRecords.ts @@ -72,10 +72,14 @@ export const useFindManyRecords = ({ useQuery(findManyRecordsQuery, { skip: skip || !objectMetadataItem, variables: { - filter: { - ...filter, - ...(withSoftDeleted ? withSoftDeleterFilter : {}), - }, + ...(filter || withSoftDeleted + ? { + filter: { + ...filter, + ...(withSoftDeleted ? withSoftDeleterFilter : {}), + }, + } + : {}), orderBy, lastCursor: cursorFilter?.cursor ?? undefined, limit: cursorFilter?.limit ?? limit, diff --git a/packages/twenty-front/src/modules/prefetch/hooks/internal/useUpsertRecordsInCacheForPrefetchKey.ts b/packages/twenty-front/src/modules/prefetch/hooks/internal/useUpsertRecordsInCacheForPrefetchKey.ts index 2e1da0cb8..381166c1b 100644 --- a/packages/twenty-front/src/modules/prefetch/hooks/internal/useUpsertRecordsInCacheForPrefetchKey.ts +++ b/packages/twenty-front/src/modules/prefetch/hooks/internal/useUpsertRecordsInCacheForPrefetchKey.ts @@ -34,6 +34,7 @@ export const useUpsertRecordsInCacheForPrefetchKey = ({ const upsertRecordsInCache = (records: T[]) => { setPrefetchDataIsLoaded(false); + upsertFindManyRecordsQueryInCache({ queryVariables: operationSignature.variables, recordGqlFields: operationSignature.fields, diff --git a/packages/twenty-front/src/modules/ui/input/components/TextInputV2.tsx b/packages/twenty-front/src/modules/ui/input/components/TextInputV2.tsx index f3a371084..08af32b50 100644 --- a/packages/twenty-front/src/modules/ui/input/components/TextInputV2.tsx +++ b/packages/twenty-front/src/modules/ui/input/components/TextInputV2.tsx @@ -59,7 +59,7 @@ const StyledInput = styled.input< padding: ${({ theme, sizeVariant }) => sizeVariant === 'sm' ? `${theme.spacing(2)} 0` : theme.spacing(2)}; padding-left: ${({ theme, LeftIcon }) => - LeftIcon ? `px` : theme.spacing(2)}; + LeftIcon ? `calc(${theme.spacing(4)} + 16px)` : theme.spacing(2)}; width: ${({ theme, width }) => width ? `calc(${width}px + ${theme.spacing(5)})` : '100%'}; diff --git a/packages/twenty-front/src/pages/settings/data-model/SettingsNewObject.tsx b/packages/twenty-front/src/pages/settings/data-model/SettingsNewObject.tsx index cf017f854..cf11db690 100644 --- a/packages/twenty-front/src/pages/settings/data-model/SettingsNewObject.tsx +++ b/packages/twenty-front/src/pages/settings/data-model/SettingsNewObject.tsx @@ -28,8 +28,7 @@ export const SettingsNewObject = () => { const navigate = useNavigateSettings(); const { enqueueSnackBar } = useSnackBar(); - const { createOneObjectMetadataItem, findManyRecordsCache } = - useCreateOneObjectMetadataItem(); + const { createOneObjectMetadataItem } = useCreateOneObjectMetadataItem(); const formConfig = useForm({ mode: 'onTouched', @@ -53,8 +52,6 @@ export const SettingsNewObject = () => { ? { objectNamePlural: response.createOneObject.namePlural } : undefined, ); - - await findManyRecordsCache(); } catch (error) { enqueueSnackBar((error as Error).message, { variant: SnackBarVariant.Error, diff --git a/packages/twenty-front/src/pages/settings/data-model/SettingsObjectNewField/SettingsObjectNewFieldConfigure.tsx b/packages/twenty-front/src/pages/settings/data-model/SettingsObjectNewField/SettingsObjectNewFieldConfigure.tsx index b64c49f11..6449613d9 100644 --- a/packages/twenty-front/src/pages/settings/data-model/SettingsObjectNewField/SettingsObjectNewFieldConfigure.tsx +++ b/packages/twenty-front/src/pages/settings/data-model/SettingsObjectNewField/SettingsObjectNewFieldConfigure.tsx @@ -137,6 +137,10 @@ export const SettingsObjectNewFieldConfigure = () => { formValues: SettingsDataModelNewFieldFormValues, ) => { try { + navigate(SettingsPath.ObjectDetail, { + objectNamePlural, + }); + if ( formValues.type === FieldMetadataType.RELATION && 'relation' in formValues @@ -172,10 +176,6 @@ export const SettingsObjectNewFieldConfigure = () => { }); } - navigate(SettingsPath.ObjectDetail, { - objectNamePlural, - }); - // TODO: fix optimistic update logic // Forcing a refetch for now but it's not ideal await apolloClient.refetchQueries({