Merge branch 'main' into teams

components/app/Contributors.vue

@@ -116,6 +116,15 @@
           />
         </a>
       </div>
+      <div class="contributors">
+        <a href="https://simplescraper.io/?utm_source=hs" target="_blank" rel="noopener">
+          <img
+            style="max-height: 50px"
+            src="~assets/images/Simplescraper_dark.png"
+            alt="Simplescraper"
+          />
+        </a>
+      </div>
       <div class="contributors">
         <a href="https://tyk.io?ref=hoppscotch" target="_blank" rel="noopener">
           <img

components/app/Footer.vue

@@ -5,7 +5,6 @@
         <a class="footer-link" href="https://www.netlify.com" target="_blank" rel="noopener">
           Powered by Netlify
         </a>
-        <span class="footer-link"> Sponsored by </span>
         <span>
           <a
             class="footer-link"
@@ -15,9 +14,6 @@
           >
             OSS Capital
           </a>
-        </span>
-        <span class="footer-link"> & </span>
-        <span>
           <a
             class="footer-link"
             href="https://paw.cloud/?utm_source=hoppscotch&utm_medium=website&utm_campaign=hoppscotch-sponsorship"
@@ -26,6 +22,14 @@
           >
             Paw
           </a>
+          <a
+            class="footer-link"
+            href="https://simplescraper.io/?utm_source=hs"
+            target="_blank"
+            rel="noopener"
+          >
+            Simplescraper
+          </a>
         </span>
         <iframe
           src="https://ghbtns.com/github-btn.html?user=hoppscotch&type=sponsor"
@@ -70,6 +74,7 @@
   @apply my-2;
   @apply mx-4;
   @apply text-fgLightColor;
+  @apply text-sm;
 
   &:hover {
     @apply text-fgColor;

components/http/CodegenModal.vue

@@ -11,7 +11,7 @@
       </div>
     </div>
     <div slot="body" class="flex flex-col">
-      <label for="requestType">{{ $t("request_type") }}</label>
+      <label for="requestType">{{ $t("choose_language") }}</label>
       <span class="select-wrapper">
         <v-popover>
           <pre v-if="requestType">{{ codegens.find((x) => x.id === requestType).name }}</pre>
@@ -46,15 +46,22 @@
           </button>
         </div>
       </div>
-      <textarea
-        id="generatedCode"
+      <SmartAceEditor
+        v-if="requestType"
+        :value="requestCode"
+        :lang="codegens.find((x) => x.id === requestType).language"
+        :options="{
+          maxLines: '10',
+          minLines: '10',
+          fontSize: '16px',
+          autoScrollEditorIntoView: true,
+          readOnly: true,
+          showPrintMargin: false,
+          useWorker: false,
+        }"
+        styles="rounded-b-lg"
         ref="generatedCode"
-        name="generatedCode"
-        rows="8"
-        v-model="requestCode"
-        readonly
-        class="rounded-b-lg"
-      ></textarea>
+      />
     </div>
   </SmartModal>
 </template>
@@ -66,7 +73,7 @@ export default {
   props: {
     show: Boolean,
     requestCode: String,
-    requestTypeProp: { type: String, default: "" },
+    requestTypeProp: { type: String, default: "curl" },
   },
   data() {
     return {
@@ -97,7 +104,8 @@ export default {
       this.$toast.success(this.$t("copied_to_clipboard"), {
         icon: "done",
       })
-      this.$refs.generatedCode.select()
+      this.$refs.generatedCode.editor.selectAll()
+      this.$refs.generatedCode.editor.focus()
       document.execCommand("copy")
       setTimeout(() => (this.$refs.copyRequestCode.innerHTML = this.copyButton), 1000)
     },