web: re-format with prettier

Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org>

web/src/elements/messages/Message.ts

@@ -9,7 +9,7 @@ export enum MessageLevel {
     error = "error",
     warning = "warning",
     success = "success",
-    info = "info"
+    info = "info",
 }
 export interface APIMessage {
     level: MessageLevel;
@@ -27,14 +27,13 @@ const LEVEL_ICON_MAP: { [key: string]: string } = {
 
 @customElement("ak-message")
 export class Message extends LitElement {
-
-    @property({attribute: false})
+    @property({ attribute: false })
     message?: APIMessage;
 
-    @property({type: Number})
+    @property({ type: Number })
     removeAfter = 8000;
 
-    @property({attribute: false})
+    @property({ attribute: false })
     onRemove?: (m: APIMessage) => void;
 
     static get styles(): CSSResult[] {
@@ -51,27 +50,34 @@ export class Message extends LitElement {
 
     render(): TemplateResult {
         return html`<li class="pf-c-alert-group__item">
-            <div class="pf-c-alert pf-m-${this.message?.level} ${this.message?.level === MessageLevel.error ? "pf-m-danger" : ""}">
+            <div
+                class="pf-c-alert pf-m-${this.message?.level} ${this.message?.level ===
+                MessageLevel.error
+                    ? "pf-m-danger"
+                    : ""}"
+            >
                 <div class="pf-c-alert__icon">
                     <i class="${this.message ? LEVEL_ICON_MAP[this.message.level] : ""}"></i>
                 </div>
-                <p class="pf-c-alert__title">
-                    ${this.message?.message}
-                </p>
-                ${this.message?.description && html`<div class="pf-c-alert__description">
+                <p class="pf-c-alert__title">${this.message?.message}</p>
+                ${this.message?.description &&
+                html`<div class="pf-c-alert__description">
                     <p>${this.message.description}</p>
                 </div>`}
                 <div class="pf-c-alert__action">
-                    <button class="pf-c-button pf-m-plain" type="button" @click=${() => {
-                        if (!this.message) return;
-                        if (!this.onRemove) return;
-                        this.onRemove(this.message);
-                    }}>
+                    <button
+                        class="pf-c-button pf-m-plain"
+                        type="button"
+                        @click=${() => {
+                            if (!this.message) return;
+                            if (!this.onRemove) return;
+                            this.onRemove(this.message);
+                        }}
+                    >
                         <i class="fas fa-times" aria-hidden="true"></i>
                     </button>
                 </div>
             </div>
         </li>`;
     }
-
 }

web/src/elements/messages/MessageContainer.ts

@@ -1,4 +1,12 @@
-import { LitElement, html, customElement, TemplateResult, property, CSSResult, css } from "lit-element";
+import {
+    LitElement,
+    html,
+    customElement,
+    TemplateResult,
+    property,
+    CSSResult,
+    css,
+} from "lit-element";
 import "./Message";
 import { APIMessage } from "./Message";
 import PFAlertGroup from "@patternfly/patternfly/components/AlertGroup/alert-group.css";
@@ -17,17 +25,20 @@ export function showMessage(message: APIMessage): void {
 
 @customElement("ak-message-container")
 export class MessageContainer extends LitElement {
-
-    @property({attribute: false})
+    @property({ attribute: false })
     messages: APIMessage[] = [];
 
     static get styles(): CSSResult[] {
-        return [PFBase, PFAlertGroup, css`
-            /* Fix spacing between messages */
-            ak-message {
-                display: block;
-            }
-        `];
+        return [
+            PFBase,
+            PFAlertGroup,
+            css`
+                /* Fix spacing between messages */
+                ak-message {
+                    display: block;
+                }
+            `,
+        ];
     }
 
     constructor() {
@@ -40,7 +51,7 @@ export class MessageContainer extends LitElement {
 
     // add a new message, but only if the message isn't currently shown.
     addMessage(message: APIMessage): void {
-        const matchingMessages = this.messages.filter(m => m.message == message.message);
+        const matchingMessages = this.messages.filter((m) => m.message == message.message);
         if (matchingMessages.length < 1) {
             this.messages.push(message);
         }
@@ -54,9 +65,10 @@ export class MessageContainer extends LitElement {
                     .onRemove=${(m: APIMessage) => {
                         this.messages = this.messages.filter((v) => v !== m);
                         this.requestUpdate();
-                    }}>
-                    </ak-message>`;
-                })}
+                    }}
+                >
+                </ak-message>`;
+            })}
         </ul>`;
     }
 }

web/src/elements/messages/Middleware.ts

@@ -4,13 +4,12 @@ import { MessageLevel } from "./Message";
 import { showMessage } from "./MessageContainer";
 
 export class MessageMiddleware implements Middleware {
-
     post(context: ResponseContext): Promise<Response | void> {
         if (context.response.status >= 500) {
             showMessage({
                 level: MessageLevel.error,
                 message: t`API request failed`,
-                description: `${context.init.method} ${context.url}: ${context.response.status}`
+                description: `${context.init.method} ${context.url}: ${context.response.status}`,
             });
         }
         return Promise.resolve(context.response);