NEOS-1681: update koala for unify (#3060)

charts/neosync/README.md

@@ -112,7 +112,7 @@ A Helm chart for Neosync that contains the api, app, and worker
 | api.updateStrategy | string | `nil` | The strategy to use when rolling out new replicas |
 | api.volumeMounts | list | `[]` | Volumes that will be mounted to the deployment |
 | api.volumes | list | `[]` | Volumes that will be attached to the deployment |
-| app.analytics.enabled | bool | `true` | Enables analytics such as Posthog/Koala (if keys have been provided for them) |
+| app.analytics.enabled | bool | `true` | Enables analytics such as Posthog/Unify (if keys have been provided for them) |
 | app.auth.audience | string | `nil` | The audience that should be present in the JWT token |
 | app.auth.clientId | string | `nil` | The client id that will be used by the app to retrieve user tokens |
 | app.auth.clientSecret | string | `nil` | The client secret that will be used by the app |
@@ -137,7 +137,6 @@ A Helm chart for Neosync that contains the api, app, and worker
 | app.ingress.enabled | bool | `false` | Enable this if using K8s ingress to expose the backend to the internet |
 | app.istio.enabled | bool | `false` | Whether or not to apply the default istio annotations/labels to the deployment |
 | app.jobHooks.enabled | bool | `false` | Enables Job Hooks on the frontend. Note: This will only work if it has also been enabled via the backend with a valid license |
-| app.koala.key | string | `nil` | Koala Key |
 | app.nameOverride | string | `nil` | Override the name specified on the Chart, which defaults to .Chart.Name |
 | app.neosyncApi.url | string | `"http://neosync-api"` | The URL to the Neosync API instance |
 | app.neosyncCloud.enabled | bool | `false` | Whether or not this is NeosyncCloud |
@@ -163,6 +162,7 @@ A Helm chart for Neosync that contains the api, app, and worker
 | app.sidecarContainers | list | `[]` | Provide sidecars that will be appended directly to the deployment next to the user-container |
 | app.terminationGracePeriodSeconds | string | `nil` | The amount of time in seconds to wait for the pod to shut down when a termination event has occurred. |
 | app.tolerations | list | `[]` | Any tolerations that should be applied to the deployment |
+| app.unify.key | string | `nil` | Unify Key |
 | app.updateStrategy | string | `nil` | The strategy to use when rolling out new replicas |
 | worker.autoscaling.enabled | bool | `false` | Whether or not to install the HPA autoscaler |
 | worker.autoscaling.maxReplicas | int | `4` | The maximum number of replicas to scale to |

docs/docs/guides/analytics.md

@@ -20,11 +20,11 @@ You can see what information is captured by checking out the [posthog-provider](
 
 Analytics are used simply to get a better view into how people use Neosync.
 
-### Koala
+### Unify
 
-Koala is similar to Posthog in that it is also used to capture user information. We send the same usage information to Koala that we send to Posthog.
+Unify is similar to Posthog in that it is also used to capture user information. We send the same usage information to Unify that we send to Posthog.
 
-You can see what information is captured by checking out the [koala-provider](https://github.com/nucleuscloud/neosync/blob/main/frontend/apps/web/components/providers/koala-provider.tsx) component that wraps each page's React components.
+You can see what information is captured by checking out the [unify-provider](https://github.com/nucleuscloud/neosync/blob/main/frontend/apps/web/components/providers/unify-provider.tsx) component that wraps each page's React components.
 
 ### Disabling Analytics
 

docs/docusaurus.config.ts

@@ -12,9 +12,9 @@ const config: Config = {
     {
       tagName: 'script',
       attributes: {
-        id: 'koala-snippet',
+        id: 'unify-snippet',
 
-        innerHTML: `!function(t){if(window.ko)return;window.ko=[],["identify","track","removeListeners","open","on","off","qualify","ready"].forEach(function(t){ko[t]=function(){var n=[].slice.call(arguments);return n.unshift(t),ko.push(n),ko}});var n=document.createElement("script");n.async=!0,n.setAttribute("src","https://cdn.getkoala.com/v1/pk_4fa92236b6fe5d23fb878c88c14d209fd48e/sdk.js"),(document.body || document.head).appendChild(n)}();`,
+        innerHTML: `!function(){window.unify||(window.unify=Object.assign([],["identify","page","startAutoPage","stopAutoPage","startAutoIdentify","stopAutoIdentify"].reduce((function(t,e){return t[e]=function(){return unify.push([e,[].slice.call(arguments)]),unify},t}),{})));var t=document.createElement("script");t.async=!0,t.setAttribute("src","https://tag.unifyintent.com/v1/3bzXn1sjuq1cb6wQF3Cp86/script.js"),t.setAttribute("data-api-key","${process.env.UNIFY_KEY}"),t.setAttribute("id","unifytag"),(document.body||document.head).appendChild(t)}();`,
       },
     },
   ],

frontend/apps/web/app/BaseLayout.tsx

@@ -2,10 +2,10 @@ import SiteFooter from '@/components/SiteFooter';
 import WelcomeDialog from '@/components/onboarding-checklist/WelcomeDialog';
 import AccountProvider from '@/components/providers/account-provider';
 import ConnectProvider from '@/components/providers/connect-provider';
-import { KoalaIdentifier } from '@/components/providers/koala-provider';
 import { PostHogIdentifier } from '@/components/providers/posthog-provider';
 import TanstackQueryProvider from '@/components/providers/query-provider';
 import { SessionProvider } from '@/components/providers/session-provider';
+import { UnifyIdentifier } from '@/components/providers/unify-provider';
 import SiteHeader from '@/components/site-header/SiteHeader';
 import { Toaster } from '@/components/ui/sonner';
 import { ReactElement, ReactNode, Suspense } from 'react';
@@ -29,7 +29,7 @@ export default async function BaseLayout(props: Props): Promise<ReactElement> {
               <PostHogIdentifier />
             </Suspense>
             <Suspense>
-              <KoalaIdentifier />
+              <UnifyIdentifier />
             </Suspense>
             <div className="relative flex min-h-screen flex-col">
               <SiteHeader />

frontend/apps/web/app/api/config/config.ts

@@ -18,9 +18,9 @@ export function getSystemAppConfig(): SystemAppConfig {
       host: process.env.POSTHOG_HOST ?? 'https://app.posthog.com',
       key: process.env.POSTHOG_KEY,
     },
-    koala: {
-      enabled: isAnalyticsEnabled() && !!process.env.KOALA_KEY,
-      key: process.env.KOALA_KEY,
+    unify: {
+      enabled: isAnalyticsEnabled() && !!process.env.UNIFY_KEY,
+      key: process.env.UNIFY_KEY,
     },
     isNeosyncCloud,
     isStripeEnabled: process.env.STRIPE_ENABLED === 'true',

frontend/apps/web/app/config/app-config.ts

@@ -2,7 +2,7 @@ export interface SystemAppConfig {
   isAuthEnabled: boolean;
   publicAppBaseUrl: string;
   posthog: PosthogConfig;
-  koala: KoalaConfig;
+  unify: UnifyConfig;
   isNeosyncCloud: boolean;
   isStripeEnabled: boolean;
   enableRunLogs: boolean;
@@ -27,7 +27,7 @@ interface PosthogConfig {
   host: string;
 }
 
-interface KoalaConfig {
+interface UnifyConfig {
   enabled: boolean;
   key?: string;
 }

frontend/apps/web/app/layout.tsx

@@ -1,10 +1,10 @@
 import '@/app/globals.css';
-import { KoalaScriptProvider } from '@/components/providers/koala-provider';
 import {
   PHProvider,
   PostHogPageview,
 } from '@/components/providers/posthog-provider';
 import { ThemeProvider } from '@/components/providers/theme-provider';
+import { UnifyScriptProvider } from '@/components/providers/unify-provider';
 import { Metadata } from 'next';
 import { ReactElement, Suspense } from 'react';
 import BaseLayout from './BaseLayout';
@@ -35,7 +35,7 @@ export default async function RootLayout({
               <BaseLayout>
                 <>
                   <Suspense>
-                    <KoalaScriptProvider />
+                    <UnifyScriptProvider />
                   </Suspense>
                   <Suspense>
                     <PostHogPageview />

frontend/apps/web/charts/app/README.md

@@ -12,7 +12,7 @@ A Helm chart for the Neosync App
 
 | Key | Type | Default | Description |
 |-----|------|---------|-------------|
-| analytics.enabled | bool | `true` | Enables analytics such as Posthog/Koala (if keys have been provided for them) |
+| analytics.enabled | bool | `true` | Enables analytics such as Posthog/Unify (if keys have been provided for them) |
 | auth.audience | string | `nil` | The audience that should be present in the JWT token |
 | auth.clientId | string | `nil` | The client id that will be used by the app to retrieve user tokens |
 | auth.clientSecret | string | `nil` | The client secret that will be used by the app |
@@ -37,7 +37,6 @@ A Helm chart for the Neosync App
 | ingress.enabled | bool | `false` | Enable this if using K8s ingress to expose the backend to the internet |
 | istio.enabled | bool | `false` | Whether or not to apply the default istio annotations/labels to the deployment |
 | jobHooks.enabled | bool | `false` | Enables Job Hooks on the frontend. Note: This will only work if it has also been enabled via the backend with a valid license |
-| koala.key | string | `nil` | Koala Key |
 | nameOverride | string | `nil` | Override the name specified on the Chart, which defaults to .Chart.Name |
 | neosyncApi.url | string | `"http://neosync-api"` | The URL to the Neosync API instance |
 | neosyncCloud.enabled | bool | `false` | Whether or not this is NeosyncCloud |
@@ -63,4 +62,5 @@ A Helm chart for the Neosync App
 | sidecarContainers | list | `[]` | Provide sidecars that will be appended directly to the deployment next to the user-container |
 | terminationGracePeriodSeconds | string | `nil` | The amount of time in seconds to wait for the pod to shut down when a termination event has occurred. |
 | tolerations | list | `[]` | Any tolerations that should be applied to the deployment |
+| unify.key | string | `nil` | Unify Key |
 | updateStrategy | string | `nil` | The strategy to use when rolling out new replicas |

frontend/apps/web/charts/app/templates/_helpers.tpl

@@ -133,8 +133,8 @@ POSTHOG_KEY: {{ .Values.posthog.key }}
 {{- if and .Values.posthog .Values.posthog.host }}
 POSTHOG_HOST: {{ .Values.posthog.host }}
 {{- end }}
-{{- if and .Values.koala .Values.koala.key }}
-KOALA_KEY: {{ .Values.koala.key }}
+{{- if and .Values.unify .Values.unify.key }}
+UNIFY_KEY: {{ .Values.unify.key }}
 {{- end }}
 NEOSYNC_CLOUD: {{ .Values.neosyncCloud.enabled | default "false" | quote }}
 ENABLE_RUN_LOGS: {{ .Values.enableRunLogs | default "false" | quote }}

frontend/apps/web/charts/app/values.yaml

@@ -117,16 +117,16 @@ ingress:
   enabled: false
 
 analytics:
-  # -- Enables analytics such as Posthog/Koala (if keys have been provided for them)
+  # -- Enables analytics such as Posthog/Unify (if keys have been provided for them)
   enabled: true
 
 posthog:
   # -- Posthog Key
   key: phc_qju45RhNvCDwYVdRyUjtWuWsOmLFaQZi3fmztMBaJip
   # host:
 
-koala:
-  # -- Koala Key
+unify:
+  # -- Unify Key
   key:
 
 # -- Any tolerations that should be applied to the deployment

frontend/apps/web/components/providers/koala-provider.tsx → frontend/apps/web/components/providers/unify-provider.tsx

@@ -6,29 +6,29 @@ import Script from 'next/script';
 import { ReactElement, useEffect } from 'react';
 import { useAccount } from './account-provider';
 
-export function KoalaScriptProvider(): ReactElement {
+export function UnifyScriptProvider(): ReactElement {
   const { data: systemAppConfig, isLoading } = useGetSystemAppConfig();
 
   if (
     isLoading ||
-    !systemAppConfig?.koala.enabled ||
-    !systemAppConfig.koala.key
+    !systemAppConfig?.unify.enabled ||
+    !systemAppConfig.unify.key
   ) {
     return <></>;
   }
   return (
     <Script
-      id="koala"
+      id="unify"
       dangerouslySetInnerHTML={{
-        __html: `!function(t){if(window.ko)return;window.ko=[],["identify","track","removeListeners","open","on","off","qualify","ready"].forEach(function(t){ko[t]=function(){var n=[].slice.call(arguments);return n.unshift(t),ko.push(n),ko}});var n=document.createElement("script");n.async=!0,n.setAttribute("src","https://cdn.getkoala.com/v1/${systemAppConfig.koala.key}/sdk.js"),(document.body || document.head).appendChild(n)}();`,
+        __html: `!function(){window.unify||(window.unify=Object.assign([],["identify","page","startAutoPage","stopAutoPage","startAutoIdentify","stopAutoIdentify"].reduce((function(t,e){return t[e]=function(){return unify.push([e,[].slice.call(arguments)]),unify},t}),{})));var t=document.createElement("script");t.async=!0,t.setAttribute("src","https://tag.unifyintent.com/v1/3bzXn1sjuq1cb6wQF3Cp86/script.js"),t.setAttribute("data-api-key","${systemAppConfig.unify.key}"),t.setAttribute("id","unifytag"),(document.body||document.head).appendChild(t)}();`,
       }}
     />
   );
 }
 
 const isBrowser = () => typeof window !== 'undefined';
 
-export function KoalaIdentifier(): ReactElement {
+export function UnifyIdentifier(): ReactElement {
   const { data: systemAppConfig, isLoading: isSystemAppConfigLoading } =
     useGetSystemAppConfig();
   const { data: userData, isLoading: isUserDataLoading } = useNeosyncUser();
@@ -42,8 +42,8 @@ export function KoalaIdentifier(): ReactElement {
       isUserDataLoading ||
       isAccountLoading ||
       isSystemAppConfigLoading ||
-      !systemAppConfig?.koala.enabled ||
-      !systemAppConfig.koala.key ||
+      !systemAppConfig?.unify.enabled ||
+      !systemAppConfig.unify.key ||
       !systemAppConfig.isAuthEnabled ||
       !user?.email
     ) {
@@ -74,8 +74,8 @@ export function KoalaIdentifier(): ReactElement {
     systemAppConfig?.isNeosyncCloud,
     user?.email,
     user?.name,
-    systemAppConfig?.koala.enabled,
-    systemAppConfig?.koala.key,
+    systemAppConfig?.unify.enabled,
+    systemAppConfig?.unify.key,
   ]);
 
   return <></>;