# This PR - Fix #5278 - Updates the implementation of the `createOneObjectMataItem` hook to reduce the number of api calls - Users can now navigate to the newly created object first and the graphql api calls to cache data are happening in the background - this will improve the user experience and reduce the create object api call time by >2 <img width="1508" alt="Screenshot 2024-05-30 at 12 00 15" src="https://github.com/twentyhq/twenty/assets/61581306/46513fd1-d46e-40bc-a036-07e3acdf2870"> In the issue description, it also suggested to have a loading indicator while creating the object, it seems like on #5352 we adopted to disable it while creating the object - which looks good to me and it works, let me know if we still need the loading indicator instead @Bonapara Looking forward to getting your feedback cc: @charlesBochet --------- Co-authored-by: Thomas Trompette <thomas.trompette@sfr.fr>
56 lines
1.7 KiB
TypeScript
56 lines
1.7 KiB
TypeScript
import { ApolloClient, 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';
|
|
import {
|
|
CreateObjectInput,
|
|
CreateOneObjectMetadataItemMutation,
|
|
CreateOneObjectMetadataItemMutationVariables,
|
|
} from '~/generated-metadata/graphql';
|
|
|
|
import { CREATE_ONE_OBJECT_METADATA_ITEM } from '../graphql/mutations';
|
|
import { FIND_MANY_OBJECT_METADATA_ITEMS } from '../graphql/queries';
|
|
|
|
import { useApolloMetadataClient } from './useApolloMetadataClient';
|
|
|
|
export const useCreateOneObjectMetadataItem = () => {
|
|
const apolloMetadataClient = useApolloMetadataClient();
|
|
const apolloClient = useApolloClient();
|
|
|
|
const { findManyRecordsQuery } = useFindManyRecordsQuery({
|
|
objectNameSingular: CoreObjectNameSingular.View,
|
|
});
|
|
|
|
const [mutate] = useMutation<
|
|
CreateOneObjectMetadataItemMutation,
|
|
CreateOneObjectMetadataItemMutationVariables
|
|
>(CREATE_ONE_OBJECT_METADATA_ITEM, {
|
|
client: apolloMetadataClient ?? ({} as ApolloClient<any>),
|
|
});
|
|
|
|
const createOneObjectMetadataItem = async (input: CreateObjectInput) => {
|
|
const createdObjectMetadata = await mutate({
|
|
variables: {
|
|
input: { object: input },
|
|
},
|
|
awaitRefetchQueries: true,
|
|
refetchQueries: [getOperationName(FIND_MANY_OBJECT_METADATA_ITEMS) ?? ''],
|
|
});
|
|
|
|
return createdObjectMetadata;
|
|
};
|
|
|
|
const findManyRecordsCache = async () => {
|
|
await apolloClient.query({
|
|
query: findManyRecordsQuery,
|
|
fetchPolicy: 'network-only',
|
|
});
|
|
};
|
|
|
|
return {
|
|
createOneObjectMetadataItem,
|
|
findManyRecordsCache,
|
|
};
|
|
};
|