add additional telemetry tracking (#1220)

* add additional telemetry tracking

* add additional telemetry tracking

* update name of event

* update logging

* remove log lines

mattermost-plugin/webapp/src/index.tsx

@@ -19,7 +19,7 @@ import GlobalHeader from '../../../webapp/src/components/globalHeader/globalHead
 import FocalboardIcon from '../../../webapp/src/widgets/icons/logo'
 import {setMattermostTheme} from '../../../webapp/src/theme'
 
-import TelemetryClient from '../../../webapp/src/telemetry/telemetryClient'
+import TelemetryClient, {TelemetryCategory, TelemetryActions} from '../../../webapp/src/telemetry/telemetryClient'
 
 import '../../../webapp/src/styles/focalboard-variables.scss'
 import '../../../webapp/src/styles/main.scss'
@@ -138,6 +138,7 @@ export default class Plugin {
             windowAny.frontendBaseURL = subpath + '/boards'
             const goToFocalboardWorkspace = () => {
                 const currentChannel = mmStore.getState().entities.channels.currentChannelId
+                TelemetryClient.trackEvent(TelemetryCategory, TelemetryActions.ClickChannelHeader, {workspaceID: currentChannel})
                 window.open(`${windowAny.frontendBaseURL}/workspace/${currentChannel}`, '_blank', 'noopener')
             }
             this.channelHeaderButtonId = registry.registerChannelHeaderButtonAction(<FocalboardIcon/>, goToFocalboardWorkspace, '', 'Boards')

webapp/src/blocks/board.ts

@@ -2,6 +2,8 @@
 // See LICENSE.txt for license information.
 import {Utils} from '../utils'
 
+import TelemetryClient, {TelemetryCategory, TelemetryActions} from '../telemetry/telemetryClient'
+
 import {Block, createBlock} from './block'
 import {Card} from './card'
 
@@ -57,6 +59,7 @@ function createBoard(block?: Block): Board {
             }
         })
     }
+    TelemetryClient.trackEvent(TelemetryCategory, TelemetryActions.CreateBoard, {isTemplate: block?.fields.isTemplate || false})
 
     return {
         ...createBlock(block),

webapp/src/blocks/boardView.ts

@@ -1,6 +1,8 @@
 // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
 // See LICENSE.txt for license information.
 
+import TelemetryClient, {TelemetryCategory, TelemetryActions} from '../telemetry/telemetryClient'
+
 import {Block, createBlock} from './block'
 import {FilterGroup, createFilterGroup} from './filterGroup'
 
@@ -26,6 +28,7 @@ type BoardView = Block & {
 }
 
 function createBoardView(block?: Block): BoardView {
+    TelemetryClient.trackEvent(TelemetryCategory, TelemetryActions.CreateBoardView, {viewType: block?.fields.viewType || 'board'})
     return {
         ...createBlock(block),
         type: 'view',

webapp/src/components/cardDetail/cardDetail.tsx

@@ -14,6 +14,7 @@ import Button from '../../widgets/buttons/button'
 import {Focusable} from '../../widgets/editable'
 import EditableArea from '../../widgets/editableArea'
 import EmojiIcon from '../../widgets/icons/emoji'
+import TelemetryClient, {TelemetryCategory, TelemetryActions} from '../../telemetry/telemetryClient'
 
 import BlockIconSelector from '../blockIconSelector'
 
@@ -56,6 +57,7 @@ const CardDetail = (props: Props): JSX.Element|null => {
         if (!title) {
             titleRef.current?.focus()
         }
+        TelemetryClient.trackEvent(TelemetryCategory, TelemetryActions.ViewCard, {card: card.id})
     }, [])
 
     useEffect(() => {

webapp/src/components/centerPanel.tsx

@@ -19,7 +19,7 @@ import {updateView} from '../store/views'
 
 import './centerPanel.scss'
 
-import TelemetryClient from '../../../webapp/src/telemetry/telemetryClient'
+import TelemetryClient, {TelemetryCategory, TelemetryActions} from '../../../webapp/src/telemetry/telemetryClient'
 
 import CardDialog from './cardDialog'
 import RootPortal from './rootPortal'
@@ -84,7 +84,7 @@ class CenterPanel extends React.Component<Props, State> {
     }
 
     componentDidMount(): void {
-        TelemetryClient.trackEvent('boards', 'view', {viewType: this.props.activeView.fields.viewType})
+        TelemetryClient.trackEvent(TelemetryCategory, TelemetryActions.ViewBoard, {viewType: this.props.activeView.fields.viewType})
     }
 
     constructor(props: Props) {
@@ -100,7 +100,7 @@ class CenterPanel extends React.Component<Props, State> {
     }
 
     componentDidUpdate(): void {
-        TelemetryClient.trackEvent('boards', 'view', {viewType: this.props.activeView.fields.viewType})
+        TelemetryClient.trackEvent(TelemetryCategory, TelemetryActions.ViewBoard, {viewType: this.props.activeView.fields.viewType})
     }
 
     render(): JSX.Element {

webapp/src/components/sidebar/boardTemplateMenuItem.tsx

@@ -11,6 +11,7 @@ import EditIcon from '../../widgets/icons/edit'
 import OptionsIcon from '../../widgets/icons/options'
 import Menu from '../../widgets/menu'
 import MenuWrapper from '../../widgets/menuWrapper'
+import TelemetryClient, {TelemetryCategory, TelemetryActions} from '../../telemetry/telemetryClient'
 
 type Props = {
     boardTemplate: Board
@@ -32,6 +33,7 @@ const addBoardFromTemplate = async (intl: IntlShape, showBoard: (id: string) =>
     const asTemplate = false
     const actionDescription = intl.formatMessage({id: 'Mutator.new-board-from-template', defaultMessage: 'new board from template'})
 
+    TelemetryClient.trackEvent(TelemetryCategory, TelemetryActions.CreateBoardViaTemplate, {boardTemplateId})
     if (global) {
         await mutator.duplicateFromRootBoard(boardTemplateId, actionDescription, asTemplate, afterRedo, beforeUndo)
     } else {

webapp/src/mutator.ts

@@ -11,6 +11,7 @@ import {OctoUtils} from './octoUtils'
 import undoManager from './undomanager'
 import {Utils} from './utils'
 import {UserSettings} from './userSettings'
+import TelemetryClient, {TelemetryCategory, TelemetryActions} from './telemetry/telemetryClient'
 
 //
 // The Mutator is used to make all changes to server state
@@ -381,6 +382,7 @@ class Mutator {
             delete newCard.fields.properties[propertyId]
         }
         await this.updateBlock(newCard, card, description)
+        TelemetryClient.trackEvent(TelemetryCategory, TelemetryActions.EditCardProperty, {card: card.id})
     }
 
     async changePropertyTypeAndName(board: Board, cards: Card[], propertyTemplate: IPropertyTemplate, newType: PropertyType, newName: string) {

webapp/src/telemetry/telemetryClient.ts

@@ -4,6 +4,18 @@ import {IUser} from '../user'
 
 import {TelemetryHandler} from './telemetry'
 
+export const TelemetryCategory = 'boards'
+
+export const TelemetryActions = {
+    ClickChannelHeader: 'clickChannelHeader',
+    CreateBoard: 'createBoard',
+    CreateBoardViaTemplate: 'createBoardViaTemplate',
+    CreateBoardView: 'createBoardView',
+    EditCardProperty: 'editCardProperty',
+    ViewBoard: 'viewBoard',
+    ViewCard: 'viewCard',
+}
+
 class TelemetryClient {
     public telemetryHandler?: TelemetryHandler
     public user?: IUser