From 61d7dcf61b2f98c3c06b5485525e746aab744b6a Mon Sep 17 00:00:00 2001
From: Andrew Bastin <andrewbastin.k@gmail.com>
Date: Mon, 13 Jan 2020 23:46:31 -0500
Subject: [PATCH 01/21] Added AxiosStrategy and ProxyStrategy Network
 Strategies

---
 functions/strategies/AxiosStrategy.js |  8 ++++++++
 functions/strategies/ProxyStrategy.js | 13 +++++++++++++
 2 files changed, 21 insertions(+)
 create mode 100644 functions/strategies/AxiosStrategy.js
 create mode 100644 functions/strategies/ProxyStrategy.js

diff --git a/functions/strategies/AxiosStrategy.js b/functions/strategies/AxiosStrategy.js
new file mode 100644
index 000000000..5c8020784
--- /dev/null
+++ b/functions/strategies/AxiosStrategy.js
@@ -0,0 +1,8 @@
+import axios from "axios";
+
+const axiosStrategy = async (req, _store) => {
+  const res = await axios(req);
+  return res;
+}
+
+export default axiosStrategy;
diff --git a/functions/strategies/ProxyStrategy.js b/functions/strategies/ProxyStrategy.js
new file mode 100644
index 000000000..9cac6f47d
--- /dev/null
+++ b/functions/strategies/ProxyStrategy.js
@@ -0,0 +1,13 @@
+import axios from "axios";
+
+const proxyStrategy = async (req, store) => {
+  const proxyRes = await axios.post(
+    store.state.postwoman.settings.PROXY_URL ||
+    "https://postwoman.apollotv.xyz/",
+    req
+  );
+
+  return proxyRes.data;
+}
+
+export default proxyStrategy;

From 3726f0a376c121c66115a65ce46d29aef39d0e05 Mon Sep 17 00:00:00 2001
From: Andrew Bastin <andrewbastin.k@gmail.com>
Date: Mon, 13 Jan 2020 23:47:28 -0500
Subject: [PATCH 02/21] Added sendNetworkRequest to detect appropriate strategy
 and use it

---
 functions/network.js | 13 +++++++++++++
 1 file changed, 13 insertions(+)
 create mode 100644 functions/network.js

diff --git a/functions/network.js b/functions/network.js
new file mode 100644
index 000000000..f2089363e
--- /dev/null
+++ b/functions/network.js
@@ -0,0 +1,13 @@
+import AxiosStrategy from "./strategies/AxiosStrategy";
+import ProxyStrategy from "./strategies/ProxyStrategy";
+
+
+const sendNetworkRequest = (req, store) => {
+  if (store.state.postwoman.settings.PROXY_ENABLED) {
+    return ProxyStrategy(req, store);
+  } else {
+    return AxiosStrategy(req, store);
+  }
+}
+
+export { sendNetworkRequest };

From 5ef1b5b75c2f6fe76c44eada1613ce623ba8e770 Mon Sep 17 00:00:00 2001
From: Andrew Bastin <andrewbastin.k@gmail.com>
Date: Mon, 13 Jan 2020 23:48:20 -0500
Subject: [PATCH 03/21] Refactor index.vue to use Network Strategies

---
 pages/index.vue | 15 ++-------------
 1 file changed, 2 insertions(+), 13 deletions(-)

diff --git a/pages/index.vue b/pages/index.vue
index 422b6ade5..9f61a3d6e 100644
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -1128,6 +1128,7 @@ import getEnvironmentVariablesFromScript from "../functions/preRequest";
 import parseTemplateString from "../functions/templating";
 import AceEditor from "../components/ace-editor";
 import { tokenRequest, oauthRedirect } from "../assets/js/oauth";
