From 4a046d17ab87e550da3c1f6389169bfb9057c04a Mon Sep 17 00:00:00 2001
From: ngxson <thichthat@gmail.com>
Date: Sun, 3 Oct 2021 14:03:26 +0200
Subject: [PATCH] prettier

---
 src/onboarding/Onboarding.vue             | 14 +++----
 src/popup/APIService.js                   |  5 ++-
 src/popup/components/AliasMoreOptions.vue |  4 +-
 src/popup/components/Header.vue           | 10 ++---
 src/popup/components/Login.vue            |  6 +--
 src/popup/components/Main.vue             | 33 ++++++++--------
 src/popup/components/NewAliasResult.vue   |  2 +-
 src/popup/components/ReverseAlias.vue     | 46 ++++++++++++++---------
 src/popup/components/SelfHostSetting.vue  |  2 +-
 src/popup/components/SplashScreen.vue     |  2 +-
 10 files changed, 70 insertions(+), 54 deletions(-)

diff --git a/src/onboarding/Onboarding.vue b/src/onboarding/Onboarding.vue
index 2b31969..ac08d93 100644
--- a/src/onboarding/Onboarding.vue
+++ b/src/onboarding/Onboarding.vue
@@ -67,12 +67,12 @@
             <img
               v-if="isChrome"
               src="../images/chrome-permission-screenshot.png"
-              style="width: 400px"
+              style="width: 400px;"
             />
             <img
               v-else
               src="../images/firefox-permission-screenshot.png"
-              style="width: 400px"
+              style="width: 400px;"
             />
 
             <p>
@@ -84,7 +84,7 @@
             <img
               alt="SimpleLogin Button demo"
               src="../images/sl-button-demo.png"
-              style="width: 400px"
+              style="width: 400px;"
               class="mb-3"
             />
 
@@ -106,7 +106,7 @@
             <button
               @click="nextStep()"
               class="btn"
-              style="color: #888; font-size: 0.8em"
+              style="color: #888; font-size: 0.8em;"
             >
               Skip
             </button>
@@ -119,20 +119,20 @@
               <img
                 alt="SimpleLogin"
                 src="../images/icon-simplelogin.png"
-                style="height: 1.2em"
+                style="height: 1.2em;"
               />
               icon at the corner of your browser.
             </p>
             <p
               v-if="isChrome"
               class="alert alert-primary"
-              style="border-left: 5px #467fcf solid"
+              style="border-left: 5px #467fcf solid;"
             >
               Note: this icon maybe hidden under
               <img
                 alt="Extension Menu"
                 src="../images/icon-puzzle.png"
-                style="height: 1.2em"
+                style="height: 1.2em;"
               />
               button.
             </p>
diff --git a/src/popup/APIService.js b/src/popup/APIService.js
index 9e7b766..d90df18 100644
--- a/src/popup/APIService.js
+++ b/src/popup/APIService.js
@@ -29,7 +29,10 @@ const API_ROUTE = {
   TOGGLE_ALIAS: { method: "POST", path: "/api/aliases/:alias_id/toggle" },
   EDIT_ALIAS: { method: "PUT", path: "/api/aliases/:alias_id" },
   DELETE_ALIAS: { method: "DELETE", path: "/api/aliases/:alias_id" },
-  CREATE_REVERSE_ALIAS: { method: "POST", path: "/api/aliases/:alias_id/contacts" },
+  CREATE_REVERSE_ALIAS: {
+    method: "POST",
+    path: "/api/aliases/:alias_id/contacts",
+  },
   GET_API_KEY_FROM_COOKIE: { method: "POST", path: "/api/api_key" },
 };
 
diff --git a/src/popup/components/AliasMoreOptions.vue b/src/popup/components/AliasMoreOptions.vue
index 8f159eb..13667fe 100644
--- a/src/popup/components/AliasMoreOptions.vue
+++ b/src/popup/components/AliasMoreOptions.vue
@@ -29,7 +29,7 @@
       <textarea-autosize
         placeholder="Note, can be anything to help you remember why you created this alias. This field is optional."
         class="form-control"
-        style="width: 100%"
+        style="width: 100%;"
         v-model="moreOptions.note"
         :disabled="loading"
       ></textarea-autosize>
