Content manager error modal

This commit is contained in:
Jiiks 2018-02-07 18:02:27 +02:00
parent bf0c74b516
commit 67f7111f66
7 changed files with 142 additions and 9 deletions

View File

@ -16,6 +16,7 @@ import { ClientLogger as Logger } from 'common';
class BetterDiscord {
constructor() {
window.css = CssEditor;
window.pm = PluginManager;
window.events = Events;
window.wpm = WebpackModules;

View File

@ -16,6 +16,10 @@ import { Error } from 'structs';
export default class {
static get errors() {
return this._errors || (this._errors = []);
}
static get localContent() {
return this._localContent ? this._localContent : (this._localContent = []);
}
@ -33,16 +37,26 @@ export default class {
try {
await this.preloadContent(dir);
} catch (err) {
//We don't want every plugin/theme to fail loading when one does
/*Events.emit('bd-error', {
header: `${this.moduleName} - Failed to load plugin: ${dir}`,
text: err.message,
type: 'err'
});*/
this.errors.push(new Error({
module: this.moduleName,
message: `Failed to load ${dir}`,
err
}));
Logger.err(this.moduleName, err);
}
}
if (this.errors.length) {
Events.emit('bd-error', {
header: `${this.moduleName} - one or more ${this.contentType}(s) failed to load`,
module: this.moduleName,
type: 'err',
content: this.errors
});
}
this._errors = [];
return this.localContent;
} catch (err) {
throw err;

View File

@ -19,6 +19,10 @@ export default class extends ContentManager {
return this.localContent;
}
static get contentType() {
return 'plugin';
}
static get moduleName() {
return 'PluginManager';
}

View File

@ -12,6 +12,7 @@ export class Error {
constructor(args) {
this.args = args;
this.showStack = false; // For error modal
}
get module() {
@ -26,4 +27,12 @@ export class Error {
return this.args.err;
}
get stackTrace() {
return this.err.stack;
}
get _type() {
return 'err';
}
}

View File

@ -197,4 +197,69 @@
}
}
}
}
}
.bd-modal-error .bd-modal-error-title {
padding: 5px;
background: rgba(0,0,0,.3);
border-radius: 3px 3px 0 0;
}
.bd-modal-error {
margin-top: 5px;
.bd-scroller-wrap {
background: rgba(0,0,0,.2);
.bd-scroller {
overflow-x: auto;
padding: 0;
&::-webkit-scrollbar-corner {
background: transparent;
}
}
}
}
.bd-modal-error .bd-scroller-wrap {
opacity: 0;
}
.bd-modal-error.bd-open {
.bd-modal-error-body {
transform: scaleY(1) translateY(0%);
margin-top: 0%;
opacity: 1;
span {
font-weight: 700;
}
}
.bd-scroller-wrap {
opacity: 1;
}
}
.bd-modal-error .bd-modal-error-body {
white-space: pre-wrap;
font-size: 12px;
font-family: 'Consolas';
padding: 0 5px;
border-radius: 3px;
max-height: 100px;
width: auto;
transition: transform 0.2s ease, margin-top 0.2s ease, opacity 0.2s ease;
transform: scaleY(0) translateY(0%);
margin-top: -50%;
opacity: 0;
}
.bd-modal-titlelink {
cursor: pointer;
color: $colbdblue;
&:hover {
text-decoration: underline;
color: lighten($colbdblue, 5%);
}
}

View File

@ -19,7 +19,9 @@
:class="[{'bd-err': modal.type && modal.type === 'err'}, {'bd-modal-out': modal.closing}]">
<MiError v-if="modal.type === 'err'" slot="icon" size="20"/>
<div slot="body">
{{modal.text}}
<div v-for="(content, index) in modal.content">
<ErrorModal v-if="content._type === 'err'" :content="content" :hideStack="hideStack" :showStack="showStack"/>
</div>
</div>
<div slot="footer" class="bd-modal-controls">
<span class="bd-modal-tip">Ctrl+Shift+I for more details</span>
@ -36,6 +38,7 @@
import { Events } from 'modules';
import { Modal } from '../common';
import { MiError } from '../common/MaterialIcon';
import ErrorModal from '../common/ErrorModal.vue';
export default {
data() {
@ -44,12 +47,13 @@
}
},
components: {
Modal, MiError
Modal, MiError, ErrorModal
},
beforeMount() {
Events.on('bd-error', e => {
e.closing = false;
this.modals.push(e);
console.log(this.modals);
});
},
methods: {
@ -58,6 +62,12 @@
setTimeout(() => {
this.modals.splice(index, 1);
}, 200);
},
showStack(error) {
error.showStack = true;
},
hideStack(error) {
error.showStack = false;
}
}
}

View File

@ -0,0 +1,30 @@
/**
* BetterDiscord Error Modal Component
* Copyright (c) 2015-present Jiiks/JsSucks - https://github.com/Jiiks / https://github.com/JsSucks
* All rights reserved.
* https://betterdiscord.net
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
<template>
<div class="bd-modal-error" :class="{'bd-open': content.showStack}">
<div class="bd-modal-error-title bd-flex">
<span class="bd-modal-title-text bd-flex-grow">{{content.message}}</span>
<span class="bd-modal-titlelink" v-if="content.showStack" @click="hideStack(content)">Hide Stacktrace</span>
<span class="bd-modal-titlelink" v-else @click="showStack(content)">Show Stacktrace</span>
</div>
<div class="bd-scroller-wrap">
<div class="bd-scroller">
<div class="bd-modal-error-body"><span>{{content.err.message}}</span>
{{content.stackTrace}}</div>
</div>
</div>
</div>
</template>
<script>
export default {
props: ['content', 'hideStack', 'showStack']
}
</script>