From c8185050f61261c6a85a59f6bb9d695e4baefd85 Mon Sep 17 00:00:00 2001
From: Liyas Thomas <liyascthomas@gmail.com>
Date: Sat, 16 Jan 2021 18:40:18 +0530
Subject: [PATCH] feat: GitHub buttons

---
 build.js                          | 56 ------------------------------
 components/collections/index.vue  |  2 +-
 components/environments/index.vue |  2 +-
 components/firebase/feeds.vue     |  2 +-
 components/layout/history.vue     |  2 +-
 components/layout/pw-footer.vue   | 57 +++++++------------------------
 components/layout/pw-header.vue   | 10 ++++++
 components/ui/tabs.vue            |  1 +
 package.json                      |  3 --
 9 files changed, 28 insertions(+), 107 deletions(-)
 delete mode 100644 build.js

diff --git a/build.js b/build.js
deleted file mode 100644
index 25b4acacd..000000000
--- a/build.js
+++ /dev/null
@@ -1,56 +0,0 @@
-const axios = require("axios")
-const fs = require("fs")
-const { spawnSync } = require("child_process")
-const runCommand = (command, args) => spawnSync(command, args).stdout.toString().replace(/\n/g, "")
-
-const FAIL_ON_ERROR = false
-const PW_BUILD_DATA_DIR = "./.hoppscotch"
-// const IS_DEV_MODE = process.argv.includes("--dev")
-
-try {
-  (async () => {
-    // Create the build data directory if it does not exist.
-    if (!fs.existsSync(PW_BUILD_DATA_DIR)) {
-      fs.mkdirSync(PW_BUILD_DATA_DIR)
-    }
-
-    let version = {}
-    // Get the current version name as the tag from Git.
-    version.name =
-      process.env.TRAVIS_TAG || runCommand("git", ["tag --sort=committerdate | tail -1"])
-
-    // FALLBACK: If version.name was unset, let's grab it from GitHub.
-    if (!version.name) {
-      version.name = (
-        await axios
-          .get("https://api.github.com/repos/hoppscotch/hoppscotch/releases")
-          // If we can't get it from GitHub, we'll resort to getting it from package.json
-          .catch((ex) => ({
-            data: [
-              {
-                tag_name: require("./package.json").version,
-              },
-            ],
-          }))
-      ).data[0]["tag_name"]
-    }
-
-    // Get the current version hash as the short hash from Git.
-    // version.hash = runCommand("git", ["rev-parse", "--short", "HEAD"])
-    // Get the 'variant' name as the branch, if it's not master.
-    // version.variant =
-    //   process.env.TRAVIS_BRANCH ||
-    //   runCommand("git", ["branch"])
-    //     .split("* ")[1]
-    //     .split(" ")[0] + (IS_DEV_MODE ? " - DEV MODE" : "")
-    // if (["", "master"].includes(version.variant)) {
-    //   delete version.variant
-    // }
-
-    // Write version data into a file
-    fs.writeFileSync(`${PW_BUILD_DATA_DIR}/version.json`, JSON.stringify(version))
-  })()
-} catch (ex) {
-  console.error(ex)
-  process.exit(FAIL_ON_ERROR ? 1 : 0)
-}
diff --git a/components/collections/index.vue b/components/collections/index.vue
index 032534bbc..d309c55b0 100644
--- a/components/collections/index.vue
+++ b/components/collections/index.vue
@@ -81,7 +81,7 @@
 
 <style scoped lang="scss">
 .virtual-list {
-  max-height: calc(100vh - 232px);
+  max-height: calc(100vh - 270px);
 }
 </style>
 
diff --git a/components/environments/index.vue b/components/environments/index.vue
index 5c2dc30a5..d67522b3d 100644
--- a/components/environments/index.vue
+++ b/components/environments/index.vue
@@ -60,7 +60,7 @@
 
 <style scoped lang="scss">
 .virtual-list {
-  max-height: calc(100vh - 232px);
+  max-height: calc(100vh - 270px);
 }
 </style>
 
