Using prettier to format

.editorconfig

@@ -5,7 +5,7 @@ indent_style = space
 indent_size = 3
 charset = utf-8
 trim_trailing_whitespace = false
-insert_final_newline = false
+insert_final_newline = true
 
 [*.svelte]
 indent_size = 2

.vscode/extensions.json

@@ -0,0 +1,3 @@
+{
+   "recommendations": ["esbenp.prettier-vscode"]
+}

src/Login/Redirect.svelte

@@ -3,10 +3,7 @@
   //    onMount,
   //    onDestroy
   // } from "svelte";
-   import {
+  import { onMount, onDestroy } from "svelte";
-      onMount,
-      onDestroy
-   } from 'svelte';
 
   const basetext = "Logged in. Redirecting";
   let dots = 0;
@@ -18,27 +15,16 @@
     console.log("Mounted");
     iv = setInterval(() => {
       dots++;
-         if (dots > 3)
+      if (dots > 3) dots = 0;
-            dots = 0;
     }, 500);
   });
 
   onDestroy(() => {
-      console.log("on Destroy")
+    console.log("on Destroy");
-      clearInterval(iv)
+    clearInterval(iv);
   });
 </script>
 
-<div class="scale">
-   <svg class="checkmark" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 52 52">
-      <circle class="checkmark__circle" cx="26" cy="26" r="25" fill="none" />
-      <path class="checkmark__check" fill="none" d="M14.1 27.2l7.1 7.2 16.7-16.8" />
-   </svg>
-</div>
-<!-- <div style="text-align: center;"> -->
-<h3>{text}</h3>
-<!-- </div> -->
-
 <style>
   .checkmark__circle {
     stroke-dasharray: 166;
@@ -60,7 +46,8 @@
     stroke-miterlimit: 10;
     margin: 10% auto;
     box-shadow: inset 0px 0px 0px #7ac142;
-      animation: fill .4s ease-in-out .4s forwards, scale .3s ease-in-out .9s both;
+    animation: fill 0.4s ease-in-out 0.4s forwards,
+      scale 0.3s ease-in-out 0.9s both;
   }
 
   .checkmark__check {
@@ -77,7 +64,6 @@
   }
 
   @keyframes scale {
-
     0%,
     100% {
       transform: none;
@@ -98,3 +84,16 @@
     transform: scale(1.5);
   }
 </style>
+
+<div class="scale">
+  <svg class="checkmark" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 52 52">
+    <circle class="checkmark__circle" cx="26" cy="26" r="25" fill="none" />
+    <path
+      class="checkmark__check"
+      fill="none"
+      d="M14.1 27.2l7.1 7.2 16.7-16.8" />
+  </svg>
+</div>
+<!-- <div style="text-align: center;"> -->
+<h3>{text}</h3>
+<!-- </div> -->

src/Login/twofactors/codeInput.svelte

@@ -1,8 +1,6 @@
 <script>
-   import Cleave from "../../cleave"
+  import Cleave from "../../cleave";
-   import {
+  import { onMount } from "svelte";
-      onMount
-   } from 'svelte';
 
   export let error;
   export let label;
@@ -13,10 +11,10 @@
   onMount(() => {
     const cleaveCustom = new Cleave(input, {
       blocks: [length / 2, length / 2],
-         delimiter: ' ',
+      delimiter: " ",
       numericOnly: true
     });
-   })
+  });
 </script>
 
 <style>
@@ -27,9 +25,9 @@
 </style>
 
 <div class="floating group">
-   <input bind:this={input} autofocus bind:value={value}>
+  <input bind:this={input} autofocus bind:value />
-   <span class="highlight"></span>
+  <span class="highlight" />
-   <span class="bar"></span>
+  <span class="bar" />
   <label>Code</label>
-   <div class="error" style={!error ? "display: none;" : "" }>{error}</div>
+  <div class="error" style={!error ? 'display: none;' : ''}>{error}</div>
 </div>

src/Login/twofactors/push.svelte

@@ -9,12 +9,10 @@
   export let finish;
 
   async function requestPush() {
-
     // Push Request
   }
 </script>
 
-
 <style>
   .error {
     color: var(--error);
@@ -94,8 +92,6 @@
     -moz-animation-delay: 1.003s;
   }
 
