move download button to hero

Author: bagusnl

home/index.md

@@ -29,6 +29,16 @@ hero:
     - theme: alt
       text: Meet the Team
       link: /team
+    - theme: alt
+      text: Download Latest Release
+      link: /latest-release
+      attributes:
+        target: "_blank"
+    - theme: alt
+      text: Download Pre-Release
+      link: /pre-release
+      attributes:
+        target: "_blank"
 
 features:
   - title: Multi-region Support
@@ -40,12 +50,10 @@ features:
 ---
 <script setup>
   import './index.css'
-  import vtuberLogo from './scripts/index.logo.vue'
-  import GitHubReleases from './scripts/githubReleases.vue';
+  import vtuberLogo from './scripts/index.logo.vue';
 
   document.title = "Collapse Launcher - Advanced Game Launcher";
 </script>
-<GitHubReleases />
 
 
 &nbsp;

home/latest-release.md

@@ -0,0 +1,27 @@
+---
+title: Redirecting to Latest Release...
+layout: page
+---
+
+<script setup>
+const owner = "CollapseLauncher";
+const repo = "Collapse";
+
+const fetchLatestReleaseUrl = async () => {
+  try {
+    const response = await fetch(`https://api.github.com/repos/${owner}/${repo}/releases`);
+    const releases = await response.json();
+    const latestRelease = releases.find(release => !release.prerelease);
+    const latestReleaseUrl = latestRelease ? latestRelease.html_url : "#";
+    window.open(latestReleaseUrl, "_blank");
+    window.location.href = "/";
+  } catch (error) {
+    console.error("Error fetching latest release:", error);
+    window.location.href = "/";
+  }
+};
+
+fetchLatestReleaseUrl();
+</script>
+
+<p>Redirecting to the latest release page...</p>

home/pre-release.md

@@ -0,0 +1,27 @@
+---
+title: Redirecting to Pre-Release...
+layout: page
+---
+
+<script setup>
+const owner = "CollapseLauncher";
+const repo = "Collapse";
+
+const fetchPreReleaseUrl = async () => {
+  try {
+    const response = await fetch(`https://api.github.com/repos/${owner}/${repo}/releases`);
+    const releases = await response.json();
+    const preRelease = releases.find(release => release.prerelease);
+    const preReleaseUrl = preRelease ? preRelease.html_url : "#";
+    window.open(preReleaseUrl, "_blank");
+    window.location.href = "/";
+  } catch (error) {
+    console.error("Error fetching pre-release:", error);
+    window.location.href = "/";
+  }
+};
+
+fetchPreReleaseUrl();
+</script>
+
+<p>Redirecting to the preview release page...</p>

home/scripts/githubReleases.vue

@@ -1,31 +1,19 @@
 <template>
-    <div>
-      <a
-        v-if="latestRelease"
-        :href="latestRelease.url"
-        target="_blank"
-        class="button padded-button"
-      >
-        Download Latest ({{ latestRelease.tag }})
-      </a>
-      <a
-        v-if="latestPreRelease"
-        :href="latestPreRelease.url"
-        target="_blank"
-        class="button padded-button"
-      >
-      Download Pre-Release ({{ latestPreRelease.tag }})
-      </a>
-      <p v-if="!latestRelease && !latestPreRelease">Loading releases...</p>
+    <div v-if="ready">
+        <a :href="latestReleaseUrl" class="button padded-button" target="_blank">Download Latest Release</a>
+        <a :href="preReleaseUrl" class="button padded-button" target="_blank">Download Pre-Release</a>
     </div>
 </template>
 
 <script>
+import { nextTick } from 'vue';
+
 export default {
     data() {
         return {
-            latestRelease: null,
-            latestPreRelease: null,
+            latestReleaseUrl: "#",
+            preReleaseUrl: "#",
+            ready: false,
         };
     },
     async created() {
@@ -34,8 +22,13 @@ export default {
 
         const releases = await this.fetchGitHubReleases(owner, repo);
 
-        this.latestRelease = releases.latestRelease;
-        this.latestPreRelease = releases.latestPreRelease;
+        if (releases.latestRelease) {
+            this.latestReleaseUrl = releases.latestRelease.url;
+        }
+        if (releases.latestPreRelease) {
+            this.preReleaseUrl = releases.latestPreRelease.url;
+        }
+        this.ready = true;
     },
     methods: {
         async fetchGitHubReleases(owner, repo) {
@@ -81,4 +74,4 @@ export default {
     background-color: #5c73e7;
     color: #fff;
 }
-</style>
+</style>