Improve Sentry logging

js/index.js

@@ -1,5 +1,6 @@
 import "babel-polyfill";
 import Raven from "raven-js";
+import createMiddleware from "raven-for-redux";
 import base from "../skins/base-2.91-png.wsz";
 import osx from "../skins/MacOSXAqua1-5.wsz";
 import topaz from "../skins/TopazAmp1-2.wsz";
@@ -8,6 +9,14 @@ import xmms from "../skins/XMMS-Turquoise.wsz";
 import zaxon from "../skins/ZaxonRemake1-0.wsz";
 import green from "../skins/Green-Dimension-V2.wsz";
 import Winamp from "./winamp";
+import {
+  STEP_MARQUEE,
+  UPDATE_TIME_ELAPSED,
+  UPDATE_WINDOW_POSITIONS,
+  SET_VOLUME,
+  SET_BALANCE,
+  SET_BAND_VALUE
+} from "./actionTypes";
 
 import {
   hideAbout,
@@ -17,6 +26,26 @@ import {
   sentryDsn
 } from "./config";
 
+const NOISY_ACTION_TYPES = new Set([
+  STEP_MARQUEE,
+  UPDATE_TIME_ELAPSED,
+  UPDATE_WINDOW_POSITIONS,
+  SET_VOLUME,
+  SET_BALANCE,
+  SET_BAND_VALUE
+]);
+
+let lastActionType = null;
+
+// Filter out consecutive common actions
+function filterBreadcrumbActions(action) {
+  const noisy =
+    NOISY_ACTION_TYPES.has(action.type) &&
+    NOISY_ACTION_TYPES.has(lastActionType);
+  lastActionType = action.type;
+  return !noisy;
+}
+
 Raven.config(sentryDsn).install();
 
 // Don't prompt user to install Winamp2-js. It's probably not
@@ -81,7 +110,20 @@ Raven.context(() => {
       }
     ],
     enableHotkeys: true,
-    __initialState: initialState
+    __initialState: initialState,
+    __customMiddleware: createMiddleware(Raven, {
+      filterBreadcrumbActions,
+      stateTransformer: state => ({
+        ...state,
+        display: {
+          ...state.display,
+          skinGenLetterWidths: "[[REDACTED]]",
+          skinImages: "[[REDACTED]]",
+          skinCursors: "[[REDACTED]]",
+          skinRegion: "[[REDACTED]]"
+        }
+      })
+    })
   });
 
   winamp.renderWhenReady(document.getElementById("app"));

js/store.js

@@ -11,7 +11,7 @@ const compose = composeWithDevTools({
   actionsBlacklist: [UPDATE_TIME_ELAPSED, STEP_MARQUEE]
 });
 
-const getStore = (media, actionEmitter, stateOverrides) => {
+const getStore = (media, actionEmitter, customMiddleware, stateOverrides) => {
   let initialState;
   if (stateOverrides) {
     initialState = merge(
@@ -31,10 +31,13 @@ const getStore = (media, actionEmitter, stateOverrides) => {
     initialState,
     compose(
       applyMiddleware(
-        thunk,
-        mediaMiddleware(media),
-        emitterMiddleware,
-        analyticsMiddleware
+        ...[
+          thunk,
+          mediaMiddleware(media),
+          emitterMiddleware,
+          customMiddleware,
+          analyticsMiddleware
+        ].filter(Boolean)
       )
     )
   );

js/winamp.js

@@ -57,6 +57,7 @@ class Winamp {
     this.store = getStore(
       this.media,
       this._actionEmitter,
+      this.options.__customMiddleware,
       this.options.__initialState
     );
     this.store.dispatch({

package.json

@@ -83,6 +83,7 @@
     "jszip": "^3.1.3",
     "prettier": "^1.10.2",
     "prop-types": "^15.5.10",
+    "raven-for-redux": "^1.3.1",
     "raven-js": "^3.19.1",
     "rc-slider": "^8.1.5",
     "react": "^16.3.0",

yarn.lock

@@ -5821,6 +5821,10 @@ range-parser@^1.0.3, range-parser@~1.2.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/range-parser/-/range-parser-1.2.0.tgz#f49be6b487894ddc40dcc94a322f611092e00d5e"
 
+raven-for-redux@^1.3.1:
+  version "1.3.1"
+  resolved "https://registry.yarnpkg.com/raven-for-redux/-/raven-for-redux-1.3.1.tgz#865f0056ec1706073c1b3a33164640453ed4fed2"
+
 raven-js@^3.19.1:
   version "3.22.2"
   resolved "https://registry.yarnpkg.com/raven-js/-/raven-js-3.22.2.tgz#85785928ebd664049e54efd0db8ff28da0cbb374"