From 57bf7e5cad8059f1078d801dc04dc3c73ed92a4a Mon Sep 17 00:00:00 2001
From: Immad Abdul Jabbar <immad.jabbar@wire.com>
Date: Wed, 9 Oct 2024 12:45:55 +0200
Subject: [PATCH] feat: log calling window resize events countly [WPB-11371]
 (#18131)

---
 src/script/calling/CallState.ts     | 13 +++++++++++++
 src/script/tracking/EventName.ts    |  1 +
 src/script/tracking/Segmentation.ts |  4 ++++
 3 files changed, 18 insertions(+)

diff --git a/src/script/calling/CallState.ts b/src/script/calling/CallState.ts
index cbcde08cc47..7fc947bb476 100644
--- a/src/script/calling/CallState.ts
+++ b/src/script/calling/CallState.ts
@@ -35,6 +35,8 @@ import {Call} from './Call';
 
 import {Config} from '../Config';
 import type {ElectronDesktopCapturerSource} from '../media/MediaDevicesHandler';
+import {EventName} from '../tracking/EventName';
+import {Segmentation} from '../tracking/Segmentation';
 import {CallViewTab} from '../view_model/CallingViewModel';
 
 export enum MuteState {
@@ -78,6 +80,7 @@ export class CallState {
   public readonly detachedWindow = ko.observable<Window | null>(null);
   public readonly detachedWindowCallQualifiedId = ko.observable<QualifiedId | null>(null);
   public readonly desktopScreenShareMenu = ko.observable<DesktopScreenShareMenu>(DesktopScreenShareMenu.NONE);
+  private currentViewMode = this.viewMode();
 
   constructor() {
     this.joinedCall = ko.pureComputed(() => this.calls().find(call => call.state() === CALL_STATE.MEDIA_ESTAB));
@@ -99,6 +102,16 @@ export class CallState {
     this.hasAvailableScreensToShare = ko.pureComputed(
       () => this.selectableScreens().length > 0 || this.selectableWindows().length > 0,
     );
+
+    // Capture the viewMode value before change
+    this.viewMode.subscribe(newVal => (this.currentViewMode = newVal), this, 'beforeChange');
+
+    this.viewMode.subscribe(() => {
+      amplify.publish(WebAppEvents.ANALYTICS.EVENT, EventName.UI.CALLING_UI_SIZE, {
+        [Segmentation.CALLING_UI_SIZE.FROM]: this.currentViewMode,
+        [Segmentation.CALLING_UI_SIZE.TO]: this.viewMode(),
+      });
+    });
   }
 
   onPageHide = (event: PageTransitionEvent) => {
diff --git a/src/script/tracking/EventName.ts b/src/script/tracking/EventName.ts
index 4ac90763f3e..c6b0ebbdc84 100644
--- a/src/script/tracking/EventName.ts
+++ b/src/script/tracking/EventName.ts
@@ -36,6 +36,7 @@ export const EventName = {
     FAILED_MESSAGE_DECRYPTION: 'e2ee.failed_message_decryption',
   },
   UI: {
+    CALLING_UI_SIZE: 'ui.calling_ui_size',
     SIDEBAR_COLLAPSE: 'ui.sidebar_collapse',
     SIDEBAR_UNCOLLAPSE: 'ui.sidebar_uncollapse',
   },
diff --git a/src/script/tracking/Segmentation.ts b/src/script/tracking/Segmentation.ts
index 8e0f4215a1c..4b4299e4acf 100644
--- a/src/script/tracking/Segmentation.ts
+++ b/src/script/tracking/Segmentation.ts
@@ -55,4 +55,8 @@ export const Segmentation = {
     DIRECTION: 'screen_share_direction',
     DURATION: 'screen_share_duration',
   },
+  CALLING_UI_SIZE: {
+    FROM: 'from',
+    TO: 'to',
+  },
 };