+import { sendNetworkRequest } from "../functions/network";
 
 const statusCategories = [
   {
@@ -1985,20 +1986,8 @@ export default {
       if (typeof requestOptions.data === "string") {
         requestOptions.data = parseTemplateString(requestOptions.data);
       }
-      const config = this.$store.state.postwoman.settings.PROXY_ENABLED
-        ? {
-            method: "POST",
-            url:
-              this.$store.state.postwoman.settings.PROXY_URL ||
-              "https://postwoman.apollotv.xyz/",
-            data: requestOptions
-          }
-        : requestOptions;
 
-      const response = await this.$axios(config);
-      return this.$store.state.postwoman.settings.PROXY_ENABLED
-        ? response.data
-        : response;
+      return await sendNetworkRequest(requestOptions, this.$store);
     },
     async sendRequest() {
       this.$toast.clear();

From 3a8b4337f0309a167601a35462d81b851b5f7bba Mon Sep 17 00:00:00 2001
From: Andrew Bastin <andrewbastin.k@gmail.com>
Date: Mon, 13 Jan 2020 23:55:03 -0500
Subject: [PATCH 04/21] Refactor graphql page to use Network Strategies

---
 pages/graphql.vue | 17 ++---------------
 1 file changed, 2 insertions(+), 15 deletions(-)

diff --git a/pages/graphql.vue b/pages/graphql.vue
index 4f21ba2d8..6e66a96e6 100644
--- a/pages/graphql.vue
+++ b/pages/graphql.vue
@@ -386,6 +386,7 @@ import axios from "axios";
 import * as gql from "graphql";
 import textareaAutoHeight from "../directives/textareaAutoHeight";
 import AceEditor from "../components/ace-editor";
+import { sendNetworkRequest } from "../functions/network";
 
 export default {
   directives: {
@@ -685,21 +686,7 @@ export default {
           data: JSON.stringify({ query: gqlQueryString, variables })
         };
 
-        const reqConfig = this.$store.state.postwoman.settings.PROXY_ENABLED
-          ? {
-              method: "post",
-              url:
-                this.$store.state.postwoman.settings.PROXY_URL ||
-                `https://postwoman.apollotv.xyz/`,
-              data: reqOptions
-            }
-          : reqOptions;
-
-        const res = await axios(reqConfig);
-
-        const data = this.$store.state.postwoman.settings.PROXY_ENABLED
-          ? res.data
-          : res;
+        const data = await sendNetworkRequest(reqOptions, this.$store);
 
         this.responseString = JSON.stringify(data.data, null, 2);
 

From 8690d18695b788da33ee798e1e4d757b4a18dcf2 Mon Sep 17 00:00:00 2001
From: Alec Ananian <>
Date: Tue, 14 Jan 2020 07:43:41 -0800
Subject: [PATCH 05/21] Replaced hard-coded strings with localizable strings
 Added en locale as localization fallback

---
 components/collections/addCollection.vue      |   8 +-
 components/collections/addFolder.vue          |   8 +-
 components/collections/collection.vue         |  10 +-
 components/collections/editCollection.vue     |   6 +-
 components/collections/editFolder.vue         |   6 +-
 components/collections/editRequest.vue        |  14 +-
 components/collections/folder.vue             |   8 +-
 .../collections/importExportCollections.vue   |  14 +-
 components/collections/index.vue              |   4 +-
 components/collections/request.vue            |   8 +-
 components/collections/saveRequestAs.vue      |  18 +--
 components/graphql/field.vue                  |   2 +-
 components/graphql/type.vue                   |   2 +-
 components/history.vue                        |  77 +++++-----
 lang/en-US.js                                 | 137 +++++++++++++++++-
 layouts/default.vue                           |  27 ++--
 layouts/error.vue                             |   6 +-
 nuxt.config.js                                |   3 +
 pages/doc.vue                                 | 116 +++++++--------
 pages/graphql.vue                             |  75 +++++-----
 pages/index.vue                               | 129 +++++++++--------
 pages/realtime.vue                            |  40 ++---
 pages/settings.vue                            |  32 ++--
 23 files changed, 452 insertions(+), 298 deletions(-)

diff --git a/components/collections/addCollection.vue b/components/collections/addCollection.vue
index 2c68f630f..197cc412a 100644
--- a/components/collections/addCollection.vue
+++ b/components/collections/addCollection.vue
@@ -4,7 +4,7 @@
       <ul>
         <li>
           <div class="flex-wrap">
-            <h3 class="title">New Collection</h3>
+            <h3 class="title">{{ $t("new_collection") }}</h3>
             <div>
               <button class="icon" @click="hideModal">
                 <i class="material-icons">close</i>
@@ -17,7 +17,7 @@
     <div slot="body">
       <ul>
         <li>
-          <input type="text" v-model="name" placeholder="My New Collection" />
+          <input type="text" v-model="name" :placeholder="$t('my_new_collection')" />
         </li>
       </ul>
     </div>
@@ -26,10 +26,10 @@
         <span></span>
         <span>
           <button class="icon" @click="hideModal">
-            Cancel
+            {{ $t("cancel") }}
           </button>
           <button class="icon primary" @click="addNewCollection">
-            Save
+            {{ $t("save") }}
           </button>
         </span>
       </div>
diff --git a/components/collections/addFolder.vue b/components/collections/addFolder.vue
index 40ec5c574..5601e6f47 100644
--- a/components/collections/addFolder.vue
+++ b/components/collections/addFolder.vue
@@ -4,7 +4,7 @@
       <ul>
         <li>
           <div class="flex-wrap">
-            <h3 class="title">New Folder</h3>
+            <h3 class="title">{{ $t("new_folder") }}</h3>
             <div>
               <button class="icon" @click="hideModal">
                 <i class="material-icons">close</i>
@@ -17,7 +17,7 @@
     <div slot="body">
       <ul>
         <li>
-          <input type="text" v-model="name" placeholder="My New Folder" />
+          <input type="text" v-model="name" :placeholder="$t('my_new_folder')" />
         </li>
       </ul>
     </div>
@@ -26,10 +26,10 @@
         <span></span>
         <span>
           <button class="icon" @click="hideModal">
-            Cancel
+            {{ $t("cancel") }}
           </button>
           <button class="icon primary" @click="addNewFolder">
-            Save
+            {{ $t("save") }}
           </button>
         </span>
       </div>
diff --git a/components/collections/collection.vue b/components/collections/collection.vue
index d6a6e6a8d..da4e189f5 100644
--- a/components/collections/collection.vue
+++ b/components/collections/collection.vue
@@ -10,14 +10,14 @@
         </button>
       </div>
       <v-popover>
-        <button class="tooltip-target icon" v-tooltip="'More'">
+        <button class="tooltip-target icon" v-tooltip="$t('more')">
           <i class="material-icons">more_vert</i>
         </button>
         <template slot="popover">
           <div>
             <button class="icon" @click="$emit('add-folder')" v-close-popover>
               <i class="material-icons">create_new_folder</i>
-              <span>New folder</span>
+              <span>{{ $t("new_folder") }}</span>
             </button>
           </div>
           <div>
@@ -27,13 +27,13 @@
               v-close-popover
             >
               <i class="material-icons">create</i>
-              <span>Edit</span>
+              <span>{{ $t("edit") }}</span>
             </button>
           </div>
           <div>
             <button class="icon" @click="removeCollection" v-close-popover>
               <i class="material-icons">delete</i>
-              <span>Delete</span>
+              <span>{{ $t("delete") }}</span>
             </button>
           </div>
         </template>
@@ -56,7 +56,7 @@
             collection.folders.length === 0 && collection.requests.length === 0
           "
         >
-          <label>Collection is empty</label>
+          <label>{{ $t("collection_empty") }}</label>
         </li>
       </ul>
       <ul>
diff --git a/components/collections/editCollection.vue b/components/collections/editCollection.vue
index 3a3feac53..4021557fe 100644
--- a/components/collections/editCollection.vue
+++ b/components/collections/editCollection.vue
@@ -4,7 +4,7 @@
       <ul>
         <li>
           <div class="flex-wrap">
-            <h3 class="title">Edit Collection</h3>
+            <h3 class="title">{{ $t("edit_collection") }}</h3>
             <div>
               <button class="icon" @click="hideModal">
                 <i class="material-icons">close</i>
@@ -31,10 +31,10 @@
         <span></span>
         <span>
           <button class="icon" @click="hideModal">
-            Cancel
+            {{ $t("cancel") }}
           </button>
           <button class="icon primary" @click="saveCollection">
-            Save
+            {{ $t("save") }}
           </button>
         </span>
       </div>
diff --git a/components/collections/editFolder.vue b/components/collections/editFolder.vue
index 17388fd34..9cdfe000d 100644
--- a/components/collections/editFolder.vue
+++ b/components/collections/editFolder.vue
@@ -4,7 +4,7 @@
       <ul>
         <li>
           <div class="flex-wrap">
-            <h3 class="title">Edit Folder</h3>
+            <h3 class="title">{{ $t("edit_folder") }}</h3>
             <div>
               <button class="icon" @click="hideModal">
                 <i class="material-icons">close</i>
@@ -31,10 +31,10 @@
         <span></span>
         <span>
           <button class="icon" @click="hideModal">
-            Cancel
+            {{ $t("cancel") }}
           </button>
           <button class="icon primary" @click="editFolder">
-            Save
+            {{ $t("save") }}
           </button>
         </span>
       </div>
diff --git a/components/collections/editRequest.vue b/components/collections/editRequest.vue
index 12d818909..f8fea28dc 100644
--- a/components/collections/editRequest.vue
+++ b/components/collections/editRequest.vue
@@ -4,7 +4,7 @@
       <ul>
         <li>
           <div class="flex-wrap">
-            <h3 class="title">Edit Request</h3>
+            <h3 class="title">{{ $t("edit_request") }}</h3>
             <div>
               <button class="icon" @click="hideModal">
                 <i class="material-icons">close</i>
@@ -17,7 +17,7 @@
     <div slot="body">
       <ul>
         <li>
-          <label for="selectLabel">Label</label>
+          <label for="selectLabel">{{ $t("label") }}</label>
           <input
             type="text"
             id="selectLabel"
@@ -25,7 +25,7 @@
             @keyup.enter="saveRequest"
             :placeholder="request.name"
           />
-          <label for="selectCollection">Collection</label>
+          <label for="selectCollection">{{ $t("collection") }}</label>
           <span class="select-wrapper">
             <select
               type="text"
@@ -38,7 +38,7 @@
                 hidden
                 disabled
                 selected
-                >Current Collection</option
+                >{{ $t("current_collection") }}</option
               >
               <option
                 v-for="(collection, index) in $store.state.postwoman
@@ -50,7 +50,7 @@
               </option>
             </select>
           </span>
-          <label for="selectFolder">Folder</label>
+          <label for="selectFolder">{{ $t("folder") }}</label>
           <span class="select-wrapper">
             <select
               type="text"
@@ -75,10 +75,10 @@
         <span></span>
         <span>
           <button class="icon" @click="hideModal">
-            Cancel
+            {{ $t("cancel") }}
           </button>
           <button class="icon primary" @click="saveRequest">
-            Save
+            {{ $t("save") }}
           </button>
         </span>
       </div>
diff --git a/components/collections/folder.vue b/components/collections/folder.vue
index 240778444..1addefd84 100644
--- a/components/collections/folder.vue
+++ b/components/collections/folder.vue
@@ -10,20 +10,20 @@
         </button>
       </div>
       <v-popover>
-        <button class="tooltip-target icon" v-tooltip="'More'">
+        <button class="tooltip-target icon" v-tooltip="$t('more')">
           <i class="material-icons">more_vert</i>
         </button>
         <template slot="popover">
           <div>
             <button class="icon" @click="editFolder" v-close-popover>
               <i class="material-icons">edit</i>
-              <span>Edit</span>
+              <span>{{ $t("edit") }}</span>
             </button>
           </div>
           <div>
             <button class="icon" @click="removeFolder" v-close-popover>
               <i class="material-icons">delete</i>
-              <span>Delete</span>
+              <span>{{ $t("delete") }}</span>
             </button>
           </div>
         </template>
@@ -49,7 +49,7 @@
           />
         </li>
         <li v-if="folder.requests.length === 0">
-          <label>Folder is empty</label>
+          <label>{{ $t("folder_empty") }}</label>
         </li>
       </ul>
     </div>
diff --git a/components/collections/importExportCollections.vue b/components/collections/importExportCollections.vue
index e6396bc66..254bdc684 100644
--- a/components/collections/importExportCollections.vue
+++ b/components/collections/importExportCollections.vue
@@ -23,10 +23,10 @@
           <button
             class="icon"
             @click="openDialogChooseFileToReplaceWith"
-            v-tooltip="'Replace current'"
+            v-tooltip="$t('replace_current')"
           >
             <i class="material-icons">create_new_folder</i>
-            <span>Replace with JSON</span>
+            <span>{{ $t("replace_json") }}</span>
             <input
               type="file"
               @change="replaceWithJSON"
@@ -37,10 +37,10 @@
           <button
             class="icon"
             @click="openDialogChooseFileToImportFrom"
-            v-tooltip="'Preserve current'"
+            v-tooltip="$t('preserve_current')"
           >
             <i class="material-icons">folder_shared</i>
-            <span>Import from JSON</span>
+            <span>{{ $t("import_json") }}</span>
             <input
               type="file"
               @change="importFromJSON"
@@ -55,14 +55,14 @@
         <span></span>
         <span>
           <button class="icon" @click="hideModal">
-            Cancel
+            {{ $t("cancel") }}
           </button>
           <button
             class="icon primary"
             @click="exportJSON"
-            v-tooltip="'Download file'"
+            v-tooltip="$t('download_file')"
           >
-            Export
+            {{ $t("export") }}
           </button>
         </span>
       </div>
diff --git a/components/collections/index.vue b/components/collections/index.vue
index c55054891..21e060a62 100644
--- a/components/collections/index.vue
+++ b/components/collections/index.vue
@@ -43,14 +43,14 @@ TODO:
       <div>
         <button class="icon" @click="displayModalAdd(true)">
           <i class="material-icons">add</i>
-          <span>New</span>
+          <span>{{ $t("new") }}</span>
         </button>
       </div>
       <div>
         <button
           class="icon"
           @click="displayModalImportExport(true)"
-          v-tooltip="'Import / Export'"
+          v-tooltip="$t('import_export')"
         >
           <i class="material-icons">import_export</i>
         </button>
diff --git a/components/collections/request.vue b/components/collections/request.vue
index 7590acb3b..b687f0ec3 100644
--- a/components/collections/request.vue
+++ b/components/collections/request.vue
@@ -1,26 +1,26 @@
 <template>
   <div class="flex-wrap">
     <div>
-      <button class="icon" @click="selectRequest()" v-tooltip="'Use request'">
+      <button class="icon" @click="selectRequest()" v-tooltip="$t('use_request')">
         <i class="material-icons">insert_drive_file</i>
         <span>{{ request.name }}</span>
       </button>
     </div>
     <v-popover>
-      <button class="tooltip-target icon" v-tooltip="'More'">
+      <button class="tooltip-target icon" v-tooltip="$t('more')">
         <i class="material-icons">more_vert</i>
       </button>
       <template slot="popover">
         <div>
           <button class="icon" @click="$emit('edit-request')" v-close-popover>
             <i class="material-icons">edit</i>
-            <span>Edit</span>
+            <span>{{ $t("edit") }}</span>
           </button>
         </div>
         <div>
           <button class="icon" @click="removeRequest" v-close-popover>
             <i class="material-icons">delete</i>
-            <span>Delete</span>
+            <span>{{ $t("delete") }}</span>
           </button>
         </div>
       </template>
diff --git a/components/collections/saveRequestAs.vue b/components/collections/saveRequestAs.vue
index 26a174d31..6cf3d6491 100644
--- a/components/collections/saveRequestAs.vue
+++ b/components/collections/saveRequestAs.vue
@@ -4,7 +4,7 @@
       <ul>
         <li>
           <div class="flex-wrap">
-            <h3 class="title">Save Request As</h3>
+            <h3 class="title">{{ $t("save_request_as") }}</h3>
             <div>
               <button class="icon" @click="hideModal">
                 <i class="material-icons">close</i>
@@ -17,7 +17,7 @@
     <div slot="body">
       <ul>
         <li>
-          <label for="selectLabel">Label</label>
+          <label for="selectLabel">{{ $t("label") }}</label>
           <input
             type="text"
             id="selectLabel"
@@ -25,7 +25,7 @@
             :placeholder="defaultRequestName"
             @keyup.enter="saveRequestAs"
           />
-          <label for="selectCollection">Collection</label>
+          <label for="selectCollection">{{ $t("collection") }}</label>
           <span class="select-wrapper">
             <select
               type="text"
@@ -38,7 +38,7 @@
                 hidden
                 disabled
                 selected
-                >Select a Collection</option
+                >{{ $t("select_collection") }}</option
               >
               <option
                 v-for="(collection, index) in $store.state.postwoman
@@ -50,7 +50,7 @@
               </option>
             </select>
           </span>
-          <label for="selectFolder">Folder</label>
+          <label for="selectFolder">{{ $t("folder") }}</label>
           <span class="select-wrapper">
             <select
               type="text"
@@ -67,7 +67,7 @@
               </option>
             </select>
           </span>
-          <label for="selectRequest">Request</label>
+          <label for="selectRequest">{{ $t("request") }}</label>
           <span class="select-wrapper">
             <select
               type="text"
@@ -92,10 +92,10 @@
         <span></span>
         <span>
           <button class="icon" @click="hideModal">
-            Cancel
+            {{ $t("cancel") }}
           </button>
           <button class="icon primary" @click="saveRequestAs">
-            Save
+            {{ $t("save") }}
           </button>
         </span>
       </div>
@@ -184,7 +184,7 @@ export default {
       const userDidntSpecifyCollection =
         this.$data.requestData.collectionIndex === undefined;
       if (userDidntSpecifyCollection) {
-        this.$toast.error("Select a Collection", {
+        this.$toast.error(this.$t("select_collection"), {
           icon: "error"
         });
         return;
diff --git a/components/graphql/field.vue b/components/graphql/field.vue
index b0fc403e5..a6f5a6f6d 100644
--- a/components/graphql/field.vue
+++ b/components/graphql/field.vue
@@ -23,7 +23,7 @@
     </div>
 
     <div class="field-deprecated" v-if="gqlField.isDeprecated">
-      DEPRECATED
+      {{ $t("deprecated") }}
     </div>
   </div>
 </template>
diff --git a/components/graphql/type.vue b/components/graphql/type.vue
index 0c9b338cd..0c93299a2 100644
--- a/components/graphql/type.vue
+++ b/components/graphql/type.vue
@@ -6,7 +6,7 @@
     </div>
 
     <div v-if="gqlType.getFields">
-      <h5>FIELDS</h5>
+      <h5>{{ $t("fields") }}</h5>
       <div v-for="field in gqlType.getFields()" :key="field.name">
         <gql-field :gqlField="field" :jumpTypeCallback="jumpTypeCallback" />
       </div>
diff --git a/components/history.vue b/components/history.vue
index ad248c56f..7b6a6102c 100644
--- a/components/history.vue
+++ b/components/history.vue
@@ -1,11 +1,16 @@
 <template>
-  <pw-section class="green" icon="history" label="History" ref="history">
+  <pw-section
+    class="green"
+    icon="history"
+    :label="$t('history')"
+    ref="history"
+  >
     <ul>
       <li id="filter-history">
         <input
           aria-label="Search"
           type="text"
-          placeholder="search history"
+          :placeholder="$t('search_history')"
           v-model="filterText"
         />
       </li>
@@ -22,7 +27,7 @@
             class="icon"
             :class="{ stared: entry.star }"
             @click="toggleStar(index)"
-            v-tooltip="{ content: !entry.star ? 'Add star' : 'Remove star' }"
+            v-tooltip="{ content: !entry.star ? $t('add_star') : $t('remove_star') }"
           >
             <i class="material-icons">
               {{ entry.star ? "star" : "star_border" }}
@@ -30,11 +35,11 @@
           </button>
           <li>
             <input
-              aria-label="Label"
+              :aria-label="$t('label')"
               type="text"
               readonly
               :value="entry.label"
-              placeholder="No label"
+              :placeholder="$t('no_label')"
               class="bg-color"
             />
           </li>
@@ -53,7 +58,7 @@
             </button>
           </li> -->
           <v-popover>
-            <button class="tooltip-target icon" v-tooltip="'Options'">
+            <button class="tooltip-target icon" v-tooltip="$t('options')">
               <i class="material-icons">more_vert</i>
             </button>
             <template slot="popover">
@@ -62,11 +67,11 @@
                   class="icon"
                   :id="'use-button#' + index"
                   @click="useHistory(entry)"
-                  aria-label="Edit"
+                  :aria-label="$t('edit')"
                   v-close-popover
                 >
                   <i class="material-icons">restore</i>
-                  <span>Restore</span>
+                  <span>{{ $t("restore") }}</span>
                 </button>
               </div>
               <div>
@@ -74,11 +79,11 @@
                   class="icon"
                   :id="'delete-button#' + index"
                   @click="deleteHistory(entry)"
-                  aria-label="Delete"
+                  :aria-label="$t('delete')"
                   v-close-popover
                 >
                   <i class="material-icons">delete</i>
-                  <span>Delete</span>
+                  <span>{{ $t("delete") }}</span>
                 </button>
               </div>
             </template>
@@ -87,7 +92,7 @@
         <div class="show-on-large-screen">
           <li class="method-list-item">
             <input
-              aria-label="Method"
+              :aria-label="$t('method')"
               type="text"
               readonly
               :value="entry.method"
@@ -105,20 +110,20 @@
         <div class="show-on-large-screen">
           <li>
             <input
-              aria-label="URL"
+              :aria-label="$t('url')"
               type="text"
               readonly
               :value="entry.url"
-              placeholder="No URL"
+              :placeholder="$t('no_url')"
             />
           </li>
           <li>
             <input
-              aria-label="Path"
+              :aria-label="$t('path')"
               type="text"
               readonly
               :value="entry.path"
-              placeholder="No path"
+              :placeholder="$t('no_path')"
             />
           </li>
         </div>
@@ -126,7 +131,7 @@
           <div v-if="showMore" class="show-on-large-screen">
             <li>
               <input
-                aria-label="Time"
+                :aria-label="$t('time')"
                 type="text"
                 readonly
                 :value="entry.time"
@@ -135,20 +140,20 @@
             </li>
             <li>
               <input
-                aria-label="Duration"
+                :aria-label="$t('duration')"
                 type="text"
                 readonly
                 :value="entry.duration"
-                placeholder="No duration"
+                :placeholder="$t('no_duration')"
               />
             </li>
             <li>
               <input
-                aria-label="Pre Request Script"
+                :aria-label="$t('prerequest_script')"
                 type="text"
                 readonly
                 :value="entry.preRequestScript"
-                placeholder="No pre request script"
+                :placeholder="$t('no_prerequest_script')"
               />
             </li>
           </div>
@@ -159,11 +164,11 @@
       :class="{ hidden: filteredHistory.length != 0 || history.length === 0 }"
     >
       <li>
-        <label>Nothing found "{{ filterText }}"</label>
+        <label>{{ $t("nothing_found") }} "{{ filterText }}"</label>
       </li>
     </ul>
     <p v-if="history.length === 0" class="info">
-      History is empty
+      {{ $t("history_empty") }}
     </p>
     <div v-if="history.length !== 0">
       <div class="flex-wrap" v-if="!isClearingHistory">
@@ -174,23 +179,23 @@
           @click="enableHistoryClearing"
         >
           <i class="material-icons">clear_all</i>
-          <span>Clear All</span>
+          <span>{{ $t("clear_all") }}</span>
         </button>
         <v-popover>
-          <button class="tooltip-target icon" v-tooltip="'Sort'">
+          <button class="tooltip-target icon" v-tooltip="$t('sort')">
             <i class="material-icons">sort</i>
           </button>
           <template slot="popover">
             <div>
               <button class="icon" @click="sort_by_label()" v-close-popover>
                 <i class="material-icons">sort_by_alpha</i>
-                <span>Label</span>
+                <span>{{ $t("label") }}</span>
               </button>
             </div>
             <div>
               <button class="icon" @click="sort_by_time()" v-close-popover>
                 <i class="material-icons">access_time</i>
-                <span>Time</span>
+                <span>{{ $t("time") }}</span>
               </button>
             </div>
             <div>
@@ -200,25 +205,25 @@
                 v-close-popover
               >
                 <i class="material-icons">assistant</i>
-                <span>Status</span>
+                <span>{{ $t("status") }}</span>
               </button>
             </div>
             <div>
               <button class="icon" @click="sort_by_url()" v-close-popover>
                 <i class="material-icons">language</i>
-                <span>URL</span>
+                <span>{{ $t("url") }}</span>
               </button>
             </div>
             <div>
               <button class="icon" @click="sort_by_path()" v-close-popover>
                 <i class="material-icons">timeline</i>
-                <span>Path</span>
+                <span>{{ $t("path") }}</span>
               </button>
             </div>
             <div v-if="showMore">
               <button class="icon" @click="sort_by_duration()" v-close-popover>
                 <i class="material-icons">timer</i>
-                <span>Duration</span>
+                <span>{{ $t("duration") }}</span>
               </button>
             </div>
             <div>
@@ -226,20 +231,20 @@
                 <i class="material-icons">
                   {{ !showMore ? "first_page" : "last_page" }}
                 </i>
-                <span>{{ !showMore ? "Show more" : "Hide more" }}</span>
+                <span>{{ !showMore ? $t("show_more") : $t("hide_more") }}</span>
               </button>
             </div>
           </template>
         </v-popover>
       </div>
       <div class="flex-wrap" v-else>
-        <label for="clear-history-button" class="info">Are you sure?</label>
+        <label for="clear-history-button" class="info">{{ $t("are_you_sure") }}</label>
         <div>
           <button
             class="icon"
             id="confirm-clear-history-button"
             @click="clearHistory"
-            v-tooltip="'Yes'"
+            v-tooltip="$t('yes')"
           >
             <i class="material-icons">done</i>
           </button>
@@ -247,7 +252,7 @@
             class="icon"
             id="reject-clear-history-button"
             @click="disableHistoryClearing"
-            v-tooltip="'No'"
+            v-tooltip="$t('no')"
           >
             <i class="material-icons">close</i>
           </button>
@@ -371,7 +376,7 @@ export default {
       this.filterText = "";
       this.disableHistoryClearing();
       updateOnLocalStorage("history", this.history);
-      this.$toast.error("History Deleted", {
+      this.$toast.error(this.$t("history_deleted"), {
         icon: "delete"
       });
     },
@@ -392,7 +397,7 @@ export default {
         this.filterText = "";
       }
       updateOnLocalStorage("history", this.history);
-      this.$toast.error("Deleted", {
+      this.$toast.error(this.$t("deleted"), {
         icon: "delete"
       });
     },
diff --git a/lang/en-US.js b/lang/en-US.js
index 9ad7e21a1..0fd4d880d 100644
--- a/lang/en-US.js
+++ b/lang/en-US.js
@@ -106,5 +106,140 @@ export default {
   client_id: "Client ID",
   scope: "Scope",
   state: "State",
-  token_req_list: "Token Request List"
+  token_req_list: "Token Request List",
+  no_path: "No path",
+  no_label: "No label",
+  prerequest_script: "Pre-Request Script",
+  no_prerequest_script: "No pre-request script",
+  search_history: "search history",
+  history_empty: "History is empty",
+  history_deleted: "History Deleted",
+  clear: "Clear",
+  clear_all: "Clear All",
+  cleared: "Cleared",
+  close: "Close",
+  sort: "Sort",
+  time: "Time",
+  duration: "Duration",
+  no_duration: "No duration",
+  show_more: "Show more",
+  hide_more: "Hide more",
+  collection: "Collection",
+  current_collection: "Current Collection",
+  select_collection: "Select a Collection",
+  create_collection: "Create a Collection",
+  new: "New",
+  import_export: "Import / Export",
+  more: "More",
+  folder: "Folder",
+  new_folder: "New Folder",
+  my_new_folder: "My New Folder",
+  folder_empty: "Folder is empty",
+  edit_folder: "Edit Folder",
+  edit: "Edit",
+  delete: "Delete",
+  deleted: "Deleted",
+  undo: "Undo",
+  collection_empty: "Collection is empty",
+  new_collection: "New Collection",
+  my_new_collection: "My New Collection",
+  edit_collection: "Edit Collection",
+  edit_request: "Edit Request",
+  save_request_as: "Save Request As",
+  export: "Export",
+  connecting_to: "Connecting to {name}...",
+  connected: "Connected",
+  connected_to: "Connected to {name}",
+  disconnected: "Disconnected",
+  disconnected_from: "Disconnected from {name}",
+  something_went_wrong: "Something went wrong!",
+  error_occurred: "An error has occurred.",
+  browser_support_sse: "This browser doesn't seems to have Server Sent Events support.",
+  log: "Log",
+  no_url: "No URL",
+  run_query: "Run Query",
+  copy_query: "Copy Query",
+  kinda_dark: "Kinda Dark",
+  clearly_white: "Clearly White",
+  just_black: "Just Black",
+  auto_system: "Auth (system)",
+  green: "Green",
+  yellow: "Yellow",
+  pink: "Pink",
+  red: "Red",
+  purple: "Purple",
+  orange: "Orange",
+  cyan: "Cyan",
+  blue: "Blue",
+  loading: "Loading...",
+  fetching: "Fetching...",
+  waiting_send_req: "(waiting to send request)",
+  cancel: "Cancel",
+  save: "Save",
+  dismiss: "Dismiss",
+  are_you_sure: "Are you sure?",
+  yes: "Yes",
+  no: "No",
+  restore: "Restore",
+  add_star: "Add star",
+  remove_star: "Remove star",
+  nothing_found: "Nothing found",
+  replace_current: "Replace current",
+  replace_json: "Replace with JSON",
+  preserve_current: "Preserve current",
+  import_json: "Import from JSON",
+  download_file: "Download file",
+  upload_file: "Upload file",
+  copy_response: "Copy response",
+  copy_code: "Copy code",
+  copy_schema: "Copy Schema",
+  use_request: "Use request",
+  documentation: "Documentation",
+  docs: "Docs",
+  reset_default: "Reset to default",
+  fields: "FIELDS",
+  deprecated: "DEPRECATED",
+  add_one_header: "(add at least one header)",
+  add_one_parameter: "(add at least one parameter)",
+  header_count: "header {count}",
+  parameter_count: "parameter {count}",
+  variable_count: "variable {count}",
+  value_count: "value {count}",
+  send_request_first: "Send a request first",
+  generate_docs: "Generate Documentation",
+  generate_docs_message: "Import any Postwoman Collection to Generate Documentation on-the-go.",
+  generate_docs_first: "Generate documentation first",
+  docs_generated: "Documentation generated",
+  import_collections: "Import collections",
+  optional: "(optional)",
+  json: "JSON",
+  none: "None",
+  username: "Username",
+  password: "Password",
+  token: "Token",
+  payload: "Payload",
+  choose_file: "Choose a file",
+  file_imported: "File imported",
+  f12_details: "(F12 for details)",
+  we_use_cookies: "We use cookies",
+  copied_to_clipboard: "Copied to clipboard",
+  finished_in: "Finished in {duration}ms",
+  check_console_details: "Check console for details.",
+  download_started: "Download started",
+  url_invalid_format: "URL is not formatted properly",
+  curl_invalid_format: "cURL is not formatted properly",
+  enable_proxy: "Try enabling Proxy",
+  complete_config_urls: "Please complete configuration urls.",
+  token_request_saved: "Token request saved",
+  donate_info1: "If you have enjoyed the productivity of using Postwoman, consider donating as a sign of appreciation.",
+  donate_info2: "You can support Postwoman development via the following methods:",
+  one_time_recurring: "One-time or recurring",
+  one_time: "One-time",
+  recurring: "Recurring",
+  wiki: "Wiki",
+  error: "Error",
+  go_home: "Go Home",
+  reload: "Reload",
+  enter_curl: "Enter cURL",
+  empty: "Empty"
 };
diff --git a/layouts/default.vue b/layouts/default.vue
index 30e0d494b..6ed7a7c0c 100644
--- a/layouts/default.vue
+++ b/layouts/default.vue
@@ -12,7 +12,7 @@
               :to="localePath('index')"
               :class="linkActive('/')"
               v-tooltip.right="$t('home')"
-              aria-label="Home"
+              :aria-label="$t('home')"
             >
               <logo alt class="material-icons" style="height: 24px;"></logo>
             </nuxt-link>
@@ -27,7 +27,7 @@
               :to="localePath('graphql')"
               :class="linkActive('/graphql')"
               v-tooltip.right="$t('graphql')"
-              aria-label="GraphQL"
+              :aria-label="$t('graphql')"
             >
               <svg
                 class="material-icons"
@@ -141,8 +141,8 @@
             <nuxt-link
               :to="localePath('doc')"
               :class="linkActive('/doc')"
-              v-tooltip.right="'Documentation'"
-              aria-label="Documentation"
+              v-tooltip.right="$t('documentation')"
+              :aria-label="$t('documentation')"
             >
               <i class="material-icons">books</i>
             </nuxt-link>
@@ -150,7 +150,7 @@
               :to="localePath('settings')"
               :class="linkActive('/settings')"
               v-tooltip.right="$t('settings')"
-              aria-label="Settings"
+              :aria-label="$t('settings')"
             >
               <i class="material-icons">settings</i>
             </nuxt-link>
@@ -289,7 +289,7 @@
                   <i class="material-icons">offline_bolt</i>
                 </button>
                 <v-popover>
-                  <button class="icon" v-tooltip="'More'">
+                  <button class="icon" v-tooltip="$t('more')">
                     <i class="material-icons">more_vert</i>
                   </button>
                   <template slot="popover">
@@ -454,18 +454,17 @@
       </div>
       <div slot="body">
         <p class="info">
-          If you have enjoyed the productivity of using Postwoman, consider
-          donating as a sign of appreciation.
+          {{ $t("donate_info1") }}
         </p>
         <p class="info">
-          You can support Postwoman development via the following methods:
+          {{ $t("donate_info2") }}
         </p>
         <div>
           <a
             href="https://opencollective.com/postwoman"
             target="_blank"
             rel="noopener"
-            v-tooltip.right="'One-time or recurring'"
+            v-tooltip.right="$t('one_time_recurring')"
           >
             <button class="icon">
               <i class="material-icons">donut_large</i>
@@ -478,7 +477,7 @@
             href="https://www.paypal.me/liyascthomas"
             target="_blank"
             rel="noopener"
-            v-tooltip.right="'One-time'"
+            v-tooltip.right="$t('one_time')"
           >
             <button class="icon">
               <i class="material-icons">payment</i>
@@ -491,7 +490,7 @@
             href="https://www.patreon.com/liyasthomas"
             target="_blank"
             rel="noopener"
-            v-tooltip.right="'Recurring'"
+            v-tooltip.right="$t('recurring')"
           >
             <button class="icon">
               <i class="material-icons">local_parking</i>
@@ -577,13 +576,13 @@ export default {
       this.showInstallPrompt = await intializePwa();
       let cookiesAllowed = localStorage.getItem("cookiesAllowed") === "yes";
       if (!cookiesAllowed) {
-        this.$toast.show("We use cookies", {
+        this.$toast.show(this.$t("we_use_cookies"), {
           icon: "info",
           duration: 5000,
           theme: "toasted-primary",
           action: [
             {
-              text: "Dismiss",
+              text: this.$t("dismiss"),
               onClick: (e, toastObject) => {
                 localStorage.setItem("cookiesAllowed", "yes");
                 toastObject.goAway(0);
diff --git a/layouts/error.vue b/layouts/error.vue
index 76a49a60f..ea7a3a1af 100644
--- a/layouts/error.vue
+++ b/layouts/error.vue
@@ -1,15 +1,15 @@
 <template>
   <div class="page page-error">
-    <img src="~static/icons/error.svg" alt="Error" class="error_banner" />
+    <img src="~static/icons/error.svg" :alt="$t('error')" class="error_banner" />
     <h2>{{ error.statusCode }}</h2>
     <h3>{{ error.message }}</h3>
     <p>
       <nuxt-link to="/">
-        <button>Go Home</button>
+        <button>{{ $t("go_home") }}</button>
       </nuxt-link>
     </p>
     <p>
-      <a href @click.prevent="reloadApplication">Reload</a>
+      <a href @click.prevent="reloadApplication">{{ $t("reload") }}</a>
     </p>
   </div>
 </template>
diff --git a/nuxt.config.js b/nuxt.config.js
index 3e70e1f1a..99d7d8dfc 100644
--- a/nuxt.config.js
+++ b/nuxt.config.js
@@ -361,6 +361,9 @@ export default {
       }
     ],
     defaultLocale: "en",
+    vueI18n: {
+      fallbackLocale: "en"
+    },
     lazy: true,
     langDir: "lang/"
   },
diff --git a/pages/doc.vue b/pages/doc.vue
index 34cd64ed0..7b8ca19a8 100644
--- a/pages/doc.vue
+++ b/pages/doc.vue
@@ -1,10 +1,10 @@
 <template>
   <div class="page">
-    <pw-section class="blue" label="Collections" ref="collections">
+    <pw-section class="blue" :label="$t('collections')" ref="collections">
       <ul>
         <li>
           <p class="info">
-            Import any Postwoman Collection to Generate Documentation on-the-go.
+            {{ $t("generate_docs_message") }}
           </p>
         </li>
       </ul>
@@ -14,10 +14,10 @@
             <button
               class="icon"
               @click="$refs.collectionUpload.click()"
-              v-tooltip="'JSON'"
+              v-tooltip="$t('json')"
             >
               <i class="material-icons">folder</i>
-              <span>Import collections</span>
+              <span>{{ $t("import_collections") }}</span>
             </button>
           </label>
           <input
@@ -48,7 +48,7 @@
         <li>
           <button class="icon" @click="getDoc">
             <i class="material-icons">book</i>
-            <span>Generate Documentation</span>
+            <span>{{ $t("generate_docs") }}</span>
           </button>
         </li>
       </ul>
@@ -56,7 +56,7 @@
 
     <pw-section class="green" label="Documentation" ref="documentation">
       <p v-if="this.items.length === 0" class="info">
-        Generate documentation first
+        {{ $t("generate_docs_first") }}
       </p>
       <div>
         <span
@@ -66,7 +66,7 @@
         >
           <h2>
             <i class="material-icons">folder</i>
-            {{ collection.name || "None" }}
+            {{ collection.name || $t("none") }}
           </h2>
           <span
             class="folder"
@@ -75,7 +75,7 @@
           >
             <h3>
               <i class="material-icons">folder_open</i>
-              {{ folder.name || "None" }}
+              {{ folder.name || $t("none") }}
             </h3>
             <span
               class="request"
@@ -84,46 +84,46 @@
             >
               <h4>
                 <i class="material-icons">insert_drive_file</i>
-                {{ request.name || "None" }}
+                {{ request.name || $t("none") }}
               </h4>
               <p class="doc-desc" v-if="request.url">
                 <span>
-                  URL: <code>{{ request.url || "None" }}</code>
+                  {{ $t("url") }}: <code>{{ request.url || $t("none") }}</code>
                 </span>
               </p>
               <p class="doc-desc" v-if="request.path">
                 <span>
-                  Path: <code>{{ request.path || "None" }}</code>
+                  {{ $t("path") }}: <code>{{ request.path || $t("none") }}</code>
                 </span>
               </p>
               <p class="doc-desc" v-if="request.method">
                 <span>
-                  Method: <code>{{ request.method || "None" }}</code>
+                  {{ $t("method") }}: <code>{{ request.method || $t("none") }}</code>
                 </span>
               </p>
               <p class="doc-desc" v-if="request.auth">
                 <span>
-                  Authentication:
-                  <code>{{ request.auth || "None" }}</code>
+                  {{ $t("authentication") }}:
+                  <code>{{ request.auth || $t("none") }}</code>
                 </span>
               </p>
               <p class="doc-desc" v-if="request.httpUser">
                 <span>
-                  Username: <code>{{ request.httpUser || "None" }}</code>
+                  {{ $t("username") }}: <code>{{ request.httpUser || $t("none") }}</code>
                 </span>
               </p>
               <p class="doc-desc" v-if="request.httpPassword">
                 <span>
-                  Password:
-                  <code>{{ request.httpPassword || "None" }}</code>
+                  {{ $t("password") }}:
+                  <code>{{ request.httpPassword || $t("none") }}</code>
                 </span>
               </p>
               <p class="doc-desc" v-if="request.bearerToken">
                 <span>
-                  Token: <code>{{ request.bearerToken || "None" }}</code>
+                  {{ $t("token") }}: <code>{{ request.bearerToken || $t("none") }}</code>
                 </span>
               </p>
-              <h4 v-if="request.headers.length > 0">Headers</h4>
+              <h4 v-if="request.headers.length > 0">{{ $t("headers") }}</h4>
               <span
                 v-if="request.headers"
                 v-for="header in request.headers"
@@ -131,12 +131,12 @@
               >
                 <p class="doc-desc">
                   <span>
-                    {{ header.key || "None" }}:
-                    <code>{{ header.value || "None" }}</code>
+                    {{ header.key || $t("none") }}:
+                    <code>{{ header.value || $t("none") }}</code>
                   </span>
                 </p>
               </span>
-              <h4 v-if="request.params.length > 0">Parameters</h4>
+              <h4 v-if="request.params.length > 0">{{ $t("parameters") }}</h4>
               <span
                 v-if="request.params"
                 v-for="parameter in request.params"
@@ -144,12 +144,12 @@
               >
                 <p class="doc-desc">
                   <span>
-                    {{ parameter.key || "None" }}:
-                    <code>{{ parameter.value || "None" }}</code>
+                    {{ parameter.key || $t("none") }}:
+                    <code>{{ parameter.value || $t("none") }}</code>
                   </span>
                 </p>
               </span>
-              <h4 v-if="request.bodyParam">Payload</h4>
+              <h4 v-if="request.bodyParam">{{ $t("payload") }}</h4>
               <span
                 v-if="request.bodyParam"
                 v-for="payload in request.bodyParam"
@@ -157,26 +157,26 @@
               >
                 <p class="doc-desc">
                   <span>
-                    {{ payload.key || "None" }}:
-                    <code>{{ payload.value || "None" }}</code>
+                    {{ payload.key || $t("none") }}:
+                    <code>{{ payload.value || $t("none") }}</code>
                   </span>
                 </p>
               </span>
               <p class="doc-desc" v-if="request.rawParams">
                 <span>
-                  Parameters: <code>{{ request.rawParams || "None" }}</code>
+                  {{ $t("parameters") }}: <code>{{ request.rawParams || $t("none") }}</code>
                 </span>
               </p>
               <p class="doc-desc" v-if="request.contentType">
                 <span>
-                  Content Type:
-                  <code>{{ request.contentType || "None" }}</code>
+                  {{ $t("content_type") }}:
+                  <code>{{ request.contentType || $t("none") }}</code>
                 </span>
               </p>
               <p class="doc-desc" v-if="request.requestType">
                 <span>
-                  Request Type:
-                  <code>{{ request.requestType || "None" }}</code>
+                  {{ $t("request_type") }}:
+                  <code>{{ request.requestType || $t("none") }}</code>
                 </span>
               </p>
             </span>
@@ -188,45 +188,45 @@
           >
             <h4>
               <i class="material-icons">insert_drive_file</i>
-              {{ request.name || "None" }}
+              {{ request.name || $t("none") }}
             </h4>
             <p class="doc-desc" v-if="request.url">
               <span>
-                URL: <code>{{ request.url || "None" }}</code>
+                {{ $t("url") }}: <code>{{ request.url || $t("none") }}</code>
               </span>
             </p>
             <p class="doc-desc" v-if="request.path">
               <span>
-                Path: <code>{{ request.path || "None" }}</code>
+                {{ $t("path") }}: <code>{{ request.path || $t("none") }}</code>
               </span>
             </p>
             <p class="doc-desc" v-if="request.method">
               <span>
-                Method: <code>{{ request.method || "None" }}</code>
+                {{ $t("method") }}: <code>{{ request.method || $t("none") }}</code>
               </span>
             </p>
             <p class="doc-desc" v-if="request.auth">
               <span>
-                Authentication:
-                <code>{{ request.auth || "None" }}</code>
+                {{ $t("authentication") }}:
+                <code>{{ request.auth || $t("none") }}</code>
               </span>
             </p>
             <p class="doc-desc" v-if="request.httpUser">
               <span>
-                Username: <code>{{ request.httpUser || "None" }}</code>
+                {{ $t("username") }}: <code>{{ request.httpUser || $t("none") }}</code>
               </span>
             </p>
             <p class="doc-desc" v-if="request.httpPassword">
               <span>
-                Password: <code>{{ request.httpPassword || "None" }}</code>
+                {{ $t("password") }}: <code>{{ request.httpPassword || $t("none") }}</code>
               </span>
             </p>
             <p class="doc-desc" v-if="request.bearerToken">
               <span>
-                Token: <code>{{ request.bearerToken || "None" }}</code>
+                {{ $t("token") }}: <code>{{ request.bearerToken || $t("none") }}</code>
               </span>
             </p>
-            <h4 v-if="request.headers.length > 0">Headers</h4>
+            <h4 v-if="request.headers.length > 0">{{ $t("headers") }}</h4>
             <span
               v-if="request.headers"
               v-for="header in request.headers"
@@ -234,12 +234,12 @@
             >
               <p class="doc-desc">
                 <span>
-                  {{ header.key || "None" }}:
-                  <code>{{ header.value || "None" }}</code>
+                  {{ header.key || $t("none") }}:
+                  <code>{{ header.value || $t("none") }}</code>
                 </span>
               </p>
             </span>
-            <h4 v-if="request.params.length > 0">Parameters</h4>
+            <h4 v-if="request.params.length > 0">{{ $t("parameters") }}</h4>
             <span
               v-if="request.params"
               v-for="parameter in request.params"
@@ -247,12 +247,12 @@
             >
               <p class="doc-desc">
                 <span>
-                  {{ parameter.key || "None" }}:
-                  <code>{{ parameter.value || "None" }}</code>
+                  {{ parameter.key || $t("none") }}:
+                  <code>{{ parameter.value || $t("none") }}</code>
                 </span>
               </p>
             </span>
-            <h4 v-if="request.bodyParam">Payload</h4>
+            <h4 v-if="request.bodyParam">{{ $t("payload") }}</h4>
             <span
               v-if="request.bodyParam"
               v-for="payload in request.bodyParam"
@@ -260,26 +260,26 @@
             >
               <p class="doc-desc">
                 <span>
-                  {{ payload.key || "None" }}:
-                  <code>{{ payload.value || "None" }}</code>
+                  {{ payload.key || $t("none") }}:
+                  <code>{{ payload.value || $t("none") }}</code>
                 </span>
               </p>
             </span>
             <p class="doc-desc" v-if="request.rawParams">
               <span>
-                Parameters: <code>{{ request.rawParams || "None" }}</code>
+                {{ $t("parameters") }}: <code>{{ request.rawParams || $t("none") }}</code>
               </span>
             </p>
             <p class="doc-desc" v-if="request.contentType">
               <span>
-                Content Type:
-                <code>{{ request.contentType || "None" }}</code>
+                {{ $t("content_type") }}:
+                <code>{{ request.contentType || $t("none") }}</code>
               </span>
             </p>
             <p class="doc-desc" v-if="request.requestType">
               <span>
-                Request Type:
-                <code>{{ request.requestType || "None" }}</code>
+                {{ $t("request_type") }}:
+                <code>{{ request.requestType || $t("none") }}</code>
               </span>
             </p>
           </span>
@@ -360,11 +360,11 @@ export default {
           this.collectionJSON = e.target.result;
         };
         reader.readAsText(file);
-        this.$toast.info("File imported", {
+        this.$toast.info(this.$t("file_imported"), {
           icon: "attach_file"
         });
       } else {
-        this.$toast.error("Choose a file", {
+        this.$toast.error(this.$t("choose_file"), {
           icon: "attach_file"
         });
       }
@@ -373,7 +373,7 @@ export default {
     getDoc() {
       try {
         this.items = JSON.parse(this.collectionJSON);
-        this.$toast.info("Documentation generated", {
+        this.$toast.info(this.$t("docs_generated"), {
           icon: "book"
         });
       } catch (e) {
diff --git a/pages/graphql.vue b/pages/graphql.vue
index 4f21ba2d8..98f6e427c 100644
--- a/pages/graphql.vue
+++ b/pages/graphql.vue
@@ -2,7 +2,7 @@
   <div class="page">
     <div class="content">
       <div class="page-columns inner-left">
-        <pw-section class="blue" label="Endpoint" ref="endpoint">
+        <pw-section class="blue" :label="$t('endpoint')" ref="endpoint">
           <ul>
             <li>
               <label for="url">{{ $t("url") }}</label>
@@ -25,7 +25,7 @@
           </ul>
         </pw-section>
 
-        <pw-section class="orange" label="Headers" ref="headers">
+        <pw-section class="orange" :label="$t('headers')" ref="headers">
           <ul>
             <li>
               <div class="flex-wrap">
@@ -34,7 +34,7 @@
                   <button
                     class="icon"
                     @click="headers = []"
-                    v-tooltip.bottom="'Clear'"
+                    v-tooltip.bottom="$t('clear')"
                   >
                     <i class="material-icons">clear_all</i>
                   </button>
@@ -45,7 +45,7 @@
                 readonly
                 v-textarea-auto-height="headerString"
                 v-model="headerString"
-                placeholder="(add at least one header)"
+                :placeholder="$t('add_one_header')"
                 rows="1"
               ></textarea>
             </li>
@@ -53,7 +53,7 @@
           <ul v-for="(header, index) in headers" :key="index">
             <li>
               <autocomplete
-                :placeholder="'header ' + (index + 1)"
+                :placeholder="$t('header_count', { count: index + 1 })"
                 :source="commonHeaders"
                 :spellcheck="false"
                 :value="header.key"
@@ -68,7 +68,7 @@
             </li>
             <li>
               <input
-                :placeholder="'value ' + (index + 1)"
+                :placeholder="$t('value_count', { count: index + 1 })"
                 :name="'value' + index"
                 :value="header.value"
                 @change="
@@ -85,6 +85,7 @@
                 <button
                   class="icon"
                   @click="removeRequestHeader(index)"
+                  v-tooltip.bottom="$t('delete')"
                   id="header"
                 >
                   <i class="material-icons">delete</i>
@@ -102,7 +103,7 @@
           </ul>
         </pw-section>
 
-        <pw-section class="green" label="Schema" ref="schema">
+        <pw-section class="green" :label="$t('schema')" ref="schema">
           <div class="flex-wrap">
             <label>{{ $t("response") }}</label>
             <div>
@@ -112,8 +113,8 @@
                 ref="ToggleExpandResponse"
                 v-tooltip="{
                   content: !expandResponse
-                    ? 'Expand response'
-                    : 'Collapse response'
+                    ? $t('expand_response')
+                    : $t('collapse_response')
                 }"
               >
                 <i class="material-icons">
@@ -124,7 +125,7 @@
                 class="icon"
                 @click="downloadResponse"
                 ref="downloadResponse"
-                v-tooltip="'Download file'"
+                v-tooltip="$t('download_file')"
               >
                 <i class="material-icons">get_app</i>
               </button>
@@ -132,7 +133,7 @@
                 class="icon"
                 ref="copySchemaCode"
                 @click="copySchema"
-                v-tooltip="'Copy Schema'"
+                v-tooltip="$t('copy_schema')"
               >
                 <i class="material-icons">file_copy</i>
               </button>
@@ -153,14 +154,14 @@
           />
         </pw-section>
 
-        <pw-section class="cyan" label="Query" ref="query">
+        <pw-section class="cyan" :label="$t('query')" ref="query">
           <div class="flex-wrap">
             <label for="gqlQuery">{{ $t("query") }}</label>
             <div>
               <button
                 class="icon"
                 @click="runQuery()"
-                v-tooltip.bottom="'Run Query'"
+                v-tooltip.bottom="$t('run_query')"
               >
                 <i class="material-icons">play_arrow</i>
               </button>
@@ -168,7 +169,7 @@
                 class="icon"
                 @click="copyQuery"
                 ref="copyQueryButton"
-                v-tooltip="'Copy Query'"
+                v-tooltip="$t('copy_query')"
               >
                 <i class="material-icons">file_copy</i>
               </button>
@@ -191,7 +192,7 @@
               <button
                 class="icon"
                 @click="variables = []"
-                v-tooltip.bottom="'Clear'"
+                v-tooltip.bottom="$t('clear')"
               >
                 <i class="material-icons">clear_all</i>
               </button>
@@ -200,7 +201,7 @@
           <ul v-for="(variable, index) in variables" :key="index">
             <li>
               <input
-                :placeholder="'variable ' + (index + 1)"
+                :placeholder="$t('variable_count', { count: index + 1 })"
                 :name="'variable_key_' + index"
                 :value="variable.key"
                 @change="
@@ -214,7 +215,7 @@
             </li>
             <li>
               <input
-                :placeholder="'value ' + (index + 1)"
+                :placeholder="$t('value_count', { count: index + 1 })"
                 :name="'variable_value_' + index"
                 :value="variable.value"
                 @change="
@@ -228,7 +229,11 @@
             </li>
             <div>
               <li>
-                <button class="icon" @click="removeQueryVariable(index)">
+                <button
+                  class="icon"
+                  @click="removeQueryVariable(index)"
+                  v-tooltip.bottom="$t('delete')"
+                >
                   <i class="material-icons">delete</i>
                 </button>
               </li>
@@ -252,7 +257,7 @@
                 class="icon"
                 @click="copyResponse"
                 ref="copyResponseButton"
-                v-tooltip="'Copy Response'"
+                v-tooltip="$t('copy_response')"
               >
                 <i class="material-icons">file_copy</i>
               </button>
@@ -274,7 +279,7 @@
         </pw-section>
       </div>
       <aside class="sticky-inner inner-right">
-        <pw-section class="purple" label="Docs" ref="docs">
+        <pw-section class="purple" :label="$t('docs')" ref="docs">
           <section>
             <input
               v-if="queryFields.length > 0"
@@ -366,7 +371,7 @@
             "
             class="info"
           >
-            Send a request first
+            {{ $t("send_request_first") }}
           </p>
         </pw-section>
       </aside>
@@ -605,7 +610,7 @@ export default {
       aux.select();
       document.execCommand("copy");
       document.body.removeChild(aux);
-      this.$toast.success("Copied to clipboard", {
+      this.$toast.success(this.$t("copied_to_clipboard"), {
         icon: "done"
       });
       setTimeout(
@@ -621,7 +626,7 @@ export default {
       aux.select();
       document.execCommand("copy");
       document.body.removeChild(aux);
-      this.$toast.success("Copied to clipboard", {
+      this.$toast.success(this.$t("copied_to_clipboard"), {
         icon: "done"
       });
       setTimeout(
@@ -637,7 +642,7 @@ export default {
       aux.select();
       document.execCommand("copy");
       document.body.removeChild(aux);
-      this.$toast.success("Copied to clipboard", {
+      this.$toast.success(this.$t("copied_to_clipboard"), {
         icon: "done"
       });
       setTimeout(
@@ -705,13 +710,13 @@ export default {
 
         this.$nuxt.$loading.finish();
         const duration = Date.now() - startTime;
-        this.$toast.info(`Finished in ${duration}ms`, {
+        this.$toast.info(this.$t("finished_in", { duration }), {
           icon: "done"
         });
       } catch (error) {
         this.$nuxt.$loading.finish();
 
-        this.$toast.error(error + " (F12 for details)", {
+        this.$toast.error(`${error} ${this.$t("f12_details")}`, {
           icon: "error"
         });
         console.log("Error", error);
@@ -719,7 +724,7 @@ export default {
     },
     async getSchema() {
       const startTime = Date.now();
-      this.schemaString = "Loading...";
+      this.schemaString = this.$t("loading");
       this.scrollInto("schema");
 
       // Start showing the loading bar as soon as possible.
@@ -824,13 +829,13 @@ export default {
 
         this.$nuxt.$loading.finish();
         const duration = Date.now() - startTime;
-        this.$toast.info(`Finished in ${duration}ms`, {
+        this.$toast.info(this.$t("finished_in", { duration }), {
           icon: "done"
         });
       } catch (error) {
         this.$nuxt.$loading.finish();
-        this.schemaString = error + ". Check console for details.";
-        this.$toast.error(error + " (F12 for details)", {
+        this.schemaString = `${error}. ${check_console_details}`;
+        this.$toast.error(`${error} ${this.$t("f12_details")}`, {
           icon: "error"
         });
         console.log("Error", error);
@@ -854,7 +859,7 @@ export default {
       document.body.appendChild(a);
       a.click();
       this.$refs.downloadResponse.innerHTML = this.doneButton;
-      this.$toast.success("Download started", {
+      this.$toast.success(this.$t("download_started"), {
         icon: "done"
       });
       setTimeout(() => {
@@ -875,10 +880,10 @@ export default {
       const oldHeaders = this.headers.slice();
 
       this.$store.commit("removeGQLHeader", index);
-      this.$toast.error("Deleted", {
+      this.$toast.error(this.$t("deleted"), {
         icon: "delete",
         action: {
-          text: "Undo",
+          text: this.$t("undo"),
           duration: 4000,
           onClick: (e, toastObject) => {
             this.headers = oldHeaders;
@@ -899,10 +904,10 @@ export default {
       const oldVariables = this.variables.slice();
 
       this.$store.commit("removeGQLVariable", index);
-      this.$toast.error("Deleted", {
+      this.$toast.error(this.$t("deleted"), {
         icon: "delete",
         action: {
-          text: "Undo",
+          text: this.$t("undo"),
           duration: 4000,
           onClick: (e, toastObject) => {
             this.variables = oldVariables;
diff --git a/pages/index.vue b/pages/index.vue
index 422b6ade5..1036c0c03 100644
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -18,7 +18,7 @@
                     target="_blank"
                     rel="noopener"
                   >
-                    <button class="icon" v-tooltip="'Wiki'">
+                    <button class="icon" v-tooltip="$t('wiki')">
                       <i class="material-icons">help</i>
                     </button>
                   </a>
@@ -40,7 +40,11 @@
           </ul>
         </pw-section>
 
-        <pw-section class="blue" label="Request" ref="request">
+        <pw-section
+          class="blue"
+          :label="$t('request')"
+          ref="request"
+        >
           <ul>
             <li>
               <label for="method">{{ $t("method") }}</label>
@@ -86,7 +90,7 @@
                 name="label"
                 type="text"
                 v-model="label"
-                placeholder="(optional)"
+                :placeholder="$t('optional')"
               />
             </li>
             <li>
@@ -135,7 +139,7 @@
                       <button
                         class="icon"
                         @click="$refs.payload.click()"
-                        v-tooltip="'Upload file'"
+                        v-tooltip="$t('upload_file')"
                       >
                         <i class="material-icons">attach_file</i>
                       </button>
@@ -159,7 +163,7 @@
                     readonly
                     v-textarea-auto-height="rawRequestBody"
                     v-model="rawRequestBody"
-                    placeholder="(add at least one parameter)"
+                    :placeholder="$t('add_one_parameter')"
                     rows="1"
                   ></textarea>
                 </li>
@@ -200,6 +204,7 @@
                     <button
                       class="icon"
                       @click="removeRequestBodyParam(index)"
+                      v-tooltip.bottom="$t('delete')"
                       id="delParam"
                     >
                       <i class="material-icons">delete</i>
@@ -306,7 +311,7 @@
               <button
                 class="icon"
                 @click="clearContent('', $event)"
-                v-tooltip.bottom="'Clear All'"
+                v-tooltip.bottom="$t('clear_all')"
                 ref="clearAll"
               >
                 <i class="material-icons">clear_all</i>
@@ -321,7 +326,7 @@
           <div class="tab">
             <pw-section
               class="cyan"
-              label="Authentication"
+              :label="$t('authentication')"
               ref="authentication"
             >
               <ul>
@@ -332,7 +337,7 @@
                       <button
                         class="icon"
                         @click="clearContent('auth', $event)"
-                        v-tooltip.bottom="'Clear'"
+                        v-tooltip.bottom="$t('clear')"
                       >
                         <i class="material-icons">clear_all</i>
                       </button>
@@ -443,14 +448,14 @@
                       <button
                         class="icon"
                         @click="clearContent('access_token', $event)"
-                        v-tooltip.bottom="'Clear'"
+                        v-tooltip.bottom="$t('clear')"
                       >
                         <i class="material-icons">clear_all</i>
                       </button>
                       <button
                         class="icon"
                         @click="showTokenRequest = false"
-                        v-tooltip.bottom="'Close'"
+                        v-tooltip.bottom="$t('close')"
                       >
                         <i class="material-icons">close</i>
                       </button>
@@ -458,7 +463,7 @@
                   </div>
                   <input
                     id="token-name"
-                    placeholder="(optional)"
+                    :placeholder="$t('optional')"
                     name="token_name"
                     v-model="accessTokenName"
                     type="text"
@@ -556,7 +561,7 @@
                       <button
                         class="icon"
                         @click="clearContent('headers', $event)"
-                        v-tooltip.bottom="'Clear'"
+                        v-tooltip.bottom="$t('clear')"
                       >
                         <i class="material-icons">clear_all</i>
                       </button>
@@ -567,7 +572,7 @@
                     readonly
                     v-textarea-auto-height="headerString"
                     v-model="headerString"
-                    placeholder="(add at least one header)"
+                    :placeholder="$t('add_one_header')"
                     rows="1"
                   ></textarea>
                 </li>
@@ -575,7 +580,7 @@
               <ul v-for="(header, index) in headers" :key="index">
                 <li>
                   <autocomplete
-                    :placeholder="'header ' + (index + 1)"
+                    :placeholder="$t('header_count', { count: index + 1 })"
                     :source="commonHeaders"
                     :spellcheck="false"
                     :value="header.key"
@@ -591,7 +596,7 @@
                 </li>
                 <li>
                   <input
-                    :placeholder="'value ' + (index + 1)"
+                    :placeholder="$t('value_count', { count: index + 1 })"
                     :name="'value' + index"
                     :value="header.value"
                     @change="
@@ -608,6 +613,7 @@
                     <button
                       class="icon"
                       @click="removeRequestHeader(index)"
+                      v-tooltip.bottom="$t('delete')"
                       id="header"
                     >
                       <i class="material-icons">delete</i>
@@ -637,7 +643,7 @@
                       <button
                         class="icon"
                         @click="clearContent('parameters', $event)"
-                        v-tooltip.bottom="'Clear'"
+                        v-tooltip.bottom="$t('clear')"
                       >
                         <i class="material-icons">clear_all</i>
                       </button>
@@ -648,7 +654,7 @@
                     readonly
                     v-textarea-auto-height="queryString"
                     v-model="queryString"
-                    placeholder="(add at least one parameter)"
+                    :placeholder="$t('add_one_parameter')"
                     rows="1"
                   ></textarea>
                 </li>
@@ -656,7 +662,7 @@
               <ul v-for="(param, index) in params" :key="index">
                 <li>
                   <input
-                    :placeholder="'parameter ' + (index + 1)"
+                    :placeholder="$t('parameter_count', { count: index + 1 })"
                     :name="'param' + index"
                     :value="param.key"
                     @change="
@@ -670,7 +676,7 @@
                 </li>
                 <li>
                   <input
-                    :placeholder="'value ' + (index + 1)"
+                    :placeholder="$t('value_count', { count: index + 1 })"
                     :name="'value' + index"
                     :value="param.value"
                     @change="
@@ -686,6 +692,7 @@
                     <button
                       class="icon"
                       @click="removeRequestParam(index)"
+                      v-tooltip.bottom="$t('delete')"
                       id="param"
                     >
                       <i class="material-icons">delete</i>
@@ -722,7 +729,7 @@
         <pw-section
           class="purple"
           id="response"
-          label="Response"
+          :label="$t('response')"
           ref="response"
         >
           <ul>
@@ -730,7 +737,7 @@
               <label for="status">{{ $t("status") }}</label>
               <input
                 :class="statusCategory ? statusCategory.className : ''"
-                :value="response.status || '(waiting to send request)'"
+                :value="response.status || $t('waiting_send_req')"
                 ref="status"
                 id="status"
                 name="status"
@@ -770,7 +777,7 @@
                     @click="downloadResponse"
                     ref="downloadResponse"
                     v-if="response.body"
-                    v-tooltip="'Download file'"
+                    v-tooltip="$t('download_file')"
                   >
                     <i class="material-icons">get_app</i>
                   </button>
@@ -779,7 +786,7 @@
                     @click="copyResponse"
                     ref="copyResponse"
                     v-if="response.body"
-                    v-tooltip="'Copy response'"
+                    v-tooltip="$t('copy_response')"
                   >
                     <i class="material-icons">file_copy</i>
                   </button>
@@ -835,7 +842,7 @@
           <input id="collection-tab" type="radio" name="side" />
           <label for="collection-tab">{{ $t("collections") }}</label>
           <div class="tab">
-            <pw-section class="yellow" label="Collections" ref="collections">
+            <pw-section class="yellow" :label="$t('collections')" ref="collections">
               <collections />
             </pw-section>
           </div>
@@ -870,7 +877,7 @@
                 id="import-text"
                 autofocus
                 rows="8"
-                placeholder="Enter cURL"
+                :placeholder="$t('enter_curl')"
               ></textarea>
             </li>
           </ul>
@@ -880,7 +887,7 @@
             <span></span>
             <span>
               <button class="icon" @click="showModal = false">
-                Cancel
+                {{ $t("cancel") }}
               </button>
               <button class="icon primary" @click="handleImport">
                 {{ $t("import") }}
@@ -928,7 +935,7 @@
                     @click="copyRequestCode"
                     id="copyRequestCode"
                     ref="copyRequestCode"
-                    v-tooltip="'Copy code'"
+                    v-tooltip="$t('copy_code')"
                   >
                     <i class="material-icons">file_copy</i>
                   </button>
@@ -971,7 +978,7 @@
                   <button
                     class="icon"
                     @click="clearContent('tokens', $event)"
-                    v-tooltip.bottom="'Clear'"
+                    v-tooltip.bottom="$t('clear')"
                   >
                     <i class="material-icons">clear_all</i>
                   </button>
@@ -1009,7 +1016,7 @@
                 <button
                   class="icon"
                   @click="removeOAuthToken(index)"
-                  v-tooltip.bottom="'Delete'"
+                  v-tooltip.bottom="$t('delete')"
                 >
                   <i class="material-icons">delete</i>
                 </button>
@@ -1017,7 +1024,7 @@
             </div>
           </ul>
           <p v-if="tokens.length === 0" class="info">
-            Empty
+            {{ $t("empty") }}
           </p>
         </div>
         <div slot="footer"></div>
@@ -1059,7 +1066,7 @@
                     :disabled="this.tokenReqs.length === 0"
                     class="icon"
                     @click="removeOAuthTokenReq"
-                    v-tooltip.bottom="'Delete'"
+                    v-tooltip.bottom="$t('delete')"
                   >
                     <i class="material-icons">delete</i>
                   </button>
@@ -1389,8 +1396,8 @@ export default {
     },
     "response.body": function(val) {
       if (
-        this.response.body === "(waiting to send request)" ||
-        this.response.body === "Loading..."
+        this.response.body === this.$t("waiting_send_req") ||
+        this.response.body === this.$t("loading")
       ) {
         this.responseBodyText = this.response.body;
         this.responseBodyType = "text";
@@ -2005,7 +2012,7 @@ export default {
       this.scrollInto("response");
 
       if (!this.isValidURL) {
-        this.$toast.error("URL is not formatted properly", {
+        this.$toast.error(this.$t("url_invalid_format"), {
           icon: "error"
         });
         return;
@@ -2019,8 +2026,8 @@ export default {
         this.$refs.response.$el.classList.toggle("hidden");
       }
       this.previewEnabled = false;
-      this.response.status = "Fetching...";
-      this.response.body = "Loading...";
+      this.response.status = this.$t("fetching");
+      this.response.body = this.$t("loading");
 
       const auth =
         this.auth === "Basic Auth"
@@ -2081,7 +2088,7 @@ export default {
         );
 
         const duration = Date.now() - startTime;
-        this.$toast.info(`Finished in ${duration}ms`, {
+        this.$toast.info(this.$t("finished_in", { duration }), {
           icon: "done"
         });
 
@@ -2134,12 +2141,12 @@ export default {
           return;
         } else {
           this.response.status = error.message;
-          this.response.body = error + ". Check console for details.";
-          this.$toast.error(error + " (F12 for details)", {
+          this.response.body = `${error}. ${this.$t("check_console_details")}`;
+          this.$toast.error(`${error} ${this.$t("f12_details")}`, {
             icon: "error"
           });
           if (!this.$store.state.postwoman.settings.PROXY_ENABLED) {
-            this.$toast.info("Try enabling Proxy", {
+            this.$toast.info(this.$t("enable_proxy"), {
               icon: "help",
               duration: 8000,
               action: {
@@ -2184,10 +2191,10 @@ export default {
       const oldHeaders = this.headers.slice();
 
       this.$store.commit("removeHeaders", index);
-      this.$toast.error("Deleted", {
+      this.$toast.error(this.$t("deleted"), {
         icon: "delete",
         action: {
-          text: "Undo",
+          text: this.$t("undo"),
           onClick: (e, toastObject) => {
             this.headers = oldHeaders;
             toastObject.remove();
@@ -2204,10 +2211,10 @@ export default {
       const oldParams = this.params.slice();
 
       this.$store.commit("removeParams", index);
-      this.$toast.error("Deleted", {
+      this.$toast.error(this.$t("deleted"), {
         icon: "delete",
         action: {
-          text: "Undo",
+          text: this.$t("undo"),
           onClick: (e, toastObject) => {
             this.params = oldParams;
             toastObject.remove();
@@ -2224,10 +2231,10 @@ export default {
       const oldBodyParams = this.bodyParams.slice();
 
       this.$store.commit("removeBodyParams", index);
-      this.$toast.error("Deleted", {
+      this.$toast.error(this.$t("deleted"), {
         icon: "delete",
         action: {
-          text: "Undo",
+          text: this.$t("undo"),
           onClick: (e, toastObject) => {
             this.bodyParams = oldBodyParams;
             toastObject.remove();
@@ -2255,7 +2262,7 @@ export default {
         document.execCommand("copy");
         document.body.removeChild(dummy);
         this.$refs.copyRequest.innerHTML = this.doneButton;
-        this.$toast.info("Copied to clipboard", {
+        this.$toast.info(this.$t("copied_to_clipboard"), {
           icon: "done"
         });
         setTimeout(
@@ -2266,7 +2273,7 @@ export default {
     },
     copyRequestCode() {
       this.$refs.copyRequestCode.innerHTML = this.doneButton;
-      this.$toast.success("Copied to clipboard", {
+      this.$toast.success(this.$t("copied_to_clipboard"), {
         icon: "done"
       });
       this.$refs.generatedCode.select();
@@ -2283,7 +2290,7 @@ export default {
     },
     copyResponse() {
       this.$refs.copyResponse.innerHTML = this.doneButton;
-      this.$toast.success("Copied to clipboard", {
+      this.$toast.success(this.$t("copied_to_clipboard"), {
         icon: "done"
       });
       const aux = document.createElement("textarea");
@@ -2318,7 +2325,7 @@ export default {
       document.body.appendChild(a);
       a.click();
       this.$refs.downloadResponse.innerHTML = this.doneButton;
-      this.$toast.success("Download started", {
+      this.$toast.success(this.$t("download_started"), {
         icon: "done"
       });
       setTimeout(() => {
@@ -2448,7 +2455,7 @@ export default {
         this.showModal = false;
       } catch (error) {
         this.showModal = false;
-        this.$toast.error("cURL is not formatted properly", {
+        this.$toast.error(this.$t("curl_invalid_format"), {
           icon: "error"
         });
       }
@@ -2512,7 +2519,7 @@ export default {
           this.scope = "";
       }
       e.target.innerHTML = this.doneButton;
-      this.$toast.info("Cleared", {
+      this.$toast.info(this.$t("cleared"), {
         icon: "clear_all"
       });
       setTimeout(
@@ -2522,7 +2529,7 @@ export default {
     },
     saveRequest() {
       if (!this.checkCollections()) {
-        this.$toast.error("Create a Collection", {
+        this.$toast.error(this.$t("create_collection"), {
           icon: "error"
         });
         return;
@@ -2586,11 +2593,11 @@ export default {
           this.rawParams = e.target.result;
         };
         reader.readAsText(file);
-        this.$toast.info("File imported", {
+        this.$toast.info(this.$t("file_imported"), {
           icon: "attach_file"
         });
       } else {
-        this.$toast.error("Choose a file", {
+        this.$toast.error(this.$t("choose_file"), {
           icon: "attach_file"
         });
       }
@@ -2600,7 +2607,7 @@ export default {
         this.oidcDiscoveryUrl === "" &&
         (this.authUrl === "" || this.accessTokenUrl === "")
       ) {
-        this.$toast.error("Please complete configuration urls.", {
+        this.$toast.error(this.$t("complete_config_urls"), {
           icon: "error"
         });
         return;
@@ -2641,10 +2648,10 @@ export default {
     removeOAuthToken(index) {
       const oldTokens = this.tokens.slice();
       this.$store.commit("removeOAuthToken", index);
-      this.$toast.error("Deleted", {
+      this.$toast.error(this.$t("deleted"), {
         icon: "delete",
         action: {
-          text: "Undo",
+          text: this.$t("undo"),
           onClick: (e, toastObject) => {
             this.tokens = oldTokens;
             toastObject.remove();
@@ -2664,7 +2671,7 @@ export default {
           name,
           details
         });
-        this.$toast.info("Token request saved");
+        this.$toast.info(this.$t("token_request_saved"));
         this.showTokenRequestList = false;
       } catch (e) {
         this.$toast.error(e, {
@@ -2679,10 +2686,10 @@ export default {
       );
       if (targetReqIndex < 0) return;
       this.$store.commit("removeOAuthTokenReq", targetReqIndex);
-      this.$toast.error("Deleted", {
+      this.$toast.error(this.$t("deleted"), {
         icon: "delete",
         action: {
-          text: "Undo",
+          text: this.$t("undo"),
           onClick: (e, toastObject) => {
             this.tokenReqs = oldTokenReqs;
             toastObject.remove();
diff --git a/pages/realtime.vue b/pages/realtime.vue
index 8e918ee4a..1ef1a49b6 100644
--- a/pages/realtime.vue
+++ b/pages/realtime.vue
@@ -4,7 +4,7 @@
       <input id="tab-one" type="radio" name="options" checked="checked" />
       <label for="tab-one">{{ $t("websocket") }}</label>
       <div class="tab">
-        <pw-section class="blue" label="Request" ref="request">
+        <pw-section class="blue" :label="$t('request')" ref="request">
           <ul>
             <li>
               <label for="url">{{ $t("url") }}</label>
@@ -39,13 +39,13 @@
 
         <pw-section
           class="purple"
-          label="Communication"
+          :label="$t('communication')"
           id="response"
           ref="response"
         >
           <ul>
             <li>
-              <label for="log">Log</label>
+              <label for="log">{{ $t("log") }}</label>
               <div id="log" name="log" class="log">
                 <span v-if="communication.log">
                   <span
@@ -94,7 +94,7 @@
       <input id="tab-two" type="radio" name="options" />
       <label for="tab-two">{{ $t("sse") }}</label>
       <div class="tab">
-        <pw-section class="blue" label="Request" ref="request">
+        <pw-section class="blue" :label="$t('request')" ref="request">
           <ul>
             <li>
               <label for="server">{{ $t("server") }}</label>
@@ -129,7 +129,7 @@
 
         <pw-section
           class="purple"
-          label="Communication"
+          :label="$t('communication')"
           id="response"
           ref="response"
         >
@@ -243,7 +243,7 @@ export default {
     connect() {
       this.communication.log = [
         {
-          payload: `Connecting to ${this.url}...`,
+          payload: this.$t("connecting_to", { name: this.url }),
           source: "info",
           color: "var(--ac-color)"
         }
@@ -254,13 +254,13 @@ export default {
           this.connectionState = true;
           this.communication.log = [
             {
-              payload: `Connected to ${this.url}.`,
+              payload: this.$t("connected_to", { name: this.url }),
               source: "info",
               color: "var(--ac-color)",
               ts: new Date().toLocaleTimeString()
             }
           ];
-          this.$toast.success("Connected", {
+          this.$toast.success(this.$t("connected"), {
             icon: "sync"
           });
         };
@@ -270,12 +270,12 @@ export default {
         this.socket.onclose = event => {
           this.connectionState = false;
           this.communication.log.push({
-            payload: `Disconnected from ${this.url}.`,
+            payload: this.$t("disconnected_from", { name: this.url }),
             source: "info",
             color: "#ff5555",
             ts: new Date().toLocaleTimeString()
           });
-          this.$toast.error("Disconnected", {
+          this.$toast.error(this.$t("disconnected"), {
             icon: "sync_disabled"
           });
         };
@@ -288,7 +288,7 @@ export default {
         };
       } catch (ex) {
         this.handleError(ex);
-        this.$toast.error("Something went wrong!", {
+        this.$toast.error(this.$t("something_went_wrong"), {
           icon: "error"
         });
       }
@@ -300,7 +300,7 @@ export default {
       this.disconnect();
       this.connectionState = false;
       this.communication.log.push({
-        payload: `An error has occurred.`,
+        payload: this.$t("error_occurred"),
         source: "info",
         color: "#ff5555",
         ts: new Date().toLocaleTimeString()
@@ -349,7 +349,7 @@ export default {
     start() {
       this.events.log = [
         {
-          payload: `Connecting to ${this.server}...`,
+          payload: this.$t("connecting_to", { name: this.server }),
           source: "info",
           color: "var(--ac-color)"
         }
@@ -361,13 +361,13 @@ export default {
             this.connectionSSEState = true;
             this.events.log = [
               {
-                payload: `Connected to ${this.server}.`,
+                payload: this.$t("connected_to", { name: this.server }),
                 source: "info",
                 color: "var(--ac-color)",
                 ts: new Date().toLocaleTimeString()
               }
             ];
-            this.$toast.success("Connected", {
+            this.$toast.success(this.$t("connected"), {
               icon: "sync"
             });
           };
@@ -377,12 +377,12 @@ export default {
           this.sse.onclose = event => {
             this.connectionSSEState = false;
             this.events.log.push({
-              payload: `Disconnected from ${this.server}.`,
+              payload: this.$t("disconnected_from", { name: this.server }),
               source: "info",
               color: "#ff5555",
               ts: new Date().toLocaleTimeString()
             });
-            this.$toast.error("Disconnected", {
+            this.$toast.error(this.$t("disconnected"), {
               icon: "sync_disabled"
             });
           };
@@ -395,14 +395,14 @@ export default {
           };
         } catch (ex) {
           this.handleSSEError(ex);
-          this.$toast.error("Something went wrong!", {
+          this.$toast.error(this.$t("something_went_wrong"), {
             icon: "error"
           });
         }
       } else {
         this.events.log = [
           {
-            payload: `This browser doesn't seems to have Server Sent Events support.`,
+            payload: this.$t("browser_support_sse"),
             source: "info",
             color: "#ff5555",
             ts: new Date().toLocaleTimeString()
@@ -414,7 +414,7 @@ export default {
       this.stop();
       this.connectionSSEState = false;
       this.events.log.push({
-        payload: `An error has occurred.`,
+        payload: this.$t("error_occurred"),
         source: "info",
         color: "#ff5555",
         ts: new Date().toLocaleTimeString()
diff --git a/pages/settings.vue b/pages/settings.vue
index 80c1ec7f8..8e0d851a1 100644
--- a/pages/settings.vue
+++ b/pages/settings.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="page">
-    <pw-section class="cyan" label="Theme" ref="theme">
+    <pw-section class="cyan" :label="$t('theme')" ref="theme">
       <ul>
         <li>
           <label>{{ $t("background") }}</label>
@@ -58,7 +58,7 @@
       </ul>
     </pw-section>
 
-    <pw-section class="blue" label="Proxy" ref="proxy">
+    <pw-section class="blue" :label="$t('proxy')" ref="proxy">
       <ul>
         <li>
           <div class="flex-wrap">
@@ -76,7 +76,7 @@
               target="_blank"
               rel="noopener"
             >
-              <button class="icon" v-tooltip="'Wiki'">
+              <button class="icon" v-tooltip="$t('wiki')">
                 <i class="material-icons">help</i>
               </button>
             </a>
@@ -90,7 +90,7 @@
             <button
               class="icon"
               @click="settings.PROXY_URL = `https://postwoman.apollotv.xyz/`"
-              v-tooltip.bottom="'Reset to default'"
+              v-tooltip.bottom="$t('reset_default')"
             >
               <i class="material-icons">clear_all</i>
             </button>
@@ -152,26 +152,26 @@ export default {
       themes: [
         {
           color: "#202124",
-          name: "Kinda Dark",
+          name: this.$t("kinda_dark"),
           class: "",
           aceEditor: "twilight"
         },
         {
           color: "#ffffff",
-          name: "Clearly White",
+          name: this.$t("clearly_white"),
           vibrant: true,
           class: "light",
           aceEditor: "iplastic"
         },
         {
           color: "#000000",
-          name: "Just Black",
+          name: this.$t("just_black"),
           class: "black",
           aceEditor: "vibrant_ink"
         },
         {
           color: "var(--bg-color)",
-          name: "Auto (system)",
+          name: this.$t("auto_system"),
           vibrant: window.matchMedia("(prefers-color-scheme: light)").matches,
           class: "auto",
           aceEditor: window.matchMedia("(prefers-color-scheme: light)").matches
@@ -184,42 +184,42 @@ export default {
         // If the color is vibrant, black is used as the active foreground color.
         {
           color: "#50fa7b",
-          name: "Green",
+          name: this.$t("green"),
           vibrant: true
         },
         {
           color: "#f1fa8c",
-          name: "Yellow",
+          name: this.$t("yellow"),
           vibrant: true
         },
         {
           color: "#ff79c6",
-          name: "Pink",
+          name: this.$t("pink"),
           vibrant: true
         },
         {
           color: "#ff5555",
-          name: "Red",
+          name: this.$t("red"),
           vibrant: false
         },
         {
           color: "#bd93f9",
-          name: "Purple",
+          name: this.$t("purple"),
           vibrant: true
         },
         {
           color: "#ffb86c",
-          name: "Orange",
+          name: this.$t("orange"),
           vibrant: true
         },
         {
           color: "#8be9fd",
-          name: "Cyan",
+          name: this.$t("cyan"),
           vibrant: true
         },
         {
           color: "#57b5f9",
-          name: "Blue",
+          name: this.$t("blue"),
           vibrant: false
         }
       ],

From bd008f42dd358e5ce41d1720fee971d093bb9202 Mon Sep 17 00:00:00 2001
From: Andrew Bastin <andrewbastin.k@gmail.com>
Date: Tue, 14 Jan 2020 11:49:43 -0500
Subject: [PATCH 06/21] Refactor network and ProxyStrategy code

---
 functions/network.js                  | 6 +++---
 functions/strategies/ProxyStrategy.js | 4 ++--
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/functions/network.js b/functions/network.js
index f2089363e..f4ad8ec66 100644
--- a/functions/network.js
+++ b/functions/network.js
@@ -5,9 +5,9 @@ import ProxyStrategy from "./strategies/ProxyStrategy";
 const sendNetworkRequest = (req, store) => {
   if (store.state.postwoman.settings.PROXY_ENABLED) {
     return ProxyStrategy(req, store);
-  } else {
-    return AxiosStrategy(req, store);
-  }
+  } 
+
+  return AxiosStrategy(req, store);
 }
 
 export { sendNetworkRequest };
diff --git a/functions/strategies/ProxyStrategy.js b/functions/strategies/ProxyStrategy.js
index 9cac6f47d..f28762d68 100644
--- a/functions/strategies/ProxyStrategy.js
+++ b/functions/strategies/ProxyStrategy.js
@@ -1,13 +1,13 @@
 import axios from "axios";
 
 const proxyStrategy = async (req, store) => {
-  const proxyRes = await axios.post(
+  const { data } = await axios.post(
     store.state.postwoman.settings.PROXY_URL ||
     "https://postwoman.apollotv.xyz/",
     req
   );
 
-  return proxyRes.data;
+  return data;
 }
 
 export default proxyStrategy;

From 061f86fbfa3ee8a074c4e5270be0146507e92033 Mon Sep 17 00:00:00 2001
From: Liyas Thomas <liyasthomas@gmail.com>
Date: Wed, 15 Jan 2020 06:33:04 +0530
Subject: [PATCH 07/21] :bug: Fixed Nuxt loader won't finish after response

---
 functions/strategies/AxiosStrategy.js | 3 ++-
 functions/strategies/ProxyStrategy.js | 6 +++---
 2 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/functions/strategies/AxiosStrategy.js b/functions/strategies/AxiosStrategy.js
index 5c8020784..de74ec377 100644
--- a/functions/strategies/AxiosStrategy.js
+++ b/functions/strategies/AxiosStrategy.js
@@ -2,7 +2,8 @@ import axios from "axios";
 
 const axiosStrategy = async (req, _store) => {
   const res = await axios(req);
+  window.$nuxt.$loading.finish();
   return res;
-}
+};
 
 export default axiosStrategy;
diff --git a/functions/strategies/ProxyStrategy.js b/functions/strategies/ProxyStrategy.js
index f28762d68..945482f48 100644
--- a/functions/strategies/ProxyStrategy.js
+++ b/functions/strategies/ProxyStrategy.js
@@ -3,11 +3,11 @@ import axios from "axios";
 const proxyStrategy = async (req, store) => {
   const { data } = await axios.post(
     store.state.postwoman.settings.PROXY_URL ||
-    "https://postwoman.apollotv.xyz/",
+      "https://postwoman.apollotv.xyz/",
     req
   );
-
+  window.$nuxt.$loading.finish();
   return data;
-}
+};
 
 export default proxyStrategy;

From 2faf675c0a5d5cd8fa69392e0e85b5d667fb4977 Mon Sep 17 00:00:00 2001
From: Liyas Thomas <liyascthomas@gmail.com>
Date: Wed, 15 Jan 2020 09:10:14 +0530
Subject: [PATCH 08/21] :rotating_light: Removing linter warnings

---
 components/collections/addCollection.vue |   6 +-
 components/collections/addFolder.vue     |   6 +-
 components/collections/request.vue       |   6 +-
 components/history.vue                   |  15 ++--
 functions/network.js                     |   5 +-
 lang/en-US.js                            |  12 ++-
 layouts/error.vue                        |   6 +-
 pages/doc.vue                            | 105 ++++++++++++-----------
 pages/index.vue                          |  12 +--
 9 files changed, 99 insertions(+), 74 deletions(-)

diff --git a/components/collections/addCollection.vue b/components/collections/addCollection.vue
index 197cc412a..2789a52d7 100644
--- a/components/collections/addCollection.vue
+++ b/components/collections/addCollection.vue
@@ -17,7 +17,11 @@
     <div slot="body">
       <ul>
         <li>
-          <input type="text" v-model="name" :placeholder="$t('my_new_collection')" />
+          <input
+            type="text"
+            v-model="name"
+            :placeholder="$t('my_new_collection')"
+          />
         </li>
       </ul>
     </div>
diff --git a/components/collections/addFolder.vue b/components/collections/addFolder.vue
index 5601e6f47..1188ad495 100644
--- a/components/collections/addFolder.vue
+++ b/components/collections/addFolder.vue
@@ -17,7 +17,11 @@
     <div slot="body">
       <ul>
         <li>
-          <input type="text" v-model="name" :placeholder="$t('my_new_folder')" />
+          <input
+            type="text"
+            v-model="name"
+            :placeholder="$t('my_new_folder')"
+          />
         </li>
       </ul>
     </div>
diff --git a/components/collections/request.vue b/components/collections/request.vue
index b687f0ec3..f96059f12 100644
--- a/components/collections/request.vue
+++ b/components/collections/request.vue
@@ -1,7 +1,11 @@
 <template>
   <div class="flex-wrap">
     <div>
-      <button class="icon" @click="selectRequest()" v-tooltip="$t('use_request')">
+      <button
+        class="icon"
+        @click="selectRequest()"
+        v-tooltip="$t('use_request')"
+      >
         <i class="material-icons">insert_drive_file</i>
         <span>{{ request.name }}</span>
       </button>
diff --git a/components/history.vue b/components/history.vue
index 7b6a6102c..289f5586b 100644
--- a/components/history.vue
+++ b/components/history.vue
@@ -1,10 +1,5 @@
 <template>
-  <pw-section
-    class="green"
-    icon="history"
-    :label="$t('history')"
-    ref="history"
-  >
+  <pw-section class="green" icon="history" :label="$t('history')" ref="history">
     <ul>
       <li id="filter-history">
         <input
@@ -27,7 +22,9 @@
             class="icon"
             :class="{ stared: entry.star }"
             @click="toggleStar(index)"
-            v-tooltip="{ content: !entry.star ? $t('add_star') : $t('remove_star') }"
+            v-tooltip="{
+              content: !entry.star ? $t('add_star') : $t('remove_star')
+            }"
           >
             <i class="material-icons">
               {{ entry.star ? "star" : "star_border" }}
@@ -238,7 +235,9 @@
         </v-popover>
       </div>
       <div class="flex-wrap" v-else>
-        <label for="clear-history-button" class="info">{{ $t("are_you_sure") }}</label>
+        <label for="clear-history-button" class="info">
+          {{ $t("are_you_sure") }}
+        </label>
         <div>
           <button
             class="icon"
diff --git a/functions/network.js b/functions/network.js
index f4ad8ec66..97881ee84 100644
--- a/functions/network.js
+++ b/functions/network.js
@@ -1,13 +1,12 @@
 import AxiosStrategy from "./strategies/AxiosStrategy";
 import ProxyStrategy from "./strategies/ProxyStrategy";
 
-
 const sendNetworkRequest = (req, store) => {
   if (store.state.postwoman.settings.PROXY_ENABLED) {
     return ProxyStrategy(req, store);
-  } 
+  }
 
   return AxiosStrategy(req, store);
-}
+};
 
 export { sendNetworkRequest };
diff --git a/lang/en-US.js b/lang/en-US.js
index 0fd4d880d..3a70eb8b5 100644
--- a/lang/en-US.js
+++ b/lang/en-US.js
@@ -154,7 +154,8 @@ export default {
   disconnected_from: "Disconnected from {name}",
   something_went_wrong: "Something went wrong!",
   error_occurred: "An error has occurred.",
-  browser_support_sse: "This browser doesn't seems to have Server Sent Events support.",
+  browser_support_sse:
+    "This browser doesn't seems to have Server Sent Events support.",
   log: "Log",
   no_url: "No URL",
   run_query: "Run Query",
@@ -207,7 +208,8 @@ export default {
   value_count: "value {count}",
   send_request_first: "Send a request first",
   generate_docs: "Generate Documentation",
-  generate_docs_message: "Import any Postwoman Collection to Generate Documentation on-the-go.",
+  generate_docs_message:
+    "Import any Postwoman Collection to Generate Documentation on-the-go.",
   generate_docs_first: "Generate documentation first",
   docs_generated: "Documentation generated",
   import_collections: "Import collections",
@@ -231,8 +233,10 @@ export default {
   enable_proxy: "Try enabling Proxy",
   complete_config_urls: "Please complete configuration urls.",
   token_request_saved: "Token request saved",
-  donate_info1: "If you have enjoyed the productivity of using Postwoman, consider donating as a sign of appreciation.",
-  donate_info2: "You can support Postwoman development via the following methods:",
+  donate_info1:
+    "If you have enjoyed the productivity of using Postwoman, consider donating as a sign of appreciation.",
+  donate_info2:
+    "You can support Postwoman development via the following methods:",
   one_time_recurring: "One-time or recurring",
   one_time: "One-time",
   recurring: "Recurring",
diff --git a/layouts/error.vue b/layouts/error.vue
index ea7a3a1af..f17577152 100644
--- a/layouts/error.vue
+++ b/layouts/error.vue
@@ -1,6 +1,10 @@
 <template>
   <div class="page page-error">
-    <img src="~static/icons/error.svg" :alt="$t('error')" class="error_banner" />
+    <img
+      src="~static/icons/error.svg"
+      :alt="$t('error')"
+      class="error_banner"
+    />
     <h2>{{ error.statusCode }}</h2>
     <h3>{{ error.message }}</h3>
     <p>
diff --git a/pages/doc.vue b/pages/doc.vue
index 7b8ca19a8..963687d4d 100644
--- a/pages/doc.vue
+++ b/pages/doc.vue
@@ -93,12 +93,14 @@
               </p>
               <p class="doc-desc" v-if="request.path">
                 <span>
-                  {{ $t("path") }}: <code>{{ request.path || $t("none") }}</code>
+                  {{ $t("path") }}:
+                  <code>{{ request.path || $t("none") }}</code>
                 </span>
               </p>
               <p class="doc-desc" v-if="request.method">
                 <span>
-                  {{ $t("method") }}: <code>{{ request.method || $t("none") }}</code>
+                  {{ $t("method") }}:
+                  <code>{{ request.method || $t("none") }}</code>
                 </span>
               </p>
               <p class="doc-desc" v-if="request.auth">
@@ -109,7 +111,8 @@
               </p>
               <p class="doc-desc" v-if="request.httpUser">
                 <span>
-                  {{ $t("username") }}: <code>{{ request.httpUser || $t("none") }}</code>
+                  {{ $t("username") }}:
+                  <code>{{ request.httpUser || $t("none") }}</code>
                 </span>
               </p>
               <p class="doc-desc" v-if="request.httpPassword">
@@ -120,16 +123,17 @@
               </p>
               <p class="doc-desc" v-if="request.bearerToken">
                 <span>
-                  {{ $t("token") }}: <code>{{ request.bearerToken || $t("none") }}</code>
+                  {{ $t("token") }}:
+                  <code>{{ request.bearerToken || $t("none") }}</code>
                 </span>
               </p>
               <h4 v-if="request.headers.length > 0">{{ $t("headers") }}</h4>
-              <span
-                v-if="request.headers"
-                v-for="header in request.headers"
-                :key="header.key"
-              >
-                <p class="doc-desc">
+              <span v-if="request.headers">
+                <p
+                  v-for="header in request.headers"
+                  :key="header.key"
+                  class="doc-desc"
+                >
                   <span>
                     {{ header.key || $t("none") }}:
                     <code>{{ header.value || $t("none") }}</code>
@@ -137,12 +141,12 @@
                 </p>
               </span>
               <h4 v-if="request.params.length > 0">{{ $t("parameters") }}</h4>
-              <span
-                v-if="request.params"
-                v-for="parameter in request.params"
-                :key="parameter.key"
-              >
-                <p class="doc-desc">
+              <span v-if="request.params">
+                <p
+                  v-for="parameter in request.params"
+                  :key="parameter.key"
+                  class="doc-desc"
+                >
                   <span>
                     {{ parameter.key || $t("none") }}:
                     <code>{{ parameter.value || $t("none") }}</code>
@@ -150,12 +154,12 @@
                 </p>
               </span>
               <h4 v-if="request.bodyParam">{{ $t("payload") }}</h4>
-              <span
-                v-if="request.bodyParam"
-                v-for="payload in request.bodyParam"
-                :key="payload.key"
-              >
-                <p class="doc-desc">
+              <span v-if="request.bodyParam">
+                <p
+                  v-for="payload in request.bodyParam"
+                  :key="payload.key"
+                  class="doc-desc"
+                >
                   <span>
                     {{ payload.key || $t("none") }}:
                     <code>{{ payload.value || $t("none") }}</code>
@@ -164,7 +168,8 @@
               </span>
               <p class="doc-desc" v-if="request.rawParams">
                 <span>
-                  {{ $t("parameters") }}: <code>{{ request.rawParams || $t("none") }}</code>
+                  {{ $t("parameters") }}:
+                  <code>{{ request.rawParams || $t("none") }}</code>
                 </span>
               </p>
               <p class="doc-desc" v-if="request.contentType">
@@ -202,7 +207,8 @@
             </p>
             <p class="doc-desc" v-if="request.method">
               <span>
-                {{ $t("method") }}: <code>{{ request.method || $t("none") }}</code>
+                {{ $t("method") }}:
+                <code>{{ request.method || $t("none") }}</code>
               </span>
             </p>
             <p class="doc-desc" v-if="request.auth">
@@ -213,26 +219,29 @@
             </p>
             <p class="doc-desc" v-if="request.httpUser">
               <span>
-                {{ $t("username") }}: <code>{{ request.httpUser || $t("none") }}</code>
+                {{ $t("username") }}:
+                <code>{{ request.httpUser || $t("none") }}</code>
               </span>
             </p>
             <p class="doc-desc" v-if="request.httpPassword">
               <span>
-                {{ $t("password") }}: <code>{{ request.httpPassword || $t("none") }}</code>
+                {{ $t("password") }}:
+                <code>{{ request.httpPassword || $t("none") }}</code>
               </span>
             </p>
             <p class="doc-desc" v-if="request.bearerToken">
               <span>
-                {{ $t("token") }}: <code>{{ request.bearerToken || $t("none") }}</code>
+                {{ $t("token") }}:
+                <code>{{ request.bearerToken || $t("none") }}</code>
               </span>
             </p>
             <h4 v-if="request.headers.length > 0">{{ $t("headers") }}</h4>
-            <span
-              v-if="request.headers"
-              v-for="header in request.headers"
-              :key="header.key"
-            >
-              <p class="doc-desc">
+            <span v-if="request.headers">
+              <p
+                v-for="header in request.headers"
+                :key="header.key"
+                class="doc-desc"
+              >
                 <span>
                   {{ header.key || $t("none") }}:
                   <code>{{ header.value || $t("none") }}</code>
@@ -240,12 +249,12 @@
               </p>
             </span>
             <h4 v-if="request.params.length > 0">{{ $t("parameters") }}</h4>
-            <span
-              v-if="request.params"
-              v-for="parameter in request.params"
-              :key="parameter.key"
-            >
-              <p class="doc-desc">
+            <span v-if="request.params">
+              <p
+                v-for="parameter in request.params"
+                :key="parameter.key"
+                class="doc-desc"
+              >
                 <span>
                   {{ parameter.key || $t("none") }}:
                   <code>{{ parameter.value || $t("none") }}</code>
@@ -253,12 +262,12 @@
               </p>
             </span>
             <h4 v-if="request.bodyParam">{{ $t("payload") }}</h4>
-            <span
-              v-if="request.bodyParam"
-              v-for="payload in request.bodyParam"
-              :key="payload.key"
-            >
-              <p class="doc-desc">
+            <span v-if="request.bodyParam">
+              <p
+                v-for="payload in request.bodyParam"
+                :key="payload.key"
+                class="doc-desc"
+              >
                 <span>
                   {{ payload.key || $t("none") }}:
                   <code>{{ payload.value || $t("none") }}</code>
@@ -267,7 +276,8 @@
             </span>
             <p class="doc-desc" v-if="request.rawParams">
               <span>
-                {{ $t("parameters") }}: <code>{{ request.rawParams || $t("none") }}</code>
+                {{ $t("parameters") }}:
+                <code>{{ request.rawParams || $t("none") }}</code>
               </span>
             </p>
             <p class="doc-desc" v-if="request.contentType">
@@ -305,9 +315,6 @@
   }
 }
 
-.collection {
-}
-
 .folder {
   border-left: 1px solid var(--brd-color);
   margin: 16px 0 0;
diff --git a/pages/index.vue b/pages/index.vue
index 003f925a2..71926504f 100644
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -40,11 +40,7 @@
           </ul>
         </pw-section>
 
-        <pw-section
-          class="blue"
-          :label="$t('request')"
-          ref="request"
-        >
+        <pw-section class="blue" :label="$t('request')" ref="request">
           <ul>
             <li>
               <label for="method">{{ $t("method") }}</label>
@@ -842,7 +838,11 @@
           <input id="collection-tab" type="radio" name="side" />
           <label for="collection-tab">{{ $t("collections") }}</label>
           <div class="tab">
-            <pw-section class="yellow" :label="$t('collections')" ref="collections">
+            <pw-section
+              class="yellow"
+              :label="$t('collections')"
+              ref="collections"
+            >
               <collections />
             </pw-section>
           </div>

From 4b48d8a8c8a28ad69c21ae03056d0fc876c76755 Mon Sep 17 00:00:00 2001
From: Andrew Bastin <andrewbastin.k@gmail.com>
Date: Thu, 16 Jan 2020 01:25:43 -0500
Subject: [PATCH 09/21] Refactor to bring the nuxt loading bar code out of the
 strategies

---
 functions/network.js                  | 11 +++++++++--
 functions/strategies/AxiosStrategy.js |  1 -
 functions/strategies/ProxyStrategy.js |  1 -
 3 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/functions/network.js b/functions/network.js
index 97881ee84..cf16b4c55 100644
--- a/functions/network.js
+++ b/functions/network.js
@@ -1,12 +1,19 @@
 import AxiosStrategy from "./strategies/AxiosStrategy";
 import ProxyStrategy from "./strategies/ProxyStrategy";
+import FirefoxStrategy from "./strategies/FirefoxStrategy";
+
+
+const runAppropriateStrategy = (req, store) => {
 
-const sendNetworkRequest = (req, store) => {
   if (store.state.postwoman.settings.PROXY_ENABLED) {
     return ProxyStrategy(req, store);
   }
 
   return AxiosStrategy(req, store);
-};
+}
+
+const sendNetworkRequest = (req, store) => 
+  runAppropriateStrategy(req, store)
+    .finally(() => window.$nuxt.$loading.finish());
 
 export { sendNetworkRequest };
diff --git a/functions/strategies/AxiosStrategy.js b/functions/strategies/AxiosStrategy.js
index de74ec377..9bef30aef 100644
--- a/functions/strategies/AxiosStrategy.js
+++ b/functions/strategies/AxiosStrategy.js
@@ -2,7 +2,6 @@ import axios from "axios";
 
 const axiosStrategy = async (req, _store) => {
   const res = await axios(req);
-  window.$nuxt.$loading.finish();
   return res;
 };
 
diff --git a/functions/strategies/ProxyStrategy.js b/functions/strategies/ProxyStrategy.js
index 945482f48..0b6f50b0f 100644
--- a/functions/strategies/ProxyStrategy.js
+++ b/functions/strategies/ProxyStrategy.js
@@ -6,7 +6,6 @@ const proxyStrategy = async (req, store) => {
       "https://postwoman.apollotv.xyz/",
     req
   );
-  window.$nuxt.$loading.finish();
   return data;
 };
 

From 5070d9fe95f50081d928a32788aef5cfca17ddd2 Mon Sep 17 00:00:00 2001
From: Andrew Bastin <andrewbastin.k@gmail.com>
Date: Thu, 16 Jan 2020 01:26:25 -0500
Subject: [PATCH 10/21] Added FirefoxStrategy to interact with the Firefox
 extension for Postwoman

---
 functions/network.js                    |  5 +++++
 functions/strategies/FirefoxStrategy.js | 15 +++++++++++++++
 2 files changed, 20 insertions(+)
 create mode 100644 functions/strategies/FirefoxStrategy.js

diff --git a/functions/network.js b/functions/network.js
index cf16b4c55..7ed233cf8 100644
--- a/functions/network.js
+++ b/functions/network.js
@@ -4,6 +4,11 @@ import FirefoxStrategy from "./strategies/FirefoxStrategy";
 
 
 const runAppropriateStrategy = (req, store) => {
+  // The firefox plugin injects a function to send requests through it
+  // If that is available, then we can use the FirefoxStrategy
+  if (window.firefoxExtSendRequest) {
+    return FirefoxStrategy(req, store); 
+  }
 
   if (store.state.postwoman.settings.PROXY_ENABLED) {
     return ProxyStrategy(req, store);
diff --git a/functions/strategies/FirefoxStrategy.js b/functions/strategies/FirefoxStrategy.js
new file mode 100644
index 000000000..77b15f453
--- /dev/null
+++ b/functions/strategies/FirefoxStrategy.js
@@ -0,0 +1,15 @@
+const firefoxStrategy = (req, _store) => new Promise((resolve, reject) => {
+
+  const eventListener = (event) => {
+    window.removeEventListener("firefoxExtSendRequestComplete", eventListener);
+
+    if (event.detail.error) reject(JSON.parse(event.detail.error));
+    else resolve(JSON.parse(event.detail.response));
+  };
+
+  window.addEventListener("firefoxExtSendRequestComplete", eventListener);
+
+  window.firefoxExtSendRequest(req);
+});
+
+export default firefoxStrategy;

From 497a4dfde6b5c564d716da2cb1a817824a9959e3 Mon Sep 17 00:00:00 2001
From: Liyas Thomas <liyascthomas@gmail.com>
Date: Thu, 16 Jan 2020 22:57:35 +0530
Subject: [PATCH 11/21] :bug: Fix #495

---
 components/collections/index.vue | 16 +++++++++-------
 1 file changed, 9 insertions(+), 7 deletions(-)

diff --git a/components/collections/index.vue b/components/collections/index.vue
index 21e060a62..ea2d2b015 100644
--- a/components/collections/index.vue
+++ b/components/collections/index.vue
@@ -47,12 +47,8 @@ TODO:
         </button>
       </div>
       <div>
-        <button
-          class="icon"
-          @click="displayModalImportExport(true)"
-          v-tooltip="$t('import_export')"
-        >
-          <i class="material-icons">import_export</i>
+        <button class="icon" @click="displayModalImportExport(true)">
+          {{ $t("import_export") }}
         </button>
         <!-- <a
           href="https://github.com/liyasthomas/postwoman/wiki/Collections"
@@ -90,12 +86,18 @@ TODO:
         </li>
       </ul>
     </virtual-list>
+    <nuxt-link :to="localePath('doc')" :aria-label="$t('documentation')">
+      <button class="icon">
+        <i class="material-icons">books</i>
+        <span>{{ $t("generate_docs") }}</span>
+      </button>
+    </nuxt-link>
   </div>
 </template>
 
 <style scoped lang="scss">
 .virtual-list {
-  max-height: calc(100vh - 232px);
+  max-height: calc(100vh - 276px);
 }
 
 ul {

From 93acb03297e6d042ad07182678397b5870135474 Mon Sep 17 00:00:00 2001
From: Liyas Thomas <liyascthomas@gmail.com>
Date: Fri, 17 Jan 2020 00:55:31 +0530
Subject: [PATCH 12/21] :sparkles: Toast for extensions

---
 README.md           |  7 +++-
 lang/en-US.js       | 17 +++++---
 layouts/default.vue | 98 +++++++++++++++++++++++++++++++++++++++++++++
 3 files changed, 115 insertions(+), 7 deletions(-)

diff --git a/README.md b/README.md
index c27261def..2ffff8300 100644
--- a/README.md
+++ b/README.md
@@ -218,8 +218,11 @@ _**All `i18n` contributions are welcome to `i18n` [branch](https://github.com/li
 
 📦 **Add-ons**: Official add-ons for Postwoman.
 
- - **[Postwoman Proxy β](https://github.com/postwoman-io/postwoman-proxy)** - A simple proxy server created for Postwoman
- - **[Postwoman CLI β](https://github.com/postwoman-io/postwoman-cli)** - A CLI solution for Postwoman
+ - **[Proxy β](https://github.com/postwoman-io/postwoman-proxy)** - A simple proxy server created for Postwoman
+ - **[CLI β](https://github.com/postwoman-io/postwoman-cli)** - A CLI solution for Postwoman
+ - **[Browser Extensions](https://github.com/postwoman-io/postwoman-cli)** - Browser extensions that simplifies access to Postwoman
+
+ [![Firefox](https://raw.github.com/alrra/browser-logos/master/src/firefox/firefox_24x24.png) **Firefox**]() &nbsp;|&nbsp; ![Chrome](https://raw.github.com/alrra/browser-logos/master/src/chrome/chrome_24x24.png) **Chrome (coming soon)**
 
 _Add-ons are developed and maintained under **[Official Postwoman Organization](https://github.com/postwoman-io)**_
 
diff --git a/lang/en-US.js b/lang/en-US.js
index 0fd4d880d..baa78e0fb 100644
--- a/lang/en-US.js
+++ b/lang/en-US.js
@@ -154,7 +154,8 @@ export default {
   disconnected_from: "Disconnected from {name}",
   something_went_wrong: "Something went wrong!",
   error_occurred: "An error has occurred.",
-  browser_support_sse: "This browser doesn't seems to have Server Sent Events support.",
+  browser_support_sse:
+    "This browser doesn't seems to have Server Sent Events support.",
   log: "Log",
   no_url: "No URL",
   run_query: "Run Query",
@@ -207,7 +208,8 @@ export default {
   value_count: "value {count}",
   send_request_first: "Send a request first",
   generate_docs: "Generate Documentation",
-  generate_docs_message: "Import any Postwoman Collection to Generate Documentation on-the-go.",
+  generate_docs_message:
+    "Import any Postwoman Collection to Generate Documentation on-the-go.",
   generate_docs_first: "Generate documentation first",
   docs_generated: "Documentation generated",
   import_collections: "Import collections",
@@ -231,8 +233,10 @@ export default {
   enable_proxy: "Try enabling Proxy",
   complete_config_urls: "Please complete configuration urls.",
   token_request_saved: "Token request saved",
-  donate_info1: "If you have enjoyed the productivity of using Postwoman, consider donating as a sign of appreciation.",
-  donate_info2: "You can support Postwoman development via the following methods:",
+  donate_info1:
+    "If you have enjoyed the productivity of using Postwoman, consider donating as a sign of appreciation.",
+  donate_info2:
+    "You can support Postwoman development via the following methods:",
   one_time_recurring: "One-time or recurring",
   one_time: "One-time",
   recurring: "Recurring",
@@ -241,5 +245,8 @@ export default {
   go_home: "Go Home",
   reload: "Reload",
   enter_curl: "Enter cURL",
-  empty: "Empty"
+  empty: "Empty",
+  extensions: "Extensions",
+  extensions_info1: "Browser extension that simplifies access to Postwoman",
+  extensions_info2: "Get Postwoman browser extension!"
 };
diff --git a/layouts/default.vue b/layouts/default.vue
index 6ed7a7c0c..bdba8e0d0 100644
--- a/layouts/default.vue
+++ b/layouts/default.vue
@@ -293,6 +293,16 @@
                     <i class="material-icons">more_vert</i>
                   </button>
                   <template slot="popover">
+                    <div>
+                      <button
+                        class="icon"
+                        @click="showExtensions = true"
+                        v-close-popover
+                      >
+                        <i class="material-icons">extension</i>
+                        <span>{{ $t("extensions") }}</span>
+                      </button>
+                    </div>
                     <div>
                       <button
                         class="icon"
@@ -402,6 +412,66 @@
         <aside class="nav-second"></aside>
       </div>
     </div>
+    <modal v-if="showExtensions" @close="showExtensions = false">
+      <div slot="header">
+        <ul>
+          <li>
+            <div class="flex-wrap">
+              <h3 class="title">{{ $t("extensions") }}</h3>
+              <div>
+                <button class="icon" @click="showExtensions = false">
+                  <i class="material-icons">close</i>
+                </button>
+              </div>
+            </div>
+          </li>
+        </ul>
+      </div>
+      <div slot="body">
+        <p class="info">
+          {{ $t("extensions_info1") }}
+        </p>
+        <div>
+          <a
+            href="https://addons.mozilla.org/en-US/firefox/addon/postwoman"
+            target="_blank"
+            rel="noopener"
+          >
+            <button class="icon">
+              <svg
+                class="material-icons"
+                xmlns="http://www.w3.org/2000/svg"
+                width="24"
+                height="24"
+                viewBox="0 0 24 24"
+              >
+                <path
+                  d="M12 0c-6.627 0-12 5.373-12 12s5.373 12 12 12 12-5.373 12-12-5.373-12-12-12zm8.003 8.657c-1.276-3.321-4.46-4.605-5.534-4.537 3.529 1.376 4.373 6.059 4.06 7.441-.307-1.621-1.286-3.017-1.872-3.385 3.417 8.005-4.835 10.465-7.353 7.687.649.168 1.931.085 2.891-.557.898-.602.983-.638 1.56-.683.686-.053-.041-1.406-1.539-1.177-.616.094-1.632.819-2.88.341-1.508-.576-1.46-2.634.096-2.015.337-.437.088-1.263.088-1.263.452-.414 1.022-.706 1.37-.911.228-.135.829-.507.795-1.23-.123-.096-.32-.219-.766-.193-1.736.11-1.852-.518-1.967-.808.078-.668.524-1.534 1.361-1.931-1.257-.193-2.28.397-2.789 1.154-.809-.174-1.305-.183-2.118-.031-.316-.24-.666-.67-.878-1.181 1.832-2.066 4.499-3.378 7.472-3.378 5.912 0 8.263 4.283 8.003 6.657z"
+                />
+              </svg>
+              <span>Firefox</span>
+            </button>
+          </a>
+        </div>
+        <div>
+          <button class="icon" disabled>
+            <svg
+              class="material-icons"
+              xmlns="http://www.w3.org/2000/svg"
+              width="24"
+              height="24"
+              viewBox="0 0 24 24"
+            >
+              <path
+                d="M2.897 4.181c2.43-2.828 5.763-4.181 9.072-4.181 4.288 0 8.535 2.273 10.717 6.554-2.722.001-6.984 0-9.293 0-1.674.001-2.755-.037-3.926.579-1.376.724-2.415 2.067-2.777 3.644l-3.793-6.596zm5.11 7.819c0 2.2 1.789 3.99 3.988 3.99s3.988-1.79 3.988-3.99-1.789-3.991-3.988-3.991-3.988 1.791-3.988 3.991zm5.536 5.223c-2.238.666-4.858-.073-6.293-2.549-1.095-1.891-3.989-6.933-5.305-9.225-1.33 2.04-1.945 4.294-1.945 6.507 0 5.448 3.726 10.65 9.673 11.818l3.87-6.551zm2.158-9.214c1.864 1.734 2.271 4.542 1.007 6.719-.951 1.641-3.988 6.766-5.46 9.248 7.189.443 12.752-5.36 12.752-11.972 0-1.313-.22-2.66-.69-3.995h-7.609z"
+              />
+            </svg>
+            <span>Chrome (coming soon)</span>
+          </button>
+        </div>
+      </div>
+      <div slot="footer"></div>
+    </modal>
     <modal v-if="showShortcuts" @close="showShortcuts = false">
       <div slot="header">
         <ul>
@@ -532,6 +602,7 @@ export default {
       // prompt.
       showInstallPrompt: null,
       version: {},
+      showExtensions: false,
       showShortcuts: false,
       showSupport: false
     };
@@ -591,6 +662,33 @@ export default {
           ]
         });
       }
+      let showExtensionsToast =
+        localStorage.getItem("showExtensionsToast") === "yes";
+      if (!showExtensionsToast) {
+        setTimeout(() => {
+          this.$toast.show(this.$t("extensions_info2"), {
+            icon: "extension",
+            duration: 5000,
+            theme: "toasted-primary",
+            action: [
+              {
+                text: this.$t("yes"),
+                onClick: (e, toastObject) => {
+                  this.showExtensions = true;
+                  localStorage.setItem("showExtensionsToast", "yes");
+                  toastObject.goAway(0);
+                }
+              },
+              {
+                text: this.$t("no"),
+                onClick: (e, toastObject) => {
+                  toastObject.goAway(0);
+                }
+              }
+            ]
+          });
+        }, 10000);
+      }
     })();
 
     window.addEventListener("scroll", event => {

From 60676addef3d65a855071c46a52ded3762a41988 Mon Sep 17 00:00:00 2001
From: Liyas Thomas <liyascthomas@gmail.com>
Date: Fri, 17 Jan 2020 01:31:30 +0530
Subject: [PATCH 13/21] :pencil2: Typo

---
 README.md | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/README.md b/README.md
index 2ffff8300..41b3cce62 100644
--- a/README.md
+++ b/README.md
@@ -220,9 +220,9 @@ _**All `i18n` contributions are welcome to `i18n` [branch](https://github.com/li
 
  - **[Proxy β](https://github.com/postwoman-io/postwoman-proxy)** - A simple proxy server created for Postwoman
  - **[CLI β](https://github.com/postwoman-io/postwoman-cli)** - A CLI solution for Postwoman
- - **[Browser Extensions](https://github.com/postwoman-io/postwoman-cli)** - Browser extensions that simplifies access to Postwoman
+ - **[Browser Extensions](https://github.com/AndrewBastin/postwoman-firefox)** - Browser extensions that simplifies access to Postwoman
 
- [![Firefox](https://raw.github.com/alrra/browser-logos/master/src/firefox/firefox_24x24.png) **Firefox**]() &nbsp;|&nbsp; ![Chrome](https://raw.github.com/alrra/browser-logos/master/src/chrome/chrome_24x24.png) **Chrome (coming soon)**
+ > [![Firefox](https://raw.github.com/alrra/browser-logos/master/src/firefox/firefox_16x16.png) **Firefox**](https://addons.mozilla.org/en-US/firefox/addon/postwoman) &nbsp;|&nbsp; ![Chrome](https://raw.github.com/alrra/browser-logos/master/src/chrome/chrome_16x16.png) **Chrome (coming soon)**
 
 _Add-ons are developed and maintained under **[Official Postwoman Organization](https://github.com/postwoman-io)**_
 

From f7a67ec30f1571f8ab5a0fae404bdcfc2443ecd6 Mon Sep 17 00:00:00 2001
From: Liyas Thomas <liyascthomas@gmail.com>
Date: Fri, 17 Jan 2020 09:46:23 +0530
Subject: [PATCH 14/21] :sparkles: Indicate installed extensions

---
 lang/en-US.js       |  3 ++-
 layouts/default.vue | 20 ++++++++++++++++++--
 2 files changed, 20 insertions(+), 3 deletions(-)

diff --git a/lang/en-US.js b/lang/en-US.js
index baa78e0fb..906fb0602 100644
--- a/lang/en-US.js
+++ b/lang/en-US.js
@@ -248,5 +248,6 @@ export default {
   empty: "Empty",
   extensions: "Extensions",
   extensions_info1: "Browser extension that simplifies access to Postwoman",
-  extensions_info2: "Get Postwoman browser extension!"
+  extensions_info2: "Get Postwoman browser extension!",
+  installed: "Installed"
 };
diff --git a/layouts/default.vue b/layouts/default.vue
index bdba8e0d0..74664578b 100644
--- a/layouts/default.vue
+++ b/layouts/default.vue
@@ -450,6 +450,13 @@
                 />
               </svg>
               <span>Firefox</span>
+              <span
+                class="icon"
+                v-if="firefoxExtInstalled"
+                v-tooltip="$t('installed')"
+              >
+                <i class="material-icons">done</i>
+              </span>
             </button>
           </a>
         </div>
@@ -467,6 +474,13 @@
               />
             </svg>
             <span>Chrome (coming soon)</span>
+            <span
+              class="icon"
+              v-if="chromeExtInstalled"
+              v-tooltip="$t('installed')"
+            >
+              <i class="material-icons">done</i>
+            </span>
           </button>
         </div>
       </div>
@@ -604,7 +618,9 @@ export default {
       version: {},
       showExtensions: false,
       showShortcuts: false,
-      showSupport: false
+      showSupport: false,
+      firefoxExtInstalled: window.firefoxExtSendRequest,
+      chromeExtInstalled: false
     };
   },
 
@@ -687,7 +703,7 @@ export default {
               }
             ]
           });
-        }, 10000);
+        }, 15000);
       }
     })();
 

From c4c2f1cbee750849573f584749982227fa44d386 Mon Sep 17 00:00:00 2001
From: pushrbx <thomace44@gmail.com>
Date: Fri, 17 Jan 2020 11:58:13 +0000
Subject: [PATCH 15/21] =?UTF-8?q?=09=F0=9F=92=9A=20Fixed=20#497?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 pages/graphql.vue | 10 +++-------
 1 file changed, 3 insertions(+), 7 deletions(-)

diff --git a/pages/graphql.vue b/pages/graphql.vue
index 5abbde18e..f057e117e 100644
--- a/pages/graphql.vue
+++ b/pages/graphql.vue
@@ -667,16 +667,12 @@ export default {
         const gqlQueryString = this.gqlQueryString;
         this.variables.forEach(variable => {
           // todo: better variable type validation
-          const intRex = new RegExp(`\$${variable.key}\: Int`);
-          intRex.compile();
-          const floatRex = new RegExp(`\$${variable.key}\: Float`);
-          floatRex.compile();
-
-          if (intRex.test(gqlQueryString)) {
+          if (gqlQueryString.indexOf(`\$${variable.key}: Int`) > -1) {
             variables[variable.key] = parseInt(variable.value);
-          } else if (floatRex.test(gqlQueryString)) {
+          } else if (gqlQueryString.indexOf(`\$${variable.key}: Float`) > -1) {
             variables[variable.key] = parseFloat(variable.value);
           } else {
+            console.log(variable);
             variables[variable.key] = variable.value;
           }
         });

From 76d2ca3e37992435ecdcb7187b0afb7eaa465280 Mon Sep 17 00:00:00 2001
From: pushrbx <thomace44@gmail.com>
Date: Fri, 17 Jan 2020 17:58:09 +0000
Subject: [PATCH 16/21] removed unneeded console.log

---
 pages/graphql.vue | 1 -
 1 file changed, 1 deletion(-)

diff --git a/pages/graphql.vue b/pages/graphql.vue
index f057e117e..05e14e940 100644
--- a/pages/graphql.vue
+++ b/pages/graphql.vue
@@ -672,7 +672,6 @@ export default {
           } else if (gqlQueryString.indexOf(`\$${variable.key}: Float`) > -1) {
             variables[variable.key] = parseFloat(variable.value);
           } else {
-            console.log(variable);
             variables[variable.key] = variable.value;
           }
         });

From 9e43bbcce29436a4790d60a1922495c891f23069 Mon Sep 17 00:00:00 2001
From: "dependabot-preview[bot]"
 <27856297+dependabot-preview[bot]@users.noreply.github.com>
Date: Sat, 18 Jan 2020 00:13:19 +0000
Subject: [PATCH 17/21] chore(deps): bump ace-builds from 1.4.7 to 1.4.8

Bumps [ace-builds](https://github.com/ajaxorg/ace-builds) from 1.4.7 to 1.4.8.
- [Release notes](https://github.com/ajaxorg/ace-builds/releases)
- [Changelog](https://github.com/ajaxorg/ace-builds/blob/master/ChangeLog.txt)
- [Commits](https://github.com/ajaxorg/ace-builds/compare/v1.4.7...v1.4.8)

Signed-off-by: dependabot-preview[bot] <support@dependabot.com>
---
 package-lock.json | 6 +++---
 package.json      | 2 +-
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 43d04f543..e305cd524 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1834,9 +1834,9 @@
             }
         },
         "ace-builds": {
-            "version": "1.4.7",
-            "resolved": "https://registry.npmjs.org/ace-builds/-/ace-builds-1.4.7.tgz",
-            "integrity": "sha512-gwQGVFewBopRLho08BfahyvRa9FlB43JUig5ItAKTYc9kJJsbA9QNz75p28QtQomoPQ9rJx82ymL21x4ZSZmdg=="
+            "version": "1.4.8",
+            "resolved": "https://registry.npmjs.org/ace-builds/-/ace-builds-1.4.8.tgz",
+            "integrity": "sha512-8ZVAxwyCGAxQX8mOp9imSXH0hoSPkGfy8igJy+WO/7axL30saRhKgg1XPACSmxxPA7nfHVwM+ShWXT+vKsNuFg=="
         },
         "acorn": {
             "version": "6.4.0",
diff --git a/package.json b/package.json
index df2b5d471..fc170337f 100644
--- a/package.json
+++ b/package.json
@@ -25,7 +25,7 @@
         "@nuxtjs/robots": "^2.4.2",
         "@nuxtjs/sitemap": "^2.0.1",
         "@nuxtjs/toast": "^3.3.0",
-        "ace-builds": "^1.4.7",
+        "ace-builds": "^1.4.8",
         "graphql": "^14.5.8",
         "nuxt": "^2.11.0",
         "nuxt-i18n": "^6.4.1",

From b6e5f7f3379eeff954ed1ae65b05602d82debfca Mon Sep 17 00:00:00 2001
From: "dependabot-preview[bot]"
 <27856297+dependabot-preview[bot]@users.noreply.github.com>
Date: Sat, 18 Jan 2020 01:24:42 +0000
Subject: [PATCH 18/21] chore(deps-dev): bump sass-loader from 8.0.1 to 8.0.2

Bumps [sass-loader](https://github.com/webpack-contrib/sass-loader) from 8.0.1 to 8.0.2.
- [Release notes](https://github.com/webpack-contrib/sass-loader/releases)
- [Changelog](https://github.com/webpack-contrib/sass-loader/blob/master/CHANGELOG.md)
- [Commits](https://github.com/webpack-contrib/sass-loader/compare/v8.0.1...v8.0.2)

Signed-off-by: dependabot-preview[bot] <support@dependabot.com>
---
 package-lock.json | 14 +++++++-------
 package.json      |  2 +-
 2 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index e305cd524..37d9c4300 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -9359,22 +9359,22 @@
             }
         },
         "sass-loader": {
-            "version": "8.0.1",
-            "resolved": "https://registry.npmjs.org/sass-loader/-/sass-loader-8.0.1.tgz",
-            "integrity": "sha512-ANR2JHuoxzCI+OPDA0hJBv1Y16A2021hucu0S3DOGgpukKzq9W+4vX9jhIqs4qibT5E7RIRsHMMrN0kdF5nUig==",
+            "version": "8.0.2",
+            "resolved": "https://registry.npmjs.org/sass-loader/-/sass-loader-8.0.2.tgz",
+            "integrity": "sha512-7o4dbSK8/Ol2KflEmSco4jTjQoV988bM82P9CZdmo9hR3RLnvNc0ufMNdMrB0caq38JQ/FgF4/7RcbcfKzxoFQ==",
             "dev": true,
             "requires": {
                 "clone-deep": "^4.0.1",
                 "loader-utils": "^1.2.3",
                 "neo-async": "^2.6.1",
                 "schema-utils": "^2.6.1",
-                "semver": "^7.1.1"
+                "semver": "^6.3.0"
             },
             "dependencies": {
                 "semver": {
-                    "version": "7.1.1",
-                    "resolved": "https://registry.npmjs.org/semver/-/semver-7.1.1.tgz",
-                    "integrity": "sha512-WfuG+fl6eh3eZ2qAf6goB7nhiCd7NPXhmyFxigB/TOkQyeLP8w8GsVehvtGNtnNmyboz4TgeK40B1Kbql/8c5A==",
+                    "version": "6.3.0",
+                    "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz",
+                    "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==",
                     "dev": true
                 }
             }
diff --git a/package.json b/package.json
index fc170337f..9a7ebbc62 100644
--- a/package.json
+++ b/package.json
@@ -38,7 +38,7 @@
     "devDependencies": {
         "cypress": "^3.8.2",
         "node-sass": "^4.13.0",
-        "sass-loader": "^8.0.1",
+        "sass-loader": "^8.0.2",
         "start-server-and-test": "^1.10.6"
     }
 }

From 808e4545ae4b2e816e116ebb30af6fbcbe293508 Mon Sep 17 00:00:00 2001
From: "dependabot-preview[bot]"
 <27856297+dependabot-preview[bot]@users.noreply.github.com>
Date: Sat, 18 Jan 2020 01:51:14 +0000
Subject: [PATCH 19/21] chore(deps): bump @nuxtjs/axios from 5.9.2 to 5.9.3

Bumps [@nuxtjs/axios](https://github.com/nuxt-community/axios-module) from 5.9.2 to 5.9.3.
- [Release notes](https://github.com/nuxt-community/axios-module/releases)
- [Changelog](https://github.com/nuxt-community/axios-module/blob/dev/CHANGELOG.md)
- [Commits](https://github.com/nuxt-community/axios-module/compare/v5.9.2...v5.9.3)

Signed-off-by: dependabot-preview[bot] <support@dependabot.com>
---
 package-lock.json | 22 ++++++++--------------
 package.json      |  2 +-
 2 files changed, 9 insertions(+), 15 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 37d9c4300..aa2faeaa1 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1413,12 +1413,12 @@
             }
         },
         "@nuxtjs/axios": {
-            "version": "5.9.2",
-            "resolved": "https://registry.npmjs.org/@nuxtjs/axios/-/axios-5.9.2.tgz",
-            "integrity": "sha512-OwRy40N7Q0V0i5A8ojUy9TlvvaYDPlDmUDKPMVxkcFf+wnmgtJbLJGgHrPWof9Y0jb9EXLgxbRmk0LgrNk7QCw==",
+            "version": "5.9.3",
+            "resolved": "https://registry.npmjs.org/@nuxtjs/axios/-/axios-5.9.3.tgz",
+            "integrity": "sha512-+P1BK7MxMRL4q1WeYM9vyfocJrRoskbuD2TztKU8ryunK8JgpkIvqCzQxTI2BLUbOPd7qvjPLwzA0QBdzqYlaA==",
             "requires": {
                 "@nuxtjs/proxy": "^1.3.3",
-                "axios": "^0.19.0",
+                "axios": "^0.19.1",
                 "axios-retry": "^3.1.2",
                 "consola": "^2.11.3",
                 "defu": "^0.0.4"
@@ -2166,12 +2166,11 @@
             "dev": true
         },
         "axios": {
-            "version": "0.19.0",
-            "resolved": "https://registry.npmjs.org/axios/-/axios-0.19.0.tgz",
-            "integrity": "sha512-1uvKqKQta3KBxIz14F2v06AEHZ/dIoeKfbTRkK1E5oqjDnuEerLmYTgJB5AiQZHJcljpg1TuRzdjDR06qNk0DQ==",
+            "version": "0.19.1",
+            "resolved": "https://registry.npmjs.org/axios/-/axios-0.19.1.tgz",
+            "integrity": "sha512-Yl+7nfreYKaLRvAvjNPkvfjnQHJM1yLBY3zhqAwcJSwR/6ETkanUgylgtIvkvz0xJ+p/vZuNw8X7Hnb7Whsbpw==",
             "requires": {
-                "follow-redirects": "1.5.10",
-                "is-buffer": "^2.0.2"
+                "follow-redirects": "1.5.10"
             },
             "dependencies": {
                 "debug": {
@@ -2190,11 +2189,6 @@
                         "debug": "=3.1.0"
                     }
                 },
-                "is-buffer": {
-                    "version": "2.0.4",
-                    "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-2.0.4.tgz",
-                    "integrity": "sha512-Kq1rokWXOPXWuaMAqZiJW4XxsmD9zGx9q4aePabbn3qCRGedtH7Cm+zV8WETitMfu1wdh+Rvd6w5egwSngUX2A=="
-                },
                 "ms": {
                     "version": "2.0.0",
                     "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
diff --git a/package.json b/package.json
index 9a7ebbc62..564519f3b 100644
--- a/package.json
+++ b/package.json
@@ -18,7 +18,7 @@
         "test": "start-server-and-test dev http://localhost:3000 e2e"
     },
     "dependencies": {
-        "@nuxtjs/axios": "^5.9.2",
+        "@nuxtjs/axios": "^5.9.3",
         "@nuxtjs/google-analytics": "^2.2.3",
         "@nuxtjs/google-tag-manager": "^2.3.1",
         "@nuxtjs/pwa": "^3.0.0-beta.19",

From 15e5edb1a36cb88d4fb81754a585e2476dfd2554 Mon Sep 17 00:00:00 2001
From: "dependabot-preview[bot]"
 <27856297+dependabot-preview[bot]@users.noreply.github.com>
Date: Sat, 18 Jan 2020 02:05:59 +0000
Subject: [PATCH 20/21] chore(deps-dev): bump node-sass from 4.13.0 to 4.13.1

Bumps [node-sass](https://github.com/sass/node-sass) from 4.13.0 to 4.13.1.
- [Release notes](https://github.com/sass/node-sass/releases)
- [Changelog](https://github.com/sass/node-sass/blob/master/CHANGELOG.md)
- [Commits](https://github.com/sass/node-sass/compare/v4.13.0...v4.13.1)

Signed-off-by: dependabot-preview[bot] <support@dependabot.com>
---
 package-lock.json | 24 ++++++++++++------------
 package.json      |  2 +-
 2 files changed, 13 insertions(+), 13 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index aa2faeaa1..596757fe5 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1972,9 +1972,9 @@
             },
             "dependencies": {
                 "readable-stream": {
-                    "version": "2.3.6",
-                    "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.6.tgz",
-                    "integrity": "sha512-tQtKA9WIAhBF3+VLAseyMqZeBjW0AHJoxOtYqSUZNJxauErmLbVm2FW1y+J/YA9dUrAC39ITejlZWhVIwawkKw==",
+                    "version": "2.3.7",
+                    "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
+                    "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
                     "dev": true,
                     "requires": {
                         "core-util-is": "~1.0.0",
@@ -5106,9 +5106,9 @@
             "integrity": "sha512-WOBp/EEGUiIsJSp7wcv/y6MO+lV9UoncWqxuFfm8eBwzWNgyfBd6Gz+IeKQ9jCmyhoH99g15M3T+QaVHFjizVA=="
         },
         "globule": {
-            "version": "1.2.1",
-            "resolved": "https://registry.npmjs.org/globule/-/globule-1.2.1.tgz",
-            "integrity": "sha512-g7QtgWF4uYSL5/dn71WxubOrS7JVGCnFPEnoeChJmBnyR9Mw8nGoEwOgJL/RC2Te0WhbsEUCejfH8SZNJ+adYQ==",
+            "version": "1.3.0",
+            "resolved": "https://registry.npmjs.org/globule/-/globule-1.3.0.tgz",
+            "integrity": "sha512-YlD4kdMqRCQHrhVdonet4TdRtv1/sZKepvoxNT4Nrhrp5HI8XFfc8kFlGlBn2myBo80aGp8Eft259mbcUJhgSg==",
             "dev": true,
             "requires": {
                 "glob": "~7.1.1",
@@ -7042,9 +7042,9 @@
             }
         },
         "node-sass": {
-            "version": "4.13.0",
-            "resolved": "https://registry.npmjs.org/node-sass/-/node-sass-4.13.0.tgz",
-            "integrity": "sha512-W1XBrvoJ1dy7VsvTAS5q1V45lREbTlZQqFbiHb3R3OTTCma0XBtuG6xZ6Z4506nR4lmHPTqVRwxT6KgtWC97CA==",
+            "version": "4.13.1",
+            "resolved": "https://registry.npmjs.org/node-sass/-/node-sass-4.13.1.tgz",
+            "integrity": "sha512-TTWFx+ZhyDx1Biiez2nB0L3YrCZ/8oHagaDalbuBSlqXgUPsdkUSzJsVxeDO9LtPB49+Fh3WQl3slABo6AotNw==",
             "dev": true,
             "requires": {
                 "async-foreach": "^0.1.3",
@@ -10020,9 +10020,9 @@
             },
             "dependencies": {
                 "readable-stream": {
-                    "version": "2.3.6",
-                    "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.6.tgz",
-                    "integrity": "sha512-tQtKA9WIAhBF3+VLAseyMqZeBjW0AHJoxOtYqSUZNJxauErmLbVm2FW1y+J/YA9dUrAC39ITejlZWhVIwawkKw==",
+                    "version": "2.3.7",
+                    "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
+                    "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
                     "dev": true,
                     "requires": {
                         "core-util-is": "~1.0.0",
diff --git a/package.json b/package.json
index 564519f3b..2a375a7a3 100644
--- a/package.json
+++ b/package.json
@@ -37,7 +37,7 @@
     },
     "devDependencies": {
         "cypress": "^3.8.2",
-        "node-sass": "^4.13.0",
+        "node-sass": "^4.13.1",
         "sass-loader": "^8.0.2",
         "start-server-and-test": "^1.10.6"
     }

From 5206aeead06cfd486b295e311993a312ce66958f Mon Sep 17 00:00:00 2001
From: Liyas Thomas <liyascthomas@gmail.com>
Date: Sat, 18 Jan 2020 10:07:30 +0530
Subject: [PATCH 21/21] :zap: Don't show Extension toast if user opt-out of it
 once or have already installed it.

---
 layouts/default.vue | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

diff --git a/layouts/default.vue b/layouts/default.vue
index 74664578b..447e58ae4 100644
--- a/layouts/default.vue
+++ b/layouts/default.vue
@@ -619,7 +619,8 @@ export default {
       showExtensions: false,
       showShortcuts: false,
       showSupport: false,
-      firefoxExtInstalled: window.firefoxExtSendRequest,
+      firefoxExtInstalled:
+        window.firefoxExtSendRequest !== undefined ? true : false,
       chromeExtInstalled: false
     };
   },
@@ -680,7 +681,11 @@ export default {
       }
       let showExtensionsToast =
         localStorage.getItem("showExtensionsToast") === "yes";
-      if (!showExtensionsToast) {
+      if (
+        !this.firefoxExtInstalled &&
+        !this.chromeExtInstalled &&
+        !showExtensionsToast
+      ) {
         setTimeout(() => {
           this.$toast.show(this.$t("extensions_info2"), {
             icon: "extension",