feat(frontend): Track batch export configuration changes (#25735)

Co-authored-by: github-actions <41898282+github-actions[bot]@users.noreply.github.com>
PostHog · Oct 23, 2024 · 0dcf1e8 · 0dcf1e8
1 parent 86c1868
commit 0dcf1e8
Show file tree

Hide file tree

Showing 4 changed files with 48 additions and 22 deletions.
diff --git a/frontend/__snapshots__/exporter-exporter--trends-line-insight-detailed--dark.png b/frontend/__snapshots__/exporter-exporter--trends-line-insight-detailed--dark.png
diff --git a/frontend/__snapshots__/exporter-exporter--trends-line-insight-detailed--light.png b/frontend/__snapshots__/exporter-exporter--trends-line-insight-detailed--light.png
diff --git a/frontend/src/scenes/pipeline/PipelineBatchExportConfiguration.tsx b/frontend/src/scenes/pipeline/PipelineBatchExportConfiguration.tsx
@@ -16,7 +16,7 @@ import { BATCH_EXPORT_SERVICE_NAMES, BatchExportService } from '~/types'
 import { BatchExportGeneralEditFields, BatchExportsEditFields } from './batch-exports/BatchExportEditForm'
 import { BatchExportConfigurationForm } from './batch-exports/types'
 import { humanizeBatchExportName } from './batch-exports/utils'
-import { pipelineBatchExportConfigurationLogic } from './pipelineBatchExportConfigurationLogic'
+import { getDefaultConfiguration, pipelineBatchExportConfigurationLogic } from './pipelineBatchExportConfigurationLogic'
 import { RenderBatchExportIcon } from './utils'
 
 export function PipelineBatchExportConfiguration({ service, id }: { service?: string; id?: string }): JSX.Element {
@@ -50,7 +50,11 @@ export function PipelineBatchExportConfiguration({ service, id }: { service?: st
             <LemonButton
                 type="secondary"
                 htmlType="reset"
-                onClick={() => resetConfiguration(savedConfiguration || {})}
+                onClick={() =>
+                    isNew && service
+                        ? resetConfiguration(getDefaultConfiguration(service))
+                        : resetConfiguration(savedConfiguration)
+                }
                 disabledReason={
                     !configurationChanged ? 'No changes' : isConfigurationSubmitting ? 'Saving in progress…' : undefined
                 }
@@ -62,6 +66,13 @@ export function PipelineBatchExportConfiguration({ service, id }: { service?: st
                 htmlType="submit"
                 onClick={submitConfiguration}
                 loading={isConfigurationSubmitting}
+                disabledReason={
+                    !configurationChanged
+                        ? 'No changes to save'
+                        : isConfigurationSubmitting
+                        ? 'Saving in progress…'
+                        : undefined
+                }
             >
                 {isNew ? 'Create' : 'Save'}
             </LemonButton>

diff --git a/frontend/src/scenes/pipeline/pipelineBatchExportConfigurationLogic.tsx b/frontend/src/scenes/pipeline/pipelineBatchExportConfigurationLogic.tsx
@@ -9,7 +9,6 @@ import { urls } from 'scenes/urls'
 import { DatabaseSchemaBatchExportTable } from '~/queries/schema'
 import { BatchExportConfiguration, BatchExportService, PipelineNodeTab, PipelineStage } from '~/types'
 
-import { BatchExportConfigurationForm } from './batch-exports/types'
 import { humanizeBatchExportName } from './batch-exports/utils'
 import { pipelineDestinationsLogic } from './destinations/destinationsLogic'
 import { pipelineAccessLogic } from './pipelineAccessLogic'
@@ -31,9 +30,9 @@ function getConfigurationFromBatchExportConfig(batchExportConfig: BatchExportCon
     }
 }
 
-function getDefaultConfiguration(service: BatchExportService['type']): Record<string, any> {
+export function getDefaultConfiguration(service: string): Record<string, any> {
     return {
-        name: humanizeBatchExportName(service),
+        name: humanizeBatchExportName(service as BatchExportService['type']),
         destination: service,
         model: 'events',
         paused: true,
@@ -209,7 +208,7 @@ export const pipelineBatchExportConfigurationLogic = kea<pipelineBatchExportConf
         setSavedConfiguration: (configuration: Record<string, any>) => ({ configuration }),
         setSelectedModel: (model: string) => ({ model }),
     }),
-    loaders(({ props, values }) => ({
+    loaders(({ props, values, actions }) => ({
         batchExportConfig: [
             null as BatchExportConfiguration | null,
             {
@@ -248,6 +247,8 @@ export const pipelineBatchExportConfigurationLogic = kea<pipelineBatchExportConf
                         return res
                     }
                     const res = await api.batchExports.create(data)
+                    actions.resetConfiguration(getConfigurationFromBatchExportConfig(res))
+
                     router.actions.replace(
                         urls.pipelineNode(PipelineStage.Destination, res.id, PipelineNodeTab.Configuration)
                     )
@@ -296,7 +297,7 @@ export const pipelineBatchExportConfigurationLogic = kea<pipelineBatchExportConf
             },
         ],
         configuration: [
-            props.service ? getDefaultConfiguration(props.service) : ({} as BatchExportConfigurationForm),
+            props.service ? getDefaultConfiguration(props.service) : ({} as Record<string, any>),
             {
                 loadBatchExportConfigSuccess: (state, { batchExportConfig }) => {
                     if (!batchExportConfig) {
@@ -309,28 +310,33 @@ export const pipelineBatchExportConfigurationLogic = kea<pipelineBatchExportConf
                     if (!batchExportConfig) {
                         return state
                     }
+
                     return getConfigurationFromBatchExportConfig(batchExportConfig)
                 },
             },
         ],
-    })),
-    selectors(() => ({
-        service: [(s, p) => [s.batchExportConfig, p.service], (config, service) => config?.destination.type || service],
         savedConfiguration: [
-            (s, p) => [s.batchExportConfig, p.service],
-            (batchExportConfig, service) => {
-                if (!batchExportConfig || !service) {
-                    return {}
-                }
-                if (batchExportConfig) {
+            {} as Record<string, any>,
+            {
+                loadBatchExportConfigSuccess: (state, { batchExportConfig }) => {
+                    if (!batchExportConfig) {
+                        return state
+                    }
+
                     return getConfigurationFromBatchExportConfig(batchExportConfig)
-                }
-                if (service) {
-                    return getDefaultConfiguration(service)
-                }
-                return {} as Record<string, any>
+                },
+                updateBatchExportConfigSuccess: (state, { batchExportConfig }) => {
+                    if (!batchExportConfig) {
+                        return state
+                    }
+
+                    return getConfigurationFromBatchExportConfig(batchExportConfig)
+                },
             },
         ],
+    })),
+    selectors(() => ({
+        service: [(s, p) => [s.batchExportConfig, p.service], (config, service) => config?.destination.type || service],
         isNew: [(_, p) => [p.id], (id): boolean => !id],
         requiredFields: [
             (s) => [s.service, s.isNew],
@@ -393,6 +399,11 @@ export const pipelineBatchExportConfigurationLogic = kea<pipelineBatchExportConf
             if (!batchExportConfig) {
                 return
             }
+            lemonToast.success('Batch export configuration updated successfully')
+
+            // Reset so that form doesn't think there are unsaved changes.
+            actions.resetConfiguration(getConfigurationFromBatchExportConfig(batchExportConfig))
+
             pipelineDestinationsLogic.findMounted()?.actions.updateBatchExportConfig(batchExportConfig)
         },
         setConfigurationValue: async ({ name, value }) => {
@@ -440,7 +451,11 @@ export const pipelineBatchExportConfigurationLogic = kea<pipelineBatchExportConf
         enabled: () => values.configurationChanged,
         message: 'Leave action?\nChanges you made will be discarded.',
         onConfirm: () => {
-            actions.resetConfiguration()
+            values.batchExportConfig
+                ? actions.resetConfiguration(getConfigurationFromBatchExportConfig(values.batchExportConfig))
+                : values.service
+                ? actions.resetConfiguration(getDefaultConfiguration(values.service))
+                : actions.resetConfiguration()
         },
     })),