refactor: get latest release

components/DownloadBtn.vue

@@ -1,60 +1,52 @@
 <template>
   <a
-    v-if="releaseContent && releaseContent.downloadName"
+    v-if="release && release.downloadName"
     class="link"
-    :href="releaseContent.releaseUrl"
+    :href="release.releaseUrl"
     target="_blank"
-    :download="releaseContent.downloadName"
+    :download="release.downloadName"
   >
     <button class="btn">
       <i18n-t keypath="downloadLink" tag="span">
         <template #platform>
-          <span>{{ releaseContent.platform }}</span>
+          <span>{{ release.platform }}</span>
         </template>
       </i18n-t>
     </button>
   </a>
   <a
     v-else
     class="link"
-    :href="releaseContent ? releaseContent.releaseUrl : GITHUB_RELEASE_URL"
+    :href="release ? release.releaseUrl : GITHUB_RELEASE_URL"
   >
     <button class="btn">
-      <i18n-t v-if="releaseContent" keypath="downloadLink" tag="span">
+      <i18n-t v-if="release" keypath="downloadLink" tag="span">
         <template #platform>
-          <span>{{ releaseContent?.platform }}</span>
+          <span>{{ release?.platform }}</span>
         </template>
       </i18n-t>
       <span v-else>{{ t('githubLink') }}</span>
     </button>
   </a>
 </template>
 
-<script setup>
-import { getLatestRelease, getStoreRelease } from '@/getLatestRelease'
+<script setup lang="ts">
+import { getLatestRelease, getStoreRelease, type LatestReleaseResponse } from '@/getLatestRelease'
 import { getBrowserOs } from '@/getBrowserOs'
 import { useI18n } from 'vue-i18n'
-import { GITHUB_RELEASE_URL } from '@/constants'
-import { onMounted, ref } from 'vue'
+import { GITHUB_RELEASE_URL, URL_RELEASE_BASE } from '@/constants'
+import { computed, type Ref } from 'vue'
 const { t } = useI18n()
 
-const releaseContent = ref(null)
+const { data }: { data: Ref<LatestReleaseResponse | undefined> } =
+  await useFetch(URL_RELEASE_BASE)
 
-onMounted(async () => {
-  releaseContent.value = await release()
-})
+const os = computed(() => getBrowserOs(navigator))
+
+const storeRelease = computed(() => os.value ? getStoreRelease({ os: os.value }) : null)
+const downloadRelease = computed(() => os.value ? getLatestRelease({ os: os.value, data: data.value }) : null)
+const release = computed(() => storeRelease.value ?? downloadRelease.value)
 
-async function release() {
-  const os = getBrowserOs(navigator)
-  const storeRelease = getStoreRelease({ os })
-  if (!os) {
-    return null
-  }
-  if (storeRelease) {
-    return storeRelease
-  }
-  return await getLatestRelease({ os })
-}
 </script>
 
 <style lang="scss">

getLatestRelease.ts

@@ -1,16 +1,16 @@
-import { GITHUB_RELEASE_URL, URL_RELEASE_BASE } from './constants'
+import { GITHUB_RELEASE_URL } from './constants'
 
-type Release = {
+export type Release = {
   platform: string
   releaseUrl: string
   downloadName: string | null
 }
 
-type LatestReleaseResponse = {
-  assets: []
+export type LatestReleaseResponse = {
+  assets: Array<ReleaseAsset>
 }
 
-type ReleaseAsset = {
+export type ReleaseAsset = {
   browser_download_url: string
   name: string | null
 }
@@ -41,21 +41,20 @@ export function getStoreRelease({ os }: { os: string }): Release | undefined {
   }
 }
 
-const { data }: { data: Ref<LatestReleaseResponse | undefined> } =
-  await useAsyncData('release', () => $fetch(URL_RELEASE_BASE))
-
-export async function getLatestRelease({
+export function getLatestRelease({
   os,
+  data,
 }: {
   os: string
-}): Promise<Release | null> {
-  if (data.value) {
-    const macRelease: ReleaseAsset = data.value.assets.find(
+  data: LatestReleaseResponse | undefined
+}): Release | null {
+  if (data) {
+    const macRelease: ReleaseAsset = data.assets.find(
       (asset: ReleaseAsset) => {
         return asset.browser_download_url.includes('myWitWallet.dmg')
       },
     ) ?? { browser_download_url: GITHUB_RELEASE_URL, name: null }
-    const linuxRelease: ReleaseAsset = data.value.assets.find(
+    const linuxRelease: ReleaseAsset = data.assets.find(
       (asset: ReleaseAsset) =>
         asset.browser_download_url.includes('linux.tar.gz'),
     ) ?? { browser_download_url: GITHUB_RELEASE_URL, name: null }