diff --git a/js/MailInfo.js b/js/MailInfo.js
new file mode 100644
index 0000000..f14dad1
--- /dev/null
+++ b/js/MailInfo.js
@@ -0,0 +1,33 @@
+Ext.define('PMG.MailInfoBox', {
+    extend: 'Ext.container.Container',
+    xtype: 'pmgMailInfo',
+
+    cls: 'x-toolbar-default',
+    style: {
+	'border-left': '0px',
+	'border-right': '0px',
+    },
+
+    update: function(data) {
+	let me = this;
+	let escaped = {};
+	for (const [key, value] of Object.entries(data)) {
+	    escaped[key] = Ext.htmlEncode(value);
+	}
+	me.items.each((item) => item.update(escaped));
+    },
+
+    layout: {
+	type: 'vbox',
+	align: 'stretch',
+    },
+
+    defaults: {
+	xtype: 'tbtext',
+    },
+
+    items: [
+	{ tpl: `<b>${gettext("From")}:</b> {from}` },
+	{ tpl: `<b>${gettext("Subject")}:</b> {subject}` },
+    ],
+});
diff --git a/js/Makefile b/js/Makefile
index b8102d1..672eedf 100644
--- a/js/Makefile
+++ b/js/Makefile
@@ -22,6 +22,7 @@ JSSRC=							\
 	MainView.js					\
 	QuarantineList.js				\
 	SpamInfoGrid.js					\
+	MailInfo.js					\
 	SpamQuarantine.js				\
 	UserBlackWhiteList.js				\
 	QuarantineView.js				\