forked from twentyhq/twenty
-
Notifications
You must be signed in to change notification settings - Fork 3
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
[FE] Update remote table schema + refactor Tables list (twentyhq#5548)
Closes twentyhq#5062. Refactoring tables list to avoid rendering all toggles on each sync or schema update while using fresh data: - introducing id for RemoteTables in apollo cache - manually updating the cache for the record that was updated after a sync or schema update instead of fetching all tables again
- Loading branch information
Showing
13 changed files
with
222 additions
and
57 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
12 changes: 12 additions & 0 deletions
12
...ages/twenty-front/src/modules/databases/graphql/mutations/syncRemoteTableSchemaChanges.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,12 @@ | ||
import { gql } from '@apollo/client'; | ||
|
||
import { REMOTE_TABLE_FRAGMENT } from '@/databases/graphql/fragments/remoteTableFragment'; | ||
|
||
export const SYNC_REMOTE_TABLE_SCHEMA_CHANGES = gql` | ||
${REMOTE_TABLE_FRAGMENT} | ||
mutation syncRemoteTableSchemaChanges($input: RemoteTableInput!) { | ||
syncRemoteTableSchemaChanges(input: $input) { | ||
...RemoteTableFields | ||
} | ||
} | ||
`; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
53 changes: 53 additions & 0 deletions
53
packages/twenty-front/src/modules/databases/hooks/useSyncRemoteTableSchemaChanges.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,53 @@ | ||
import { useCallback } from 'react'; | ||
import { ApolloClient, useMutation } from '@apollo/client'; | ||
|
||
import { SYNC_REMOTE_TABLE_SCHEMA_CHANGES } from '@/databases/graphql/mutations/syncRemoteTableSchemaChanges'; | ||
import { modifyRemoteTableFromCache } from '@/databases/utils/modifyRemoteTableFromCache'; | ||
import { useApolloMetadataClient } from '@/object-metadata/hooks/useApolloMetadataClient'; | ||
import { | ||
RemoteTableInput, | ||
SyncRemoteTableSchemaChangesMutation, | ||
SyncRemoteTableSchemaChangesMutationVariables, | ||
} from '~/generated-metadata/graphql'; | ||
import { isDefined } from '~/utils/isDefined'; | ||
|
||
export const useSyncRemoteTableSchemaChanges = () => { | ||
const apolloMetadataClient = useApolloMetadataClient(); | ||
|
||
const [mutate, mutationInformation] = useMutation< | ||
SyncRemoteTableSchemaChangesMutation, | ||
SyncRemoteTableSchemaChangesMutationVariables | ||
>(SYNC_REMOTE_TABLE_SCHEMA_CHANGES, { | ||
client: apolloMetadataClient ?? ({} as ApolloClient<any>), | ||
}); | ||
|
||
const syncRemoteTableSchemaChanges = useCallback( | ||
async (input: RemoteTableInput) => { | ||
const remoteTable = await mutate({ | ||
variables: { | ||
input, | ||
}, | ||
update: (cache, { data }) => { | ||
if (isDefined(data)) { | ||
modifyRemoteTableFromCache({ | ||
cache: cache, | ||
remoteTableName: input.name, | ||
fieldModifiers: { | ||
schemaPendingUpdates: () => | ||
data.syncRemoteTableSchemaChanges.schemaPendingUpdates || [], | ||
}, | ||
}); | ||
} | ||
}, | ||
}); | ||
|
||
return remoteTable; | ||
}, | ||
[mutate], | ||
); | ||
|
||
return { | ||
syncRemoteTableSchemaChanges, | ||
isLoading: mutationInformation.loading, | ||
}; | ||
}; |
Oops, something went wrong.