feat(cdp): Notify if template updates are available (#24386)

Co-authored-by: github-actions <41898282+github-actions[bot]@users.noreply.github.com>
PostHog · Aug 21, 2024 · f063d4d · f063d4d
1 parent 1024d82
commit f063d4d
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 6 deletions.
diff --git a/frontend/src/scenes/pipeline/hogfunctions/HogFunctionConfiguration.tsx b/frontend/src/scenes/pipeline/hogfunctions/HogFunctionConfiguration.tsx
@@ -1,4 +1,4 @@
-import { IconInfo, IconPlus } from '@posthog/icons'
+import { IconPlus } from '@posthog/icons'
 import {
     LemonBanner,
     LemonButton,
@@ -7,6 +7,7 @@ import {
     LemonInput,
     LemonLabel,
     LemonSwitch,
+    LemonTag,
     LemonTextArea,
     Link,
     SpinnerOverlay,
@@ -51,6 +52,7 @@ export function HogFunctionConfiguration({ templateId, id }: { templateId?: stri
         sparkline,
         sparklineLoading,
         template,
+        templateHasChanged,
     } = useValues(logic)
     const {
         submitConfiguration,
@@ -211,16 +213,19 @@ export function HogFunctionConfiguration({ templateId, id }: { templateId?: stri
                                                     <div className="flex-1">
                                                         <LemonButton>Close</LemonButton>
                                                     </div>
-                                                    <LemonButton onClick={() => resetToTemplate()}>
-                                                        Reset to template
-                                                    </LemonButton>
 
                                                     <LemonButton
                                                         type="secondary"
                                                         onClick={() => duplicateFromTemplate()}
                                                     >
                                                         New function from template
                                                     </LemonButton>
+
+                                                    {templateHasChanged ? (
+                                                        <LemonButton type="primary" onClick={() => resetToTemplate()}>
+                                                            Update
+                                                        </LemonButton>
+                                                    ) : null}
                                                 </div>
                                             </div>
                                         }
@@ -229,7 +234,10 @@ export function HogFunctionConfiguration({ templateId, id }: { templateId?: stri
                                             <Link subtle className="flex items-center gap-1 flex-wrap p-2">
                                                 Built from template:
                                                 <span className="font-semibold">{hogFunction?.template.name}</span>
-                                                <DestinationTag status={hogFunction.template.status} /> <IconInfo />
+                                                <DestinationTag status={hogFunction.template.status} />
+                                                {templateHasChanged ? (
+                                                    <LemonTag type="success">Update available!</LemonTag>
+                                                ) : null}
                                             </Link>
                                         </div>
                                     </LemonDropdown>

diff --git a/frontend/src/scenes/pipeline/hogfunctions/hogFunctionConfigurationLogic.tsx b/frontend/src/scenes/pipeline/hogfunctions/hogFunctionConfigurationLogic.tsx
@@ -487,6 +487,13 @@ export const hogFunctionConfigurationLogic = kea<hogFunctionConfigurationLogicTy
             },
             { resultEqualityCheck: equal },
         ],
+
+        templateHasChanged: [
+            (s) => [s.hogFunction, s.configuration],
+            (hogFunction, configuration) => {
+                return hogFunction?.template?.hog && hogFunction.template.hog !== configuration.hog
+            },
+        ],
     })),
 
     listeners(({ actions, values, cache }) => ({
@@ -583,8 +590,9 @@ export const hogFunctionConfigurationLogic = kea<hogFunctionConfigurationLogicTy
                     name: values.configuration.name,
                     description: values.configuration.description,
                     inputs,
-                    enabled: false,
                 })
+
+                lemonToast.success('Template updates applied but not saved.')
             }
         },
         setConfigurationValue: () => {