From c1ce90dad0cc919978e666e9f9ce45bef0c44984 Mon Sep 17 00:00:00 2001
From: liyasthomas <liyascthomas@gmail.com>
Date: Thu, 19 Aug 2021 00:10:57 +0530
Subject: [PATCH] feat: finish new i18n translation format

---
 components/app/Share.vue                      |   2 +-
 components/app/Shortcuts.vue                  |   2 +-
 components/collections/Add.vue                |  10 +-
 components/collections/AddFolder.vue          |   7 +-
 components/collections/Edit.vue               |  10 +-
 components/collections/EditFolder.vue         |   7 +-
 components/collections/EditRequest.vue        |   9 +-
 components/collections/ImportExport.vue       |  16 +-
 components/collections/SaveRequest.vue        |  12 +-
 components/collections/graphql/Add.vue        |  10 +-
 components/collections/graphql/AddFolder.vue  |   7 +-
 components/collections/graphql/Collection.vue |   6 +-
 components/collections/graphql/Edit.vue       |  10 +-
 components/collections/graphql/EditFolder.vue |   7 +-
 .../collections/graphql/EditRequest.vue       |   9 +-
 components/collections/graphql/Folder.vue     |   6 +-
 .../collections/graphql/ImportExport.vue      |  14 +-
 components/collections/graphql/Request.vue    |   8 +-
 components/collections/graphql/index.vue      |   6 +-
 components/collections/index.vue              |  16 +-
 components/collections/my/Collection.vue      |   4 +-
 components/collections/my/Folder.vue          |   6 +-
 components/collections/my/Request.vue         |   6 +-
 components/collections/teams/Collection.vue   |   4 +-
 components/collections/teams/Folder.vue       |   6 +-
 components/collections/teams/Request.vue      |   6 +-
 components/docs/Collection.vue                |   2 +-
 components/docs/Folder.vue                    |   2 +-
 components/docs/Request.vue                   |  47 +-
 components/environments/Add.vue               |  10 +-
 components/environments/Edit.vue              |  12 +-
 components/environments/Environment.vue       |   6 +-
 components/environments/ImportExport.vue      |  14 +-
 components/environments/index.vue             |   2 +-
 components/firebase/Login.vue                 |   8 +-
 components/graphql/Field.vue                  |   2 +-
 components/graphql/QueryEditor.vue            |   2 +-
 components/graphql/RequestOptions.vue         |  10 +-
 components/graphql/Response.vue               |   6 +-
 components/graphql/Sidebar.vue                |   6 +-
 components/history/index.vue                  |   8 +-
 components/history/rest/Card.vue              |   6 +-
 components/http/Authorization.vue             |  20 +-
 components/http/CodegenModal.vue              |   2 +-
 components/http/ImportCurl.vue                |   7 +-
 components/http/RawBody.vue                   |   8 +-
 components/http/Request.vue                   |   2 +-
 components/http/ResponseMeta.vue              |   4 +-
 components/http/TokenList.vue                 |  80 --
 .../lenses/renderers/HTMLLensRenderer.vue     |   6 +-
 .../lenses/renderers/ImageLensRenderer.vue    |   4 +-
 .../lenses/renderers/JSONLensRenderer.vue     |   6 +-
 .../lenses/renderers/RawLensRenderer.vue      |   6 +-
 .../lenses/renderers/XMLLensRenderer.vue      |   6 +-
 components/realtime/Mqtt.vue                  |  12 +-
 components/realtime/Socketio.vue              |  12 +-
 components/realtime/Sse.vue                   |  16 +-
 components/realtime/Websocket.vue             |  19 +-
 components/smart/ConfirmModal.vue             |   4 +-
 components/teams/Add.vue                      |   7 +-
 components/teams/Edit.vue                     |   7 +-
 components/teams/Team.vue                     |   6 +-
 components/teams/index.vue                    |   2 +-
 locales/en.json                               | 941 +++++++++---------
 pages/documentation.vue                       |  13 +-
 pages/settings.vue                            |  18 +-
 66 files changed, 755 insertions(+), 802 deletions(-)
 delete mode 100644 components/http/TokenList.vue

