Track room list sorting algorithm changes (#32556)

* Update analytics package

* Add method for tracking event

* Track event on resort

* Add test

* Fix lint

src/PosthogTrackers.ts

@@ -10,10 +10,12 @@ import { PureComponent, type SyntheticEvent } from "react";
 import { type WebScreen as ScreenEvent } from "@matrix-org/analytics-events/types/typescript/WebScreen";
 import { type Interaction as InteractionEvent } from "@matrix-org/analytics-events/types/typescript/Interaction";
 import { type PinUnpinAction } from "@matrix-org/analytics-events/types/typescript/PinUnpinAction";
+import { type RoomListSortingAlgorithmChanged } from "@matrix-org/analytics-events/types/typescript/RoomListSortingAlgorithmChanged";
 
 import PageType from "./PageTypes";
 import Views from "./Views";
 import { PosthogAnalytics } from "./PosthogAnalytics";
+import { SortingAlgorithm } from "./stores/room-list-v3/skip-list/sorters";
 
 export type ScreenName = ScreenEvent["$current_url"];
 export type InteractionName = InteractionEvent["name"];
@@ -38,6 +40,12 @@ const loggedInPageTypeMap: Record<PageType | string, ScreenName> = {
     [PageType.UserView]: "User",
 };
 
+const SortingAlgorithmMap: Record<SortingAlgorithm, RoomListSortingAlgorithmChanged["newAlgorithm"]> = {
+    [SortingAlgorithm.Recency]: "Activity",
+    [SortingAlgorithm.Unread]: "Unread",
+    [SortingAlgorithm.Alphabetic]: "Alphabetic",
+};
+
 export default class PosthogTrackers {
     private static internalInstance: PosthogTrackers;
 
@@ -112,6 +120,22 @@ export default class PosthogTrackers {
             from,
         });
     }
+
+    /**
+     * Track when the user chooses a different sorting algorithm for the room-list.
+     * @param oldAlgorithm - The old algorithm.
+     * @param newAlgorithm - The new algorithm.
+     */
+    public static trackRoomListSortingAlgorithmChange(
+        oldAlgorithm: SortingAlgorithm,
+        newAlgorithm: SortingAlgorithm,
+    ): void {
+        PosthogAnalytics.instance.trackEvent<RoomListSortingAlgorithmChanged>({
+            eventName: "RoomListSortingAlgorithmChanged",
+            oldAlgorithm: SortingAlgorithmMap[oldAlgorithm],
+            newAlgorithm: SortingAlgorithmMap[newAlgorithm],
+        });
+    }
 }
 
 export class PosthogScreenTracker extends PureComponent<{ screenName: ScreenName }> {

src/viewmodels/room-list/RoomListHeaderViewModel.ts

@@ -170,20 +170,26 @@ export class RoomListHeaderViewModel
     };
 
     public sort = (option: SortOption): void => {
-        let sortingAlgorithm: SortingAlgorithm;
+        const oldSortingAlgorithm = RoomListStoreV3.instance.activeSortAlgorithm;
+        let newSortingAlgorithm: SortingAlgorithm;
         switch (option) {
             case "alphabetical":
-                sortingAlgorithm = SortingAlgorithm.Alphabetic;
+                newSortingAlgorithm = SortingAlgorithm.Alphabetic;
                 break;
             case "recent":
-                sortingAlgorithm = SortingAlgorithm.Recency;
+                newSortingAlgorithm = SortingAlgorithm.Recency;
                 break;
             case "unread-first":
-                sortingAlgorithm = SortingAlgorithm.Unread;
+                newSortingAlgorithm = SortingAlgorithm.Unread;
                 break;
         }
-        RoomListStoreV3.instance.resort(sortingAlgorithm);
+        RoomListStoreV3.instance.resort(newSortingAlgorithm);
         this.snapshot.merge({ activeSortOption: option });
+
+        // Record analytics for this action
+        if (oldSortingAlgorithm) {
+            PosthogTrackers.trackRoomListSortingAlgorithmChange(oldSortingAlgorithm, newSortingAlgorithm);
+        }
     };
 
     public toggleMessagePreview = (): void => {