feat: add click tracking to onboarding tasks

Adds interaction tracking to explore room, send DM and create room events in onboarding view and elsewhere

Author: justjanne

src/components/structures/HomePage.tsx

@@ -34,13 +34,15 @@ import Analytics from "../../Analytics";
 import PosthogTrackers from "../../PosthogTrackers";
 import EmbeddedPage from "./EmbeddedPage";
 
-const onClickSendDm = () => {
+const onClickSendDm = (ev: ButtonEvent) => {
     Analytics.trackEvent('home_page', 'button', 'dm');
+    PosthogTrackers.trackInteraction("WebHomeCreateChatButton", ev);
     dis.dispatch({ action: 'view_create_chat' });
 };
 
-const onClickExplore = () => {
+const onClickExplore = (ev: ButtonEvent) => {
     Analytics.trackEvent('home_page', 'button', 'room_directory');
+    PosthogTrackers.trackInteraction("WebHomeExploreRoomsButton", ev);
     dis.fire(Action.ViewRoomDirectory);
 };
 

src/components/structures/LeftPanel.tsx

@@ -43,6 +43,8 @@ import SettingsStore from "../../settings/SettingsStore";
 import { KeyBindingAction } from "../../accessibility/KeyboardShortcuts";
 import { shouldShowComponent } from "../../customisations/helpers/UIComponents";
 import { UIComponent } from "../../settings/UIFeature";
+import { ButtonEvent } from "../views/elements/AccessibleButton";
+import PosthogTrackers from "../../PosthogTrackers";
 
 interface IProps {
     isMinimized: boolean;
@@ -116,8 +118,9 @@ export default class LeftPanel extends React.Component<IProps, IState> {
         dis.fire(Action.OpenDialPad);
     };
 
-    private onExplore = () => {
+    private onExplore = (ev: ButtonEvent) => {
         dis.fire(Action.ViewRoomDirectory);
+        PosthogTrackers.trackInteraction("WebLeftPanelExploreRoomsItem", ev);
     };
 
     private refreshStickyHeaders = () => {

src/components/views/rooms/RoomList.tsx

@@ -142,6 +142,7 @@ const DmAuxButton = ({ tabIndex, dispatcher = defaultDispatcher }: IAuxButtonPro
                             e.stopPropagation();
                             closeMenu();
                             defaultDispatcher.dispatch({ action: "view_create_chat" });
+                            PosthogTrackers.trackInteraction("WebRoomListRoomsSublistPlusMenuCreateChatItem", e);
                         }}
                     /> }
                     { showInviteUsers && <IconizedContextMenuOption
@@ -178,7 +179,10 @@ const DmAuxButton = ({ tabIndex, dispatcher = defaultDispatcher }: IAuxButtonPro
     } else if (!activeSpace && showCreateRooms) {
         return <AccessibleTooltipButton
             tabIndex={tabIndex}
-            onClick={() => dispatcher.dispatch({ action: 'view_create_chat' })}
+            onClick={(e) => {
+                dispatcher.dispatch({ action: 'view_create_chat' });
+                PosthogTrackers.trackInteraction("WebRoomListRoomsSublistPlusMenuCreateChatItem", e);
+            }}
             className="mx_RoomSublist_auxButton"
             tooltipClassName="mx_RoomSublist_addRoomTooltip"
             aria-label={_t("Start chat")}
@@ -300,6 +304,7 @@ const UntaggedAuxButton = ({ tabIndex }: IAuxButtonProps) => {
                     e.preventDefault();
                     e.stopPropagation();
                     closeMenu();
+                    PosthogTrackers.trackInteraction("WebRoomListRoomsSublistPlusMenuExploreRoomsItem", e);
                     defaultDispatcher.fire(Action.ViewRoomDirectory);
                 }}
             />
@@ -496,9 +501,10 @@ export default class RoomList extends React.PureComponent<IProps, IState> {
         }
     };
 
-    private onStartChat = () => {
+    private onStartChat = (ev: ButtonEvent) => {
         const initialText = RoomListStore.instance.getFirstNameFilterCondition()?.search;
         defaultDispatcher.dispatch({ action: "view_create_chat", initialText });
+        PosthogTrackers.trackInteraction("WebRoomListRoomsSublistPlusMenuCreateChatItem", ev);
     };
 
     private onExplore = (ev: ButtonEvent) => {
@@ -512,6 +518,7 @@ export default class RoomList extends React.PureComponent<IProps, IState> {
         } else {
             const initialText = RoomListStore.instance.getFirstNameFilterCondition()?.search;
             defaultDispatcher.dispatch({ action: Action.ViewRoomDirectory, initialText });
+            PosthogTrackers.trackInteraction("WebRoomListRoomsSublistPlusMenuExploreRoomsItem", ev);
         }
     };
 

src/components/views/rooms/RoomListHeader.tsx

@@ -297,6 +297,7 @@ const RoomListHeader = ({ onVisibilityChange }: IProps) => {
                         e.preventDefault();
                         e.stopPropagation();
                         defaultDispatcher.dispatch({ action: "view_create_chat" });
+                        PosthogTrackers.trackInteraction("WebRoomListHeaderPlusMenuCreateChatItem", e);
                         closePlusMenu();
                     }}
                 />
@@ -335,6 +336,7 @@ const RoomListHeader = ({ onVisibilityChange }: IProps) => {
                         e.preventDefault();
                         e.stopPropagation();
                         defaultDispatcher.dispatch({ action: Action.ViewRoomDirectory });
+                        PosthogTrackers.trackInteraction("WebRoomListHeaderPlusMenuExploreRoomsItem", e);
                         closePlusMenu();
                     }}
                 />