diff --git a/src/components/exceptions.vue b/src/components/exceptions.vue
index 1fd4a23..48aa6b8 100644
--- a/src/components/exceptions.vue
+++ b/src/components/exceptions.vue
@@ -1,87 +1,71 @@
 <template>
     <div class="-my-2 overflow-x-auto sm:-mx-6 lg:-mx-8">
         <div class="py-2 align-middle inline-block min-w-full sm:px-6 lg:px-8">
-            <div class="shadow border-b border-gray-200 sm:rounded-lg">
+            <div class="shadow border-b border-gray-200 rounded-lg">
+                <table class="min-w-full divide-y divide-gray-200">
+                    <thead>
+                    <tr>
+                        <th class="px-6 py-3 bg-gray-50 text-left text-xs leading-4 font-medium text-gray-500 uppercase tracking-wider">
+                            Message
+                        </th>
+                    </tr>
+                    </thead>
+                    <tbody class="divide-y divide-gray-200">
+                    <tr class="bg-white" v-for="(exception, key) in exceptions" :key="`exception_${key}`">
+                        <td class="px-6 py-4 text-sm leading-5 font-medium text-gray-900 font-mono">
+                            <span class="text-red-800 block">{{ exception.message }}</span>
+                            <span :class="fileExists(exception.file) ? 'cursor-pointer' : ''"
+                                  @click="openEditor(exception.file, exception.line)"
+                                  class="font-mono text-gray-800 text-xs block">
+                                {{ exception.file }}#{{ exception.line }}
+                            </span>
+                            <div class="mt-2 bg-gray-100">
+                                <span
+                                    class="text-gray-800 text-xs block whitespace-pre"
+                                    v-for="(line, lineKey) in exception.surrounding_lines"
+                                    :key="`exception${key}_${lineKey}`">
+                                    {{ sanitizeString(line) }}
+                                </span>
+                            </div>
+                            <div class="pt-2">
+                                <span class="font-bold">Stack trace:</span>
+                                <ul>
+                                    <li
+                                        class="font-mono text-gray-800 text-xs"
+                                        v-for="(trace, traceKey) in stackTraceLines(exception.stack_trace)"
+                                        :key="`exception${key}_${traceKey}`">
+                                        {{ trace }}
+                                    </li>
+                                </ul>
+                            </div>
+                        </td>
+                    </tr>
+                    </tbody>
+                </table>
             </div>
         </div>
     </div>
 </template>
 
 <script>
-import {xor} from 'lodash';
+
+import fileMixin from "@/mixins/fileMixin";
 
 export default {
     props: ['selectedRequest'],
-    data() {
-        return {
-            filteredLabels: []
-        };
-    },
-    mounted() {
-        this.applySymfonyJS();
-    },
+    mixins: [fileMixin],
     computed: {
-        labels() {
-            let labels = [];
-            
-            this.selectedRequest.data.messages.messages.map(message => {
-                if (! labels.includes(message.label)) {
-                    labels.push(message.label);
-                }
-            })
-
-            return labels;
+        exceptions() {
+            return this.selectedRequest.data.exceptions.exceptions
         },
-        messages() {
-            return this.selectedRequest.data.messages.messages.filter(message => {
-                return ! this.filteredLabels.includes(message.label);
-            });
-        }
     },
     methods: {
-        applySymfonyJS() {
-            document.querySelectorAll('.sf-dump').forEach(element => {
-                window.Sfdump(element.id);
-            });
+        stackTraceLines(stackTrace) {
+            return stackTrace.split('\n');
         },
-        toggleLabel(label) {
-            this.filteredLabels = xor(this.filteredLabels, [label]);
-
-            this.$nextTick(() => {
-                this.applySymfonyJS();
-            })
-        },
-        isFiltered(label) {
-            if (this.filteredLabels.includes(label)) {
-                return 'bg-opacity-50';
-            }
-            return '';
-        },
-        labelColor(label) {
-            let classList = '';
-            switch (label) {
-                case 'debug':
-                    classList = 'bg-green-600';
-                    break;
-
-                case 'info':
-                    classList = 'bg-blue-700';
-                    break;
-
-                case 'error':
-                    classList = 'bg-red-700';
-                    break;
-            
-                case 'warning':
-                    classList = 'bg-orange-500';
-                    break;
-            
-                default:
-                    classList = 'bg-gray-700';
-                    break;
-            }
 
-            return classList;
+        sanitizeString(string) {
+            return string.replace(/\r?\n|\r|\n/g, '');
         }
     }
 }
diff --git a/src/components/queries.vue b/src/components/queries.vue
index 3a91af5..1fd936d 100644
--- a/src/components/queries.vue
+++ b/src/components/queries.vue
@@ -58,13 +58,11 @@
 <script>
 import Empty from './empty'
 import sqlFormatter from "sql-formatter";
-import { existsSync } from 'fs';
-import { join } from 'path';
-import { shell } from 'electron';
-import editorUrl from './../lib/editor';
+import fileMixin from "@/mixins/fileMixin";
 
 export default {
     props: ['selectedRequest'],
+    mixins: [fileMixin],
     components: {
         Empty,
     },
@@ -109,24 +107,6 @@ export default {
         }
     },
     methods: {
-        openEditor(filename, lineNumber) {
-            if (this.fileExists(filename)) {
-                shell.openExternal(editorUrl(mainStorage.get('editor'), this.detectFilename(filename), lineNumber))
-            }
-        },
-
-        detectFilename(filename) {
-            if (existsSync(filename)) {
-                return filename;
-            }
-
-            return join(this.selectedRequest.base_path,filename);
-        },
-
-        fileExists(filename) {
-            return existsSync(filename) || existsSync(join(this.selectedRequest.base_path,filename));
-        },
-
         toggleDuplicates() {
             this.showDuplicates = ! this.showDuplicates;
         }
diff --git a/src/mixins/fileMixin.js b/src/mixins/fileMixin.js
new file mode 100644
index 0000000..35935db
--- /dev/null
+++ b/src/mixins/fileMixin.js
@@ -0,0 +1,26 @@
+import {shell} from "electron";
+import editorUrl from "@/lib/editor";
+import {existsSync} from "fs";
+import {join} from "path";
+
+export default {
+    methods: {
+        openEditor(filename, lineNumber) {
+            if (this.fileExists(filename)) {
+                shell.openExternal(editorUrl(mainStorage.get('editor'), this.detectFilename(filename), lineNumber))
+            }
+        },
+
+        detectFilename(filename) {
+            if (existsSync(filename)) {
+                return filename;
+            }
+
+            return join(this.selectedRequest.base_path, filename);
+        },
+
+        fileExists(filename) {
+            return existsSync(filename) || existsSync(join(this.selectedRequest.base_path, filename));
+        },
+    },
+}
\ No newline at end of file