Display the log entries, although it doesn't look pretty at all.

packages/rocketchat-apps/client/admin/appLogs.html

@@ -14,11 +14,11 @@
 			<div class="content background-transparent-dark">
 				{{#if isReady}}
 					<div class="rocket-form">
-						{{#each logs}}
+						{{#each log in logs}}
 							<div class="section section-collapsed">
 								<div class="section-title">
 									<div class="section-title-text">
-										Logs for "{{method}}" ({{entries.length}}) {{totalTime}}ms
+										{{formatDate log._createdAt}}: "{{log.method}}" ({{log.totalTime}}ms)
 									</div>
 									<div class="section-title-right">
 										<button class="button primary expand">
@@ -27,7 +27,24 @@
 									</div>
 								</div>
 								<div class="section-content">
-									Content
+									<h4>General Information</h4>
+									<ul>
+										<li>Method: {{ log.method }}</li>
+										<li>Start Time: {{ log.startTime }}</li>
+										<li>End Time: {{ log.endTime }}</li>
+										<li>Total Time: {{ log.totalTime }}ms</li>
+										<li>Log Entries: {{ log.entries.length }}</li>
+									</ul>
+
+									<h4>Log Entries</h4>
+									<ul>
+										{{#each entry in log.entries}}
+											<li>Timestamp: {{ entry.timestamp }}</li>
+											<li>Severity: {{ entry.severity }}</li>
+											<li>Caller: {{ entry.caller }}</li>
+											<li>Arguments: <pre><code class="code-colors hljs json">{{{ jsonStringify entry.args }}}</code></pre></li>
+										{{/each}}
+									</ul>
 								</div>
 							</div>
 						{{/each}}

packages/rocketchat-apps/client/admin/appLogs.js

@@ -1,3 +1,6 @@
+import moment from 'moment';
+import hljs from 'highlight.js';
+
 Template.appLogs.onCreated(function() {
 	const instance = this;
 	this.id = new ReactiveVar(FlowRouter.getParam('appId'));
@@ -42,6 +45,18 @@ Template.appLogs.helpers({
 	},
 	logs() {
 		return Template.instance().logs.get();
+	},
+	formatDate(date) {
+		return moment(date).format('L LTS');
+	},
+	jsonStringify(data) {
+		if (!data) {
+			return '';
+		} else if (typeof data === 'object') {
+			return hljs.highlight('json', JSON.stringify(data, null, 2)).value;
+		} else {
+			return hljs.highlight('json', data).value;
+		}
 	}
 });