Add window.cloudron.onRequestError()

dashboard/src/components/RequestErrorDialog.vue

@@ -0,0 +1,59 @@
+<script setup>
+
+import { ref, useTemplateRef } from 'vue';
+import { Dialog } from '@cloudron/pankow';
+
+const dialog = useTemplateRef('dialog');
+
+const status = ref(0);
+const message = ref('');
+const stackTrace = ref('');
+
+async function onRequestError(error) {
+  console.error(error);
+
+  status.value = error.status || 'unknown';
+  message.value = error.body?.message || error.message || 'unkown';
+
+  let stack = '';
+  if (error.stack) stack = error.stack;
+  else stack = (new Error()).stack;
+
+  if (stack.indexOf('Error') === 0) { // chrome v8
+    stackTrace.value = stack.split('\n').slice(2, 7).map(l => l.slice('    at '.length).split(' ')[0] + '()').join('\n');
+  } else { // firefox and safari
+    stackTrace.value = stack.split('\n').slice(1, 7).map(l => l.split('@')[0] + '()').join('\n');
+  }
+
+  dialog.value.open();
+}
+
+if (!window.cloudron) window.cloudron = {};
+window.cloudron.onRequestError = onRequestError;
+
+function onClose() {
+  status.value = 0;
+  message.value = '';
+  stackTrace.value = '';
+}
+
+</script>
+
+<template>
+  <Dialog ref="dialog" title="Unhandled error"
+    :reject-label="$t('main.dialog.close')"
+    @close="onClose"
+  >
+    <div>
+      <label>Status:</label>
+      <pre>{{ status }}</pre>
+      <label>Details:</label>
+      <pre>{{ message }}</pre>
+      <label>Trace:</label>
+<pre>
+{{ stackTrace }}
+...
+</pre>
+    </div>
+  </Dialog>
+</template>