diff --git a/components/app/Share.vue b/components/app/Share.vue
index 5f78134d6..50189fd75 100644
--- a/components/app/Share.vue
+++ b/components/app/Share.vue
@@ -86,7 +86,7 @@ export default {
     copyAppLink() {
       copyToClipboard(this.url)
       this.copyIcon = "done"
-      this.$toast.success(this.$t("copied_to_clipboard").toString(), {
+      this.$toast.success(this.$t("state.copied_to_clipboard").toString(), {
         icon: "done",
       })
       setTimeout(() => (this.copyIcon = "content_copy"), 1000)
diff --git a/components/app/Shortcuts.vue b/components/app/Shortcuts.vue
index 00d342a43..67fa87f03 100644
--- a/components/app/Shortcuts.vue
+++ b/components/app/Shortcuts.vue
@@ -38,7 +38,7 @@
               pl-8
               focus-visible:border-divider
             "
-            :placeholder="$t('search')"
+            :placeholder="$t('action.search')"
           />
         </div>
       </div>
diff --git a/components/collections/Add.vue b/components/collections/Add.vue
index dc0d9c7eb..c17af8515 100644
--- a/components/collections/Add.vue
+++ b/components/collections/Add.vue
@@ -18,8 +18,14 @@
     </template>
     <template #footer>
       <span>
-        <ButtonPrimary :label="$t('save')" @click.native="addNewCollection" />
-        <ButtonSecondary :label="$t('cancel')" @click.native="hideModal" />
+        <ButtonPrimary
+          :label="$t('action.save')"
+          @click.native="addNewCollection"
+        />
+        <ButtonSecondary
+          :label="$t('action.cancel')"
+          @click.native="hideModal"
+        />
       </span>
     </template>
   </SmartModal>
diff --git a/components/collections/AddFolder.vue b/components/collections/AddFolder.vue
index e5e83f64f..d018349a5 100644
--- a/components/collections/AddFolder.vue
+++ b/components/collections/AddFolder.vue
@@ -22,8 +22,11 @@
     </template>
     <template #footer>
       <span>
-        <ButtonPrimary :label="$t('save')" @click.native="addFolder" />
-        <ButtonSecondary :label="$t('cancel')" @click.native="hideModal" />
+        <ButtonPrimary :label="$t('action.save')" @click.native="addFolder" />
+        <ButtonSecondary
+          :label="$t('action.cancel')"
+          @click.native="hideModal"
+        />
       </span>
     </template>
   </SmartModal>
diff --git a/components/collections/Edit.vue b/components/collections/Edit.vue
index a76b87f4b..75c6910d2 100644
--- a/components/collections/Edit.vue
+++ b/components/collections/Edit.vue
@@ -18,8 +18,14 @@
     </template>
     <template #footer>
       <span>
-        <ButtonPrimary :label="$t('save')" @click.native="saveCollection" />
-        <ButtonSecondary :label="$t('cancel')" @click.native="hideModal" />
+        <ButtonPrimary
+          :label="$t('action.save')"
+          @click.native="saveCollection"
+        />
+        <ButtonSecondary
+          :label="$t('action.cancel')"
+          @click.native="hideModal"
+        />
       </span>
     </template>
   </SmartModal>
diff --git a/components/collections/EditFolder.vue b/components/collections/EditFolder.vue
index 64d212aa0..013f5c3be 100644
--- a/components/collections/EditFolder.vue
+++ b/components/collections/EditFolder.vue
@@ -22,8 +22,11 @@
     </template>
     <template #footer>
       <span>
-        <ButtonPrimary :label="$t('save')" @click.native="editFolder" />
-        <ButtonSecondary :label="$t('cancel')" @click.native="hideModal" />
+        <ButtonPrimary :label="$t('action.save')" @click.native="editFolder" />
+        <ButtonSecondary
+          :label="$t('action.cancel')"
+          @click.native="hideModal"
+        />
       </span>
     </template>
   </SmartModal>
diff --git a/components/collections/EditRequest.vue b/components/collections/EditRequest.vue
index b6d6260c6..149f91015 100644
--- a/components/collections/EditRequest.vue
+++ b/components/collections/EditRequest.vue
@@ -1,5 +1,5 @@
 <template>
-  <SmartModal v-if="show" :title="$t('edit_request')" @close="hideModal">
+  <SmartModal v-if="show" :title="$t('modal.edit_request')" @close="hideModal">
     <template #body>
       <div class="flex flex-col px-2">
         <input
@@ -18,8 +18,11 @@
     </template>
     <template #footer>
       <span>
-        <ButtonPrimary :label="$t('save')" @click.native="saveRequest" />
-        <ButtonSecondary :label="$t('cancel')" @click.native="hideModal" />
+        <ButtonPrimary :label="$t('action.save')" @click.native="saveRequest" />
+        <ButtonSecondary
+          :label="$t('action.cancel')"
+          @click.native="hideModal"
+        />
       </span>
     </template>
   </SmartModal>
diff --git a/components/collections/ImportExport.vue b/components/collections/ImportExport.vue
index 340c0932d..52b4799d8 100644
--- a/components/collections/ImportExport.vue
+++ b/components/collections/ImportExport.vue
@@ -30,7 +30,7 @@
           <template #trigger>
             <ButtonSecondary
               v-tippy="{ theme: 'tooltip' }"
-              :title="$t('more')"
+              :title="$t('action.more')"
               class="rounded"
               icon="more_vert"
             />
@@ -73,9 +73,9 @@
       <div v-if="mode == 'import_export'" class="flex flex-col space-y-2">
         <SmartItem
           v-tippy="{ theme: 'tooltip' }"
-          :title="$t('replace_current')"
+          :title="$t('action.replace_current')"
           icon="folder_special"
-          :label="$t('replace_json')"
+          :label="$t('action.replace_json')"
           @click.native="openDialogChooseFileToReplaceWith"
         />
         <input
@@ -88,7 +88,7 @@
         />
         <SmartItem
           v-tippy="{ theme: 'tooltip' }"
-          :title="$t('preserve_current')"
+          :title="$t('action.preserve_current')"
           icon="create_new_folder"
           :label="$t('import.json')"
           @click.native="openDialogChooseFileToImportFrom"
@@ -104,14 +104,14 @@
         <SmartItem
           v-if="collectionsType.type == 'team-collections'"
           v-tippy="{ theme: 'tooltip' }"
-          :title="$t('preserve_current')"
+          :title="$t('action.preserve_current')"
           icon="folder_shared"
           :label="$t('import.from_my_collections')"
           @click.native="mode = 'import_from_my_collections'"
         />
         <SmartItem
           v-tippy="{ theme: 'tooltip' }"
-          :title="$t('download_file')"
+          :title="$t('action.download_file')"
           icon="drive_file_move"
           :label="$t('export.as_json')"
           @click.native="exportJSON"
@@ -404,7 +404,7 @@ export default defineComponent({
       a.download = `${url.split("/").pop().split("#")[0].split("?")[0]}`
       document.body.appendChild(a)
       a.click()
-      this.$toast.success(this.$t("download_started"), {
+      this.$toast.success(this.$t("state.download_started"), {
         icon: "done",
       })
       setTimeout(() => {
@@ -413,7 +413,7 @@ export default defineComponent({
       }, 1000)
     },
     fileImported() {
-      this.$toast.success(this.$t("file_imported"), {
+      this.$toast.success(this.$t("state.file_imported"), {
         icon: "folder_shared",
       })
     },
diff --git a/components/collections/SaveRequest.vue b/components/collections/SaveRequest.vue
index 5c505c951..42d23bb20 100644
--- a/components/collections/SaveRequest.vue
+++ b/components/collections/SaveRequest.vue
@@ -39,8 +39,14 @@
     </template>
     <template #footer>
       <span>
-        <ButtonPrimary :label="$t('save')" @click.native="saveRequestAs" />
-        <ButtonSecondary :label="$t('cancel')" @click.native="hideModal" />
+        <ButtonPrimary
+          :label="$t('action.save')"
+          @click.native="saveRequestAs"
+        />
+        <ButtonSecondary
+          :label="$t('action.cancel')"
+          @click.native="hideModal"
+        />
       </span>
     </template>
   </SmartModal>
@@ -108,7 +114,7 @@ export default defineComponent({
     },
     saveRequestAs() {
       if (!this.requestName) {
-        this.$toast.error(this.$t("empty_req_name"), {
+        this.$toast.error(this.$t("error.empty_req_name"), {
           icon: "error",
         })
         return
diff --git a/components/collections/graphql/Add.vue b/components/collections/graphql/Add.vue
index 7473dfddd..2a8fe99f4 100644
--- a/components/collections/graphql/Add.vue
+++ b/components/collections/graphql/Add.vue
@@ -18,8 +18,14 @@
     </template>
     <template #footer>
       <span>
-        <ButtonPrimary :label="$t('save')" @click.native="addNewCollection" />
-        <ButtonSecondary :label="$t('cancel')" @click.native="hideModal" />
+        <ButtonPrimary
+          :label="$t('action.save')"
+          @click.native="addNewCollection"
+        />
+        <ButtonSecondary
+          :label="$t('action.cancel')"
+          @click.native="hideModal"
+        />
       </span>
     </template>
   </SmartModal>
diff --git a/components/collections/graphql/AddFolder.vue b/components/collections/graphql/AddFolder.vue
index 0dfba9eff..f8ace472a 100644
--- a/components/collections/graphql/AddFolder.vue
+++ b/components/collections/graphql/AddFolder.vue
@@ -22,8 +22,11 @@
     </template>
     <template #footer>
       <span>
-        <ButtonPrimary :label="$t('save')" @click.native="addFolder" />
-        <ButtonSecondary :label="$t('cancel')" @click.native="hideModal" />
+        <ButtonPrimary :label="$t('action.save')" @click.native="addFolder" />
+        <ButtonSecondary
+          :label="$t('action.cancel')"
+          @click.native="hideModal"
+        />
       </span>
     </template>
   </SmartModal>
diff --git a/components/collections/graphql/Collection.vue b/components/collections/graphql/Collection.vue
index 2f6b6313f..a190b9464 100644
--- a/components/collections/graphql/Collection.vue
+++ b/components/collections/graphql/Collection.vue
@@ -54,7 +54,7 @@
             <template #trigger>
               <ButtonSecondary
                 v-tippy="{ theme: 'tooltip' }"
-                :title="$t('more')"
+                :title="$t('action.more')"
                 icon="more_vert"
               />
             </template>
@@ -70,7 +70,7 @@
             />
             <SmartItem
               icon="create"
-              :label="$t('edit')"
+              :label="$t('action.edit')"
               @click.native="
                 $emit('edit-collection')
                 $refs.options.tippy().hide()
@@ -219,7 +219,7 @@ export default Vue.extend({
       }
       removeGraphqlCollection(this.collectionIndex)
 
-      this.$toast.error(this.$t("deleted").toString(), {
+      this.$toast.error(this.$t("state.deleted").toString(), {
         icon: "delete",
       })
     },
diff --git a/components/collections/graphql/Edit.vue b/components/collections/graphql/Edit.vue
index 88fea2b9c..82a9d4a57 100644
--- a/components/collections/graphql/Edit.vue
+++ b/components/collections/graphql/Edit.vue
@@ -18,8 +18,14 @@
     </template>
     <template #footer>
       <span>
-        <ButtonPrimary :label="$t('save')" @click.native="saveCollection" />
-        <ButtonSecondary :label="$t('cancel')" @click.native="hideModal" />
+        <ButtonPrimary
+          :label="$t('action.save')"
+          @click.native="saveCollection"
+        />
+        <ButtonSecondary
+          :label="$t('action.cancel')"
+          @click.native="hideModal"
+        />
       </span>
     </template>
   </SmartModal>
diff --git a/components/collections/graphql/EditFolder.vue b/components/collections/graphql/EditFolder.vue
index de6213e46..60783e366 100644
--- a/components/collections/graphql/EditFolder.vue
+++ b/components/collections/graphql/EditFolder.vue
@@ -22,8 +22,11 @@
     </template>
     <template #footer>
       <span>
-        <ButtonPrimary :label="$t('save')" @click.native="editFolder" />
-        <ButtonSecondary :label="$t('cancel')" @click.native="hideModal" />
+        <ButtonPrimary :label="$t('action.save')" @click.native="editFolder" />
+        <ButtonSecondary
+          :label="$t('action.cancel')"
+          @click.native="hideModal"
+        />
       </span>
     </template>
   </SmartModal>
diff --git a/components/collections/graphql/EditRequest.vue b/components/collections/graphql/EditRequest.vue
index 897aae174..e29c573d7 100644
--- a/components/collections/graphql/EditRequest.vue
+++ b/components/collections/graphql/EditRequest.vue
@@ -1,5 +1,5 @@
 <template>
-  <SmartModal v-if="show" :title="$t('edit_request')" @close="hideModal">
+  <SmartModal v-if="show" :title="$t('modal.edit_request')" @close="hideModal">
     <template #body>
       <div class="flex flex-col px-2">
         <input
@@ -18,8 +18,11 @@
     </template>
     <template #footer>
       <span>
-        <ButtonPrimary :label="$t('save')" @click.native="saveRequest" />
-        <ButtonSecondary :label="$t('cancel')" @click.native="hideModal" />
+        <ButtonPrimary :label="$t('action.save')" @click.native="saveRequest" />
+        <ButtonSecondary
+          :label="$t('action.cancel')"
+          @click.native="hideModal"
+        />
       </span>
     </template>
   </SmartModal>
diff --git a/components/collections/graphql/Folder.vue b/components/collections/graphql/Folder.vue
index 610d951b5..e1824e0b0 100644
--- a/components/collections/graphql/Folder.vue
+++ b/components/collections/graphql/Folder.vue
@@ -52,7 +52,7 @@
             <template #trigger>
               <ButtonSecondary
                 v-tippy="{ theme: 'tooltip' }"
-                :title="$t('more')"
+                :title="$t('action.more')"
                 icon="more_vert"
               />
             </template>
@@ -66,7 +66,7 @@
             />
             <SmartItem
               icon="edit"
-              :label="$t('edit')"
+              :label="$t('action.edit')"
               @click.native="
                 $emit('edit-folder', { folder, folderPath })
                 $refs.options.tippy().hide()
@@ -217,7 +217,7 @@ export default Vue.extend({
       }
 
       removeGraphqlFolder(this.folderPath)
-      this.$toast.error(this.$t("deleted").toString(), {
+      this.$toast.error(this.$t("state.deleted").toString(), {
         icon: "delete",
       })
     },
diff --git a/components/collections/graphql/ImportExport.vue b/components/collections/graphql/ImportExport.vue
index 174b7fd9e..9ba8a58ae 100644
--- a/components/collections/graphql/ImportExport.vue
+++ b/components/collections/graphql/ImportExport.vue
@@ -10,7 +10,7 @@
           <template #trigger>
             <ButtonSecondary
               v-tippy="{ theme: 'tooltip' }"
-              :title="$t('more')"
+              :title="$t('action.more')"
               class="rounded"
               icon="more_vert"
             />
@@ -53,9 +53,9 @@
       <div class="flex flex-col space-y-2">
         <SmartItem
           v-tippy="{ theme: 'tooltip' }"
-          :title="$t('replace_current')"
+          :title="$t('action.replace_current')"
           icon="folder_special"
-          :label="$t('replace_json')"
+          :label="$t('action.replace_json')"
           @click.native="openDialogChooseFileToReplaceWith"
         />
         <input
@@ -67,7 +67,7 @@
         />
         <SmartItem
           v-tippy="{ theme: 'tooltip' }"
-          :title="$t('preserve_current')"
+          :title="$t('action.preserve_current')"
           icon="create_new_folder"
           :label="$t('import.json')"
           @click.native="openDialogChooseFileToImportFrom"
@@ -81,7 +81,7 @@
         />
         <SmartItem
           v-tippy="{ theme: 'tooltip' }"
-          :title="$t('download_file')"
+          :title="$t('action.download_file')"
           icon="drive_file_move"
           :label="$t('export.as_json')"
           @click.native="exportJSON"
@@ -248,7 +248,7 @@ export default defineComponent({
       a.download = `${url.split("/").pop().split("#")[0].split("?")[0]}`
       document.body.appendChild(a)
       a.click()
-      this.$toast.success(this.$t("download_started"), {
+      this.$toast.success(this.$t("state.download_started"), {
         icon: "done",
       })
       setTimeout(() => {
@@ -257,7 +257,7 @@ export default defineComponent({
       }, 1000)
     },
     fileImported() {
-      this.$toast.info(this.$t("file_imported"), {
+      this.$toast.info(this.$t("state.file_imported"), {
         icon: "folder_shared",
       })
     },
diff --git a/components/collections/graphql/Request.vue b/components/collections/graphql/Request.vue
index 55e328309..4356536b5 100644
--- a/components/collections/graphql/Request.vue
+++ b/components/collections/graphql/Request.vue
@@ -43,7 +43,7 @@
           v-if="!savingMode"
           v-tippy="{ theme: 'tooltip' }"
           icon="replay"
-          :title="$t('restore')"
+          :title="$t('action.restore')"
           class="hidden group-hover:inline-flex"
           @click.native="!doc ? selectRequest() : {}"
         />
@@ -58,13 +58,13 @@
             <template #trigger>
               <ButtonSecondary
                 v-tippy="{ theme: 'tooltip' }"
-                :title="$t('more')"
+                :title="$t('action.more')"
                 icon="more_vert"
               />
             </template>
             <SmartItem
               icon="edit"
-              :label="$t('edit')"
+              :label="$t('action.edit')"
               @click.native="
                 $emit('edit-request', {
                   request,
@@ -171,7 +171,7 @@ export default Vue.extend({
       }
 
       removeGraphqlRequest(this.folderPath, this.requestIndex)
-      this.$toast.error(this.$t("deleted").toString(), {
+      this.$toast.error(this.$t("state.deleted").toString(), {
         icon: "delete",
       })
     },
diff --git a/components/collections/graphql/index.vue b/components/collections/graphql/index.vue
index c8ca71f7c..659fe03e6 100644
--- a/components/collections/graphql/index.vue
+++ b/components/collections/graphql/index.vue
@@ -11,7 +11,7 @@
         <input
           v-model="filterText"
           type="search"
-          :placeholder="$t('search')"
+          :placeholder="$t('action.search')"
           class="
             bg-primaryLight
             border-b border-dividerLight
@@ -26,7 +26,7 @@
       <div class="border-b border-dividerLight flex flex-1 justify-between">
         <ButtonSecondary
           icon="add"
-          :label="$t('new')"
+          :label="$t('action.new')"
           class="rounded-none"
           @click.native="displayModalAdd(true)"
         />
@@ -86,7 +86,7 @@
     >
       <i class="opacity-75 pb-2 material-icons">manage_search</i>
       <span class="text-center">
-        {{ $t("nothing_found") }} "{{ filterText }}"
+        {{ $t("state.nothing_found") }} "{{ filterText }}"
       </span>
     </div>
     <CollectionsGraphqlAdd
diff --git a/components/collections/index.vue b/components/collections/index.vue
index ba7464609..81a4dc3e6 100644
--- a/components/collections/index.vue
+++ b/components/collections/index.vue
@@ -11,7 +11,7 @@
         <input
           v-model="filterText"
           type="search"
-          :placeholder="$t('search')"
+          :placeholder="$t('action.search')"
           class="
             bg-primaryLight
             border-b border-dividerLight
@@ -42,12 +42,12 @@
           class="rounded-none"
           icon="add"
           :title="$t('team.no_access')"
-          :label="$t('new')"
+          :label="$t('action.new')"
         />
         <ButtonSecondary
           v-else
           icon="add"
-          :label="$t('new')"
+          :label="$t('action.new')"
           class="rounded-none"
           @click.native="displayModalAdd(true)"
         />
@@ -135,7 +135,7 @@
     >
       <i class="opacity-75 pb-2 material-icons">manage_search</i>
       <span class="text-center">
-        {{ $t("nothing_found") }} "{{ filterText }}"
+        {{ $t("state.nothing_found") }} "{{ filterText }}"
       </span>
     </div>
     <CollectionsAdd
@@ -591,7 +591,7 @@ export default defineComponent({
 
         removeRESTCollection(collectionIndex)
 
-        this.$toast.error(this.$t("deleted"), {
+        this.$toast.error(this.$t("state.deleted"), {
           icon: "delete",
         })
       } else if (collectionsType.type === "team-collections") {
@@ -619,7 +619,7 @@ export default defineComponent({
               },
             })
             .then(() => {
-              this.$toast.error(this.$t("deleted"), {
+              this.$toast.error(this.$t("state.deleted"), {
                 icon: "delete",
               })
             })
@@ -645,7 +645,7 @@ export default defineComponent({
         }
         removeRESTRequest(folderPath, requestIndex)
 
-        this.$toast.error(this.$t("deleted"), {
+        this.$toast.error(this.$t("state.deleted"), {
           icon: "delete",
         })
       } else if (this.collectionsType.type === "team-collections") {
@@ -661,7 +661,7 @@ export default defineComponent({
         teamUtils
           .deleteRequest(this.$apollo, requestIndex)
           .then(() => {
-            this.$toast.error(this.$t("deleted"), {
+            this.$toast.error(this.$t("state.deleted"), {
               icon: "delete",
             })
           })
diff --git a/components/collections/my/Collection.vue b/components/collections/my/Collection.vue
index de354841b..be63d4cfe 100644
--- a/components/collections/my/Collection.vue
+++ b/components/collections/my/Collection.vue
@@ -72,7 +72,7 @@
             <template #trigger>
               <ButtonSecondary
                 v-tippy="{ theme: 'tooltip' }"
-                :title="$t('more')"
+                :title="$t('action.more')"
                 icon="more_vert"
               />
             </template>
@@ -89,7 +89,7 @@
             />
             <SmartItem
               icon="create"
-              :label="$t('edit')"
+              :label="$t('action.edit')"
               @click.native="
                 $emit('edit-collection')
                 $refs.options.tippy().hide()
diff --git a/components/collections/my/Folder.vue b/components/collections/my/Folder.vue
index 00a8bca14..5b8278be2 100644
--- a/components/collections/my/Folder.vue
+++ b/components/collections/my/Folder.vue
@@ -52,7 +52,7 @@
             <template #trigger>
               <ButtonSecondary
                 v-tippy="{ theme: 'tooltip' }"
-                :title="$t('more')"
+                :title="$t('action.more')"
                 icon="more_vert"
               />
             </template>
@@ -66,7 +66,7 @@
             />
             <SmartItem
               icon="edit"
-              :label="$t('edit')"
+              :label="$t('action.edit')"
               @click.native="
                 $emit('edit-folder', {
                   folder,
@@ -229,7 +229,7 @@ export default {
       }
       removeRESTFolder(this.folderPath)
 
-      this.$toast.error(this.$t("deleted"), {
+      this.$toast.error(this.$t("state.deleted"), {
         icon: "delete",
       })
     },
diff --git a/components/collections/my/Request.vue b/components/collections/my/Request.vue
index 7cc22f9f1..4d9944a3b 100644
--- a/components/collections/my/Request.vue
+++ b/components/collections/my/Request.vue
@@ -51,7 +51,7 @@
           v-if="!saveRequest && !doc"
           v-tippy="{ theme: 'tooltip' }"
           icon="replay"
-          :title="$t('restore')"
+          :title="$t('action.restore')"
           class="hidden group-hover:inline-flex"
           @click.native="!doc ? selectRequest() : {}"
         />
@@ -66,13 +66,13 @@
             <template #trigger>
               <ButtonSecondary
                 v-tippy="{ theme: 'tooltip' }"
-                :title="$t('more')"
+                :title="$t('action.more')"
                 icon="more_vert"
               />
             </template>
             <SmartItem
               icon="edit"
-              :label="$t('edit')"
+              :label="$t('action.edit')"
               @click.native="
                 $emit('edit-request', {
                   collectionIndex,
diff --git a/components/collections/teams/Collection.vue b/components/collections/teams/Collection.vue
index 3c3b33b9a..567969a43 100644
--- a/components/collections/teams/Collection.vue
+++ b/components/collections/teams/Collection.vue
@@ -65,7 +65,7 @@
             <template #trigger>
               <ButtonSecondary
                 v-tippy="{ theme: 'tooltip' }"
-                :title="$t('more')"
+                :title="$t('action.more')"
                 icon="more_vert"
               />
             </template>
@@ -84,7 +84,7 @@
             <SmartItem
               v-if="collectionsType.selectedTeam.myRole !== 'VIEWER'"
               icon="create"
-              :label="$t('edit')"
+              :label="$t('action.edit')"
               @click.native="
                 $emit('edit-collection')
                 $refs.options.tippy().hide()
diff --git a/components/collections/teams/Folder.vue b/components/collections/teams/Folder.vue
index ffb88f298..519a64e4d 100644
--- a/components/collections/teams/Folder.vue
+++ b/components/collections/teams/Folder.vue
@@ -46,7 +46,7 @@
             <template #trigger>
               <ButtonSecondary
                 v-tippy="{ theme: 'tooltip' }"
-                :title="$t('more')"
+                :title="$t('action.more')"
                 icon="more_vert"
               />
             </template>
@@ -62,7 +62,7 @@
             <SmartItem
               v-if="collectionsType.selectedTeam.myRole !== 'VIEWER'"
               icon="edit"
-              :label="$t('edit')"
+              :label="$t('action.edit')"
               @click.native="
                 $emit('edit-folder', {
                   folder,
@@ -221,7 +221,7 @@ export default {
         teamUtils
           .deleteCollection(this.$apollo, this.folder.id)
           .then(() => {
-            this.$toast.error(this.$t("deleted"), {
+            this.$toast.error(this.$t("state.deleted"), {
               icon: "delete",
             })
             this.$emit("update-team-collections")
diff --git a/components/collections/teams/Request.vue b/components/collections/teams/Request.vue
index 4bba905c8..aa6d269bb 100644
--- a/components/collections/teams/Request.vue
+++ b/components/collections/teams/Request.vue
@@ -44,7 +44,7 @@
           v-if="!saveRequest && !doc"
           v-tippy="{ theme: 'tooltip' }"
           icon="replay"
-          :title="$t('restore')"
+          :title="$t('action.restore')"
           class="hidden group-hover:inline-flex"
           @click.native="!doc ? selectRequest() : {}"
         />
@@ -60,13 +60,13 @@
             <template #trigger>
               <ButtonSecondary
                 v-tippy="{ theme: 'tooltip' }"
-                :title="$t('more')"
+                :title="$t('action.more')"
                 icon="more_vert"
               />
             </template>
             <SmartItem
               icon="edit"
-              :label="$t('edit')"
+              :label="$t('action.edit')"
               @click.native="
                 $emit('edit-request', {
                   collectionIndex,
diff --git a/components/docs/Collection.vue b/components/docs/Collection.vue
index 197357113..8885e6711 100644
--- a/components/docs/Collection.vue
+++ b/components/docs/Collection.vue
@@ -2,7 +2,7 @@
   <div class="collection">
     <h2 class="heading">
       <i class="material-icons">folder</i>
-      {{ collection.name || $t("none") }}
+      {{ collection.name || $t("state.none") }}
     </h2>
     <span
       v-for="(folder, index) in collection.folders"
diff --git a/components/docs/Folder.vue b/components/docs/Folder.vue
index f52d96fbb..b2f1b6143 100644
--- a/components/docs/Folder.vue
+++ b/components/docs/Folder.vue
@@ -2,7 +2,7 @@
   <div class="folder">
     <h3 class="heading">
       <i class="material-icons">folder_open</i>
-      {{ folder.name || $t("none") }}
+      {{ folder.name || $t("state.none") }}
     </h3>
     <div
       v-for="(subFolder, index) in folder.folders"
diff --git a/components/docs/Request.vue b/components/docs/Request.vue
index ada8572cf..0c46e1cf6 100644
--- a/components/docs/Request.vue
+++ b/components/docs/Request.vue
@@ -2,47 +2,48 @@
   <div class="request">
     <h4 class="heading">
       <i class="material-icons">insert_drive_file</i>
-      {{ request.name || $t("none") }}
+      {{ request.name || $t("state.none") }}
     </h4>
     <p v-if="request.url" class="doc-desc">
       <span>
-        {{ $t("request.url") }}: <code>{{ request.url || $t("none") }}</code>
+        {{ $t("request.url") }}:
+        <code>{{ request.url || $t("state.none") }}</code>
       </span>
     </p>
     <p v-if="request.path" class="doc-desc">
       <span>
         {{ $t("request.path") }}:
-        <code>{{ request.path || $t("none") }}</code>
+        <code>{{ request.path || $t("state.none") }}</code>
       </span>
     </p>
     <p v-if="request.method" class="doc-desc">
       <span>
         {{ $t("request.method") }}:
-        <code>{{ request.method || $t("none") }}</code>
+        <code>{{ request.method || $t("state.none") }}</code>
       </span>
     </p>
     <p v-if="request.auth" class="doc-desc">
       <span>
-        {{ $t("authentication") }}:
-        <code>{{ request.auth || $t("none") }}</code>
+        {{ $t("request.authorization") }}:
+        <code>{{ request.auth.authType || $t("state.none") }}</code>
       </span>
     </p>
     <p v-if="request.httpUser" class="doc-desc">
       <span>
-        {{ $t("username") }}:
-        <code>{{ request.httpUser || $t("none") }}</code>
+        {{ $t("authorization.username") }}:
+        <code>{{ request.httpUser || $t("state.none") }}</code>
       </span>
     </p>
     <p v-if="request.httpPassword" class="doc-desc">
       <span>
-        {{ $t("password") }}:
-        <code>{{ request.httpPassword || $t("none") }}</code>
+        {{ $t("authorization.password") }}:
+        <code>{{ request.httpPassword || $t("state.none") }}</code>
       </span>
     </p>
     <p v-if="request.bearerToken" class="doc-desc">
       <span>
-        {{ $t("token") }}:
-        <code>{{ request.bearerToken || $t("none") }}</code>
+        {{ $t("authorization.token") }}:
+        <code>{{ request.bearerToken || $t("state.none") }}</code>
       </span>
     </p>
     <h4 v-if="request.headers" class="heading">{{ $t("tab.headers") }}</h4>
@@ -53,8 +54,8 @@
         class="doc-desc"
       >
         <span>
-          {{ header.key || $t("none") }}:
-          <code>{{ header.value || $t("none") }}</code>
+          {{ header.key || $t("state.none") }}:
+          <code>{{ header.value || $t("state.none") }}</code>
         </span>
       </p>
     </span>
@@ -68,12 +69,14 @@
         class="doc-desc"
       >
         <span>
-          {{ parameter.key || $t("none") }}:
-          <code>{{ parameter.value || $t("none") }}</code>
+          {{ parameter.key || $t("state.none") }}:
+          <code>{{ parameter.value || $t("state.none") }}</code>
         </span>
       </p>
     </span>
-    <h4 v-if="request.bodyParams" class="heading">{{ $t("payload") }}</h4>
+    <h4 v-if="request.bodyParams" class="heading">
+      {{ $t("request.payload") }}
+    </h4>
     <span v-if="request.bodyParams">
       <p
         v-for="(payload, index) in request.bodyParams"
@@ -81,27 +84,27 @@
         class="doc-desc"
       >
         <span>
-          {{ payload.key || $t("none") }}:
-          <code>{{ payload.value || $t("none") }}</code>
+          {{ payload.key || $t("state.none") }}:
+          <code>{{ payload.value || $t("state.none") }}</code>
         </span>
       </p>
     </span>
     <p v-if="request.rawParams" class="doc-desc">
       <span>
         {{ $t("request.parameters") }}:
-        <code>{{ request.rawParams || $t("none") }}</code>
+        <code>{{ request.rawParams || $t("state.none") }}</code>
       </span>
     </p>
     <p v-if="request.contentType" class="doc-desc">
       <span>
         {{ $t("request.content_type") }}:
-        <code>{{ request.contentType || $t("none") }}</code>
+        <code>{{ request.contentType || $t("state.none") }}</code>
       </span>
     </p>
     <p v-if="request.requestType" class="doc-desc">
       <span>
         {{ $t("request.type") }}:
-        <code>{{ request.requestType || $t("none") }}</code>
+        <code>{{ request.requestType || $t("state.none") }}</code>
       </span>
     </p>
   </div>
diff --git a/components/environments/Add.vue b/components/environments/Add.vue
index 019decd9c..a4c77ae95 100644
--- a/components/environments/Add.vue
+++ b/components/environments/Add.vue
@@ -18,8 +18,14 @@
     </template>
     <template #footer>
       <span>
-        <ButtonPrimary :label="$t('save')" @click.native="addNewEnvironment" />
-        <ButtonSecondary :label="$t('cancel')" @click.native="hideModal" />
+        <ButtonPrimary
+          :label="$t('action.save')"
+          @click.native="addNewEnvironment"
+        />
+        <ButtonSecondary
+          :label="$t('action.cancel')"
+          @click.native="hideModal"
+        />
       </span>
     </template>
   </SmartModal>
diff --git a/components/environments/Edit.vue b/components/environments/Edit.vue
index 1d821c5b2..42bbb0f14 100644
--- a/components/environments/Edit.vue
+++ b/components/environments/Edit.vue
@@ -92,8 +92,14 @@
     </template>
     <template #footer>
       <span>
-        <ButtonPrimary :label="$t('save')" @click.native="saveEnvironment" />
-        <ButtonSecondary :label="$t('cancel')" @click.native="hideModal" />
+        <ButtonPrimary
+          :label="$t('action.save')"
+          @click.native="saveEnvironment"
+        />
+        <ButtonSecondary
+          :label="$t('action.cancel')"
+          @click.native="hideModal"
+        />
       </span>
     </template>
   </SmartModal>
@@ -153,7 +159,7 @@ export default defineComponent({
     clearContent() {
       this.vars = []
       this.clearIcon = "done"
-      this.$toast.info(this.$t("cleared").toString(), {
+      this.$toast.info(this.$t("state.cleared").toString(), {
         icon: "clear_all",
       })
       setTimeout(() => (this.clearIcon = "clear_all"), 1000)
diff --git a/components/environments/Environment.vue b/components/environments/Environment.vue
index 2b102bacf..668bc75e8 100644
--- a/components/environments/Environment.vue
+++ b/components/environments/Environment.vue
@@ -27,13 +27,13 @@
         <template #trigger>
           <ButtonSecondary
             v-tippy="{ theme: 'tooltip' }"
-            :title="$t('more')"
+            :title="$t('action.more')"
             icon="more_vert"
           />
         </template>
         <SmartItem
           icon="create"
-          :label="$t('edit')"
+          :label="$t('action.edit')"
           @click.native="
             $emit('edit-environment')
             $refs.options.tippy().hide()
@@ -82,7 +82,7 @@ export default Vue.extend({
     removeEnvironment() {
       if (this.environmentIndex !== "Global")
         deleteEnvironment(this.environmentIndex)
-      this.$toast.error(this.$t("deleted").toString(), {
+      this.$toast.error(this.$t("state.deleted").toString(), {
         icon: "delete",
       })
     },
diff --git a/components/environments/ImportExport.vue b/components/environments/ImportExport.vue
index dc998c52b..927244825 100644
--- a/components/environments/ImportExport.vue
+++ b/components/environments/ImportExport.vue
@@ -10,7 +10,7 @@
           <template #trigger>
             <ButtonSecondary
               v-tippy="{ theme: 'tooltip' }"
-              :title="$t('more')"
+              :title="$t('action.more')"
               class="rounded"
               icon="more_vert"
             />
@@ -53,9 +53,9 @@
       <div class="flex flex-col space-y-2">
         <SmartItem
           v-tippy="{ theme: 'tooltip' }"
-          :title="$t('replace_current')"
+          :title="$t('action.replace_current')"
           icon="folder_special"
-          :label="$t('replace_json')"
+          :label="$t('action.replace_json')"
           @click.native="openDialogChooseFileToReplaceWith"
         />
         <input
@@ -67,7 +67,7 @@
         />
         <SmartItem
           v-tippy="{ theme: 'tooltip' }"
-          :title="$t('preserve_current')"
+          :title="$t('action.preserve_current')"
           icon="create_new_folder"
           :label="$t('import.json')"
           @click.native="openDialogChooseFileToImportFrom"
@@ -81,7 +81,7 @@
         />
         <SmartItem
           v-tippy="{ theme: 'tooltip' }"
-          :title="$t('download_file')"
+          :title="$t('action.download_file')"
           icon="drive_file_move"
           :label="$t('export.as_json')"
           @click.native="exportJSON"
@@ -226,7 +226,7 @@ export default defineComponent({
       a.download = `${url.split("/").pop().split("#")[0].split("?")[0]}`
       document.body.appendChild(a)
       a.click()
-      this.$toast.success(this.$t("download_started"), {
+      this.$toast.success(this.$t("state.download_started"), {
         icon: "done",
       })
       setTimeout(() => {
@@ -235,7 +235,7 @@ export default defineComponent({
       }, 1000)
     },
     fileImported() {
-      this.$toast.info(this.$t("file_imported"), {
+      this.$toast.info(this.$t("state.file_imported"), {
         icon: "folder_shared",
       })
     },
diff --git a/components/environments/index.vue b/components/environments/index.vue
index b7c880bec..2d142ae43 100644
--- a/components/environments/index.vue
+++ b/components/environments/index.vue
@@ -58,7 +58,7 @@
       <div class="border-b border-dividerLight flex flex-1 justify-between">
         <ButtonSecondary
           icon="add"
-          :label="$t('new')"
+          :label="$t('action.new')"
           class="rounded-none"
           @click.native="displayModalAdd(true)"
         />
diff --git a/components/firebase/Login.vue b/components/firebase/Login.vue
index 6fd579677..7d50e425f 100644
--- a/components/firebase/Login.vue
+++ b/components/firebase/Login.vue
@@ -181,7 +181,7 @@ export default {
               duration: null,
               closeOnSwipe: false,
               action: {
-                text: this.$t("yes"),
+                text: this.$t("action.yes"),
                 onClick: (_, toastObject) => {
                   applySetting("syncHistory", true)
                   applySetting("syncCollections", true)
@@ -228,7 +228,7 @@ export default {
             duration: null,
             closeOnSwipe: false,
             action: {
-              text: this.$t("yes"),
+              text: this.$t("action.yes"),
               onClick: async (_, toastObject) => {
                 const { user } = await signInWithGithub()
                 await user.linkWithCredential(pendingCred)
@@ -264,7 +264,7 @@ export default {
               duration: null,
               closeOnSwipe: false,
               action: {
-                text: this.$t("yes"),
+                text: this.$t("action.yes"),
                 onClick: (_, toastObject) => {
                   applySetting("syncHistory", true)
                   applySetting("syncCollections", true)
@@ -311,7 +311,7 @@ export default {
             duration: null,
             closeOnSwipe: false,
             action: {
-              text: this.$t("yes"),
+              text: this.$t("action.yes"),
               onClick: async (_, toastObject) => {
                 const { user } = await signInUserWithGoogle()
                 await user.linkWithCredential(pendingCred)
diff --git a/components/graphql/Field.vue b/components/graphql/Field.vue
index 69d1bbb86..d222daeea 100644
--- a/components/graphql/Field.vue
+++ b/components/graphql/Field.vue
@@ -38,7 +38,7 @@
         field-deprecated
       "
     >
-      {{ $t("deprecated") }}
+      {{ $t("state.deprecated") }}
     </div>
     <div v-if="fieldArgs.length > 0">
       <h5 class="my-2">Arguments:</h5>
diff --git a/components/graphql/QueryEditor.vue b/components/graphql/QueryEditor.vue
index 20f445c59..4ae821859 100644
--- a/components/graphql/QueryEditor.vue
+++ b/components/graphql/QueryEditor.vue
@@ -181,7 +181,7 @@ export default {
       try {
         this.$emit("update-query", gql.print(gql.parse(this.editor.getValue())))
       } catch (e) {
-        this.$toast.error(this.$t("gql_prettify_invalid_query"), {
+        this.$toast.error(this.$t("error.gql_prettify_invalid_query"), {
           icon: "error",
         })
       }
diff --git a/components/graphql/RequestOptions.vue b/components/graphql/RequestOptions.vue
index 0bab877f4..ce0a0bf31 100644
--- a/components/graphql/RequestOptions.vue
+++ b/components/graphql/RequestOptions.vue
@@ -22,7 +22,7 @@
             </label>
             <div class="flex">
               <ButtonSecondary
-                :label="$t('run')"
+                :label="$t('request.run')"
                 :shortcut="[getSpecialKey(), 'Enter']"
                 icon="play_arrow"
                 class="rounded-none !text-accent"
@@ -37,7 +37,7 @@
               <ButtonSecondary
                 v-tippy="{ theme: 'tooltip' }"
                 :title="`${$t(
-                  'prettify_query'
+                  'action.prettify'
                 )} <kbd>${getSpecialKey()}</kbd><kbd>P</kbd>`"
                 :icon="prettifyQueryIcon"
                 @click.native="prettifyQuery"
@@ -358,7 +358,7 @@ export default defineComponent({
       const startTime = Date.now()
 
       nuxt.value.$loading.start()
-      response.value = t("loading").toString()
+      response.value = t("state.loading").toString()
 
       try {
         const runURL = clone(url.value)
@@ -393,14 +393,14 @@ export default defineComponent({
 
         addGraphqlHistoryEntry(historyEntry)
 
-        $toast.success(t("finished_in", { duration }).toString(), {
+        $toast.success(t("state.finished_in", { duration }).toString(), {
           icon: "done",
         })
       } catch (e: any) {
         response.value = `${e}. ${t("error.check_console_details")}`
         nuxt.value.$loading.finish()
 
-        $toast.error(`${e} ${t("f12_details").toString()}`, {
+        $toast.error(`${e} ${t("error.f12_details").toString()}`, {
           icon: "error",
         })
         console.error(e)
diff --git a/components/graphql/Response.vue b/components/graphql/Response.vue
index 11d444345..d8151be5f 100644
--- a/components/graphql/Response.vue
+++ b/components/graphql/Response.vue
@@ -21,7 +21,7 @@
         <ButtonSecondary
           ref="downloadResponse"
           v-tippy="{ theme: 'tooltip' }"
-          :title="$t('download_file')"
+          :title="$t('action.download_file')"
           :icon="downloadResponseIcon"
           @click.native="downloadResponse"
         />
@@ -92,7 +92,7 @@
         </div>
       </div>
       <ButtonSecondary
-        :label="$t('documentation')"
+        :label="$t('app.documentation')"
         to="https://docs.hoppscotch.io"
         icon="open_in_new"
         blank
@@ -151,7 +151,7 @@ export default defineComponent({
       document.body.appendChild(a)
       a.click()
       downloadResponseIcon.value = "done"
-      $toast.success(t("download_started").toString(), {
+      $toast.success(t("state.download_started").toString(), {
         icon: "done",
       })
       setTimeout(() => {
diff --git a/components/graphql/Sidebar.vue b/components/graphql/Sidebar.vue
index afd9989ee..65566f6a8 100644
--- a/components/graphql/Sidebar.vue
+++ b/components/graphql/Sidebar.vue
@@ -16,7 +16,7 @@
               <input
                 v-model="graphqlFieldsFilterText"
                 type="search"
-                :placeholder="$t('search')"
+                :placeholder="$t('action.search')"
                 class="bg-primaryLight flex w-full py-2 pr-2 pl-9"
               />
             </div>
@@ -162,7 +162,7 @@
               <ButtonSecondary
                 ref="downloadSchema"
                 v-tippy="{ theme: 'tooltip' }"
-                :title="$t('download_file')"
+                :title="$t('action.download_file')"
                 :icon="downloadSchemaIcon"
                 @click.native="downloadSchema"
               />
@@ -415,7 +415,7 @@ export default defineComponent({
       document.body.appendChild(a)
       a.click()
       downloadSchemaIcon.value = "done"
-      $toast.success(t("download_started").toString(), {
+      $toast.success(t("state.download_started").toString(), {
         icon: "done",
       })
       setTimeout(() => {
diff --git a/components/history/index.vue b/components/history/index.vue
index 562446a4f..644c43202 100644
--- a/components/history/index.vue
+++ b/components/history/index.vue
@@ -15,7 +15,7 @@
           v-model="filterText"
           type="search"
           class="bg-primaryLight flex w-full py-2 pr-2 pl-9"
-          :placeholder="$t('search')"
+          :placeholder="$t('action.search')"
         />
       </div>
       <div class="flex">
@@ -63,7 +63,7 @@
     >
       <i class="opacity-75 pb-2 material-icons">manage_search</i>
       <span class="text-center">
-        {{ $t("nothing_found") }} "{{ filterText }}"
+        {{ $t("state.nothing_found") }} "{{ filterText }}"
       </span>
     </div>
     <div
@@ -137,7 +137,7 @@ export default defineComponent({
       if (this.page === "rest") clearRESTHistory()
       else clearGraphqlHistory()
 
-      this.$toast.error(this.$t("history_deleted").toString(), {
+      this.$toast.error(this.$t("state.history_deleted").toString(), {
         icon: "delete",
       })
     },
@@ -148,7 +148,7 @@ export default defineComponent({
       if (this.page === "rest") deleteRESTHistoryEntry(entry)
       else deleteGraphqlHistoryEntry(entry)
 
-      this.$toast.error(this.$t("deleted").toString(), {
+      this.$toast.error(this.$t("state.deleted").toString(), {
         icon: "delete",
       })
     },
diff --git a/components/history/rest/Card.vue b/components/history/rest/Card.vue
index a7d8bb53b..1147bf8af 100644
--- a/components/history/rest/Card.vue
+++ b/components/history/rest/Card.vue
@@ -61,9 +61,9 @@ export default {
       if (this.entry.meta.responseDuration) {
         const responseDuration = this.entry.meta.responseDuration
         return responseDuration > 0
-          ? `${this.$t("duration")}: ${responseDuration}ms`
-          : this.$t("no_duration")
-      } else return this.$t("no_duration")
+          ? `${this.$t("request.duration")}: ${responseDuration}ms`
+          : this.$t("error.no_duration")
+      } else return this.$t("error.no_duration")
     },
     entryStatus() {
       const foundStatusGroup = findStatusGroup(this.entry.statusCode)
diff --git a/components/http/Authorization.vue b/components/http/Authorization.vue
index a1cad8832..078f1686d 100644
--- a/components/http/Authorization.vue
+++ b/components/http/Authorization.vue
@@ -107,7 +107,7 @@
           name="http_basic_user"
         />
         <label for="http_basic_user">
-          {{ $t("username") }}
+          {{ $t("authorization.username") }}
         </label>
       </div>
       <div class="flex relative">
@@ -120,7 +120,7 @@
           :type="passwordFieldType"
         />
         <label for="http_basic_passwd">
-          {{ $t("password") }}
+          {{ $t("authorization.password") }}
         </label>
         <ButtonSecondary
           :icon="passwordFieldType === 'text' ? 'visibility' : 'visibility_off'"
@@ -164,22 +164,6 @@
         />
       </div>
     </div>
-    <!-- <button
-            v-if="authType === 'OAuth 2.0'"
-            v-tooltip.bottom="$t('use_token')"
-            class="icon button"
-            @click="showTokenListModal = !showTokenListModal"
-          >
-            <i class="material-icons">open_in_new</i>
-          </button> -->
-    <!-- <button
-            v-if="authType === 'OAuth 2.0'"
-            v-tooltip.bottom="$t('get_token')"
-            class="icon button"
-            @click="showTokenRequest = !showTokenRequest"
-          >
-            <i class="material-icons">vpn_key</i>
-          </button> -->
     <!-- <SmartToggle
         :on="!URL_EXCLUDES.auth"
         @change="setExclude('auth', !$event)"
diff --git a/components/http/CodegenModal.vue b/components/http/CodegenModal.vue
index 0db8c0009..1d49afeaf 100644
--- a/components/http/CodegenModal.vue
+++ b/components/http/CodegenModal.vue
@@ -139,7 +139,7 @@ export default defineComponent({
     copyRequestCode() {
       copyToClipboard(this.requestCode)
       this.copyIcon = "done"
-      this.$toast.success(this.$t("copied_to_clipboard").toString(), {
+      this.$toast.success(this.$t("state.copied_to_clipboard").toString(), {
         icon: "done",
       })
       setTimeout(() => (this.copyIcon = "content_copy"), 1000)
diff --git a/components/http/ImportCurl.vue b/components/http/ImportCurl.vue
index 37b2bb465..1f7ed50f2 100644
--- a/components/http/ImportCurl.vue
+++ b/components/http/ImportCurl.vue
@@ -21,7 +21,10 @@
           :label="$t('import.title')"
           @click.native="handleImport"
         />
-        <ButtonSecondary :label="$t('cancel')" @click.native="hideModal" />
+        <ButtonSecondary
+          :label="$t('action.cancel')"
+          @click.native="hideModal"
+        />
       </span>
     </template>
   </SmartModal>
@@ -124,7 +127,7 @@ export default defineComponent({
         )
       } catch (e) {
         console.error(e)
-        this.$toast.error(this.$t("curl_invalid_format").toString(), {
+        this.$toast.error(this.$t("error.curl_invalid_format").toString(), {
           icon: "error",
         })
       }
diff --git a/components/http/RawBody.vue b/components/http/RawBody.vue
index bc83a9185..2331bfd4d 100644
--- a/components/http/RawBody.vue
+++ b/components/http/RawBody.vue
@@ -34,7 +34,7 @@
           v-if="contentType.endsWith('json')"
           ref="prettifyRequest"
           v-tippy="{ theme: 'tooltip' }"
-          :title="$t('prettify_body')"
+          :title="$t('action.prettify')"
           :icon="prettifyIcon"
           @click.native="prettifyRequestBody"
         />
@@ -108,11 +108,11 @@ export default defineComponent({
           this.rawParamsBody = target.result
         }
         reader.readAsText(file)
-        this.$toast.info(this.$t("file_imported"), {
+        this.$toast.info(this.$t("state.file_imported"), {
           icon: "attach_file",
         })
       } else {
-        this.$toast.error(this.$t("choose_file"), {
+        this.$toast.error(this.$t("action.choose_file"), {
           icon: "attach_file",
         })
       }
@@ -126,7 +126,7 @@ export default defineComponent({
         setTimeout(() => (this.prettifyIcon = "photo_filter"), 1000)
       } catch (e) {
         console.error(e)
-        this.$toast.error(`${this.$t("json_prettify_invalid_body")}`, {
+        this.$toast.error(`${this.$t("error.json_prettify_invalid_body")}`, {
           icon: "error",
         })
       }
diff --git a/components/http/Request.vue b/components/http/Request.vue
index 7a0915c8a..a8ead924e 100644
--- a/components/http/Request.vue
+++ b/components/http/Request.vue
@@ -345,7 +345,7 @@ export default defineComponent({
           .catch(() => {})
       } else {
         copyToClipboard(window.location.href)
-        $toast.info(t("copied_to_clipboard").toString(), {
+        $toast.info(t("state.copied_to_clipboard").toString(), {
           icon: "done",
         })
       }
diff --git a/components/http/ResponseMeta.vue b/components/http/ResponseMeta.vue
index 506075bec..7a2e8b1ba 100644
--- a/components/http/ResponseMeta.vue
+++ b/components/http/ResponseMeta.vue
@@ -42,7 +42,7 @@
         </div>
       </div>
       <ButtonSecondary
-        :label="$t('documentation')"
+        :label="$t('app.documentation')"
         to="https://docs.hoppscotch.io"
         icon="open_in_new"
         blank
@@ -87,7 +87,7 @@
       >
         <span v-if="response.statusCode">
           <span class="text-secondary"> {{ $t("response.status") }}: </span>
-          {{ response.statusCode || $t("waiting_send_req") }}
+          {{ response.statusCode || $t("state.waiting_send_request") }}
         </span>
         <span v-if="response.meta && response.meta.responseDuration">
           <span class="text-secondary"> {{ $t("response.time") }}: </span>
diff --git a/components/http/TokenList.vue b/components/http/TokenList.vue
deleted file mode 100644
index 57d93d6d8..000000000
--- a/components/http/TokenList.vue
+++ /dev/null
@@ -1,80 +0,0 @@
-<template>
-  <SmartModal v-if="show" :title="$t('manage_token')" @close="hideModal">
-    <template #body>
-      <div class="flex flex-1">
-        <label>{{ $t("token_list") }}</label>
-        <div v-if="tokens.length != 0">
-          <ButtonSecondary
-            v-tippy="{ theme: 'tooltip' }"
-            :title="$t('action.clear_all')"
-            icon="clear_all"
-            @click.native="clearContent('tokens', $event)"
-          />
-        </div>
-      </div>
-      <ul v-for="(token, index) in tokens" :key="`token-${index}`">
-        <li>
-          <input
-            class="input"
-            :placeholder="`name ${index + 1}`"
-            :value="token.name"
-            @change="
-              $store.commit('setOAuthTokenName', {
-                index,
-                value: $event.target.value,
-              })
-            "
-          />
-        </li>
-        <li>
-          <input class="input" :value="token.value" readonly />
-        </li>
-        <div class="flex flex-1">
-          <li>
-            <ButtonSecondary
-              v-tippy="{ theme: 'tooltip' }"
-              :title="$t('use_token')"
-              icon="input"
-              @click.native="useOAuthToken(token.value)"
-            />
-          </li>
-          <li>
-            <ButtonSecondary
-              v-tippy="{ theme: 'tooltip' }"
-              :title="$t('action.remove')"
-              icon="remove_circle_outline"
-              color="red"
-              @click.native="removeOAuthToken(index)"
-            />
-          </li>
-        </div>
-      </ul>
-      <p v-if="tokens.length === 0">
-        {{ $t("empty.protocols") }}
-      </p>
-    </template>
-  </SmartModal>
-</template>
-
-<script>
-export default {
-  props: {
-    show: Boolean,
-    tokens: { type: Array, default: () => [] },
-  },
-  methods: {
-    clearContent(tokens, $event) {
-      this.$emit("clear-content", tokens, $event)
-    },
-    useOAuthToken(token) {
-      this.$emit("use-oauth-token", token)
-    },
-    removeOAuthToken(index) {
-      this.$emit("remove-oauth-token", index)
-    },
-    hideModal() {
-      this.$emit("hide-modal")
-    },
-  },
-}
-</script>
diff --git a/components/lenses/renderers/HTMLLensRenderer.vue b/components/lenses/renderers/HTMLLensRenderer.vue
index 8868bfb99..edbf2eeb8 100644
--- a/components/lenses/renderers/HTMLLensRenderer.vue
+++ b/components/lenses/renderers/HTMLLensRenderer.vue
@@ -30,7 +30,7 @@
           v-if="response.body"
           ref="downloadResponse"
           v-tippy="{ theme: 'tooltip' }"
-          :title="$t('download_file')"
+          :title="$t('action.download_file')"
           :icon="downloadIcon"
           @click.native="downloadResponse"
         />
@@ -96,7 +96,7 @@ export default {
       document.body.appendChild(a)
       a.click()
       this.downloadIcon = "done"
-      this.$toast.success(this.$t("download_started"), {
+      this.$toast.success(this.$t("state.download_started"), {
         icon: "done",
       })
       setTimeout(() => {
@@ -108,7 +108,7 @@ export default {
     copyResponse() {
       copyToClipboard(this.responseBodyText)
       this.copyIcon = "done"
-      this.$toast.success(this.$t("copied_to_clipboard"), {
+      this.$toast.success(this.$t("state.copied_to_clipboard"), {
         icon: "done",
       })
       setTimeout(() => (this.copyIcon = "content_copy"), 1000)
diff --git a/components/lenses/renderers/ImageLensRenderer.vue b/components/lenses/renderers/ImageLensRenderer.vue
index e6ec8fe91..f2ac8000a 100644
--- a/components/lenses/renderers/ImageLensRenderer.vue
+++ b/components/lenses/renderers/ImageLensRenderer.vue
@@ -21,7 +21,7 @@
           v-if="response.body"
           ref="downloadResponse"
           v-tippy="{ theme: 'tooltip' }"
-          :title="$t('download_file')"
+          :title="$t('action.download_file')"
           :icon="downloadIcon"
           @click.native="downloadResponse"
         />
@@ -101,7 +101,7 @@ export default {
       document.body.appendChild(a)
       a.click()
       this.downloadIcon = "done"
-      this.$toast.success(this.$t("download_started"), {
+      this.$toast.success(this.$t("state.download_started"), {
         icon: "done",
       })
       setTimeout(() => {
diff --git a/components/lenses/renderers/JSONLensRenderer.vue b/components/lenses/renderers/JSONLensRenderer.vue
index 3b5144687..11014cb15 100644
--- a/components/lenses/renderers/JSONLensRenderer.vue
+++ b/components/lenses/renderers/JSONLensRenderer.vue
@@ -21,7 +21,7 @@
           v-if="response.body"
           ref="downloadResponse"
           v-tippy="{ theme: 'tooltip' }"
-          :title="$t('download_file')"
+          :title="$t('action.download_file')"
           :icon="downloadIcon"
           @click.native="downloadResponse"
         />
@@ -100,7 +100,7 @@ export default {
       document.body.appendChild(a)
       a.click()
       this.downloadIcon = "done"
-      this.$toast.success(this.$t("download_started"), {
+      this.$toast.success(this.$t("state.download_started"), {
         icon: "done",
       })
       setTimeout(() => {
@@ -112,7 +112,7 @@ export default {
     copyResponse() {
       copyToClipboard(this.responseBodyText)
       this.copyIcon = "done"
-      this.$toast.success(this.$t("copied_to_clipboard"), {
+      this.$toast.success(this.$t("state.copied_to_clipboard"), {
         icon: "done",
       })
       setTimeout(() => (this.copyIcon = "content_copy"), 1000)
diff --git a/components/lenses/renderers/RawLensRenderer.vue b/components/lenses/renderers/RawLensRenderer.vue
index 1bab6db58..334ef9b56 100644
--- a/components/lenses/renderers/RawLensRenderer.vue
+++ b/components/lenses/renderers/RawLensRenderer.vue
@@ -21,7 +21,7 @@
           v-if="response.body"
           ref="downloadResponse"
           v-tippy="{ theme: 'tooltip' }"
-          :title="$t('download_file')"
+          :title="$t('action.download_file')"
           :icon="downloadIcon"
           @click.native="downloadResponse"
         />
@@ -92,7 +92,7 @@ export default {
       document.body.appendChild(a)
       a.click()
       this.downloadIcon = "done"
-      this.$toast.success(this.$t("download_started"), {
+      this.$toast.success(this.$t("state.download_started"), {
         icon: "done",
       })
       setTimeout(() => {
@@ -104,7 +104,7 @@ export default {
     copyResponse() {
       copyToClipboard(this.responseBodyText)
       this.copyIcon = "done"
-      this.$toast.success(this.$t("copied_to_clipboard"), {
+      this.$toast.success(this.$t("state.copied_to_clipboard"), {
         icon: "done",
       })
       setTimeout(() => (this.copyIcon = "content_copy"), 1000)
diff --git a/components/lenses/renderers/XMLLensRenderer.vue b/components/lenses/renderers/XMLLensRenderer.vue
index 94483dedb..980b01966 100644
--- a/components/lenses/renderers/XMLLensRenderer.vue
+++ b/components/lenses/renderers/XMLLensRenderer.vue
@@ -21,7 +21,7 @@
           v-if="response.body"
           ref="downloadResponse"
           v-tippy="{ theme: 'tooltip' }"
-          :title="$t('download_file')"
+          :title="$t('action.download_file')"
           :icon="downloadIcon"
           @click.native="downloadResponse"
         />
@@ -91,7 +91,7 @@ export default {
       document.body.appendChild(a)
       a.click()
       this.downloadIcon = "done"
-      this.$toast.success(this.$t("download_started"), {
+      this.$toast.success(this.$t("state.download_started"), {
         icon: "done",
       })
       setTimeout(() => {
@@ -103,7 +103,7 @@ export default {
     copyResponse() {
       copyToClipboard(this.responseBodyText)
       this.copyIcon = "done"
-      this.$toast.success(this.$t("copied_to_clipboard"), {
+      this.$toast.success(this.$t("state.copied_to_clipboard"), {
         icon: "done",
       })
       setTimeout(() => (this.copyIcon = "content_copy"), 1000)
diff --git a/components/realtime/Mqtt.vue b/components/realtime/Mqtt.vue
index acf37982a..966d8381b 100644
--- a/components/realtime/Mqtt.vue
+++ b/components/realtime/Mqtt.vue
@@ -42,7 +42,7 @@
         </Pane>
         <Pane class="hide-scrollbar !overflow-auto">
           <AppSection label="response">
-            <RealtimeLog :title="$t('log')" :log="log" />
+            <RealtimeLog :title="$t('mqtt.log')" :log="log" />
           </AppSection>
         </Pane>
       </Splitpanes>
@@ -199,7 +199,7 @@ export default defineComponent({
       this.connectingState = true
       this.log = [
         {
-          payload: this.$t("connecting_to", { name: this.url }),
+          payload: this.$t("state.connecting_to", { name: this.url }),
           source: "info",
           color: "var(--accent-color)",
           ts: new Date().toLocaleTimeString(),
@@ -237,12 +237,12 @@ export default defineComponent({
       this.connectingState = false
       this.connectionState = true
       this.log.push({
-        payload: this.$t("connected_to", { name: this.url }),
+        payload: this.$t("state.connected_to", { name: this.url }),
         source: "info",
         color: "var(--accent-color)",
         ts: new Date().toLocaleTimeString(),
       })
-      this.$toast.success(this.$t("connected"), {
+      this.$toast.success(this.$t("state.connected"), {
         icon: "sync",
       })
     },
@@ -265,7 +265,7 @@ export default defineComponent({
       this.manualDisconnect = true
       this.client.disconnect()
       this.log.push({
-        payload: this.$t("disconnected_from", { name: this.url }),
+        payload: this.$t("state.disconnected_from", { name: this.url }),
         source: "info",
         color: "#ff5555",
         ts: new Date().toLocaleTimeString(),
@@ -275,7 +275,7 @@ export default defineComponent({
       this.connectingState = false
       this.connectionState = false
       if (this.manualDisconnect) {
-        this.$toast.error(this.$t("disconnected"), {
+        this.$toast.error(this.$t("state.disconnected"), {
           icon: "sync_disabled",
         })
       } else {
diff --git a/components/realtime/Socketio.vue b/components/realtime/Socketio.vue
index b7f66ad38..9bc527ada 100644
--- a/components/realtime/Socketio.vue
+++ b/components/realtime/Socketio.vue
@@ -61,7 +61,7 @@
         </Pane>
         <Pane class="hide-scrollbar !overflow-auto">
           <AppSection label="response">
-            <RealtimeLog :title="$t('log')" :log="communication.log" />
+            <RealtimeLog :title="$t('socketio.log')" :log="communication.log" />
           </AppSection>
         </Pane>
       </Splitpanes>
@@ -219,7 +219,7 @@ export default defineComponent({
       this.connectingState = true
       this.communication.log = [
         {
-          payload: this.$t("connecting_to", { name: this.url }),
+          payload: this.$t("state.connecting_to", { name: this.url }),
           source: "info",
           color: "var(--accent-color)",
         },
@@ -239,13 +239,13 @@ export default defineComponent({
           this.connectionState = true
           this.communication.log = [
             {
-              payload: this.$t("connected_to", { name: this.url }),
+              payload: this.$t("state.connected_to", { name: this.url }),
               source: "info",
               color: "var(--accent-color)",
               ts: new Date().toLocaleTimeString(),
             },
           ]
-          this.$toast.success(this.$t("connected"), {
+          this.$toast.success(this.$t("state.connected"), {
             icon: "sync",
           })
         })
@@ -270,12 +270,12 @@ export default defineComponent({
           this.connectingState = false
           this.connectionState = false
           this.communication.log.push({
-            payload: this.$t("disconnected_from", { name: this.url }),
+            payload: this.$t("state.disconnected_from", { name: this.url }),
             source: "info",
             color: "#ff5555",
             ts: new Date().toLocaleTimeString(),
           })
-          this.$toast.error(this.$t("disconnected"), {
+          this.$toast.error(this.$t("state.disconnected"), {
             icon: "sync_disabled",
           })
         })
diff --git a/components/realtime/Sse.vue b/components/realtime/Sse.vue
index 81e8e480e..dd1b62e36 100644
--- a/components/realtime/Sse.vue
+++ b/components/realtime/Sse.vue
@@ -70,7 +70,7 @@
       <AppSection label="response">
         <ul>
           <li>
-            <RealtimeLog :title="$t('log')" :log="events.log" />
+            <RealtimeLog :title="$t('sse.log')" :log="events.log" />
             <div id="result"></div>
           </li>
         </ul>
@@ -137,7 +137,7 @@ export default {
       this.connectingState = true
       this.events.log = [
         {
-          payload: this.$t("connecting_to", { name: this.server }),
+          payload: this.$t("state.connecting_to", { name: this.server }),
           source: "info",
           color: "var(--accent-color)",
         },
@@ -150,13 +150,13 @@ export default {
             this.connectionSSEState = true
             this.events.log = [
               {
-                payload: this.$t("connected_to", { name: this.server }),
+                payload: this.$t("state.connected_to", { name: this.server }),
                 source: "info",
                 color: "var(--accent-color)",
                 ts: new Date().toLocaleTimeString(),
               },
             ]
-            this.$toast.success(this.$t("connected"), {
+            this.$toast.success(this.$t("state.connected"), {
               icon: "sync",
             })
           }
@@ -166,12 +166,14 @@ export default {
           this.sse.onclose = () => {
             this.connectionSSEState = false
             this.events.log.push({
-              payload: this.$t("disconnected_from", { name: this.server }),
+              payload: this.$t("state.disconnected_from", {
+                name: this.server,
+              }),
               source: "info",
               color: "#ff5555",
               ts: new Date().toLocaleTimeString(),
             })
-            this.$toast.error(this.$t("disconnected"), {
+            this.$toast.error(this.$t("state.disconnected"), {
               icon: "sync_disabled",
             })
           }
@@ -191,7 +193,7 @@ export default {
       } else {
         this.events.log = [
           {
-            payload: this.$t("browser_support_sse"),
+            payload: this.$t("error.browser_support_sse"),
             source: "info",
             color: "#ff5555",
             ts: new Date().toLocaleTimeString(),
diff --git a/components/realtime/Websocket.vue b/components/realtime/Websocket.vue
index 4a77bf99c..b01fb14f9 100644
--- a/components/realtime/Websocket.vue
+++ b/components/realtime/Websocket.vue
@@ -142,7 +142,10 @@
         </Pane>
         <Pane class="hide-scrollbar !overflow-auto">
           <AppSection label="response">
-            <RealtimeLog :title="$t('log')" :log="communication.log" />
+            <RealtimeLog
+              :title="$t('websocket.log')"
+              :log="communication.log"
+            />
           </AppSection>
         </Pane>
       </Splitpanes>
@@ -271,7 +274,7 @@ export default defineComponent({
     connect() {
       this.communication.log = [
         {
-          payload: this.$t("connecting_to", { name: this.url }),
+          payload: this.$t("state.connecting_to", { name: this.url }),
           source: "info",
           color: "var(--accent-color)",
         },
@@ -284,13 +287,13 @@ export default defineComponent({
           this.connectionState = true
           this.communication.log = [
             {
-              payload: this.$t("connected_to", { name: this.url }),
+              payload: this.$t("state.connected_to", { name: this.url }),
               source: "info",
               color: "var(--accent-color)",
               ts: new Date().toLocaleTimeString(),
             },
           ]
-          this.$toast.success(this.$t("connected"), {
+          this.$toast.success(this.$t("state.connected"), {
             icon: "sync",
           })
         }
@@ -300,12 +303,12 @@ export default defineComponent({
         this.socket.onclose = () => {
           this.connectionState = false
           this.communication.log.push({
-            payload: this.$t("disconnected_from", { name: this.url }),
+            payload: this.$t("state.disconnected_from", { name: this.url }),
             source: "info",
             color: "#ff5555",
             ts: new Date().toLocaleTimeString(),
           })
-          this.$toast.error(this.$t("disconnected"), {
+          this.$toast.error(this.$t("state.disconnected"), {
             icon: "sync_disabled",
           })
         }
@@ -403,10 +406,10 @@ export default defineComponent({
     deleteProtocol({ index }) {
       const oldProtocols = this.protocols.slice()
       this.$delete(this.protocols, index)
-      this.$toast.error(this.$t("deleted"), {
+      this.$toast.error(this.$t("state.deleted"), {
         icon: "delete",
         action: {
-          text: this.$t("undo"),
+          text: this.$t("action.undo"),
           duration: 4000,
           onClick: (_, toastObject) => {
             this.protocols = oldProtocols
diff --git a/components/smart/ConfirmModal.vue b/components/smart/ConfirmModal.vue
index df6e07042..b6206bf25 100644
--- a/components/smart/ConfirmModal.vue
+++ b/components/smart/ConfirmModal.vue
@@ -24,13 +24,13 @@ export default {
     yes: {
       type: String,
       default() {
-        return this.$t("yes")
+        return this.$t("action.yes")
       },
     },
     no: {
       type: String,
       default() {
-        return this.$t("no")
+        return this.$t("action.no")
       },
     },
   },
diff --git a/components/teams/Add.vue b/components/teams/Add.vue
index 622d44d7f..da21b5c75 100644
--- a/components/teams/Add.vue
+++ b/components/teams/Add.vue
@@ -18,8 +18,11 @@
     </template>
     <template #footer>
       <span>
-        <ButtonPrimary :label="$t('save')" @click.native="addNewTeam" />
-        <ButtonSecondary :label="$t('cancel')" @click.native="hideModal" />
+        <ButtonPrimary :label="$t('action.save')" @click.native="addNewTeam" />
+        <ButtonSecondary
+          :label="$t('action.cancel')"
+          @click.native="hideModal"
+        />
       </span>
     </template>
   </SmartModal>
diff --git a/components/teams/Edit.vue b/components/teams/Edit.vue
index fe3f37830..5a2c4cf03 100644
--- a/components/teams/Edit.vue
+++ b/components/teams/Edit.vue
@@ -174,8 +174,11 @@
     </template>
     <template #footer>
       <span>
-        <ButtonPrimary :label="$t('save')" @click.native="saveTeam" />
-        <ButtonSecondary :label="$t('cancel')" @click.native="hideModal" />
+        <ButtonPrimary :label="$t('action.save')" @click.native="saveTeam" />
+        <ButtonSecondary
+          :label="$t('action.cancel')"
+          @click.native="hideModal"
+        />
       </span>
     </template>
   </SmartModal>
diff --git a/components/teams/Team.vue b/components/teams/Team.vue
index 808a2476a..f8c890bb3 100644
--- a/components/teams/Team.vue
+++ b/components/teams/Team.vue
@@ -6,7 +6,7 @@
           class="cursor-pointer transition hover:text-secondaryDark"
           @click="team.myRole === 'OWNER' ? $emit('edit-team') : ''"
         >
-          {{ team.name || $t("nothing_found") }}
+          {{ team.name || $t("state.nothing_found") }}
         </label>
         <div class="flex -space-x-1 mt-2 overflow-hidden">
           <img
@@ -24,14 +24,14 @@
         <template #trigger>
           <ButtonSecondary
             v-tippy="{ theme: 'tooltip' }"
-            :title="$t('more')"
+            :title="$t('action.more')"
             icon="more_vert"
           />
         </template>
         <SmartItem
           v-if="team.myRole === 'OWNER'"
           icon="create"
-          :label="$t('edit')"
+          :label="$t('action.edit')"
           @click.native="
             $emit('edit-team')
             $refs.options.tippy().hide()
diff --git a/components/teams/index.vue b/components/teams/index.vue
index 7336fed18..3dd01939e 100644
--- a/components/teams/index.vue
+++ b/components/teams/index.vue
@@ -18,7 +18,7 @@
         @click.native="displayModalAdd(true)"
       />
       <p v-if="$apollo.queries.myTeams.loading">
-        {{ $t("loading") }}
+        {{ $t("state.loading") }}
       </p>
       <div v-if="myTeams.length === 0" class="flex items-center">
         <i class="mr-4 material-icons">help_outline</i>
diff --git a/locales/en.json b/locales/en.json
index 5d5ca6999..c07f3d1d1 100644
--- a/locales/en.json
+++ b/locales/en.json
@@ -1,517 +1,484 @@
 {
-  "navigation": {
-    "rest": "REST",
-    "graphql": "GraphQL",
-    "realtime": "Realtime",
-    "doc": "Docs",
-    "settings": "Settings"
-  },
-  "header": {
-    "install_pwa": "Install app",
-    "save_workspace": "Save My Workspace",
-    "account": "Account",
-    "login": "Login"
-  },
   "action": {
-    "label": "Label",
-    "turn_on": "Turn on",
-    "turn_off": "Turn off",
-    "dismiss": "Dismiss",
-    "copy": "Copy",
-    "send": "Send",
     "cancel": "Cancel",
-    "learn_more": "Learn more",
-    "go_back": "Go back",
-    "delete": "Delete",
-    "remove": "Remove",
+    "choose_file": "Choose a file",
     "clear": "Clear",
     "clear_all": "Clear all",
     "connect": "Connect",
+    "copy": "Copy",
+    "delete": "Delete",
     "disconnect": "Disconnect",
+    "dismiss": "Dismiss",
+    "download_file": "Download file",
+    "edit": "Edit",
+    "go_back": "Go back",
+    "label": "Label",
+    "learn_more": "Learn more",
+    "more": "More",
+    "new": "New",
+    "no": "No",
+    "preserve_current": "Preserve current",
+    "prettify": "Prettify",
+    "remove": "Remove",
+    "replace_current": "Replace current",
+    "replace_json": "Replace with JSON",
+    "restore": "Restore",
+    "save": "Save",
+    "search": "Search",
+    "send": "Send",
     "start": "Start",
-    "stop": "Stop"
-  },
-  "confirm": {
-    "logout": "Are you sure you want to logout?",
-    "remove_history": "Are you sure you want to permanently delete all history?",
-    "remove_collection": "Are you sure you want to permanently delete this collection?",
-    "remove_folder": "Are you sure you want to permanently delete this folder?",
-    "remove_request": "Are you sure you want to permanently delete this request?",
-    "remove_environment": "Are you sure you want to permanently delete this environment?",
-    "remove_telemetry": "Are you sure you want to opt-out of Telemetry?",
-    "remove_team": "Are you sure you want to delete this team?",
-    "sync": "Are you sure you want to sync this workspace?"
-  },
-  "empty": {
-    "protocols": "Protocols are empty",
-    "environments": "Environments are empty",
-    "collections": "Collections are empty",
-    "team_name": "Team name empty",
-    "collection": "Collection is empty",
-    "folder": "Folder is empty",
-    "parameters": "This request does not have any parameters",
-    "history": "History is empty",
-    "headers": "This request does not have any headers",
-    "tests": "There are no tests for this request",
-    "schema": "Connect to a GraphQL endpoint",
-    "teams": "Teams are empty",
-    "members": "Team is empty",
-    "body": "This request does not have a body",
-    "authorization": "This request does not use any authorization"
-  },
-  "count": {
-    "message": "Message {count}",
-    "protocol": "Protocol {count}",
-    "header": "Header {count}",
-    "parameter": "Parameter {count}",
-    "variable": "Variable {count}",
-    "value": "Value {count}"
+    "stop": "Stop",
+    "turn_off": "Turn off",
+    "turn_on": "Turn on",
+    "undo": "Undo",
+    "yes": "Yes"
   },
   "add": {
     "new": "Add new",
     "star": "Add star"
   },
+  "app": {
+    "chat_with_us": "Chat with us",
+    "contact_us": "Contact us",
+    "copy": "Copy",
+    "documentation": "Documentation",
+    "help": "Help, feedback and</br>documentation",
+    "home": "Home",
+    "invite": "Invite",
+    "invite_description": "In Hoppscotch, we designed a simple and intuitive interface for creating and managing your APIs. Hoppscotch is a tool that helps you build, test, document and share your APIs.",
+    "invite_your_friends": "Invite your friends",
+    "join_discord_community": "Join our Discord community",
+    "keyboard_shortcuts": "Keyboard shortcuts",
+    "name": "Hoppscotch",
+    "new_version_found": "New version found. Refresh to update.",
+    "proxy_privacy_policy": "Proxy privacy policy",
+    "search": "Search",
+    "share": "Share",
+    "shortcuts": "Shortcuts",
+    "spotlight": "Spotlight",
+    "status": "Status",
+    "terms_and_privacy": "Terms and privacy",
+    "twitter": "Twitter",
+    "type_a_command_search": "Type a command or search…",
+    "version": "v2.0",
+    "we_use_cookies": "We use cookies",
+    "whats_new": "What's new?",
+    "wiki": "Wiki"
+  },
+  "auth": {
+    "account_exists": "Account exists with different credential - Login to link both accounts",
+    "all_sign_in_options": "All sign in options",
+    "continue_with_email": "Continue with Email",
+    "continue_with_github": "Continue with GitHub",
+    "continue_with_google": "Continue with Google",
+    "email": "Email",
+    "logged_out": "Logged out",
+    "login": "Login",
+    "login_success": "Successfully logged in",
+    "login_to_hoppscotch": "Login to Hoppscotch",
+    "logout": "Logout",
+    "re_enter_email": "Re-enter email",
+    "send_magic_link": "Send a magic link",
+    "sync": "Sync",
+    "we_sent_magic_link": "We sent you a magic link!",
+    "we_sent_magic_link_description": "Check your inbox - we sent an email to {email}. It contains a magic link that will log you in."
+  },
+  "authorization": {
+    "include_in_url": "Include in URL",
+    "password": "Password",
+    "token": "Token",
+    "type": "Authorization Type",
+    "username": "Username"
+  },
+  "collection": {
+    "created": "Collection created",
+    "edit": "Edit Collection",
+    "invalid_name": "Please provide a valid name for the collection",
+    "my_collections": "My Collections",
+    "name": "My New Collection",
+    "new": "New Collection",
+    "save_as": "Save as",
+    "select": "Select a Collection",
+    "select_location": "Select location",
+    "select_team": "Select a team",
+    "team_collections": "Team Collections"
+  },
+  "confirm": {
+    "logout": "Are you sure you want to logout?",
+    "remove_collection": "Are you sure you want to permanently delete this collection?",
+    "remove_environment": "Are you sure you want to permanently delete this environment?",
+    "remove_folder": "Are you sure you want to permanently delete this folder?",
+    "remove_history": "Are you sure you want to permanently delete all history?",
+    "remove_request": "Are you sure you want to permanently delete this request?",
+    "remove_team": "Are you sure you want to delete this team?",
+    "remove_telemetry": "Are you sure you want to opt-out of Telemetry?",
+    "sync": "Are you sure you want to sync this workspace?"
+  },
+  "count": {
+    "header": "Header {count}",
+    "message": "Message {count}",
+    "parameter": "Parameter {count}",
+    "protocol": "Protocol {count}",
+    "value": "Value {count}",
+    "variable": "Variable {count}"
+  },
+  "documentation": {
+    "generate": "Generate documentation",
+    "generate_message": "Import any Hoppscotch collection to generate API documentation on-the-go."
+  },
+  "empty": {
+    "authorization": "This request does not use any authorization",
+    "body": "This request does not have a body",
+    "collection": "Collection is empty",
+    "collections": "Collections are empty",
+    "environments": "Environments are empty",
+    "folder": "Folder is empty",
+    "headers": "This request does not have any headers",
+    "history": "History is empty",
+    "members": "Team is empty",
+    "parameters": "This request does not have any parameters",
+    "protocols": "Protocols are empty",
+    "schema": "Connect to a GraphQL endpoint",
+    "team_name": "Team name empty",
+    "teams": "Teams are empty",
+    "tests": "There are no tests for this request"
+  },
+  "environment": {
+    "create_new": "Create new environment",
+    "edit": "Edit Environment",
+    "invalid_name": "Please provide a valid name for the environment",
+    "new": "New Environment",
+    "no_environment": "No environment",
+    "select": "Select environment",
+    "title": "Environments",
+    "variable_list": "Variable List"
+  },
+  "error": {
+    "browser_support_sse": "This browser doesn't seems to have Server Sent Events support.",
+    "check_console_details": "Check console log for details.",
+    "curl_invalid_format": "cURL is not formatted properly",
+    "empty_req_name": "Empty Request Name",
+    "f12_details": "(F12 for details)",
+    "gql_prettify_invalid_query": "Couldn't prettify an invalid query, solve query syntax errors and try again",
+    "json_prettify_invalid_body": "Couldn't prettify an invalid body, solve json syntax errors and try again",
+    "network_fail": "Could not send request",
+    "no_duration": "No duration",
+    "something_went_wrong": "Something went wrong"
+  },
+  "export": {
+    "as_json": "Export as JSON",
+    "create_secret_gist": "Create secret Gist",
+    "gist_created": "Gist created",
+    "require_github": "Login with GitHub to create secret gist"
+  },
+  "folder": {
+    "created": "Folder created",
+    "edit": "Edit Folder",
+    "new": "New Folder",
+    "renamed": "Folder renamed"
+  },
+  "graphql": {
+    "mutations": "Mutations",
+    "schema": "Schema",
+    "subscriptions": "Subscriptions"
+  },
+  "header": {
+    "account": "Account",
+    "install_pwa": "Install app",
+    "login": "Login",
+    "save_workspace": "Save My Workspace"
+  },
+  "helpers": {
+    "authorization": "The authorization header will be automatically generated when you send the request.",
+    "generate_documentation_first": "Generate documentation first",
+    "network_fail": "Unable to reach the API endpoint. Check your network connection and try again.",
+    "offline": "You seem to be offline. Data in this workspace might not be up to date.",
+    "offline_short": "You seem to be offline.",
+    "post_request_tests": "Test scripts are written in JavaScript, and are run after the response is received.",
+    "pre_request_script": "Pre-request scripts are written in JavaScript, and are run before the request is sent.",
+    "tests": "Write a test script to automate debugging."
+  },
+  "hide": {
+    "more": "Hide more",
+    "preview": "Hide Preview",
+    "sidebar": "Hide sidebar"
+  },
+  "import": {
+    "collections": "Import collections",
+    "curl": "Import cURL",
+    "failed": "Import failed",
+    "from_gist": "Import from Gist",
+    "from_my_collections": "Import from My Collections",
+    "gist_url": "Enter Gist URL",
+    "json": "Import from JSON",
+    "title": "Import"
+  },
+  "layout": {
+    "zen_mode": "Zen mode"
+  },
+  "modal": {
+    "collections": "Collections",
+    "confirm": "Confirm",
+    "edit_request": "Edit Request",
+    "import_export": "Import / Export"
+  },
+  "mqtt": {
+    "communication": "Communication",
+    "log": "Log",
+    "message": "Message",
+    "publish": "Publish",
+    "subscribe": "Subscribe",
+    "topic": "Topic",
+    "topic_name": "Topic Name",
+    "topic_title": "Publish / Subscribe topic",
+    "unsubscribe": "Unsubscribe",
+    "url": "URL"
+  },
+  "navigation": {
+    "doc": "Docs",
+    "graphql": "GraphQL",
+    "realtime": "Realtime",
+    "rest": "REST",
+    "settings": "Settings"
+  },
+  "preRequest": {
+    "javascript_code": "JavaScript Code",
+    "script": "Pre-Request Script",
+    "snippets": "Snippets"
+  },
   "remove": {
     "star": "Remove star"
   },
+  "request": {
+    "authorization": "Authorization",
+    "body": "Request Body",
+    "choose_language": "Choose language",
+    "content_type": "Content Type",
+    "copy_link": "Copy link",
+    "duration": "Duration",
+    "enter_curl": "Enter cURL",
+    "generate_code": "Generate code",
+    "generated_code": "Generated code",
+    "header_list": "Header List",
+    "method": "Method",
+    "name": "Request name",
+    "parameter_list": "Query Parameters",
+    "parameters": "Parameters",
+    "payload": "Payload",
+    "query": "Query",
+    "raw_body": "Raw Request Body",
+    "run": "Run",
+    "save": "Save",
+    "save_as": "Save as",
+    "share": "Share",
+    "title": "Request",
+    "type": "Request type",
+    "url": "URL",
+    "variables": "Variables"
+  },
+  "response": {
+    "body": "Response Body",
+    "headers": "Headers",
+    "html": "HTML",
+    "image": "Image",
+    "json": "JSON",
+    "preview_html": "Preview HTML",
+    "raw": "Raw",
+    "size": "Size",
+    "status": "Status",
+    "time": "Time",
+    "title": "Response",
+    "waiting_for_connection": "waiting for connection",
+    "xml": "XML"
+  },
+  "settings": {
+    "accent_color": "Accent color",
+    "account": "Account",
+    "account_description": "Customize your account settings.",
+    "account_email_description": "Your primary email address.",
+    "account_name_description": "This is your display name.",
+    "background": "Background",
+    "black_mode": "Black",
+    "change_font_size": "Change font size",
+    "choose_language": "Choose language",
+    "dark_mode": "Dark",
+    "experiments": "Experiments",
+    "experiments_notice": "This is a collection of experiments we're working on that might turn out to be useful, fun, both, or neither. They're not final and may not be stable, so if something overly weird happens, don't panic. Just turn the dang thing off. Jokes aside, ",
+    "extension_ver_not_reported": "Not Reported",
+    "extension_version": "Extension Version",
+    "extensions": "Extensions",
+    "extensions_use_toggle": "Use the browser extension to send requests (if present)",
+    "font_size": "Font size",
+    "font_size_large": "Large",
+    "font_size_medium": "Medium",
+    "font_size_small": "Small",
+    "interceptor": "Interceptor",
+    "interceptor_description": "Middleware between application and APIs.",
+    "language": "Language",
+    "light_mode": "Light",
+    "navigation_sidebar": "Navigation sidebar",
+    "official_proxy_hosting": "Official Proxy is hosted by Hoppscotch.",
+    "proxy": "Proxy",
+    "proxy_url": "Proxy URL",
+    "proxy_use_toggle": "Use the proxy middleware to send requests",
+    "read_the": "Read the",
+    "reset_default": "Reset to default",
+    "shortcuts_indicator": "Shortcuts indicator",
+    "sync": "Synchronise",
+    "sync_collections": "Collections",
+    "sync_description": "These settings are synced to cloud.",
+    "sync_environments": "Environments",
+    "sync_history": "History",
+    "system_mode": "System",
+    "telemetry": "Telemetry",
+    "telemetry_helps_us": "Telemetry helps us to personalize our operations and deliver the best experience to you.",
+    "theme": "Theme",
+    "theme_description": "Customize your application theme.",
+    "use_experimental_url_bar": "Use experimental URL bar with environment highlighting",
+    "user": "User"
+  },
+  "shortcut": {
+    "general": {
+      "close_current_menu": "Close current menu",
+      "command_menu": "Search & command menu",
+      "help_menu": "Help menu",
+      "show_all": "Keyboard shortcuts",
+      "title": "General"
+    },
+    "miscellaneous": {
+      "invite": "Invite people to Hoppscotch",
+      "title": "Miscellaneous"
+    },
+    "navigation": {
+      "back": "Go back to previous page",
+      "documentation": "Go to Documentation page",
+      "forward": "Go forward to next page",
+      "graphql": "Go to GraphQL page",
+      "realtime": "Go to Realtime page",
+      "rest": "Go to REST page",
+      "settings": "Go to Settings page",
+      "title": "Navigation"
+    },
+    "request": {
+      "copy_request_link": "Copy Request Link",
+      "delete_method": "Select DELETE method",
+      "get_method": "Select GET method",
+      "head_method": "Select HEAD method",
+      "method": "Method",
+      "next_method": "Select Next method",
+      "path": "Path",
+      "post_method": "Select POST method",
+      "previous_method": "Select Previous method",
+      "put_method": "Select PUT method",
+      "reset_request": "Reset Request",
+      "save_to_collections": "Save to Collections",
+      "send_request": "Send Request",
+      "title": "Request"
+    }
+  },
   "show": {
     "code": "Show code",
     "more": "Show more",
     "sidebar": "Show sidebar"
   },
-  "hide": {
-    "sidebar": "Hide sidebar",
-    "more": "Hide more",
-    "preview": "Hide Preview"
-  },
-  "support": {
-    "title": "Support",
-    "documentation": "Read more about Hoppscotch",
-    "changelog": "Read more about latest releases",
-    "twitter": "Follow us on Twitter",
-    "chat": "Questions? Chat with us!",
-    "forum": "Ask questions and get answers",
-    "team": "Get in touch with the team",
-    "shortcuts": "Browse app faster",
-    "community": "Ask questions and help others"
-  },
-  "app": {
-    "name": "Hoppscotch",
-    "version": "v2.0",
-    "home": "Home",
-    "wiki": "Wiki",
-    "we_use_cookies": "We use cookies",
-    "documentation": "Documentation",
-    "whats_new": "What's new?",
-    "chat_with_us": "Chat with us",
-    "shortcuts": "Shortcuts",
-    "keyboard_shortcuts": "Keyboard shortcuts",
-    "join_discord_community": "Join our Discord community",
-    "twitter": "Twitter",
-    "new_version_found": "New version found. Refresh to update.",
-    "terms_and_privacy": "Terms and privacy",
-    "status": "Status",
-    "help": "Help, feedback and</br>documentation",
-    "invite": "Invite",
-    "invite_your_friends": "Invite your friends",
-    "invite_description": "In Hoppscotch, we designed a simple and intuitive interface for creating and managing your APIs. Hoppscotch is a tool that helps you build, test, document and share your APIs.",
-    "share": "Share",
-    "copy": "Copy",
-    "search": "Search",
-    "type_a_command_search": "Type a command or search…",
-    "spotlight": "Spotlight"
-  },
-  "collection": {
-    "my_collections": "My Collections",
-    "team_collections": "Team Collections",
-    "select_team": "Select a team",
-    "save_as": "Save as",
-    "select_location": "Select location",
-    "select": "Select a Collection",
-    "invalid_name": "Please provide a valid name for the collection",
-    "new": "New Collection",
-    "name": "My New Collection",
-    "edit": "Edit Collection",
-    "created": "Collection created"
-  },
-  "folder": {
-    "new": "New Folder",
-    "edit": "Edit Folder",
-    "created": "Folder created",
-    "renamed": "Folder renamed"
-  },
-  "team": {
-    "title": "Teams",
-    "join_beta": "Join the beta program to access teams.",
-    "exit": "Exit Team",
-    "name_length_insufficient": "Team name should be atleast 6 characters long",
-    "invalid_email_format": "Email format is invalid",
-    "new": "New Team",
-    "new_name": "My New Team",
-    "edit": "Edit Team",
-    "deleted": "Team deleted",
-    "members": "Members",
-    "permissions": "Permissions",
-    "invalid_member_permission": "Please provide a valid permission to the team member",
-    "email": "E-mail",
-    "create_new": "Create new team",
-    "new_created": "New team created",
-    "saved": "Team saved",
-    "no_access": "You do not have edit access to these collections",
-    "left": "You left the team",
-    "exit_disabled": "Only owner cannot exit the team",
-    "member_role_updated": "User roles updated",
-    "member_removed": "User removed"
-  },
-  "modal": {
-    "confirm": "Confirm",
-    "import_export": "Import / Export",
-    "collections": "Collections"
-  },
-  "import": {
-    "title": "Import",
-    "from_gist": "Import from Gist",
-    "gist_url": "Enter Gist URL",
-    "failed": "Import failed",
-    "json": "Import from JSON",
-    "collections": "Import collections",
-    "curl": "Import cURL",
-    "from_my_collections": "Import from My Collections"
-  },
-  "export": {
-    "as_json": "Export as JSON",
-    "create_secret_gist": "Create secret Gist",
-    "require_github": "Login with GitHub to create secret gist",
-    "gist_created": "Gist created"
-  },
-  "auth": {
-    "login": "Login",
-    "continue_with_google": "Continue with Google",
-    "continue_with_github": "Continue with GitHub",
-    "continue_with_email": "Continue with Email",
-    "email": "Email",
-    "all_sign_in_options": "All sign in options",
-    "re_enter_email": "Re-enter email",
-    "account_exists": "Account exists with different credential - Login to link both accounts",
-    "send_magic_link": "Send a magic link",
-    "we_sent_magic_link": "We sent you a magic link!",
-    "we_sent_magic_link_description": "Check your inbox - we sent an email to {email}. It contains a magic link that will log you in.",
-    "sync": "Sync",
-    "login_success": "Successfully logged in",
-    "logout": "Logout",
-    "logged_out": "Logged out",
-    "login_to_hoppscotch": "Login to Hoppscotch"
-  },
-  "tab": {
-    "websocket": "WebSocket",
-    "queries": "Queries",
-    "sse": "SSE",
-    "mqtt": "MQTT",
-    "types": "Types",
-    "query": "Query",
-    "variables": "Variables",
-    "headers": "Headers",
-    "pre_request_script": "Pre-request Script",
-    "collections": "Collections",
-    "body": "Body",
-    "authorization": "Authorization",
-    "tests": "Tests",
-    "socketio": "Socket.IO",
-    "parameters": "Parameters",
-    "history": "History"
-  },
-  "authorization": {
-    "type": "Authorization Type",
-    "include_in_url": "Include in URL"
-  },
-  "websocket": {
-    "protocols": "Protocols",
-    "message": "Message",
-    "url": "URL",
-    "communication": "Communication"
-  },
-  "sse": {
-    "url": "URL",
-    "event_type": "Event type"
-  },
-  "mqtt": {
-    "topic": "Topic",
-    "topic_name": "Topic Name",
-    "topic_title": "Publish / Subscribe topic",
-    "publish": "Publish",
-    "subscribe": "Subscribe",
-    "unsubscribe": "Unsubscribe",
-    "message": "Message",
-    "url": "URL",
-    "communication": "Communication"
-  },
   "socketio": {
+    "communication": "Communication",
     "event_name": "Event Name",
     "events": "Events",
-    "url": "URL",
-    "communication": "Communication"
+    "log": "Log",
+    "url": "URL"
   },
-  "request": {
-    "title": "Request",
-    "query": "Query",
-    "copy_link": "Copy link",
-    "variables": "Variables",
-    "url": "URL",
-    "header_list": "Header List",
-    "save": "Save",
-    "parameters": "Parameters",
-    "type": "Request type",
-    "save_as": "Save as",
-    "parameter_list": "Query Parameters",
-    "body": "Request Body",
-    "raw_body": "Raw Request Body",
-    "name": "Request name",
-    "choose_language": "Choose language",
-    "generate_code": "Generate code",
-    "generated_code": "Generated code",
-    "enter_curl": "Enter cURL",
-    "content_type": "Content Type",
-    "share": "Share"
-  },
-  "settings": {
-    "account_description": "Customize your account settings.",
-    "theme_description": "Customize your application theme.",
-    "account": "Account",
-    "background": "Background",
-    "proxy_url": "Proxy URL",
-    "official_proxy_hosting": "Official Proxy is hosted by Hoppscotch.",
-    "user": "User",
-    "account_name_description": "This is your display name.",
-    "account_email_description": "Your primary email address.",
-    "interceptor_description": "Middleware between application and APIs.",
-    "sync_description": "These settings are synced to cloud.",
-    "proxy": "Proxy",
-    "sync": "Synchronise",
-    "sync_history": "History",
-    "sync_collections": "Collections",
-    "sync_environments": "Environments",
-    "shortcuts_indicator": "Shortcuts indicator",
-    "telemetry": "Telemetry",
-    "interceptor": "Interceptor",
-    "system_mode": "System",
-    "light_mode": "Light",
-    "dark_mode": "Dark",
-    "black_mode": "Black",
-    "navigation_sidebar": "Navigation sidebar",
-    "font_size": "Font size",
-    "font_size_small": "Small",
-    "font_size_large": "Large",
-    "font_size_medium": "Medium",
-    "change_font_size": "Change font size",
-    "language": "Language",
-    "choose_language": "Choose language",
-    "use_experimental_url_bar": "Use experimental URL bar with environment highlighting",
-    "accent_color": "Accent color",
-    "telemetry_helps_us": "Telemetry helps us to personalize our operations and deliver the best experience to you.",
-    "experiments": "Experiments",
-    "experiments_notice": "This is a collection of experiments we're working on that might turn out to be useful, fun, both, or neither. They're not final and may not be stable, so if something overly weird happens, don't panic. Just turn the dang thing off. Jokes aside, ",
-    "extension_ver_not_reported": "Not Reported",
-    "extension_version": "Extension Version",
-    "extensions_use_toggle": "Use the browser extension to send requests (if present)",
-    "proxy_use_toggle": "Use the proxy middleware to send requests",
-    "extensions": "Extensions",
-    "theme": "Theme"
-  },
-  "layout": {
-    "zen_mode": "Zen mode"
-  },
-  "preRequest": {
-    "script": "Pre-Request Script",
-    "snippets": "Snippets",
-    "javascript_code": "JavaScript Code"
-  },
-  "test": {
-    "script": "Script",
-    "results": "Test Results",
-    "report": "Test Report",
-    "snippets": "Snippets",
-    "javascript_code": "JavaScript Code"
-  },
-  "shortcut": {
-    "general": {
-      "title": "General",
-      "help_menu": "Help menu",
-      "show_all": "Keyboard shortcuts",
-      "command_menu": "Search & command menu",
-      "close_current_menu": "Close current menu"
-    },
-    "navigation": {
-      "title": "Navigation",
-      "rest": "Go to REST page",
-      "graphql": "Go to GraphQL page",
-      "realtime": "Go to Realtime page",
-      "documentation": "Go to Documentation page",
-      "settings": "Go to Settings page",
-      "back": "Go back to previous page",
-      "forward": "Go forward to next page"
-    },
-    "miscellaneous": {
-      "title": "Miscellaneous",
-      "invite": "Invite people to Hoppscotch"
-    },
-    "request": {
-      "title": "Request",
-      "method": "Method",
-      "path": "Path",
-      "send_request": "Send Request",
-      "save_to_collections": "Save to Collections",
-      "copy_request_link": "Copy Request Link",
-      "reset_request": "Reset Request",
-      "next_method": "Select Next method",
-      "previous_method": "Select Previous method",
-      "get_method": "Select GET method",
-      "head_method": "Select HEAD method",
-      "post_method": "Select POST method",
-      "put_method": "Select PUT method",
-      "delete_method": "Select DELETE method"
-    }
-  },
-  "graphql": {
-    "mutations": "Mutations",
-    "subscriptions": "Subscriptions",
-    "schema": "Schema"
-  },
-  "error": {
-    "something_went_wrong": "Something went wrong",
-    "check_console_details": "Check console log for details.",
-    "network_fail": "Could not send request"
-  },
-  "helpers": {
-    "authorization": "The authorization header will be automatically generated when you send the request.",
-    "pre_request_script": "Pre-request scripts are written in JavaScript, and are run before the request is sent.",
-    "post_request_tests": "Test scripts are written in JavaScript, and are run after the response is received.",
-    "offline_short": "You seem to be offline.",
-    "offline": "You seem to be offline. Data in this workspace might not be up to date.",
-    "tests": "Write a test script to automate debugging.",
-    "network_fail": "Unable to reach the API endpoint. Check your network connection and try again."
-  },
-  "environment": {
-    "title": "Environments",
-    "no_environment": "No environment",
-    "new": "New Environment",
-    "create_new": "Create new environment",
-    "edit": "Edit Environment",
-    "variable_list": "Variable List",
-    "invalid_name": "Please provide a valid name for the environment",
-    "select": "Select environment"
-  },
-  "response": {
-    "title": "Response",
-    "body": "Response Body",
-    "headers": "Headers",
-    "status": "Status",
-    "time": "Time",
-    "size": "Size",
-    "waiting_for_connection": "waiting for connection",
-    "preview_html": "Preview HTML",
-    "html": "HTML",
-    "xml": "XML",
-    "json": "JSON",
-    "raw": "Raw",
-    "image": "Image"
+  "sse": {
+    "event_type": "Event type",
+    "log": "Log",
+    "url": "URL"
   },
   "state": {
+    "cleared": "Cleared",
+    "connected": "Connected",
+    "connected_to": "Connected to {name}",
+    "connecting_to": "Connecting to {name}...",
+    "copied_to_clipboard": "Copied to clipboard",
+    "deleted": "Deleted",
+    "deprecated": "DEPRECATED",
+    "disabled": "Disabled",
+    "disconnected": "Disconnected",
+    "disconnected_from": "Disconnected from {name}",
+    "docs_generated": "Documentation generated",
+    "download_started": "Download started",
     "enabled": "Enabled",
-    "disabled": "Disabled"
+    "file_imported": "File imported",
+    "finished_in": "Finished in {duration}ms",
+    "history_deleted": "History deleted",
+    "loading": "Loading...",
+    "none": "None",
+    "nothing_found": "Nothing found for",
+    "waiting_send_request": "Waiting to send request"
   },
-  "read_the": "Read the",
-  "proxy_privacy_policy": "Proxy privacy policy",
-  "contact_us": "Contact us",
-  "access_token": "Access Token",
-  "token_list": "Token List",
-  "get_token": "Get New Token",
-  "manage_token": "Manage Access Token",
-  "save_token": "Save Access Token",
-  "use_token": "Use Saved Token",
-  "request_token": "Request Token",
-  "save_token_req": "Save Token Request",
-  "manage_token_req": "Manage Token Request",
-  "use_token_req": "Use Token Request",
-  "empty_req_name": "Empty Request Name",
-  "token_req_details": "Request Details",
-  "token_name": "Token Name",
-  "oidc_discovery_url": "OIDC Discovery URL",
-  "auth_url": "Auth URL",
-  "access_token_url": "Access Token URL",
-  "client_id": "Client ID",
-  "scope": "Scope",
-  "token_req_list": "Token Request List",
-  "no_path": "No path",
-  "no_label": "No label",
-  "search": "Search",
-  "history_deleted": "History deleted",
-  "cleared": "Cleared",
-  "time": "Time",
-  "duration": "Duration",
-  "no_duration": "No duration",
-  "new": "New",
-  "more": "More",
-  "edit": "Edit",
-  "deleted": "Deleted",
-  "undo": "Undo",
-  "edit_request": "Edit Request",
-  "connecting_to": "Connecting to {name}...",
-  "connected": "Connected",
-  "connected_to": "Connected to {name}",
-  "disconnected": "Disconnected",
-  "disconnected_from": "Disconnected from {name}",
-  "browser_support_sse": "This browser doesn't seems to have Server Sent Events support.",
-  "log": "Log",
-  "no_url": "No URL",
-  "run": "Run",
-  "loading": "Loading...",
-  "fetching": "Fetching...",
-  "waiting_send_req": "Waiting to send request",
-  "waiting_receive_response": "(waiting to receive response)",
-  "waiting_receive_schema": "(waiting to receive schema)",
-  "gql_prettify_invalid_query": "Couldn't prettify an invalid query, solve query syntax errors and try again",
-  "prettify_query": "Prettify Query",
-  "json_prettify_invalid_body": "Couldn't prettify an invalid body, solve json syntax errors and try again",
-  "prettify_body": "Prettify body",
-  "cancelled": "Cancelled",
-  "save": "Save",
-  "yes": "Yes",
-  "no": "No",
-  "restore": "Restore",
-  "nothing_found": "Nothing found for",
-  "replace_current": "Replace current",
-  "replace_json": "Replace with JSON",
-  "preserve_current": "Preserve current",
-  "download_file": "Download file",
-  "upload_file": "Upload file",
-  "use_request": "Use request",
-  "documentation": "Documentation",
-  "docs": "Docs",
-  "reset_default": "Reset to default",
-  "fields": "Fields",
-  "deprecated": "DEPRECATED",
-  "send_request_first": "Send a request first",
-  "generate_docs": "Generate documentation",
-  "generate_docs_message": "Import any Hoppscotch collection to generate API documentation on-the-go.",
-  "generate_docs_first": "Generate documentation first",
-  "docs_generated": "Documentation generated",
-  "optional": "(optional)",
-  "none": "None",
-  "username": "Username",
-  "password": "Password",
-  "token": "Token",
-  "payload": "Payload",
-  "choose_file": "Choose a file",
-  "file_imported": "File imported",
-  "f12_details": "(F12 for details)",
-  "copied_to_clipboard": "Copied to clipboard",
-  "finished_in": "Finished in {duration}ms",
-  "check_graphql_valid": "Check the URL to see if it is a valid GraphQL endpoint",
-  "graphql_introspect_failed": "Failed fetching schema 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"
+  "support": {
+    "changelog": "Read more about latest releases",
+    "chat": "Questions? Chat with us!",
+    "community": "Ask questions and help others",
+    "documentation": "Read more about Hoppscotch",
+    "forum": "Ask questions and get answers",
+    "shortcuts": "Browse app faster",
+    "team": "Get in touch with the team",
+    "title": "Support",
+    "twitter": "Follow us on Twitter"
+  },
+  "tab": {
+    "authorization": "Authorization",
+    "body": "Body",
+    "collections": "Collections",
+    "headers": "Headers",
+    "history": "History",
+    "mqtt": "MQTT",
+    "parameters": "Parameters",
+    "pre_request_script": "Pre-request Script",
+    "queries": "Queries",
+    "query": "Query",
+    "socketio": "Socket.IO",
+    "sse": "SSE",
+    "tests": "Tests",
+    "types": "Types",
+    "variables": "Variables",
+    "websocket": "WebSocket"
+  },
+  "team": {
+    "create_new": "Create new team",
+    "deleted": "Team deleted",
+    "edit": "Edit Team",
+    "email": "E-mail",
+    "exit": "Exit Team",
+    "exit_disabled": "Only owner cannot exit the team",
+    "invalid_email_format": "Email format is invalid",
+    "invalid_member_permission": "Please provide a valid permission to the team member",
+    "join_beta": "Join the beta program to access teams.",
+    "left": "You left the team",
+    "member_removed": "User removed",
+    "member_role_updated": "User roles updated",
+    "members": "Members",
+    "name_length_insufficient": "Team name should be atleast 6 characters long",
+    "new": "New Team",
+    "new_created": "New team created",
+    "new_name": "My New Team",
+    "no_access": "You do not have edit access to these collections",
+    "permissions": "Permissions",
+    "saved": "Team saved",
+    "title": "Teams"
+  },
+  "test": {
+    "javascript_code": "JavaScript Code",
+    "report": "Test Report",
+    "results": "Test Results",
+    "script": "Script",
+    "snippets": "Snippets"
+  },
+  "websocket": {
+    "communication": "Communication",
+    "log": "Log",
+    "message": "Message",
+    "protocols": "Protocols",
+    "url": "URL"
+  }
 }
diff --git a/pages/documentation.vue b/pages/documentation.vue
index f56e8bc9f..1687bae73 100644
--- a/pages/documentation.vue
+++ b/pages/documentation.vue
@@ -6,7 +6,7 @@
           <AppSection label="import">
             <div class="flex p-4 items-start justify-between">
               <label>
-                {{ $t("generate_docs_message") }}
+                {{ $t("documentation.generate_message") }}
               </label>
               <span
                 class="
@@ -83,7 +83,7 @@
               "
             >
               <ButtonPrimary
-                :label="$t('generate_docs')"
+                :label="$t('documentation.generate')"
                 @click.native="getDoc"
               />
             </div>
@@ -104,7 +104,7 @@
               >
                 <i class="opacity-75 pb-2 material-icons">topic</i>
                 <span class="text-center">
-                  {{ $t("generate_docs_first") }}
+                  {{ $t("helpers.generate_documentation_first") }}
                 </span>
               </div>
               <div
@@ -196,6 +196,7 @@ export default defineComponent({
       items: [],
       docsMarkdown: "",
       selected: [],
+      currentUser: null,
     }
   },
   subscriptions() {
@@ -249,11 +250,11 @@ export default defineComponent({
           this.collectionJSON = target.result
         }
         reader.readAsText(file)
-        this.$toast.info(this.$t("file_imported"), {
+        this.$toast.info(this.$t("state.file_imported"), {
           icon: "attach_file",
         })
       } else {
-        this.$toast.error(this.$t("choose_file"), {
+        this.$toast.error(this.$t("action.choose_file"), {
           icon: "attach_file",
         })
       }
@@ -286,7 +287,7 @@ export default defineComponent({
         this.items = JSON.parse(this.collectionJSON)
         this.assignIDs(this.items, "", "#")
         this.$toast.clear()
-        this.$toast.info(this.$t("docs_generated"), {
+        this.$toast.info(this.$t("state.docs_generated"), {
           icon: "book",
         })
         const docsMarkdown = Mustache.render(
diff --git a/pages/settings.vue b/pages/settings.vue
index 41893e4fb..7925031be 100644
--- a/pages/settings.vue
+++ b/pages/settings.vue
@@ -34,7 +34,7 @@
                   </div>
                   <div class="ml-4">
                     <label>
-                      {{ currentUser.displayName || $t("nothing_found") }}
+                      {{ currentUser.displayName || $t("state.nothing_found") }}
                     </label>
                     <p class="mt-1 text-secondaryLight">
                       {{ $t("settings.account_name_description") }}
@@ -47,7 +47,7 @@
                   </div>
                   <div class="ml-4">
                     <label>
-                      {{ currentUser.email || $t("nothing_found") }}
+                      {{ currentUser.email || $t("state.nothing_found") }}
                     </label>
                     <p class="mt-1 text-secondaryLight">
                       {{ $t("settings.account_email_description") }}
@@ -163,7 +163,7 @@
                 to="https://github.com/hoppscotch/hoppscotch/issues/new/choose"
                 blank
               >
-                {{ $t("contact_us") }} </SmartLink
+                {{ $t("app.contact_us") }} </SmartLink
               >.
             </div>
             <div class="space-y-4 py-4">
@@ -287,13 +287,17 @@
               {{ $t("settings.proxy") }}
             </h4>
             <div class="mt-1 text-secondaryLight">
-              {{ `${$t("settings.official_proxy_hosting")} ${$t("read_the")}` }}
+              {{
+                `${$t("settings.official_proxy_hosting")} ${$t(
+                  "settings.read_the"
+                )}`
+              }}
               <SmartLink
                 class="link"
                 to="https://github.com/hoppscotch/proxyscotch/wiki/Privacy-policy"
                 blank
               >
-                {{ $t("proxy_privacy_policy") }} </SmartLink
+                {{ $t("app.proxy_privacy_policy") }} </SmartLink
               >.
             </div>
             <div class="space-y-4 py-4">
@@ -322,7 +326,7 @@
               </div>
               <ButtonSecondary
                 v-tippy="{ theme: 'tooltip' }"
-                :title="$t('reset_default')"
+                :title="$t('settings.reset_default')"
                 :icon="clearIcon"
                 outline
                 class="rounded"
@@ -460,7 +464,7 @@ export default defineComponent({
     resetProxy() {
       applySetting("PROXY_URL", `https://proxy.hoppscotch.io/`)
       this.clearIcon = "done"
-      this.$toast.info(this.$t("cleared").toString(), {
+      this.$toast.info(this.$t("state.cleared").toString(), {
         icon: "clear_all",
       })
       setTimeout(() => (this.clearIcon = "clear_all"), 1000)