-
-
   @keyframes orbit {
     0% {
       opacity: 1;
@@ -369,23 +365,26 @@
 
 <h3>SMS</h3>
 
-<p>A code was sent to your Device <b>{device}</b></p>
+<p>
+  A code was sent to your Device
+  <b>{device}</b>
+</p>
 
 <div class="windows8">
   <div class="wBall" id="wBall_1">
-      <div class="wInnerBall"></div>
+    <div class="wInnerBall" />
   </div>
   <div class="wBall" id="wBall_2">
-      <div class="wInnerBall"></div>
+    <div class="wInnerBall" />
   </div>
   <div class="wBall" id="wBall_3">
-      <div class="wInnerBall"></div>
+    <div class="wInnerBall" />
   </div>
   <div class="wBall" id="wBall_4">
-      <div class="wInnerBall"></div>
+    <div class="wInnerBall" />
   </div>
   <div class="wBall" id="wBall_5">
-      <div class="wInnerBall"></div>
+    <div class="wInnerBall" />
   </div>
 </div>
 

src/Login/twofactors/sms.svelte

@@ -4,7 +4,7 @@
   const states = {
     approve: 1,
     enter: 2
-   }
+  };
   let state = states.approve;
 
   let error = "";
@@ -12,9 +12,7 @@
   export let number = "+4915...320";
   //export let finish;
 
-   function validateCode() {
+  function validateCode() {}
-
-   }
 
   function sendCode() {
     // Send request to Server
@@ -23,7 +21,6 @@
   }
 </script>
 
-
 <style>
   :root {
     --error: red;
@@ -41,9 +38,12 @@
 {:else}
   <p>A code was sent to you. Please enter</p>
   <input type="number" placeholder="Code" bind:value={code} />
-   <button on:click={validateCode}>Send</button><br>
+  <button on:click={validateCode}>Send</button>
-   <a href="# " on:click|preventDefault={() => state = states.approve}>Not received?</a>
+  <br />
+  <a href="# " on:click|preventDefault={() => (state = states.approve)}>
+    Not received?
+  </a>
 {/if}
 <div class="error">{error}</div>
 
-<ToList {finish}/>
+<ToList {finish} />

src/Login/twofactors/toList.svelte

@@ -1,6 +1,7 @@
 <script>
   export let finish = () => {};
 </script>
+
 <style>
   a {
     color: var(--primary);
@@ -9,5 +10,7 @@
 </style>
 
 <p>
-   <a href="# " on:click={evt=>evt.preventDefault() || finish(false)}>Choose another Method</a>
+  <a href="# " on:click={evt => evt.preventDefault() || finish(false)}>
+    Choose another Method
+  </a>
 </p>

src/Login/twofactors/u2f.svelte

@@ -8,7 +8,7 @@
     requestUser: 1,
     sendChallenge: 2,
     error: 3
-   }
+  };
 
   let state = states.getChallenge;
 
@@ -25,7 +25,7 @@
     state = states.requestUser;
     let res = await window.navigator.credentials.get({
       publicKey: challenge
-      })
+    });
     state = states.sendChallenge();
     let r = res.response;
     let data = encode({
@@ -34,12 +34,10 @@
       signature: r.signature,
       userHandle: r.userHandle
     });
-      let {
+    let { success } = fetch("https://localhost:8444/auth", {
-         success
-      } = fetch("https://localhost:8444/auth", {
       body: data,
       method: "POST"
-      }).then(res => res.json())
+    }).then(res => res.json());
     if (success) {
       finish(true);
     }
@@ -53,10 +51,9 @@
 
     requestUser().catch(onError);
   }
-   getChallenge().catch(onError)
+  getChallenge().catch(onError);
 </script>
 
-
 <style>
   :root {
     --error: red;

src/request.ts

@@ -4,7 +4,7 @@ import { getCookie } from "./cookie";
 // const baseURL = "http://localhost:3000";
 const baseURL = "";
 
-export default async function request(endpoint: string, parameters: { [key: string]: string } = {}, method: "GET" | "POST" | "DELETE" | "PUT" = "GET", body?: any, authInParam = false) {
+export default async function request(endpoint: string, parameters: { [key: string]: string } = {}, method: "GET" | "POST" | "DELETE" | "PUT" = "GET", body?: any, authInParam = false, redirect = false) {
    let pairs = [];
 
    if (authInParam) {
@@ -33,9 +33,9 @@ export default async function request(endpoint: string, parameters: { [key: stri
       return e.json()
    }).then(data => {
       if (data.error) {
-         if (data.additional && data.additional.auth) {
+         if (redirect && data.additional && data.additional.auth) {
             let state = btoa(window.location.pathname + window.location.hash);
-            // window.location.href = `/login?state=${state}&base64=true`;
+            window.location.href = `/login?state=${state}&base64=true`;
          }
          return Promise.reject(new Error(data.error))
       }