Add log metadata plugin

src/client/debug/log/Log.svelte

@@ -138,15 +138,15 @@
     {/if}
   {/each}
 
-  {#each renderedLogEntries as { action, payload }, i}
+  {#each renderedLogEntries as { action, metadata }, i}
     <LogEvent
       pinned={i === pinned}
       logIndex={i}
       on:click={OnLogClick}
       on:mouseenter={OnMouseEnter}
       on:mouseleave={OnMouseLeave}
       {action}
-      {payload} />
+      {metadata} />
   {/each}
 
   {#each renderedLogEntries as { phase }, i}

src/client/debug/log/LogEvent.svelte

@@ -2,18 +2,18 @@
   export let logIndex;
   export let action;
   export let pinned;
-  export let payload;
-  export let payloadComponent;
+  export let metadata;
+  export let metadataComponent;
 
-  import CustomPayload from './CustomPayload.svelte';
+  import LogMetadata from './LogMetadata.svelte';
   import { createEventDispatcher } from 'svelte';
 
   const dispatch = createEventDispatcher();
 
   const args = action.payload.args;
   const renderedArgs = typeof args === 'string' ? args : (args || []).join(',');
   const playerID = action.payload.playerID;
-  let actionType; 
+  let actionType;
   switch (action.type) {
     case 'UNDO':
       actionType = 'undo';
@@ -134,10 +134,9 @@
   on:blur={() => dispatch('mouseleave')}
 >
   <div>{actionType}({renderedArgs})</div>
-
-  {#if payloadComponent}
-    <svelte:component this={payloadComponent} {payload} />
+  {#if metadataComponent}
+    <svelte:component this={metadataComponent} {metadata} />
   {:else}
-    <CustomPayload {payload} />
+    <LogMetadata {metadata} />
   {/if}
 </button>

src/client/debug/log/LogMetadata.svelte

@@ -0,0 +1,7 @@
+<script>
+  export let metadata;
+  const renderedMetadata =
+    metadata !== undefined ? JSON.stringify(metadata, null, 4) : '';
+</script>
+
+<div>{renderedMetadata}</div>

src/core/reducer.ts

@@ -105,6 +105,11 @@ function initializeDeltalog(
     phase: state.ctx.phase,
   };
 
+  const pluginLogMetadata = state.plugins.log.data.metadata;
+  if (pluginLogMetadata !== undefined) {
+    logEntry.metadata = pluginLogMetadata;
+  }
+
   if (typeof move === 'object' && move.redact === true) {
     logEntry.redact = true;
   }

src/plugins/main.ts

@@ -9,6 +9,7 @@
 import PluginImmer from './plugin-immer';
 import PluginRandom from './plugin-random';
 import PluginEvents from './plugin-events';
+import PluginLog from './plugin-log';
 import {
   AnyFn,
   PartialGameState,
@@ -28,7 +29,7 @@ interface PluginOpts {
 /**
  * List of plugins that are always added.
  */
-const DEFAULT_PLUGINS = [PluginImmer, PluginRandom, PluginEvents];
+const DEFAULT_PLUGINS = [PluginImmer, PluginRandom, PluginEvents, PluginLog];
 
 /**
  * Allow plugins to intercept actions and process them.

src/plugins/plugin-log.test.ts

@@ -0,0 +1,36 @@
+/*
+ * Copyright 2019 The boardgame.io Authors
+ *
+ * Use of this source code is governed by a MIT-style
+ * license that can be found in the LICENSE file or at
+ * https://opensource.org/licenses/MIT.
+ */
+
+import { Client } from '../client/client';
+
+describe('log-metadata', () => {
+  test('It sets metadata in a move and then clears the metadata', () => {
+    const game = {
+      moves: {
+        setMetadataMove: (G, ctx) => {
+          ctx.log.setMetadata({
+            message: 'test',
+          });
+        },
+        doNothing: G => G,
+      },
+    };
+    const client = Client({ game });
+    client.moves.setMetadataMove();
+
+    expect(client.getState().plugins.log.data).toEqual({});
+    expect(client.getState().log[0].metadata).toEqual({
+      message: 'test',
+    });
+
+    client.moves.doNothing();
+
+    expect(client.getState().plugins.log.data).toEqual({});
+    expect(client.getState().log[1].metadata).toEqual(undefined);
+  });
+});

src/plugins/plugin-log.ts

@@ -0,0 +1,40 @@
+/*
+ * Copyright 2018 The boardgame.io Authors
+ *
+ * Use of this source code is governed by a MIT-style
+ * license that can be found in the LICENSE file or at
+ * https://opensource.org/licenses/MIT.
+ */
+
+import { Plugin } from '../types';
+
+interface LogMetadataData {
+  metadata?: any;
+}
+
+interface LogMetadataAPI {
+  setMetadata(metadata: any): void;
+}
+
+/**
+ * Plugin that makes it possible to add metadata to log entries.
+ * During a move, you can set metadata using ctx.log.setMetadata and it will be
+ * available on the log entry for that move.
+ */
+const LogPlugin: Plugin<LogMetadataAPI, LogMetadataData> = {
+  name: 'log',
+
+  flush: () => ({}),
+
+  api: ({ data }) => {
+    return {
+      setMetadata: metadata => {
+        data.metadata = metadata;
+      },
+    };
+  },
+
+  setup: () => ({}),
+};
+
+export default LogPlugin;

src/types.ts

@@ -92,6 +92,7 @@ export interface LogEntry {
   phase: string;
   redact?: boolean;
   automatic?: boolean;
+  metadata?: any;
 }
 
 interface PluginContext<