Finish implementation of protected routes but passwords must still be encrypted

assets/pages/index.html

@@ -32,6 +32,18 @@
 
 <script>
 
+    function redirectToProtectedRoute(route) {
+        let data = JSON.parse(localStorage.getItem("creds"));
+
+        fetch(route, {
+            headers: {
+                "Authorization": `Basic ${data.username}:${data.password}`
+            }
+        })
+            .then(r => r.text())
+            .then(html => document.body.innerHTML = html);
+    }
+
     let btn = document.getElementById("connect-button");
     btn.addEventListener("click", async () => {
         let username = document.getElementById("username-field").value;
@@ -50,7 +62,8 @@
             body: JSON.stringify(data)})
             .then(response => {
                 if(response.ok) {
-                    window.location.href = "/payment";
+                    localStorage.setItem("creds", JSON.stringify(data));
+                    redirectToProtectedRoute("/payment");
                 } else {
                     throw new Error("Authentication request failed")
                 }