@@ -69,7 +69,7 @@
 
         <button
           class="btn btn-sm btn-delete"
-          style="color: #dc3545"
+          style="color: #dc3545;"
           v-on:click="handleClickDelete"
           :disabled="loading"
         >
diff --git a/src/popup/components/Header.vue b/src/popup/components/Header.vue
index 67ec027..000717c 100644
--- a/src/popup/components/Header.vue
+++ b/src/popup/components/Header.vue
@@ -1,21 +1,21 @@
 <template>
   <div class="header">
-    <div class="row mt-2 pb-2 ml-3 mr-2" style="border-bottom: 1px #eee solid">
+    <div class="row mt-2 pb-2 ml-3 mr-2" style="border-bottom: 1px #eee solid;">
       <div>
         <div
           v-on:click="navigateBack()"
           v-bind:class="{ back: canBack }"
-          style="display: inline-block"
+          style="display: inline-block;"
         >
           <img
             v-if="canBack"
             src="/images/back-button.svg"
-            style="height: 20px"
+            style="height: 20px;"
           />
           <img
             class="sl-logo"
             src="/images/horizontal-logo.svg"
-            style="height: 18px"
+            style="height: 18px;"
           />
         </div>
         <div class="beta-badge" v-if="isBeta">BETA</div>
@@ -53,7 +53,7 @@
           :href="apiUrl + '/dashboard/'"
           target="_blank"
           class="dashboard-btn float-right"
-          style="padding: 0.25rem 0.5rem; font-size: 0.875rem"
+          style="padding: 0.25rem 0.5rem; font-size: 0.875rem;"
           title="Dashboard"
           v-b-tooltip.hover
           :disabled="!useCompactLayout"
diff --git a/src/popup/components/Login.vue b/src/popup/components/Login.vue
index a9e1f85..9ebe64d 100644
--- a/src/popup/components/Login.vue
+++ b/src/popup/components/Login.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="content">
     <!-- Login/register screen -->
-    <div v-if="!isShowMfa" class="p-6 container" style="min-height: 350px">
+    <div v-if="!isShowMfa" class="p-6 container" style="min-height: 350px;">
       <h1 class="h5 mb-3">
         Welcome to
         <a href="https://simplelogin.io" target="_blank"
@@ -52,7 +52,7 @@
     <!-- END Login/register screen -->
 
     <!-- MFA screen -->
-    <div v-else class="p-6 container" style="min-height: 350px">
+    <div v-else class="p-6 container" style="min-height: 350px;">
       <div class="p-3">
         <div class="mb-2">
           Your account is protected with Two Factor Authentication. <br />
@@ -63,7 +63,7 @@
           <p>Please enter the 2FA code from your 2FA authenticator</p>
         </div>
 
-        <div style="margin: auto">
+        <div style="margin: auto;">
           <input
             v-model="mfaCode"
             v-on:keyup.enter="submitMfaCode"
diff --git a/src/popup/components/Main.vue b/src/popup/components/Main.vue
index d1984c1..cb34818 100644
--- a/src/popup/components/Main.vue
+++ b/src/popup/components/Main.vue
@@ -5,7 +5,7 @@
     <!-- Main Page -->
     <div class="container">
       <div v-if="recommendation.show" class="text-center">
-        <div class="" style="font-size: 12px">
+        <div class="" style="font-size: 12px;">
           You created this alias on this website before:
         </div>
         <div class="flex-grow-1">
@@ -27,14 +27,14 @@
       <div>
         <p
           class="font-weight-bold mt-2 align-self-center"
-          style="display: inline-block"
+          style="display: inline-block;"
         >
           New Alias
         </p>
 
         <button
           :disabled="loading || !canCreate"
-          style="margin-left: 15px"
+          style="margin-left: 15px;"
           class="btn btn-outline-primary btn-sm"
           title="Generate a totally random alias."
           @click="createRandomAlias"
@@ -49,7 +49,7 @@
           <div class="row mb-2">
             <div
               class="col align-self-start input-group-sm"
-              style="padding-right: 0"
+              style="padding-right: 0;"
             >
               <input
                 v-model="aliasPrefix"
@@ -63,7 +63,7 @@
 
             <div
               class="col align-self-start input-group-sm"
