antares/src/renderer/components/ModalSettingsChangelog.vue

92 lines
2.1 KiB
Vue
Raw Normal View History

2021-04-11 12:35:16 +02:00
<template>
<div class="p-relative">
<BaseLoader v-if="isLoading" />
<div
id="changelog"
class="container"
v-html="changelog"
/>
<div v-if="isError" class="empty">
<div class="empty-icon">
<i class="mdi mdi-48px mdi-alert-outline" />
</div>
</div>
</div>
</template>
<script setup lang="ts">
import { shell } from 'electron';
import { marked } from 'marked';
import { ref } from 'vue';
import BaseLoader from '@/components/BaseLoader.vue';
2022-04-27 18:23:48 +02:00
import { useApplicationStore } from '@/stores/application';
2021-04-11 12:35:16 +02:00
const { appVersion } = useApplicationStore();
2021-04-11 12:35:16 +02:00
const changelog = ref('');
const isLoading = ref(true);
const error = ref('');
const isError = ref(false);
2023-08-08 18:05:27 +02:00
const openOutside = (link: string) => {
shell.openExternal(link);
};
const getChangelog = async () => {
try {
const apiRes = await fetch(`https://api.github.com/repos/antares-sql/antares/releases/tags/v${appVersion}`, {
method: 'GET'
});
2021-04-11 12:35:16 +02:00
const { body } = await apiRes.json();
const cutOffset = body.indexOf('### Download');
const markdown = cutOffset >= 0
? body.substr(0, cutOffset)
: body;
2021-04-11 12:35:16 +02:00
const renderer = {
link (href: string, title: string, text: string) {
2023-08-08 18:05:27 +02:00
return `<a class="changelog-link" href="${href}" title="${title || ''}" target="_blank">${text}</a>`;
},
listitem (text: string) {
return `<li>${text.replace(/ *\([^)]*\) */g, '')}</li>`;
2021-04-11 12:35:16 +02:00
}
};
marked.use({ renderer });
changelog.value = marked(markdown);
}
catch (err) {
error.value = err.message;
isError.value = true;
2021-04-11 12:35:16 +02:00
}
isLoading.value = false;
2023-08-08 18:05:27 +02:00
setTimeout(() => {
const links = document.querySelectorAll<HTMLAnchorElement>('.changelog-link');
for (const link of links) {
link.addEventListener('click', e => {
e.preventDefault();
openOutside(link.href);
});
}
}, 0);
2021-04-11 12:35:16 +02:00
};
getChangelog();
2021-04-11 12:35:16 +02:00
</script>
<style lang="scss">
#changelog {
h3 {
font-size: 1rem;
}
li {
margin-top: 0;
}
}
</style>