1 files changed, 25 insertions, 2 deletions
diff --git a/old-ui/app/components/typed-message-renderer.js b/old-ui/app/components/typed-message-renderer.js
index 19e46f4fc..0dc673b8a 100644
--- a/old-ui/app/components/typed-message-renderer.js
+++ b/old-ui/app/components/typed-message-renderer.js
@@ -2,6 +2,7 @@ const Component = require('react').Component
 const h = require('react-hyperscript')
 const inherits = require('util').inherits
 const extend = require('xtend')
+const { ObjectInspector } = require('react-inspector')
 
 module.exports = TypedMessageRenderer
 
@@ -12,8 +13,16 @@ function TypedMessageRenderer () {
 
 TypedMessageRenderer.prototype.render = function () {
   const props = this.props
-  const { value, style } = props
-  const text = renderTypedData(value)
+  const { value, version, style } = props
+  let text
+  switch (version) {
+    case 'V1':
+      text = renderTypedData(value)
+      break
+    case 'V3':
+      text = renderTypedDataV3(value)
+      break
+  }
 
   const defaultStyle = extend({
     width: '315px',
@@ -44,3 +53,17 @@ function renderTypedData (values) {
     ])
   })
 }
+
+function renderTypedDataV3 (values) {
+  const { domain, message } = JSON.parse(values)
+   return [
+    domain ? h('div', [
+      h('h1', 'Domain'),
+      h(ObjectInspector, { data: domain, expandLevel: 1, name: 'domain' }),
+    ]) : '',
+    message ? h('div', [
+      h('h1', 'Message'),
+      h(ObjectInspector, { data: message, expandLevel: 1, name: 'message' }),
+    ]) : '',
+  ]
+}