-              style="padding-left: 5px; padding-right: 5px"
+              style="padding-left: 5px; padding-right: 5px;"
             >
               <select
                 v-model="signedSuffix"
@@ -82,7 +82,7 @@
 
             <button
               :disabled="loading || !canCreate"
-              style="margin-right: 15px"
+              style="margin-right: 15px;"
               class="btn btn-primary btn-sm align-self-start"
             >
               Create
@@ -90,7 +90,7 @@
           </div>
           <div
             class="row text-danger"
-            style="font-size: 12px"
+            style="font-size: 12px;"
             v-if="aliasPrefixError != ''"
           >
             <div class="col">
@@ -100,13 +100,13 @@
         </form>
       </div>
 
-      <div class="mb-1 text-center" v-if="aliasPrefix" style="font-size: 12px">
+      <div class="mb-1 text-center" v-if="aliasPrefix" style="font-size: 12px;">
         You're about to create alias
         <span class="text-primary">{{ aliasPrefix }}{{ signedSuffix[0] }}</span>
       </div>
 
       <div v-if="!canCreate">
-        <p class="text-danger" style="font-size: 14px">
+        <p class="text-danger" style="font-size: 14px;">
           You have reached limit number of email aliases in free plan, please
           <a :href="apiUrl + '/dashboard/pricing'" target="_blank">upgrade</a>
           or reuse one of the existing aliases.
@@ -119,7 +119,7 @@
           Or use an existing alias
         </div>
 
-        <div class="mx-auto" style="max-width: 60%">
+        <div class="mx-auto" style="max-width: 60%;">
           <input
             v-model="searchString"
             v-on:keyup.enter="loadAlias"
@@ -133,7 +133,7 @@
               v-if="searchString"
               @click="resetSearch"
               class="float-right"
-              style="color: blue; border: none; padding: 0; background: none"
+              style="color: blue; border: none; padding: 0; background: none;"
             >
               Reset
             </button>
@@ -157,7 +157,7 @@
                   </a>
                   <div class="list-item-email-fade" />
                 </div>
-                <div style="white-space: nowrap">
+                <div style="white-space: nowrap;">
                   <toggle-button
                     :value="alias.enabled"
                     color="#b02a8f"
@@ -166,7 +166,10 @@
                     @change="toggleAlias(alias)"
                   />
 
-                  <div class="btn-svg btn-send" @click="goToReverseAlias(alias)">
+                  <div
+                    class="btn-svg btn-send"
+                    @click="goToReverseAlias(alias)"
+                  >
                     <font-awesome-icon icon="paper-plane" />
                   </div>
 
@@ -189,7 +192,7 @@
                 {{ alias.note }}
               </div>
 
-              <div class="font-weight-lighter" style="font-size: 11px">
+              <div class="font-weight-lighter" style="font-size: 11px;">
                 {{ alias.nb_forward }} forwards, {{ alias.nb_reply }} replies,
                 {{ alias.nb_block }} blocks.
               </div>
@@ -210,7 +213,7 @@
       <div v-if="isFetchingAlias" class="text-secondary mx-auto text-center">
         <img
           src="/images/loading-three-dots.svg"
-          style="width: 80px; margin: 20px"
+          style="width: 80px; margin: 20px;"
         />
       </div>
     </div>
diff --git a/src/popup/components/NewAliasResult.vue b/src/popup/components/NewAliasResult.vue
index c3f18bb..be33c50 100644
--- a/src/popup/components/NewAliasResult.vue
+++ b/src/popup/components/NewAliasResult.vue
@@ -41,7 +41,7 @@
           <a
             @click="doNotAskRateAgain"
             class="text-secondary cursor"
-            style="font-size: 0.7em"
+            style="font-size: 0.7em;"
           >
             Do not ask again
           </a>
diff --git a/src/popup/components/ReverseAlias.vue b/src/popup/components/ReverseAlias.vue
index b8c47a9..092dbdd 100644
--- a/src/popup/components/ReverseAlias.vue
+++ b/src/popup/components/ReverseAlias.vue
@@ -1,20 +1,30 @@
 <template>
-  <div class="content ">
+  <div class="content">
     <div class="p-2 container">
       <!-- Reverse-alias screen -->
       <div class="m-2 p-2" v-if="!createdReverseAlias">
