MM-41827 Count preloaded channels on first team load (mattermost#9908)

Co-authored-by: Mattermod <[email protected]>

actions/telemetry_actions.jsx

@@ -30,7 +30,7 @@ export function trackEvent(category, event, props) {
  Client4.trackEvent(category, event, props);
  if (isDevMode() && category === 'performance' && props) {
  // eslint-disable-next-line no-console
- console.log(`${event}: ${props.duration}ms, fresh: ${props.fresh}`);
+ console.log(event + ' - ' + Object.entries(props).map(([key, value]) => `${key}: ${value}`).join(', '));
  }
 }
 

components/data_prefetch/actions.ts

@@ -0,0 +1,33 @@
+// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
+// See LICENSE.txt for license information.
+
+import {Dispatch} from 'redux';
+
+import {getChannelIdsForCurrentTeam} from 'mattermost-redux/selectors/entities/channels';
+
+import {trackEvent} from 'actions/telemetry_actions';
+
+import {GlobalState} from 'types/store';
+
+let isFirstPreload = true;
+
+export function trackPreloadedChannels(prefetchQueueObj: Record<string, string[]>) {
+ return (dispatch: Dispatch, getState: () => GlobalState) => {
+ const state = getState();
+ const channelIdsForTeam = getChannelIdsForCurrentTeam(state);
+
+ trackEvent('performance', 'preloaded_channels', {
+ numHigh: prefetchQueueObj[1]?.length || 0,
+ numMedium: prefetchQueueObj[2]?.length || 0,
+ numLow: prefetchQueueObj[3]?.length || 0,
+
+ numTotal: channelIdsForTeam.length,
+
+ // Tracks whether this is the first team that we've preloaded channels for in this session since
+ // the first preload will likely include DMs and GMs
+ isFirstPreload,
+ });
+
+ isFirstPreload = false;
+ };
+}

components/data_prefetch/data_prefetch.test.tsx

@@ -28,6 +28,7 @@ describe('/components/data_prefetch', () => {
  currentChannelId: '',
  actions: {
  prefetchChannelPosts: jest.fn(() => Promise.resolve({})),
+ trackPreloadedChannels: jest.fn(),
  },
  prefetchQueueObj: {
  1: [],

components/data_prefetch/data_prefetch.tsx

@@ -22,6 +22,7 @@ type Props = {
  unreadChannels: Channel[];
  actions: {
  prefetchChannelPosts: (channelId: string, delay?: number) => Promise<any>;
+ trackPreloadedChannels: (prefetchQueueObj: Record<string, string[]>) => void;
  };
 }
 
@@ -60,6 +61,10 @@ export default class DataPrefetch extends React.PureComponent<Props> {
  await queue.clear();
  this.prefetchData();
  }
+
+ if (currentChannelId && sidebarLoaded && (!prevProps.currentChannelId || !prevProps.sidebarLoaded)) {
+ this.props.actions.trackPreloadedChannels(prefetchQueueObj);
+ }
  }
 
  public prefetchPosts = (channelId: string) => {

components/data_prefetch/index.ts

@@ -12,7 +12,6 @@ import {getMyChannelMemberships} from 'mattermost-redux/selectors/entities/commo
 import {Channel, ChannelMembership} from 'mattermost-redux/types/channels';
 import {PostList} from 'mattermost-redux/types/posts';
 
-import {ActionFunc, GenericAction} from 'mattermost-redux/types/actions';
 import {RelationOneToOne} from 'mattermost-redux/types/utilities';
 
 import {prefetchChannelPosts} from 'actions/views/channel';
@@ -23,10 +22,12 @@ import {GlobalState} from 'types/store';
 
 import {isCollapsedThreadsEnabled} from '../../packages/mattermost-redux/src/selectors/entities/preferences';
 
+import {trackPreloadedChannels} from './actions';
 import DataPrefetch from './data_prefetch';
 
 type Actions = {
  prefetchChannelPosts: (channelId: string, delay?: number) => Promise<{data: PostList}>;
+ trackPreloadedChannels: (prefetchQueueObj: Record<string, string[]>) => void;
 };
 
 enum Priority {
@@ -93,10 +94,11 @@ function mapStateToProps(state: GlobalState) {
  };
 }
 
-function mapDispatchToProps(dispatch: Dispatch<GenericAction>) {
+function mapDispatchToProps(dispatch: Dispatch) {
  return {
- actions: bindActionCreators<ActionCreatorsMapObject<ActionFunc>, Actions>({
+ actions: bindActionCreators<ActionCreatorsMapObject, Actions>({
  prefetchChannelPosts,
+ trackPreloadedChannels,
  }, dispatch),
  };
 }