Supporting START, IMPORT_STATE and RESET from Redux DevTools.

Author: Tor Hovland

src/BlazorRedux/DevToolsInterop.cs

@@ -11,8 +11,15 @@ public static class DevToolsInterop
         private static bool _isReady;
         private static readonly Queue<Tuple<string, string>> Q = new Queue<Tuple<string, string>>();
 
+        public static event EventHandler Reset;
         public static event StringEventHandler TimeTravel;
 
+        private static void OnReset(EventArgs e)
+        {
+            var handler = Reset;
+            handler?.Invoke(null, e);
+        }
+
         private static void OnTimeTravel(StringEventArgs e)
         {
             var handler = TimeTravel;
@@ -33,6 +40,11 @@ public static void DevToolsReady()
             _isReady = true;
         }
 
+        public static void DevToolsReset()
+        {
+            OnReset(new EventArgs());
+        }
+
         public static void TimeTravelFromJs(string state)
         {
             OnTimeTravel(new StringEventArgs(state));

src/BlazorRedux/ReduxDevTools.cs

@@ -13,6 +13,11 @@ protected override void BuildRenderTree(RenderTreeBuilder builder)
             builder.OpenElement(seq++, "script");
             builder.AddContent(seq++,
 @"(function () {
+function timeTravel(state) {
+    const timeTravel = Blazor.platform.findMethod('BlazorRedux', 'BlazorRedux', 'DevToolsInterop', 'TimeTravelFromJs');
+    Blazor.platform.callMethod(timeTravel, null, [ Blazor.platform.toDotNetString(JSON.stringify(state)) ]);
+}
+
 Blazor.registerFunction('log', (action, state) => {
     var json = JSON.parse(state);
 
@@ -40,17 +45,42 @@ protected override void BuildRenderTree(RenderTreeBuilder builder)
 }
 
 devTools.subscribe((message) => {
-    if (message.type === 'DISPATCH' && message.state) {
-        const timeTravel = Blazor.platform.findMethod('BlazorRedux', 'BlazorRedux', 'DevToolsInterop', 'TimeTravelFromJs');
-        Blazor.platform.callMethod(timeTravel, null, [ Blazor.platform.toDotNetString(message.state) ]);
+    if (message.type === 'START') {
+        console.log('Connected with Redux DevTools.');
+        const devToolsReady = Blazor.platform.findMethod('BlazorRedux', 'BlazorRedux', 'DevToolsInterop', 'DevToolsReady');
+        Blazor.platform.callMethod(devToolsReady, null, []);
+    }
+    else if (message.type === 'DISPATCH' && message.payload) {
+        var payload = message.payload;
+
+        if (payload.type === 'IMPORT_STATE') {
+            // Hydration of state from a previous session
+            var states = payload.nextLiftedState.computedStates;
+            var index = payload.nextLiftedState.currentStateIndex;
+            var state = states[index].state;
+            timeTravel(state);
+        }
+        else if (payload.type === 'RESET') {
+            // Reset state
+            const devToolsReset = Blazor.platform.findMethod('BlazorRedux', 'BlazorRedux', 'DevToolsInterop', 'DevToolsReset');
+            Blazor.platform.callMethod(devToolsReset, null, []);
+        }
+        else {
+            console.log('Unhandled payload from Redux DevTools:');
+            console.log(payload);
+        }
+    }
+    else if (message.type === 'DISPATCH' && message.state) {
+        // Time-traveling
+        timeTravel(message.state);
+    }
+    else {
+        console.log('Unhandled message from Redux DevTools:');
+        console.log(message);
     }
 });
 
 window.devTools = devTools;
-console.log('Connected with Redux DevTools.');
-
-const devToolsReady = Blazor.platform.findMethod('BlazorRedux', 'BlazorRedux', 'DevToolsInterop', 'DevToolsReady');
-Blazor.platform.callMethod(devToolsReady, null, []);
 }());");
 
             builder.CloseElement();

src/BlazorRedux/Store.cs

@@ -7,13 +7,16 @@ namespace BlazorRedux
     public class Store<TState, TAction> : IDisposable
     {
         private readonly Reducer<TState, TAction> _reducer;
+        private readonly TState _initialState;
         private readonly object _syncRoot = new object();
 
         public Store(Reducer<TState, TAction> reducer, TState initialState = default(TState))
         {
             _reducer = reducer;
+            _initialState = initialState;
             State = initialState;
 
+            DevToolsInterop.Reset += OnDevToolsReset;
             DevToolsInterop.TimeTravel += OnDevToolsTimeTravel;
 
             DevToolsInterop.Log("initial", JsonUtil.Serialize(State));
@@ -26,9 +29,16 @@ public class Store<TState, TAction> : IDisposable
 
         public void Dispose()
         {
+            DevToolsInterop.Reset -= OnDevToolsReset;
             DevToolsInterop.TimeTravel -= OnDevToolsTimeTravel;
         }
 
+        private void OnDevToolsReset(object sender, EventArgs e)
+        {
+            var state = _initialState;
+            TimeTravel(state);
+        }
+
         private void OnDevToolsTimeTravel(object sender, StringEventArgs e)
         {
             var state = JsonUtil.Deserialize<TState>(e.String);