website: Add Logs page to website

website/src/layouts/default/AppBar.vue

@@ -3,9 +3,22 @@
     <v-app-bar-title>
       BlueOS Store Apps
     </v-app-bar-title>
+    <v-spacer></v-spacer>
+    <v-btn :to="buttonRoute">{{ buttonText }}</v-btn>
   </v-app-bar>
 </template>
 
 <script lang="ts" setup>
-  //
+import { computed } from 'vue'
+import { useRoute } from 'vue-router'
+
+const route = useRoute()
+
+const buttonText = computed(() => {
+  return route.path === '/logs' ? 'Home' : 'Logs'
+})
+
+const buttonRoute = computed(() => {
+  return route.path === '/logs' ? '/' : '/logs'
+})
 </script>

website/src/router/index.ts

@@ -14,6 +14,11 @@ const routes = [
         // which is lazy-loaded when the route is visited.
         component: () => import(/* webpackChunkName: "home" */ '@/views/Home.vue'),
       },
+      {
+        path: 'logs',
+        name: 'Logs',
+        component: () => import(/* webpackChunkName: "logs" */ '@/views/Logs.vue'),
+      },
     ],
   },
 ]

website/src/views/Logs.vue

@@ -0,0 +1,35 @@
+<template>
+  <div>
+    <h1>Generation Logs</h1>
+    <JsonViewer
+      :value="data"
+      :expand-depth=5
+      copyable
+      sort
+    />
+  </div>
+</template>
+
+<script lang="ts" setup>
+import { onMounted, ref } from 'vue'
+// @ts-expect-error Lib does not have types
+import JsonViewer from 'vue-json-viewer'
+
+const data = ref({})
+
+onMounted(async () => {
+  try {
+    const response = await fetch("manifest.log")
+    data.value = await response.json()
+  } catch (e) {
+    console.error('Failed to load manifest.log', e)
+  }
+})
+</script>
+
+<style scoped>
+h1 {
+  text-align: center;
+  margin-bottom: 20px;
+}
+</style>