send actions as breadcrumbs to sentry (codesandbox#3117)

Author: christianalfoni

packages/app/src/app/index.js

@@ -11,12 +11,14 @@ import {
   initializeSentry,
   logError,
 } from '@codesandbox/common/lib/utils/analytics';
+import { logBreadcrumb } from '@codesandbox/common/lib/utils/analytics/sentry';
 import _debug from '@codesandbox/common/lib/utils/debug';
 import {
   convertTypeToStatus,
   notificationState,
 } from '@codesandbox/common/lib/utils/notifications';
 import { isSafari } from '@codesandbox/common/lib/utils/platform';
+import { Severity } from '@sentry/browser';
 import { client } from 'app/graphql/client';
 import history from 'app/utils/history';
 import { createOvermind } from 'overmind';
@@ -43,16 +45,6 @@ window.addEventListener('unhandledrejection', e => {
   }
 });
 
-if (process.env.NODE_ENV === 'production') {
-  try {
-    initializeSentry(
-      'https://[email protected]/155188'
-    );
-  } catch (error) {
-    console.error(error);
-  }
-}
-
 window.__isTouch = !matchMedia('(pointer:fine)').matches;
 
 const overmind = createOvermind(config, {
@@ -66,6 +58,48 @@ const overmind = createOvermind(config, {
   logProxies: true,
 });
 
+if (process.env.NODE_ENV === 'production') {
+  const ignoredOvermindActions = [
+    'onInitialize',
+    'server.onCodeSandboxAPIMessage',
+    'track',
+    'editor.previewActionReceived',
+    'live.onSelectionChanged',
+  ];
+
+  try {
+    initializeSentry(
+      'https://[email protected]/155188'
+    );
+
+    overmind.eventHub.on('action:start', event => {
+      if (ignoredOvermindActions.includes(event.actionName)) {
+        return;
+      }
+
+      // We try as the payload might cause a stringify error
+      try {
+        logBreadcrumb({
+          category: 'overmind-action',
+          message: event.actionName,
+          level: Severity.Info,
+          data: {
+            value: JSON.stringify(event.value),
+          },
+        });
+      } catch (e) {
+        logBreadcrumb({
+          category: 'overmind-action',
+          message: event.actionName,
+          level: Severity.Info,
+        });
+      }
+    });
+  } catch (error) {
+    console.error(error);
+  }
+}
+
 /*
   Temporary global functions to grab state and actions, related to old
   Cerebral implementation

packages/common/src/utils/analytics/sentry.ts

@@ -1,4 +1,5 @@
 import { Breadcrumb } from '@sentry/browser';
+
 import VERSION from '../../version';
 import { DO_NOT_TRACK_ENABLED } from './utils';
 
@@ -35,6 +36,7 @@ export async function initialize(dsn: string) {
         "undefined is not an object (evaluating 'window.__pad.performLoop')", // Only happens on Safari, but spams our servers. Doesn't break anything
       ],
       whitelistUrls: [/https?:\/\/((uploads|www)\.)?codesandbox\.io/],
+      maxBreadcrumbs: 20,
       /**
        * Don't send messages from the sandbox, so don't send from eg.
        * new.codesandbox.io or new.csb.app