feat: init i18n with gitlocalize

components/app/Header.vue

@@ -1,17 +1,7 @@
 <template>
   <div>
     <header
-      class="
+      class="flex space-x-2 flex-1 py-2 px-2 items-center justify-between"
-        flex
-        space-x-2
-        flex-1
-        py-2
-        px-2
-        hide-scrollbar
-        items-center
-        justify-between
-      "
-      :class="{ 'overflow-x-auto': !currentUser }"
     >
       <div class="space-x-2 group inline-flex items-center">
         <ButtonSecondary
@@ -28,7 +18,7 @@
           id="installPWA"
           v-tippy="{ theme: 'tooltip' }"
           :title="$t('header.install_pwa')"
-          icon="offline_bolt"
+          icon="download_for_offline"
           class="rounded"
           @click.native="showInstallPrompt()"
         />

components/environments/Edit.vue

@@ -113,12 +113,12 @@
 </template>
 
 <script lang="ts">
-import Vue, { PropType } from "vue"
 import clone from "lodash/clone"
+import { defineComponent, PropType } from "@nuxtjs/composition-api"
 import type { Environment } from "~/newstore/environments"
 import { updateEnvironment } from "~/newstore/environments"
 
-export default Vue.extend({
+export default defineComponent({
   props: {
     show: Boolean,
     editingEnvironment: {

components/http/PreRequestScript.vue

@@ -1,5 +1,5 @@
 <template>
-  <AppSection label="preRequest">
+  <AppSection id="script" :label="$t('preRequest.script')">
     <div
       class="
         bg-primary
@@ -59,6 +59,17 @@
           to="https://github.com/hoppscotch/hoppscotch/wiki/Pre-Request-Scripts"
           blank
         />
+        <h4 class="font-bold text-secondaryLight pt-6">
+          {{ $t("preRequest.snippets") }}
+        </h4>
+        <div class="flex flex-col pt-4">
+          <SmartItem
+            v-for="(snippet, index) in snippets"
+            :key="`snippet-${index}`"
+            :label="snippet.name"
+            @click.native="useSnippet(snippet.script)"
+          />
+        </div>
       </div>
     </div>
   </AppSection>
@@ -67,6 +78,7 @@
 <script lang="ts">
 import { defineComponent } from "@nuxtjs/composition-api"
 import { usePreRequestScript } from "~/newstore/RESTSession"
+import preRequestScriptSnippets from "~/helpers/preRequestScriptSnippets"
 
 export default defineComponent({
   setup() {
@@ -74,5 +86,15 @@ export default defineComponent({
       preRequestScript: usePreRequestScript(),
     }
   },
+  data() {
+    return {
+      snippets: preRequestScriptSnippets,
+    }
+  },
+  methods: {
+    useSnippet(script: string) {
+      this.preRequestScript += script
+    },
+  },
 })
 </script>

components/http/Response.vue

@@ -1,7 +1,10 @@
 <template>
   <AppSection label="response">
     <HttpResponseMeta :response="response" />
-    <LensesResponseBodyRenderer v-if="!loading" :response="response" />
+    <LensesResponseBodyRenderer
+      v-if="!loading && hasResponse"
+      :response="response"
+    />
   </AppSection>
 </template>
 
@@ -14,11 +17,17 @@ export default defineComponent({
   setup() {
     const response = useReadonlyStream(restResponse$, null)
 
+    const hasResponse = computed(
+      () =>
+        response.value?.type === "success" || response.value?.type === "fail"
+    )
+
     const loading = computed(
       () => response.value === null || response.value.type === "loading"
     )
 
     return {
+      hasResponse,
       response,
       loading,
     }

components/http/Tests.vue

@@ -59,6 +59,17 @@
           to="https://github.com/hoppscotch/hoppscotch/wiki/Post-Request-Tests"
           blank
         />
+        <h4 class="font-bold text-secondaryLight pt-6">
+          {{ $t("test.snippets") }}
+        </h4>
+        <div class="flex flex-col pt-4">
+          <SmartItem
+            v-for="(snippet, index) in snippets"
+            :key="`snippet-${index}`"
+            :label="snippet.name"
+            @click.native="useSnippet(snippet.script)"
+          />
+        </div>
       </div>
     </div>
   </AppSection>
@@ -67,6 +78,7 @@
 <script lang="ts">
 import { defineComponent } from "@nuxtjs/composition-api"
 import { useTestScript } from "~/newstore/RESTSession"
+import testSnippets from "~/helpers/testSnippets"
 
 export default defineComponent({
   setup() {
@@ -74,5 +86,15 @@ export default defineComponent({
       testScript: useTestScript(),
     }
   },
+  data() {
+    return {
+      snippets: testSnippets,
+    }
+  },
+  methods: {
+    useSnippet(script: string) {
+      this.testScript += script
+    },
+  },
 })
 </script>

helpers/preRequestScriptSnippets.js

@@ -0,0 +1,14 @@
+export default [
+  {
+    name: "Status code: Status code is 200",
+    script: `\n\npw.test("Status code is 200", ()=> {
+    pw.expect(pw.response.statusCode).toBe(200);
+});`,
+  },
+  {
+    name: "Response body: Contains string",
+    script: `\n\npw.test("Status code is 200", ()=> {
+    pw.expect(pw.response.statusCode).toBe(200);
+});`,
+  },
+]

helpers/testSnippets.js

@@ -0,0 +1,14 @@
+export default [
+  {
+    name: "Status code: Status code is 200",
+    script: `\n\npw.test("Status code is 200", ()=> {
+    pw.expect(pw.response.statusCode).toBe(200);
+});`,
+  },
+  {
+    name: "Response body: Contains string",
+    script: `\n\npw.test("Status code is 200", ()=> {
+    pw.expect(pw.response.statusCode).toBe(200);
+});`,
+  },
+]

languages.json

@@ -1,135 +1,51 @@
 [
+  {
+    "code": "de",
+    "name": "Deutsch",
+    "iso": "de-DE",
+    "file": "de.json",
+    "country": "DE"
+  },
   {
     "code": "en",
     "name": "English",
     "iso": "en-US",
-    "file": "en-US.json",
+    "file": "en.json",
     "country": "US"
   },
   {
     "code": "es",
     "name": "Español",
     "iso": "es-ES",
-    "file": "es-ES.json",
+    "file": "es.json",
     "country": "ES"
   },
   {
     "code": "fr",
     "name": "Français",
     "iso": "fr-FR",
-    "file": "fr-FR.json",
+    "file": "fr.json",
     "country": "FR"
   },
-  {
-    "code": "fa",
-    "name": "Farsi",
-    "iso": "fa-IR",
-    "file": "fa-IR.json",
-    "country": "IR"
-  },
   {
     "code": "pt",
     "name": "Português",
     "iso": "pt-PT",
-    "file": "pt-PT.json",
+    "file": "pt.json",
     "country": "PT"
   },
   {
-    "code": "pt-br",
+    "code": "ru",
-    "name": "Português Brasileiro",
+    "name": "Russian",
-    "iso": "pt-BR",
+    "iso": "ru-RU",
-    "file": "pt-BR.json",
+    "file": "ru.json",
-    "country": "BR"
+    "country": "RU"
   },
   {
     "code": "cn",
     "name": "简体中文",
     "iso": "zh-CN",
-    "file": "zh-CN.json",
+    "file": "zh.json",
     "country": "CN"
-  },
-  {
-    "code": "tw",
-    "name": "繁體中文",
-    "iso": "zh-TW",
-    "file": "zh-TW.json",
-    "country": "TW"
-  },
-  {
-    "code": "id",
-    "name": "Bahasa Indonesia",
-    "iso": "id-ID",
-    "file": "id-ID.json",
-    "country": "ID"
-  },
-  {
-    "code": "tr",
-    "name": "Türkçe",
-    "iso": "tr-TR",
-    "file": "tr-TR.json",
-    "country": "TR"
-  },
-  {
-    "code": "de",
-    "name": "Deutsch",
-    "iso": "de-DE",
-    "file": "de-DE.json",
-    "country": "DE"
-  },
-  {
-    "code": "ja",
-    "name": "日本語",
-    "iso": "ja-JP",
-    "file": "ja-JP.json",
-    "country": "JP"
-  },
-  {
-    "code": "ko",
-    "name": "한국어",
-    "iso": "ko-KR",
-    "file": "ko-KR.json",
-    "country": "KR"
-  },
-  {
-    "code": "in",
-    "name": "हिंदी",
-    "iso": "in-IN",
-    "file": "in-IN.json",
-    "country": "IN"
-  },
-  {
-    "code": "bn",
-    "name": "Bengali",
-    "iso": "bn-BD",
-    "file": "bn-BD.json",
-    "country": "BD"
-  },
-  {
-    "code": "ml",
-    "name": "മലയാളം",
-    "iso": "ml-ML",
-    "file": "ml-ML.json",
-    "country": "ML"
-  },
-  {
-    "code": "vi",
-    "name": "Vietnamese",
-    "iso": "vi-VN",
-    "file": "vi-VN.json",
-    "country": "VN"
-  },
-  {
-    "code": "nl",
-    "name": "Dutch",
-    "iso": "nl-BE",
-    "file": "nl-BE.json",
-    "country": "BE"
-  },
-  {
-    "code": "nb",
-    "name": "Norwegian (Bokmål)",
-    "iso": "nb-NO",
-    "file": "nb-NO.json",
-    "country": "NO"
   }
 ]

pages/index.vue

@@ -31,7 +31,7 @@
             </SmartTab>
 
             <SmartTab
-              :id="'pre_request_script'"
+              :id="'preRequestScript'"
               :label="$t('pre_request_script')"
             >
               <HttpPreRequestScript />