From 9579f22bc2cedddf7d39ebd742003e9ff558309a Mon Sep 17 00:00:00 2001 From: Charles Bochet Date: Fri, 13 Dec 2024 13:14:10 +0100 Subject: [PATCH] Move settings data model refreshMetadata to sync calls (#9046) In this PR, I'm - removing setting up the isAppWaitingForFreshMetadata boolean state in PageChangeEffect navigate (not robust) to some precise synchronous places, improving the control we have on when the app considers it's ready to be rendered based on fresh metadata - fixing tests --- .../effect-components/PageChangeEffect.tsx | 22 +-------- .../useFindManyObjectMetadataItems.ts | 45 ++++++++++++++----- .../useCreateOneObjectMetadataItem.test.tsx | 14 ++++++ .../useCreateOneRelationMetadataItem.test.tsx | 18 +++++++- .../useDeleteOneObjectMetadataItem.test.tsx | 16 ++++++- .../useDeleteOneRelationMetadataItem.test.tsx | 16 ++++++- .../__tests__/useFieldMetadataItem.test.tsx | 14 ++++++ .../hooks/useCreateOneFieldMetadataItem.ts | 13 +++--- .../hooks/useCreateOneObjectMetadataItem.ts | 9 ++-- .../hooks/useCreateOneRelationMetadataItem.ts | 14 +++--- .../hooks/useDeleteOneFieldMetadataItem.ts | 14 +++--- .../hooks/useDeleteOneObjectMetadataItem.ts | 14 +++--- .../hooks/useDeleteOneRelationMetadataItem.ts | 15 ++++--- .../hooks/useLoadMockedObjectMetadataItems.ts | 9 ++++ .../hooks/useRefreshObjectMetadataItem.ts | 9 +++- .../hooks/useUpdateOneFieldMetadataItem.ts | 9 ++-- .../hooks/useUpdateOneObjectMetadataItem.ts | 14 +++--- .../__tests__/getHighlightedDates.test.ts | 14 ++++-- .../date/utils/getHighlightedDates.ts | 4 +- 19 files changed, 204 insertions(+), 79 deletions(-) diff --git a/packages/twenty-front/src/modules/app/effect-components/PageChangeEffect.tsx b/packages/twenty-front/src/modules/app/effect-components/PageChangeEffect.tsx index b9f692e0e..3934d9040 100644 --- a/packages/twenty-front/src/modules/app/effect-components/PageChangeEffect.tsx +++ b/packages/twenty-front/src/modules/app/effect-components/PageChangeEffect.tsx @@ -1,6 +1,6 @@ import { useEffect, useState } from 'react'; import { useLocation, useNavigate } from 'react-router-dom'; -import { useRecoilValue, useSetRecoilState } from 'recoil'; +import { useRecoilValue } from 'recoil'; import { setSessionId, @@ -8,14 +8,12 @@ import { } from '@/analytics/hooks/useEventTracker'; import { useRequestFreshCaptchaToken } from '@/captcha/hooks/useRequestFreshCaptchaToken'; import { isCaptchaScriptLoadedState } from '@/captcha/states/isCaptchaScriptLoadedState'; -import { isAppWaitingForFreshObjectMetadataState } from '@/object-metadata/states/isAppWaitingForFreshObjectMetadataState'; import { TableHotkeyScope } from '@/object-record/record-table/types/TableHotkeyScope'; import { AppBasePath } from '@/types/AppBasePath'; import { AppPath } from '@/types/AppPath'; import { PageHotkeyScope } from '@/types/PageHotkeyScope'; import { SettingsPath } from '@/types/SettingsPath'; import { useSetHotkeyScope } from '@/ui/utilities/hotkey/hooks/useSetHotkeyScope'; -import { useDebouncedCallback } from 'use-debounce'; import { useCleanRecoilState } from '~/hooks/useCleanRecoilState'; import { useIsMatchingLocation } from '~/hooks/useIsMatchingLocation'; import { usePageChangeEffectNavigateLocation } from '~/hooks/usePageChangeEffectNavigateLocation'; @@ -52,27 +50,11 @@ export const PageChangeEffect = () => { } }, [location, previousLocation]); - const setIsAppWaitingForFreshObjectMetadata = useSetRecoilState( - isAppWaitingForFreshObjectMetadataState, - ); - - const setIsAppWaitingForFreshObjectMetadataDebounced = useDebouncedCallback( - () => { - setIsAppWaitingForFreshObjectMetadata(false); - }, - 100, - ); - useEffect(() => { if (isDefined(pageChangeEffectNavigateLocation)) { navigate(pageChangeEffectNavigateLocation); - setIsAppWaitingForFreshObjectMetadataDebounced(); } - }, [ - navigate, - pageChangeEffectNavigateLocation, - setIsAppWaitingForFreshObjectMetadataDebounced, - ]); + }, [navigate, pageChangeEffectNavigateLocation]); useEffect(() => { switch (true) { diff --git a/packages/twenty-front/src/modules/object-metadata/hooks/__mocks__/useFindManyObjectMetadataItems.ts b/packages/twenty-front/src/modules/object-metadata/hooks/__mocks__/useFindManyObjectMetadataItems.ts index 104376df0..e0d859536 100644 --- a/packages/twenty-front/src/modules/object-metadata/hooks/__mocks__/useFindManyObjectMetadataItems.ts +++ b/packages/twenty-front/src/modules/object-metadata/hooks/__mocks__/useFindManyObjectMetadataItems.ts @@ -1,11 +1,9 @@ import { gql } from '@apollo/client'; +import { mockedStandardObjectMetadataQueryResult } from '~/testing/mock-data/generated/mock-metadata-query-result'; export const query = gql` - query ObjectMetadataItems( - $objectFilter: objectFilter - $fieldFilter: fieldFilter - ) { - objects(paging: { first: 1000 }, filter: $objectFilter) { + query ObjectMetadataItems($objectFilter: objectFilter, $fieldFilter: fieldFilter) { + objects(paging: {first: 1000}, filter: $objectFilter) { edges { node { id @@ -25,7 +23,32 @@ export const query = gql` labelIdentifierFieldMetadataId imageIdentifierFieldMetadataId shortcut - fields(paging: { first: 1000 }, filter: $fieldFilter) { + isLabelSyncedWithName + indexMetadatas(paging: {first: 100}) { + edges { + node { + id + createdAt + updatedAt + name + indexWhereClause + indexType + isUnique + indexFieldMetadatas(paging: {first: 100}) { + edges { + node { + id + createdAt + updatedAt + order + fieldMetadataId + } + } + } + } + } + } + fields(paging: {first: 1000}, filter: $fieldFilter) { edges { node { id @@ -38,8 +61,12 @@ export const query = gql` isActive isSystem isNullable + isUnique createdAt updatedAt + defaultValue + options + settings isLabelSyncedWithName relationDefinition { relationId @@ -63,8 +90,6 @@ export const query = gql` name } } - defaultValue - options } } pageInfo { @@ -88,6 +113,4 @@ export const query = gql` export const variables = { objectFilter: undefined, fieldFilter: undefined }; -export const responseData = { - objects: { edges: [] }, -}; +export const responseData = mockedStandardObjectMetadataQueryResult; diff --git a/packages/twenty-front/src/modules/object-metadata/hooks/__tests__/useCreateOneObjectMetadataItem.test.tsx b/packages/twenty-front/src/modules/object-metadata/hooks/__tests__/useCreateOneObjectMetadataItem.test.tsx index cc92f241e..c234da65a 100644 --- a/packages/twenty-front/src/modules/object-metadata/hooks/__tests__/useCreateOneObjectMetadataItem.test.tsx +++ b/packages/twenty-front/src/modules/object-metadata/hooks/__tests__/useCreateOneObjectMetadataItem.test.tsx @@ -10,6 +10,11 @@ import { variables, } from '../__mocks__/useCreateOneObjectMetadataItem'; +import { + query as findManyObjectMetadataItemsQuery, + responseData as findManyObjectMetadataItemsResponseData, +} from '../__mocks__/useFindManyObjectMetadataItems'; + const mocks = [ { request: { @@ -22,6 +27,15 @@ const mocks = [ }, })), }, + { + request: { + query: findManyObjectMetadataItemsQuery, + variables: {}, + }, + result: jest.fn(() => ({ + data: findManyObjectMetadataItemsResponseData, + })), + }, { request: { query: findManyViewsQuery, diff --git a/packages/twenty-front/src/modules/object-metadata/hooks/__tests__/useCreateOneRelationMetadataItem.test.tsx b/packages/twenty-front/src/modules/object-metadata/hooks/__tests__/useCreateOneRelationMetadataItem.test.tsx index 6c93394cf..f0c721b6e 100644 --- a/packages/twenty-front/src/modules/object-metadata/hooks/__tests__/useCreateOneRelationMetadataItem.test.tsx +++ b/packages/twenty-front/src/modules/object-metadata/hooks/__tests__/useCreateOneRelationMetadataItem.test.tsx @@ -1,6 +1,6 @@ import { MockedProvider } from '@apollo/client/testing'; -import { act, renderHook } from '@testing-library/react'; -import { ReactNode } from 'react'; +import { renderHook } from '@testing-library/react'; +import { ReactNode, act } from 'react'; import { RecoilRoot } from 'recoil'; import { useCreateOneRelationMetadataItem } from '@/object-metadata/hooks/useCreateOneRelationMetadataItem'; @@ -12,6 +12,11 @@ import { variables, } from '../__mocks__/useCreateOneRelationMetadataItem'; +import { + query as findManyObjectMetadataItemsQuery, + responseData as findManyObjectMetadataItemsResponseData, +} from '../__mocks__/useFindManyObjectMetadataItems'; + const mocks = [ { request: { @@ -24,6 +29,15 @@ const mocks = [ }, })), }, + { + request: { + query: findManyObjectMetadataItemsQuery, + variables: {}, + }, + result: jest.fn(() => ({ + data: findManyObjectMetadataItemsResponseData, + })), + }, ]; const Wrapper = ({ children }: { children: ReactNode }) => ( diff --git a/packages/twenty-front/src/modules/object-metadata/hooks/__tests__/useDeleteOneObjectMetadataItem.test.tsx b/packages/twenty-front/src/modules/object-metadata/hooks/__tests__/useDeleteOneObjectMetadataItem.test.tsx index 03954953f..a28539774 100644 --- a/packages/twenty-front/src/modules/object-metadata/hooks/__tests__/useDeleteOneObjectMetadataItem.test.tsx +++ b/packages/twenty-front/src/modules/object-metadata/hooks/__tests__/useDeleteOneObjectMetadataItem.test.tsx @@ -1,6 +1,6 @@ -import { ReactNode } from 'react'; import { MockedProvider } from '@apollo/client/testing'; import { act, renderHook } from '@testing-library/react'; +import { ReactNode } from 'react'; import { RecoilRoot } from 'recoil'; import { useDeleteOneObjectMetadataItem } from '@/object-metadata/hooks/useDeleteOneObjectMetadataItem'; @@ -11,6 +11,11 @@ import { variables, } from '../__mocks__/useDeleteOneObjectMetadataItem'; +import { + query as findManyObjectMetadataItemsQuery, + responseData as findManyObjectMetadataItemsResponseData, +} from '../__mocks__/useFindManyObjectMetadataItems'; + const mocks = [ { request: { @@ -23,6 +28,15 @@ const mocks = [ }, })), }, + { + request: { + query: findManyObjectMetadataItemsQuery, + variables: {}, + }, + result: jest.fn(() => ({ + data: findManyObjectMetadataItemsResponseData, + })), + }, ]; const Wrapper = ({ children }: { children: ReactNode }) => ( diff --git a/packages/twenty-front/src/modules/object-metadata/hooks/__tests__/useDeleteOneRelationMetadataItem.test.tsx b/packages/twenty-front/src/modules/object-metadata/hooks/__tests__/useDeleteOneRelationMetadataItem.test.tsx index 7c6dcf613..e663d7a78 100644 --- a/packages/twenty-front/src/modules/object-metadata/hooks/__tests__/useDeleteOneRelationMetadataItem.test.tsx +++ b/packages/twenty-front/src/modules/object-metadata/hooks/__tests__/useDeleteOneRelationMetadataItem.test.tsx @@ -1,6 +1,6 @@ -import { ReactNode } from 'react'; import { MockedProvider } from '@apollo/client/testing'; import { act, renderHook } from '@testing-library/react'; +import { ReactNode } from 'react'; import { RecoilRoot } from 'recoil'; import { useDeleteOneRelationMetadataItem } from '@/object-metadata/hooks/useDeleteOneRelationMetadataItem'; @@ -11,6 +11,11 @@ import { variables, } from '../__mocks__/useDeleteOneRelationMetadataItem'; +import { + query as findManyObjectMetadataItemsQuery, + responseData as findManyObjectMetadataItemsResponseData, +} from '../__mocks__/useFindManyObjectMetadataItems'; + const mocks = [ { request: { @@ -23,6 +28,15 @@ const mocks = [ }, })), }, + { + request: { + query: findManyObjectMetadataItemsQuery, + variables: {}, + }, + result: jest.fn(() => ({ + data: findManyObjectMetadataItemsResponseData, + })), + }, ]; const Wrapper = ({ children }: { children: ReactNode }) => ( diff --git a/packages/twenty-front/src/modules/object-metadata/hooks/__tests__/useFieldMetadataItem.test.tsx b/packages/twenty-front/src/modules/object-metadata/hooks/__tests__/useFieldMetadataItem.test.tsx index 9392f9c2f..af6f199fc 100644 --- a/packages/twenty-front/src/modules/object-metadata/hooks/__tests__/useFieldMetadataItem.test.tsx +++ b/packages/twenty-front/src/modules/object-metadata/hooks/__tests__/useFieldMetadataItem.test.tsx @@ -16,6 +16,11 @@ import { variables, } from '../__mocks__/useFieldMetadataItem'; +import { + query as findManyObjectMetadataItemsQuery, + responseData as findManyObjectMetadataItemsResponseData, +} from '../__mocks__/useFindManyObjectMetadataItems'; + const fieldMetadataItem: FieldMetadataItem = { id: FIELD_METADATA_ID, createdAt: '', @@ -157,6 +162,15 @@ const mocks = [ data: responseData.getCurrentUser, })), }, + { + request: { + query: findManyObjectMetadataItemsQuery, + variables: {}, + }, + result: jest.fn(() => ({ + data: findManyObjectMetadataItemsResponseData, + })), + }, ]; const Wrapper = getJestMetadataAndApolloMocksWrapper({ diff --git a/packages/twenty-front/src/modules/object-metadata/hooks/useCreateOneFieldMetadataItem.ts b/packages/twenty-front/src/modules/object-metadata/hooks/useCreateOneFieldMetadataItem.ts index e7ed996c5..42e40ec0d 100644 --- a/packages/twenty-front/src/modules/object-metadata/hooks/useCreateOneFieldMetadataItem.ts +++ b/packages/twenty-front/src/modules/object-metadata/hooks/useCreateOneFieldMetadataItem.ts @@ -1,5 +1,4 @@ import { useMutation } from '@apollo/client'; -import { getOperationName } from '@apollo/client/utilities'; import { CreateFieldInput, @@ -8,12 +7,14 @@ import { } from '~/generated-metadata/graphql'; import { CREATE_ONE_FIELD_METADATA_ITEM } from '../graphql/mutations'; -import { FIND_MANY_OBJECT_METADATA_ITEMS } from '../graphql/queries'; +import { useRefreshObjectMetadataItems } from '@/object-metadata/hooks/useRefreshObjectMetadataItem'; import { useApolloMetadataClient } from './useApolloMetadataClient'; export const useCreateOneFieldMetadataItem = () => { const apolloMetadataClient = useApolloMetadataClient(); + const { refreshObjectMetadataItems } = + useRefreshObjectMetadataItems('network-only'); const [mutate] = useMutation< CreateOneFieldMetadataItemMutation, @@ -23,15 +24,17 @@ export const useCreateOneFieldMetadataItem = () => { }); const createOneFieldMetadataItem = async (input: CreateFieldInput) => { - return await mutate({ + const result = await mutate({ variables: { input: { field: input, }, }, - awaitRefetchQueries: true, - refetchQueries: [getOperationName(FIND_MANY_OBJECT_METADATA_ITEMS) ?? ''], }); + + await refreshObjectMetadataItems(); + + return result; }; return { 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 98f34c91f..c55596049 100644 --- a/packages/twenty-front/src/modules/object-metadata/hooks/useCreateOneObjectMetadataItem.ts +++ b/packages/twenty-front/src/modules/object-metadata/hooks/useCreateOneObjectMetadataItem.ts @@ -1,5 +1,4 @@ import { useApolloClient, useMutation } from '@apollo/client'; -import { getOperationName } from '@apollo/client/utilities'; import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular'; import { useFindManyRecordsQuery } from '@/object-record/hooks/useFindManyRecordsQuery'; @@ -10,13 +9,15 @@ import { } from '~/generated-metadata/graphql'; import { CREATE_ONE_OBJECT_METADATA_ITEM } from '../graphql/mutations'; -import { FIND_MANY_OBJECT_METADATA_ITEMS } from '../graphql/queries'; +import { useRefreshObjectMetadataItems } from '@/object-metadata/hooks/useRefreshObjectMetadataItem'; import { useApolloMetadataClient } from './useApolloMetadataClient'; export const useCreateOneObjectMetadataItem = () => { const apolloMetadataClient = useApolloMetadataClient(); const apolloClient = useApolloClient(); + const { refreshObjectMetadataItems } = + useRefreshObjectMetadataItems('network-only'); const { findManyRecordsQuery } = useFindManyRecordsQuery({ objectNameSingular: CoreObjectNameSingular.View, @@ -34,10 +35,10 @@ export const useCreateOneObjectMetadataItem = () => { variables: { input: { object: input }, }, - awaitRefetchQueries: true, - refetchQueries: [getOperationName(FIND_MANY_OBJECT_METADATA_ITEMS) ?? ''], }); + await refreshObjectMetadataItems(); + return createdObjectMetadata; }; diff --git a/packages/twenty-front/src/modules/object-metadata/hooks/useCreateOneRelationMetadataItem.ts b/packages/twenty-front/src/modules/object-metadata/hooks/useCreateOneRelationMetadataItem.ts index f8c0b1aec..9f176cc05 100644 --- a/packages/twenty-front/src/modules/object-metadata/hooks/useCreateOneRelationMetadataItem.ts +++ b/packages/twenty-front/src/modules/object-metadata/hooks/useCreateOneRelationMetadataItem.ts @@ -1,5 +1,4 @@ import { useMutation } from '@apollo/client'; -import { getOperationName } from '@apollo/client/utilities'; import { CreateOneRelationMetadataMutation, @@ -7,12 +6,12 @@ import { } from '~/generated-metadata/graphql'; import { CREATE_ONE_RELATION_METADATA_ITEM } from '../graphql/mutations'; -import { FIND_MANY_OBJECT_METADATA_ITEMS } from '../graphql/queries'; import { formatRelationMetadataInput, FormatRelationMetadataInputParams, } from '../utils/formatRelationMetadataInput'; +import { useRefreshObjectMetadataItems } from '@/object-metadata/hooks/useRefreshObjectMetadataItem'; import { useApolloMetadataClient } from './useApolloMetadataClient'; export const useCreateOneRelationMetadataItem = () => { @@ -25,14 +24,19 @@ export const useCreateOneRelationMetadataItem = () => { client: apolloMetadataClient, }); + const { refreshObjectMetadataItems } = + useRefreshObjectMetadataItems('network-only'); + const createOneRelationMetadataItem = async ( input: FormatRelationMetadataInputParams, ) => { - return await mutate({ + const result = await mutate({ variables: { input: { relation: formatRelationMetadataInput(input) } }, - awaitRefetchQueries: true, - refetchQueries: [getOperationName(FIND_MANY_OBJECT_METADATA_ITEMS) ?? ''], }); + + await refreshObjectMetadataItems(); + + return result; }; return { diff --git a/packages/twenty-front/src/modules/object-metadata/hooks/useDeleteOneFieldMetadataItem.ts b/packages/twenty-front/src/modules/object-metadata/hooks/useDeleteOneFieldMetadataItem.ts index 117051e4d..20985212a 100644 --- a/packages/twenty-front/src/modules/object-metadata/hooks/useDeleteOneFieldMetadataItem.ts +++ b/packages/twenty-front/src/modules/object-metadata/hooks/useDeleteOneFieldMetadataItem.ts @@ -1,5 +1,4 @@ import { useMutation } from '@apollo/client'; -import { getOperationName } from '@apollo/client/utilities'; import { DeleteOneFieldMetadataItemMutation, @@ -7,8 +6,8 @@ import { } from '~/generated-metadata/graphql'; import { DELETE_ONE_FIELD_METADATA_ITEM } from '../graphql/mutations'; -import { FIND_MANY_OBJECT_METADATA_ITEMS } from '../graphql/queries'; +import { useRefreshObjectMetadataItems } from '@/object-metadata/hooks/useRefreshObjectMetadataItem'; import { useApolloMetadataClient } from './useApolloMetadataClient'; export const useDeleteOneFieldMetadataItem = () => { @@ -21,16 +20,21 @@ export const useDeleteOneFieldMetadataItem = () => { client: apolloMetadataClient, }); + const { refreshObjectMetadataItems } = + useRefreshObjectMetadataItems('network-only'); + const deleteOneFieldMetadataItem = async ( idToDelete: DeleteOneFieldMetadataItemMutationVariables['idToDelete'], ) => { - return await mutate({ + const result = await mutate({ variables: { idToDelete, }, - awaitRefetchQueries: true, - refetchQueries: [getOperationName(FIND_MANY_OBJECT_METADATA_ITEMS) ?? ''], }); + + await refreshObjectMetadataItems(); + + return result; }; return { diff --git a/packages/twenty-front/src/modules/object-metadata/hooks/useDeleteOneObjectMetadataItem.ts b/packages/twenty-front/src/modules/object-metadata/hooks/useDeleteOneObjectMetadataItem.ts index f4101ca66..0cd3bbe94 100644 --- a/packages/twenty-front/src/modules/object-metadata/hooks/useDeleteOneObjectMetadataItem.ts +++ b/packages/twenty-front/src/modules/object-metadata/hooks/useDeleteOneObjectMetadataItem.ts @@ -1,5 +1,4 @@ import { useMutation } from '@apollo/client'; -import { getOperationName } from '@apollo/client/utilities'; import { DeleteOneObjectMetadataItemMutation, @@ -7,8 +6,8 @@ import { } from '~/generated-metadata/graphql'; import { DELETE_ONE_OBJECT_METADATA_ITEM } from '../graphql/mutations'; -import { FIND_MANY_OBJECT_METADATA_ITEMS } from '../graphql/queries'; +import { useRefreshObjectMetadataItems } from '@/object-metadata/hooks/useRefreshObjectMetadataItem'; import { useApolloMetadataClient } from './useApolloMetadataClient'; export const useDeleteOneObjectMetadataItem = () => { @@ -21,16 +20,21 @@ export const useDeleteOneObjectMetadataItem = () => { client: apolloMetadataClient, }); + const { refreshObjectMetadataItems } = + useRefreshObjectMetadataItems('network-only'); + const deleteOneObjectMetadataItem = async ( idToDelete: DeleteOneObjectMetadataItemMutationVariables['idToDelete'], ) => { - return await mutate({ + const result = await mutate({ variables: { idToDelete, }, - awaitRefetchQueries: true, - refetchQueries: [getOperationName(FIND_MANY_OBJECT_METADATA_ITEMS) ?? ''], }); + + await refreshObjectMetadataItems(); + + return result; }; return { diff --git a/packages/twenty-front/src/modules/object-metadata/hooks/useDeleteOneRelationMetadataItem.ts b/packages/twenty-front/src/modules/object-metadata/hooks/useDeleteOneRelationMetadataItem.ts index c380fdbab..50934bb25 100644 --- a/packages/twenty-front/src/modules/object-metadata/hooks/useDeleteOneRelationMetadataItem.ts +++ b/packages/twenty-front/src/modules/object-metadata/hooks/useDeleteOneRelationMetadataItem.ts @@ -1,5 +1,4 @@ import { useMutation } from '@apollo/client'; -import { getOperationName } from '@apollo/client/utilities'; import { DELETE_ONE_RELATION_METADATA_ITEM } from '@/object-metadata/graphql/mutations'; import { @@ -7,8 +6,7 @@ import { DeleteOneRelationMetadataItemMutationVariables, } from '~/generated-metadata/graphql'; -import { FIND_MANY_OBJECT_METADATA_ITEMS } from '../graphql/queries'; - +import { useRefreshObjectMetadataItems } from '@/object-metadata/hooks/useRefreshObjectMetadataItem'; import { useApolloMetadataClient } from './useApolloMetadataClient'; export const useDeleteOneRelationMetadataItem = () => { @@ -21,16 +19,21 @@ export const useDeleteOneRelationMetadataItem = () => { client: apolloMetadataClient, }); + const { refreshObjectMetadataItems } = + useRefreshObjectMetadataItems('network-only'); + const deleteOneRelationMetadataItem = async ( idToDelete: DeleteOneRelationMetadataItemMutationVariables['idToDelete'], ) => { - return await mutate({ + const result = await mutate({ variables: { idToDelete, }, - awaitRefetchQueries: true, - refetchQueries: [getOperationName(FIND_MANY_OBJECT_METADATA_ITEMS) ?? ''], }); + + await refreshObjectMetadataItems(); + + return result; }; return { diff --git a/packages/twenty-front/src/modules/object-metadata/hooks/useLoadMockedObjectMetadataItems.ts b/packages/twenty-front/src/modules/object-metadata/hooks/useLoadMockedObjectMetadataItems.ts index e8e3fa71c..dda913133 100644 --- a/packages/twenty-front/src/modules/object-metadata/hooks/useLoadMockedObjectMetadataItems.ts +++ b/packages/twenty-front/src/modules/object-metadata/hooks/useLoadMockedObjectMetadataItems.ts @@ -1,3 +1,4 @@ +import { isAppWaitingForFreshObjectMetadataState } from '@/object-metadata/states/isAppWaitingForFreshObjectMetadataState'; import { objectMetadataItemsState } from '@/object-metadata/states/objectMetadataItemsState'; import { useRecoilCallback } from 'recoil'; import { generatedMockObjectMetadataItems } from '~/testing/mock-data/generatedMockObjectMetadataItems'; @@ -15,6 +16,14 @@ export const useLoadMockedObjectMetadataItems = () => { ) { set(objectMetadataItemsState, generatedMockObjectMetadataItems); } + + if ( + snapshot + .getLoadable(isAppWaitingForFreshObjectMetadataState) + .getValue() === true + ) { + set(isAppWaitingForFreshObjectMetadataState, false); + } }, [], ); diff --git a/packages/twenty-front/src/modules/object-metadata/hooks/useRefreshObjectMetadataItem.ts b/packages/twenty-front/src/modules/object-metadata/hooks/useRefreshObjectMetadataItem.ts index af68f985b..f1e9eec68 100644 --- a/packages/twenty-front/src/modules/object-metadata/hooks/useRefreshObjectMetadataItem.ts +++ b/packages/twenty-front/src/modules/object-metadata/hooks/useRefreshObjectMetadataItem.ts @@ -1,5 +1,6 @@ import { FIND_MANY_OBJECT_METADATA_ITEMS } from '@/object-metadata/graphql/queries'; import { useApolloMetadataClient } from '@/object-metadata/hooks/useApolloMetadataClient'; +import { isAppWaitingForFreshObjectMetadataState } from '@/object-metadata/states/isAppWaitingForFreshObjectMetadataState'; import { objectMetadataItemsState } from '@/object-metadata/states/objectMetadataItemsState'; import { ObjectMetadataItem } from '@/object-metadata/types/ObjectMetadataItem'; import { mapPaginatedObjectMetadataItemsToObjectMetadataItems } from '@/object-metadata/utils/mapPaginatedObjectMetadataItemsToObjectMetadataItems'; @@ -7,13 +8,18 @@ import { useRecoilCallback } from 'recoil'; import { ObjectMetadataItemsQuery } from '~/generated-metadata/graphql'; import { isDeeplyEqual } from '~/utils/isDeeplyEqual'; -export const useRefreshObjectMetadataItems = () => { +type FetchPolicy = 'network-only' | 'cache-first'; + +export const useRefreshObjectMetadataItems = ( + fetchPolicy: FetchPolicy = 'cache-first', +) => { const client = useApolloMetadataClient(); const refreshObjectMetadataItems = async () => { const result = await client.query({ query: FIND_MANY_OBJECT_METADATA_ITEMS, variables: {}, + fetchPolicy, }); const objectMetadataItems = @@ -34,6 +40,7 @@ export const useRefreshObjectMetadataItems = () => { ) ) { set(objectMetadataItemsState, toSetObjectMetadataItems); + set(isAppWaitingForFreshObjectMetadataState, false); } }, [], diff --git a/packages/twenty-front/src/modules/object-metadata/hooks/useUpdateOneFieldMetadataItem.ts b/packages/twenty-front/src/modules/object-metadata/hooks/useUpdateOneFieldMetadataItem.ts index cc66a69e0..34784fba3 100644 --- a/packages/twenty-front/src/modules/object-metadata/hooks/useUpdateOneFieldMetadataItem.ts +++ b/packages/twenty-front/src/modules/object-metadata/hooks/useUpdateOneFieldMetadataItem.ts @@ -1,5 +1,4 @@ import { useApolloClient, useMutation } from '@apollo/client'; -import { getOperationName } from '@apollo/client/utilities'; import { UpdateOneFieldMetadataItemMutation, @@ -7,9 +6,9 @@ import { } from '~/generated-metadata/graphql'; import { UPDATE_ONE_FIELD_METADATA_ITEM } from '../graphql/mutations'; -import { FIND_MANY_OBJECT_METADATA_ITEMS } from '../graphql/queries'; import { currentWorkspaceState } from '@/auth/states/currentWorkspaceState'; +import { useRefreshObjectMetadataItems } from '@/object-metadata/hooks/useRefreshObjectMetadataItem'; import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular'; import { useFindManyRecordsQuery } from '@/object-record/hooks/useFindManyRecordsQuery'; import { GET_CURRENT_USER } from '@/users/graphql/queries/getCurrentUser'; @@ -19,6 +18,8 @@ import { useApolloMetadataClient } from './useApolloMetadataClient'; export const useUpdateOneFieldMetadataItem = () => { const apolloMetadataClient = useApolloMetadataClient(); const apolloClient = useApolloClient(); + const { refreshObjectMetadataItems } = + useRefreshObjectMetadataItems('network-only'); const setCurrentWorkspace = useSetRecoilState(currentWorkspaceState); @@ -67,10 +68,10 @@ export const useUpdateOneFieldMetadataItem = () => { idToUpdate: fieldMetadataIdToUpdate, updatePayload: updatePayload, }, - awaitRefetchQueries: true, - refetchQueries: [getOperationName(FIND_MANY_OBJECT_METADATA_ITEMS) ?? ''], }); + await refreshObjectMetadataItems(); + const { data } = await apolloClient.query({ query: GET_CURRENT_USER }); setCurrentWorkspace(data?.currentUser?.defaultWorkspace); diff --git a/packages/twenty-front/src/modules/object-metadata/hooks/useUpdateOneObjectMetadataItem.ts b/packages/twenty-front/src/modules/object-metadata/hooks/useUpdateOneObjectMetadataItem.ts index a70ff41c2..0c91fa230 100644 --- a/packages/twenty-front/src/modules/object-metadata/hooks/useUpdateOneObjectMetadataItem.ts +++ b/packages/twenty-front/src/modules/object-metadata/hooks/useUpdateOneObjectMetadataItem.ts @@ -1,5 +1,4 @@ import { useMutation } from '@apollo/client'; -import { getOperationName } from '@apollo/client/utilities'; import { UpdateOneObjectInput, @@ -8,8 +7,8 @@ import { } from '~/generated-metadata/graphql'; import { UPDATE_ONE_OBJECT_METADATA_ITEM } from '../graphql/mutations'; -import { FIND_MANY_OBJECT_METADATA_ITEMS } from '../graphql/queries'; +import { useRefreshObjectMetadataItems } from '@/object-metadata/hooks/useRefreshObjectMetadataItem'; import { useApolloMetadataClient } from './useApolloMetadataClient'; // TODO: Slice the Apollo store synchronously in the update function instead of subscribing, so we can use update after read in the same function call @@ -23,6 +22,9 @@ export const useUpdateOneObjectMetadataItem = () => { client: apolloClientMetadata ?? undefined, }); + const { refreshObjectMetadataItems } = + useRefreshObjectMetadataItems('network-only'); + const updateOneObjectMetadataItem = async ({ idToUpdate, updatePayload, @@ -30,14 +32,16 @@ export const useUpdateOneObjectMetadataItem = () => { idToUpdate: UpdateOneObjectInput['id']; updatePayload: UpdateOneObjectInput['update']; }) => { - return await mutate({ + const result = await mutate({ variables: { idToUpdate, updatePayload, }, - awaitRefetchQueries: true, - refetchQueries: [getOperationName(FIND_MANY_OBJECT_METADATA_ITEMS) ?? ''], }); + + await refreshObjectMetadataItems(); + + return result; }; return { diff --git a/packages/twenty-front/src/modules/ui/input/components/internal/date/utils/__tests__/getHighlightedDates.test.ts b/packages/twenty-front/src/modules/ui/input/components/internal/date/utils/__tests__/getHighlightedDates.test.ts index 26e87dde1..3f8e7a182 100644 --- a/packages/twenty-front/src/modules/ui/input/components/internal/date/utils/__tests__/getHighlightedDates.test.ts +++ b/packages/twenty-front/src/modules/ui/input/components/internal/date/utils/__tests__/getHighlightedDates.test.ts @@ -8,7 +8,7 @@ describe('getHighlightedDates', () => { expect(getHighlightedDates(dateRange)).toEqual([]); }); - it('should should return empty if range is one day', () => { + it('should should return one day if range is one day', () => { const dateRange = { start: new Date('2024-10-12T00:00:00.000Z'), end: new Date('2024-10-12T00:00:00.000Z'), @@ -18,7 +18,7 @@ describe('getHighlightedDates', () => { ]); }); - it('should should return empty if range is 2 days', () => { + it('should should return two days if range is 2 days', () => { const dateRange = { start: new Date('2024-10-12T00:00:00.000Z'), end: new Date('2024-10-13T00:00:00.000Z'), @@ -29,7 +29,7 @@ describe('getHighlightedDates', () => { ]); }); - it('should should return empty if range is 10 days', () => { + it('should should return 10 days if range is 10 days', () => { const dateRange = { start: new Date('2024-10-12T00:00:00.000Z'), end: new Date('2024-10-21T00:00:00.000Z'), @@ -47,4 +47,12 @@ describe('getHighlightedDates', () => { new Date('2024-10-21T00:00:00.000Z'), ]); }); + + it('should should return empty if range is 10 days but out of range', () => { + const dateRange = { + start: new Date('2023-10-01T00:00:00.000Z'), + end: new Date('2023-10-10T00:00:00.000Z'), + }; + expect(getHighlightedDates(dateRange)).toEqual([]); + }); }); diff --git a/packages/twenty-front/src/modules/ui/input/components/internal/date/utils/getHighlightedDates.ts b/packages/twenty-front/src/modules/ui/input/components/internal/date/utils/getHighlightedDates.ts index 813b36996..ce8aabfd8 100644 --- a/packages/twenty-front/src/modules/ui/input/components/internal/date/utils/getHighlightedDates.ts +++ b/packages/twenty-front/src/modules/ui/input/components/internal/date/utils/getHighlightedDates.ts @@ -12,9 +12,11 @@ export const getHighlightedDates = (highlightedDateRange?: { const minDate = subMonths(currentDate, 2); const maxDate = addMonths(currentDate, 2); - let dateToHighlight = start < minDate ? minDate : start; + const startDate = start < minDate ? minDate : start; const lastDate = end > maxDate ? maxDate : end; + let dateToHighlight = new Date(startDate); + while (dateToHighlight <= lastDate) { highlightedDates.push(dateToHighlight); dateToHighlight = addDays(dateToHighlight, 1);