From 4eecba36876d9cf045367c9603ebc46ca399790d Mon Sep 17 00:00:00 2001 From: Artem Astapenko <3767150+Jamakase@users.noreply.github.com> Date: Tue, 20 Jul 2021 02:14:52 +0300 Subject: [PATCH] Add openreplay (#4685) * Add openreplay * Add env variables for openreplay * Add openreplay env for k8s --- airbyte-webapp/nginx/default.conf.template | 1 + airbyte-webapp/package-lock.json | 8 ++++++++ airbyte-webapp/package.json | 1 + .../src/components/hooks/useOpenReplay.tsx | 16 ++++++++++++++++ airbyte-webapp/src/config/index.ts | 7 +++++++ airbyte-webapp/src/pages/routes.tsx | 5 ++++- kube/overlays/dev/.env | 1 + kube/overlays/stable-with-resource-limits/.env | 1 + kube/overlays/stable/.env | 1 + kube/resources/webapp.yaml | 5 +++++ 10 files changed, 45 insertions(+), 1 deletion(-) create mode 100644 airbyte-webapp/src/components/hooks/useOpenReplay.tsx diff --git a/airbyte-webapp/nginx/default.conf.template b/airbyte-webapp/nginx/default.conf.template index abac94fe7f27..604ae0058b25 100644 --- a/airbyte-webapp/nginx/default.conf.template +++ b/airbyte-webapp/nginx/default.conf.template @@ -19,6 +19,7 @@ server { window.TRACKING_STRATEGY = "$TRACKING_STRATEGY"; window.PAPERCUPS_STORYTIME = "$PAPERCUPS_STORYTIME"; window.FULLSTORY = "$FULLSTORY"; + window.OPENREPLAY = "$OPENREPLAY"; window.AIRBYTE_VERSION = "$AIRBYTE_VERSION"; window.API_URL = "$API_URL"; window.IS_DEMO = "$IS_DEMO"; diff --git a/airbyte-webapp/package-lock.json b/airbyte-webapp/package-lock.json index 5b2b815a604a..c6140d8d7321 100644 --- a/airbyte-webapp/package-lock.json +++ b/airbyte-webapp/package-lock.json @@ -3804,6 +3804,14 @@ } } }, + "@openreplay/tracker": { + "version": "3.0.5", + "resolved": "https://registry.npmjs.org/@openreplay/tracker/-/tracker-3.0.5.tgz", + "integrity": "sha512-hIY7DnQmm7bCe6v+e257WD7OdNuBOWUZ15Q3yUEdyxu7xDNG7brbak9pS97qCt3VY9xGK0RvW/j3ANlRPk8aVg==", + "requires": { + "error-stack-parser": "^2.0.6" + } + }, "@papercups-io/chat-widget": { "version": "1.1.5", "resolved": "https://registry.npmjs.org/@papercups-io/chat-widget/-/chat-widget-1.1.5.tgz", diff --git a/airbyte-webapp/package.json b/airbyte-webapp/package.json index 9efee0199f4d..350930446d09 100644 --- a/airbyte-webapp/package.json +++ b/airbyte-webapp/package.json @@ -16,6 +16,7 @@ "@fortawesome/free-solid-svg-icons": "^5.12.1", "@fortawesome/react-fontawesome": "^0.1.8", "@fullstory/browser": "^1.4.9", + "@openreplay/tracker": "^3.0.5", "@papercups-io/chat-widget": "^1.1.5", "@papercups-io/storytime": "^1.0.6", "@rest-hooks/legacy": "^2.0.5", diff --git a/airbyte-webapp/src/components/hooks/useOpenReplay.tsx b/airbyte-webapp/src/components/hooks/useOpenReplay.tsx new file mode 100644 index 000000000000..7172b308097c --- /dev/null +++ b/airbyte-webapp/src/components/hooks/useOpenReplay.tsx @@ -0,0 +1,16 @@ +import { useMemo } from "react"; +import OpenReplay from "@openreplay/tracker"; + +const useOpenReplay = (projectKey: string): OpenReplay => { + return useMemo(() => { + const tracker = new OpenReplay({ + projectKey: projectKey, + }); + + tracker.start(); + + return tracker; + }, [projectKey]); +}; + +export default useOpenReplay; diff --git a/airbyte-webapp/src/config/index.ts b/airbyte-webapp/src/config/index.ts index 7cd4719d7874..19bcd2d43056 100644 --- a/airbyte-webapp/src/config/index.ts +++ b/airbyte-webapp/src/config/index.ts @@ -6,6 +6,7 @@ declare global { TRACKING_STRATEGY?: string; PAPERCUPS_STORYTIME?: string; FULLSTORY?: string; + OPENREPLAY?: string; AIRBYTE_VERSION?: string; API_URL?: string; IS_DEMO?: string; @@ -32,6 +33,9 @@ type Config = { baseUrl: string; enableStorytime: boolean; }; + openreplay: { + projectKey: string; + }; fullstory: Fullstory.SnippetOptions; apiUrl: string; healthCheckInterval: number; @@ -67,6 +71,9 @@ const config: Config = { baseUrl: "https://app.papercups.io", enableStorytime: window.PAPERCUPS_STORYTIME !== "disabled", }, + openreplay: { + projectKey: window.OPENREPLAY !== "disabled" ? "6611843272536134" : "", + }, fullstory: { orgId: "13AXQ4", devMode: window.FULLSTORY === "disabled", diff --git a/airbyte-webapp/src/pages/routes.tsx b/airbyte-webapp/src/pages/routes.tsx index f1a13fbb07da..ed002619f774 100644 --- a/airbyte-webapp/src/pages/routes.tsx +++ b/airbyte-webapp/src/pages/routes.tsx @@ -26,6 +26,7 @@ import useWorkspace from "components/hooks/services/useWorkspaceHook"; import { AnalyticsService } from "core/analytics/AnalyticsService"; import { useNotificationService } from "components/hooks/services/Notification/NotificationService"; import { useApiHealthPoll } from "components/hooks/services/Health"; +import useOpenReplay from "../components/hooks/useOpenReplay"; export enum Routes { Preferences = "/preferences", @@ -160,15 +161,17 @@ const OnboardingsRoutes = () => { }; export const Routing: React.FC = () => { + useApiHealthPoll(config.healthCheckInterval); useSegment(config.segment.token); useFullStory(config.fullstory); - useApiHealthPoll(config.healthCheckInterval); + const tracker = useOpenReplay(config.openreplay.projectKey); const { workspace } = useWorkspace(); useEffect(() => { if (workspace) { AnalyticsService.identify(workspace.customerId); + tracker.setUserID(workspace.customerId); } }, [workspace]); diff --git a/kube/overlays/dev/.env b/kube/overlays/dev/.env index 6b77c81e531b..0e78f4536f1d 100644 --- a/kube/overlays/dev/.env +++ b/kube/overlays/dev/.env @@ -35,6 +35,7 @@ INTERNAL_API_HOST=airbyte-server-svc:8001 WORKER_ENVIRONMENT=kubernetes PAPERCUPS_STORYTIME=disabled FULLSTORY=disabled +OPENREPLAY=disabled IS_DEMO=false LOG_LEVEL=INFO diff --git a/kube/overlays/stable-with-resource-limits/.env b/kube/overlays/stable-with-resource-limits/.env index fea24ed7be8e..e74606059d49 100644 --- a/kube/overlays/stable-with-resource-limits/.env +++ b/kube/overlays/stable-with-resource-limits/.env @@ -35,6 +35,7 @@ INTERNAL_API_HOST=airbyte-server-svc:8001 WORKER_ENVIRONMENT=kubernetes PAPERCUPS_STORYTIME=enabled FULLSTORY=enabled +OPENREPLAY=enabled IS_DEMO=false LOG_LEVEL=INFO diff --git a/kube/overlays/stable/.env b/kube/overlays/stable/.env index fea24ed7be8e..e74606059d49 100644 --- a/kube/overlays/stable/.env +++ b/kube/overlays/stable/.env @@ -35,6 +35,7 @@ INTERNAL_API_HOST=airbyte-server-svc:8001 WORKER_ENVIRONMENT=kubernetes PAPERCUPS_STORYTIME=enabled FULLSTORY=enabled +OPENREPLAY=enabled IS_DEMO=false LOG_LEVEL=INFO diff --git a/kube/resources/webapp.yaml b/kube/resources/webapp.yaml index 9f973ea5f5e4..ca4487b6e1fe 100644 --- a/kube/resources/webapp.yaml +++ b/kube/resources/webapp.yaml @@ -53,6 +53,11 @@ spec: configMapKeyRef: name: airbyte-env key: FULLSTORY + - name: OPENREPLAY + valueFrom: + configMapKeyRef: + name: airbyte-env + key: OPENREPLAY - name: IS_DEMO valueFrom: configMapKeyRef: