static: fetch messages which were created when the user arrives/leaves the page

passbook/static/static/src/elements/Messages.ts

@@ -38,6 +38,10 @@ export class Messages extends LitElement {
         this.connect();
     }
 
+    firstUpdated() {
+        this.fetchMessages();
+    }
+
     connect() {
         const wsUrl = `${window.location.protocol.replace("http", "ws")}//${
             window.location.host
@@ -64,6 +68,24 @@ export class Messages extends LitElement {
         });
     }
 
+    /* Fetch messages which were stored in the session.
+     * This mostly gets messages which were created when the user arrives/leaves the site
+     * and especially the login flow */
+    fetchMessages() {
+        return fetch(this.url)
+            .then((r) => r.json())
+            .then((r) => (this.messages = r))
+            .then((r) => {
+                const container = <HTMLElement>(
+                    this.querySelector(".pf-c-alert-group")!
+                );
+                r.forEach((message: Message) => {
+                    const messageElement = this.renderMessage(message);
+                    container.appendChild(messageElement);
+                });
+            });
+    }
+
     renderMessage(message: Message): ChildNode {
         const id = ID("pb-message");
         const el = document.createElement("template");