ヘルプでアップデートを確認できるようにする

src/components/UpdateInfo.vue

@@ -21,10 +21,44 @@ export default defineComponent({
     const infos = ref<UpdateInfo[]>();
     store.dispatch("GET_UPDATE_INFOS").then((obj) => (infos.value = obj));
 
+    const currentVersion = ref("");
+    window.electron.getAppInfos().then((obj) => {
+      currentVersion.value = obj.version;
+    });
+
+    const latestVersion = ref("");
+    fetch("https://api.github.com/repos/VOICEVOX/voicevox/releases")
+      .then((res) => res.json())
+      .then((obj) => {
+        obj.find((item: { prerelease: boolean }) => {
+          item.prerelease === false;
+        });
+        latestVersion.value = obj[0].tag_name;
+      });
+
     const html = computed(() => {
       if (!infos.value) return "";
 
       let html = "";
+
+      const isFetchingFinished = latestVersion.value.length > 0;
+      const isUpdateAvailable = currentVersion.value !== latestVersion.value;
+
+      if (isFetchingFinished && isUpdateAvailable) {
+        html += `<h3>アップデートがあります！</h3>`;
+        html += `<p>現在のバージョン：` + currentVersion.value + `</p>`;
+        html += `<p>最新のバージョン：` + latestVersion.value + `</p>`;
+        html += `<h4>最新版のダウンロードページ</h4>`;
+        html += `<a href="https://voicevox.hiroshiba.jp/" target="_blank">https://voicevox.hiroshiba.jp/</a>`;
+      } else if (isFetchingFinished) {
+        html += `<h3>お使いの VOICEBOX は最新です！</h3>`;
+      } else {
+        html += `<h3>アップデートを確認中です…</h3>`;
+      }
+
+      html += `<hr />`;
+      html += `<h3>アップデート履歴</h3>`;
+
       for (const info of infos.value) {
         const version: string = info.version;
         const descriptions: string[] = info.descriptions;