fix: use correct routing for changelog.vue test page

Author: elibosley

web/pages/changelog.vue

@@ -1,43 +1,36 @@
 <script setup lang="ts">
-import { ref, onMounted } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useUpdateOsStore } from '~/store/updateOs';
 import { storeToRefs } from 'pinia';
 
-const changelog = ref('');
-const changelogPretty = ref('');
 const updateOsStore = useUpdateOsStore();
 const { changelogModalVisible } = storeToRefs(updateOsStore);
 const { t } = useI18n();
 
-onMounted(async () => {
-    const response = await fetch('https://releases.unraid.net/json');
+
+async function showChangelogModalFromReleasesEndpoint() {
+    const response = await fetch('https://releases.unraid.net/os?branch=stable&current_version=6.12.3');
     const data = await response.json();
-    console.debug('[changelog] data', data);
-    if (data.length > 0) {
-        changelog.value = data[0].changelog;
-        changelogPretty.value = data[0].changelog_pretty;
-    }
-});
+    updateOsStore.setReleaseForUpdate(data);
+}
 
-function showChangelogModal() {
+function showChangelogModalWithTestData() {
     updateOsStore.setReleaseForUpdate({
         version: '6.12.3',
         date: '2023-07-15',
-        changelog: changelog.value,
-        changelogPretty: changelogPretty.value,
+        changelog: 'https://raw.githubusercontent.com/unraid/docs/main/docs/unraid-os/release-notes/6.12.3.md',
+        changelogPretty: 'https://docs.unraid.net/go/release-notes/6.12.3',
         name: '6.12.3',
         isEligible: true,
         isNewer: true,  
         sha256: '1234567890'
     });
 }
-
 function showChangelogWithoutPretty() {
     updateOsStore.setReleaseForUpdate({
         version: '6.12.3',
         date: '2023-07-15',
-        changelog: changelog.value,
+        changelog: 'https://raw.githubusercontent.com/unraid/docs/main/docs/unraid-os/release-notes/6.12.3.md',
         changelogPretty: '',
         name: '6.12.3',
         isEligible: true,
@@ -65,12 +58,18 @@ function showChangelogBrokenParse() {
     <div class="container mx-auto p-6">
         <h1 class="text-2xl font-bold mb-6">Changelog</h1>
         <UpdateOsChangelogModal :t="t" :open="changelogModalVisible" />
-        <div class="mb-6 flex gap-4">
+        <div class="mb-6 flex flex-col gap-4 max-w-md">
             <button 
                 class="px-4 py-2 bg-blue-500 text-white rounded hover:bg-blue-600" 
-                @click="showChangelogModal"
+                @click="showChangelogModalFromReleasesEndpoint"
             >
-                Test Changelog Modal
+                Test Changelog Modal (from releases endpoint)
+            </button>
+            <button 
+                class="px-4 py-2 bg-red-500 text-white rounded hover:bg-red-600" 
+                @click="showChangelogModalWithTestData"
+            >
+                Test Changelog Modal (with test data)
             </button>
             <button 
                 class="px-4 py-2 bg-green-500 text-white rounded hover:bg-green-600" 
@@ -85,9 +84,5 @@ function showChangelogBrokenParse() {
                 Test Broken Parse Changelog
             </button>
         </div>
-        
-        <div class="prose max-w-none">
-            <div v-html="changelog"></div>
-        </div>
     </div>
 </template>