-        <p>Create reverse-alias for <span class="font-weight-bold">{{ alias.email }}</span></p>
+        <p>
+          Create reverse-alias for
+          <span class="font-weight-bold">{{ alias.email }}</span>
+        </p>
         <small>
-          To send an email from your alias to a contact, you need to create a reverse-alias, a special email address. When you send an email to the reverse-alias, the email will be sent from your alias to the contact.<br/><br/>
-          This Youtube video can also quickly walk you through the steps: <a href="https://www.youtube.com/watch?v=VsypF-DBaow" target="_blank" rel="noopener noreferrer">How to send emails from an alias</a>
+          To send an email from your alias to a contact, you need to create a
+          reverse-alias, a special email address. When you send an email to the
+          reverse-alias, the email will be sent from your alias to the
+          contact.<br /><br />
+          This Youtube video can also quickly walk you through the steps:
+          <a
+            href="https://www.youtube.com/watch?v=VsypF-DBaow"
+            target="_blank"
+            rel="noopener noreferrer"
+            >How to send emails from an alias</a
+          >
         </small>
-        <br/><br/>
+        <br /><br />
         <label>
           Receiver:
           <font-awesome-icon
-            v-b-tooltip.hover.top="
-              'Where do you want to send the email?'
-            "
+            v-b-tooltip.hover.top="'Where do you want to send the email?'"
             icon="question-circle"
           />
         </label>
@@ -43,10 +53,14 @@
           </a>
         </p>
         <small>
-          Emails sent to this address will be forwarded to <b>{{ createdReverseAlias.contact }}</b>. The receiver will see <b>{{ alias.email }}</b> as your email.<br/>
-          You can use this reverse-alias from one of these mailbox(es):<br/>
+          Emails sent to this address will be forwarded to
+          <b>{{ createdReverseAlias.contact }}</b
+          >. The receiver will see <b>{{ alias.email }}</b> as your email.<br />
+          You can use this reverse-alias from one of these mailbox(es):<br />
           <ul>
-            <li v-for="mailbox in alias.mailboxes" v-bind:key="mailbox.id">{{ mailbox.email }}</li>
+            <li v-for="mailbox in alias.mailboxes" v-bind:key="mailbox.id">
+              {{ mailbox.email }}
+            </li>
           </ul>
         </small>
       </div>
@@ -61,11 +75,7 @@
           Create a reverse-alias
         </button>
 
-        <button
-          class="btn btn-sm btn-primary"
-          @click="backToMainPage"
-          v-else
-        >
+        <button class="btn btn-sm btn-primary" @click="backToMainPage" v-else>
           <font-awesome-icon icon="arrow-left" />
           Back
         </button>
@@ -86,7 +96,7 @@ export default {
       alias: SLStorage.getTemporary("alias"),
       createdReverseAlias: null,
       loading: false,
-      receiverEmail: '',
+      receiverEmail: "",
     };
   },
   methods: {
@@ -112,7 +122,7 @@ export default {
         API_ON_ERR.TOAST
       );
       this.createdReverseAlias = data;
-      console.log(this.createdReverseAlias)
+      console.log(this.createdReverseAlias);
       this.loading = false;
     },
 
diff --git a/src/popup/components/SelfHostSetting.vue b/src/popup/components/SelfHostSetting.vue
index 1f27b50..be86b88 100644
--- a/src/popup/components/SelfHostSetting.vue
+++ b/src/popup/components/SelfHostSetting.vue
@@ -7,7 +7,7 @@
       </div>
       <div class="mb-2">The default API URL is https://app.simplelogin.io</div>
 
-      <div style="margin: auto">
+      <div style="margin: auto;">
         <input
           v-model="apiUrl"
           v-on:keyup.enter="saveApiUrl"
diff --git a/src/popup/components/SplashScreen.vue b/src/popup/components/SplashScreen.vue
index e849b4e..3605e99 100644
--- a/src/popup/components/SplashScreen.vue
+++ b/src/popup/components/SplashScreen.vue
@@ -1,5 +1,5 @@
 <template>
-  <div v-if="show" style="height: 400px">
+  <div v-if="show" style="height: 400px;">
     <div class="splash overlay">
       <div class="overlay-content">
         <img class="logo" src="/images/horizontal-logo.svg" /><br />