fix(caching): refetch query on update (#3020)

datahub-project · Aug 3, 2021 · ea7952c · ea7952c
1 parent 07bbd50
commit ea7952c
Show file tree

Hide file tree

Showing 5 changed files with 11 additions and 65 deletions.
diff --git a/datahub-web-react/src/app/entity/chart/profile/ChartProfile.tsx b/datahub-web-react/src/app/entity/chart/profile/ChartProfile.tsx
@@ -4,7 +4,7 @@ import { Chart, EntityType, GlobalTags } from '../../../../types.generated';
 import { Ownership as OwnershipView } from '../../shared/Ownership';
 import { EntityProfile } from '../../../shared/EntityProfile';
 import ChartHeader from './ChartHeader';
-import { GetChartDocument, useGetChartQuery, useUpdateChartMutation } from '../../../../graphql/chart.generated';
+import { useGetChartQuery, useUpdateChartMutation } from '../../../../graphql/chart.generated';
 import ChartSources from './ChartSources';
 import ChartDashboards from './ChartDashboards';
 import { Message } from '../../../shared/Message';
@@ -24,18 +24,7 @@ const ENABLED_TAB_TYPES = [TabType.Ownership, TabType.Sources, TabType.Propertie
 export default function ChartProfile({ urn }: { urn: string }) {
     const { loading, error, data } = useGetChartQuery({ variables: { urn } });
     const [updateChart] = useUpdateChartMutation({
-        update(cache, { data: newChart }) {
-            cache.modify({
-                fields: {
-                    chart() {
-                        cache.writeQuery({
-                            query: GetChartDocument,
-                            data: { chart: { ...newChart?.updateChart } },
-                        });
-                    },
-                },
-            });
-        },
+        refetchQueries: () => ['getChart'],
     });
 
     if (error || (!loading && !error && !data)) {

diff --git a/datahub-web-react/src/app/entity/dashboard/profile/DashboardProfile.tsx b/datahub-web-react/src/app/entity/dashboard/profile/DashboardProfile.tsx
@@ -1,10 +1,6 @@
 import { Alert } from 'antd';
 import React from 'react';
-import {
-    GetDashboardDocument,
-    useGetDashboardQuery,
-    useUpdateDashboardMutation,
-} from '../../../../graphql/dashboard.generated';
+import { useGetDashboardQuery, useUpdateDashboardMutation } from '../../../../graphql/dashboard.generated';
 import { Dashboard, EntityType, GlobalTags } from '../../../../types.generated';
 import { Ownership as OwnershipView } from '../../shared/Ownership';
 import { EntityProfile } from '../../../shared/EntityProfile';
@@ -28,18 +24,7 @@ const ENABLED_TAB_TYPES = [TabType.Ownership, TabType.Charts, TabType.Properties
 export default function DashboardProfile({ urn }: { urn: string }) {
     const { loading, error, data } = useGetDashboardQuery({ variables: { urn } });
     const [updateDashboard] = useUpdateDashboardMutation({
-        update(cache, { data: newDashboard }) {
-            cache.modify({
-                fields: {
-                    dashboard() {
-                        cache.writeQuery({
-                            query: GetDashboardDocument,
-                            data: { dashboard: { ...newDashboard?.updateDashboard } },
-                        });
-                    },
-                },
-            });
-        },
+        refetchQueries: () => ['getDashboard'],
     });
 
     if (error || (!loading && !error && !data)) {

diff --git a/datahub-web-react/src/app/entity/dataFlow/profile/DataFlowProfile.tsx b/datahub-web-react/src/app/entity/dataFlow/profile/DataFlowProfile.tsx
@@ -1,10 +1,6 @@
 import React from 'react';
 import { Alert } from 'antd';
-import {
-    GetDataFlowDocument,
-    useGetDataFlowQuery,
-    useUpdateDataFlowMutation,
-} from '../../../../graphql/dataFlow.generated';
+import { useGetDataFlowQuery, useUpdateDataFlowMutation } from '../../../../graphql/dataFlow.generated';
 import { EntityProfile } from '../../../shared/EntityProfile';
 import { DataFlow, EntityType, GlobalTags } from '../../../../types.generated';
 import DataFlowHeader from './DataFlowHeader';
@@ -29,18 +25,7 @@ export const DataFlowProfile = ({ urn }: { urn: string }): JSX.Element => {
     };
     const { loading, error, data } = useGetDataFlowQuery({ variables: { urn } });
     const [updateDataFlow] = useUpdateDataFlowMutation({
-        update(cache, { data: newDataFlow }) {
-            cache.modify({
-                fields: {
-                    dataFlow() {
-                        cache.writeQuery({
-                            query: GetDataFlowDocument,
-                            data: { dataFlow: { ...newDataFlow?.updateDataFlow } },
-                        });
-                    },
-                },
-            });
-        },
+        refetchQueries: () => ['getDataFlow'],
     });
 
     if (error || (!loading && !error && !data)) {

diff --git a/datahub-web-react/src/app/entity/dataJob/profile/DataJobProfile.tsx b/datahub-web-react/src/app/entity/dataJob/profile/DataJobProfile.tsx
@@ -1,10 +1,6 @@
 import React from 'react';
 import { Alert } from 'antd';
-import {
-    useGetDataJobQuery,
-    GetDataJobDocument,
-    useUpdateDataJobMutation,
-} from '../../../../graphql/dataJob.generated';
+import { useGetDataJobQuery, useUpdateDataJobMutation } from '../../../../graphql/dataJob.generated';
 import { EntityProfile } from '../../../shared/EntityProfile';
 import { DataJob, EntityType, GlobalTags } from '../../../../types.generated';
 import DataJobHeader from './DataJobHeader';
@@ -29,18 +25,7 @@ export const DataJobProfile = ({ urn }: { urn: string }): JSX.Element => {
     const entityRegistry = useEntityRegistry();
     const { loading, error, data } = useGetDataJobQuery({ variables: { urn } });
     const [updateDataJob] = useUpdateDataJobMutation({
-        update(cache, { data: newDataJob }) {
-            cache.modify({
-                fields: {
-                    dataJob() {
-                        cache.writeQuery({
-                            query: GetDataJobDocument,
-                            data: { dataJob: { ...newDataJob?.updateDataJob } },
-                        });
-                    },
-                },
-            });
-        },
+        refetchQueries: () => ['getDataJob'],
     });
 
     if (error || (!loading && !error && !data)) {

diff --git a/datahub-web-react/src/app/entity/dataset/profile/DatasetProfile.tsx b/datahub-web-react/src/app/entity/dataset/profile/DatasetProfile.tsx
@@ -39,7 +39,9 @@ export const DatasetProfile = ({ urn }: { urn: string }): JSX.Element => {
     const { loading, error, data } = useGetDatasetQuery({ variables: { urn } });
 
     const user = useGetAuthenticatedUser();
-    const [updateDataset] = useUpdateDatasetMutation();
+    const [updateDataset] = useUpdateDatasetMutation({
+        refetchQueries: () => ['getDataset'],
+    });
     const isLineageMode = useIsLineageMode();
 
     if (!loading && error) {