All files / components/app App.ts

85% Statements 17/20
80% Branches 8/10
85.71% Functions 6/7
85% Lines 17/20

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 851x 1x   1x 1x           1x       3x                   4x               4x   4x   2x     2x 4x                                       2x   2x         1x   1x                             1x
import CustomElement from "../../custom-element/CustomElement";
import defineCustomElement from "../../custom-element/helpers/defineCustomElement";
import { CustomElementStateMetadata } from "../../custom-element/interfaces";
import { errorEvent } from "../../error/ErrorHandler";
import { html } from "../../renderer/html";
 
/**
 * The root class of the SPA
 * Centralizes: Authorization, Localization, Errors display
 */
export default class App extends CustomElement {
 
    static get state(): Record<string, CustomElementStateMetadata> {
 
        return {
 
            errors: {
                value: []
            }
        };
    }
 
    render() {
 
        return html`${this.renderErrors()}
            <slot></slot>`;
    }
 
    renderErrors() {
 
        const {
            errors
        } = this;
 
        if (errors.length === 0) {
 
            return null;
        }
 
        return html`<gcl-overlay>
                ${errors.map(e => html`<span>${e.message}</span>`)}
            </gcl-overlay>`;
 
        // return (
        //     <gcl-overlay>
        //         <gcl-alert
        //             type="error"
        //             message={this.getErrorMessage()}
        //             closable={true}
        //             style={{ maxWidth: '90%' }}
        //             close={() => {
        //                 this.setError(undefined);
        //             }}
        //         />
        //     </gcl-overlay>
        // );
    }
 
    connectedCallback() {
 
        super.connectedCallback?.();
 
        this.addEventListener(errorEvent, this.handleError);
    }
 
    disconnectedCallback() {
 
        super.disconnectedCallback?.();
 
        this.removeEventListener(errorEvent, this.handleError);
    }
 
    handleError(event: CustomEvent): void {
 
        const {
            error
        } = event.detail;
 
        this.errors = [...this.errors, error];
 
        event.stopPropagation();
    }
}
 
defineCustomElement('gcl-app', App);