diff --git a/components/firebase/feeds.vue b/components/firebase/feeds.vue
index 6d90f2e9e..e3acbe84c 100644
--- a/components/firebase/feeds.vue
+++ b/components/firebase/feeds.vue
@@ -30,7 +30,7 @@
 
 <style scoped lang="scss">
 .virtual-list {
-  max-height: calc(100vh - 296px);
+  max-height: calc(100vh - 270px);
 }
 
 .clamb-3 {
diff --git a/components/layout/history.vue b/components/layout/history.vue
index cb8b84684..a4c05dd8e 100644
--- a/components/layout/history.vue
+++ b/components/layout/history.vue
@@ -217,7 +217,7 @@
 
 <style scoped lang="scss">
 .virtual-list {
-  max-height: calc(100vh - 290px);
+  max-height: calc(100vh - 270px);
 
   [readonly] {
     cursor: default;
diff --git a/components/layout/pw-footer.vue b/components/layout/pw-footer.vue
index e38e718b4..b90eee993 100644
--- a/components/layout/pw-footer.vue
+++ b/components/layout/pw-footer.vue
@@ -1,20 +1,7 @@
 <template>
-  <footer class="flex-col flex-no-wrap">
+  <footer class="footer">
     <div class="row-wrapper">
-      <span
-        v-if="version.name"
-        class="flex flex-col flex-wrap justify-start font-mono md:flex-row"
-        style="align-items: start"
-      >
-        <a
-          class="footer-link"
-          :href="'https://github.com/hoppscotch/hoppscotch/releases/tag/' + version.name"
-          target="_blank"
-          rel="noopener"
-          v-tooltip="'GitHub'"
-        >
-          {{ version.name }}
-        </a>
+      <span class="flex flex-col font-mono md:flex-row" style="align-items: start">
         <a class="footer-link" href="https://www.netlify.com" target="_blank" rel="noopener">
           Powered by Netlify
         </a>
@@ -38,23 +25,18 @@
             Paw
           </a>
         </span>
-        <!-- <span v-if="version.hash">
-          -
-          <a
-            :href="'https://github.com/hoppscotch/hoppscotch/commit/' + version.hash"
-            target="_blank"
-            rel="noopener"
-          >{{version.hash}}</a>
-        </span> -->
-        <!-- <span v-if="version.variant">({{version.variant}})</span> -->
+        <iframe
+          src="https://ghbtns.com/github-btn.html?user=hoppscotch&type=sponsor"
+          frameborder="0"
+          scrolling="0"
+          width="150"
+          height="20"
+          title="GitHub"
+          class="footer-link"
+          loading="lazy"
+        ></iframe>
       </span>
-      <span
-        class="flex flex-col flex-wrap justify-start font-mono md:flex-row"
-        style="align-items: start"
-      >
-        <a href="https://liyasthomas.web.app" target="_blank" rel="noopener">
-          <button class="icon" v-tooltip="'Liyas Thomas'">🦄</button>
-        </a>
+      <span class="flex flex-col font-mono md:flex-row" style="align-items: start">
         <a href="mailto:liyascthomas@gmail.com" target="_blank" rel="noopener">
           <button class="icon" v-tooltip="$t('contact_us')">
             <i class="material-icons">email</i>
@@ -94,20 +76,7 @@
 </style>
 
 <script>
-import * as version from "../../.hoppscotch/version.json"
-
 export default {
-  data() {
-    return {
-      version: {},
-    }
-  },
-
-  beforeMount() {
-    // Set version data
-    this.version = version.default
-  },
-
   computed: {
     availableLocales() {
       return this.$i18n.locales.filter(({ code }) => code !== this.$i18n.locale)
diff --git a/components/layout/pw-header.vue b/components/layout/pw-header.vue
index 371eb07d5..cf3f5eae1 100644
--- a/components/layout/pw-header.vue
+++ b/components/layout/pw-header.vue
@@ -6,6 +6,16 @@
           <h1 class="hide-on-small-screen logo">Hoppscotch</h1>
           <h1 class="show-on-small-screen logo">Hs</h1>
         </nuxt-link>
+        <iframe
+          src="https://ghbtns.com/github-btn.html?user=hoppscotch&repo=hoppscotch&type=star&count=true"
+          frameborder="0"
+          scrolling="0"
+          width="150"
+          height="20"
+          title="GitHub"
+          class="ml-8"
+          loading="lazy"
+        ></iframe>
       </span>
       <span>
         <a
diff --git a/components/ui/tabs.vue b/components/ui/tabs.vue
index e20f4f5c3..0964efad7 100644
--- a/components/ui/tabs.vue
+++ b/components/ui/tabs.vue
@@ -36,6 +36,7 @@
     @apply flex;
     @apply whitespace-no-wrap;
     @apply overflow-auto;
+    @apply mt-4;
 
     ul {
       @apply flex;
diff --git a/package.json b/package.json
index 2c15224b2..d15faca7d 100644
--- a/package.json
+++ b/package.json
@@ -5,12 +5,9 @@
   "author": "liyasthomas",
   "private": true,
   "scripts": {
-    "predev": "node build.js --dev",
     "dev": "nuxt",
-    "prebuild": "node build.js",
     "build": "nuxt build",
     "start": "nuxt start",
-    "pregenerate": "node build.js",
     "generate": "nuxt generate --modern",
     "pretty-quick": "pretty-quick --staged --pattern \"**/*.*(html|js|json|vue)\"",
     "test": "jest",