Fixes for retrieving user information

components/SwaggerUI.vue

@@ -22,8 +22,9 @@ onMounted(() => {
     showExtensions: true,
     showCommonExtensions: true,
     requestInterceptor: (req) => {
-      const paths = ['/jobs', '/processes', '/stac', '/raster'];
-      if (req.url.startsWith(serverUrl) && paths.some(path => req.url.includes('/ogc-api' + path))) {
+      const paths = ['/api', '/me', '/jobs', '/processes', '/stac', '/raster'];
+      // if (req.url.startsWith(serverUrl) && paths.some(path => req.url.includes('/ogc-api' + path))) {
+      if (paths.some(path => req.url.includes('/ogc-api' + path))) {
         if (config.public.ZOO_OGCAPI_REQUIRES_BEARER_TOKEN === 'true') {
           const token = authStore.token.access_token;
           if (token) {

components/layout/default/Footer.vue

@@ -1,18 +1,14 @@
 <template>
-  <q-footer bordered class="bg-white text-grey-9 q-py-xs q-px-sm">
+  <q-footer bordered class="bg-white text-grey-9 q-py-xs q-px-sm" itemscope itemtype="https://schema.org/SoftwareApplication">
     <div class="row justify-center q-gutter-lg">
       <div class="col-auto">
-        <NuxtLink to="/developer" style="text-decoration: none;">Developers</NuxtLink>
-      </div>
-      <div class="col-auto">
-        <NuxtLink to="/help" style="text-decoration: none;">Help</NuxtLink>
-      </div>
-      <div class="col-auto">
-        <NuxtLink to="/about" style="text-decoration: none;">About</NuxtLink>
+        <NuxtLink to="http://zoo-project.org/" itemprop="url" style="text-decoration: none;"><span itemprop="name">ZOO-Project</span></NuxtLink>
+        <meta itemprop="applicationCategory" content="WebService" />
       </div>
       <!-- /TODO: Add configurable and dynamic links to the footer -->
     </div>
   </q-footer>
+
 </template>
 <script setup lang="ts">
 </script>

components/layout/default/Header.vue

@@ -32,7 +32,7 @@
           <div v-if="!authStore.user">
             <q-btn v-if="isSmallScreen" class="q-px-sm" dense no-caps color="accent" round
                    icon="mdi-account-circle" href="/api/auth/signin"/>
-            <q-btn v-else-if="!isLoggedUser" class="q-px-md" no-caps color="accent" label="Acceder"
+            <q-btn v-else-if="!isLoggedUser" class="q-px-md" no-caps color="accent" label="Authenticate"
                    :href="'/api/auth/signin'"/>
           </div>
           <div v-else>
@@ -43,19 +43,11 @@
             </q-btn>
             <q-menu>
               <q-list dense>
-                <q-item clickable v-close-popup class="q-px-lg">
+                <q-item clickable v-close-popup 
+                  :href="`${config.public.NUXT_OIDC_ISSUER}/account/?referrer=${config.public.NUXT_OIDC_CLIENT_ID}&referrer_uri=${encodeURIComponent(config.public.NUXT_BASE_URL)}`" 
+                  class="q-px-lg" >
                   <q-item-section class="q-px-sm">Profile</q-item-section>
                 </q-item>
-                <q-item clickable v-close-popup>
-                  <q-item-section class="q-px-sm">Sample</q-item-section>
-                </q-item>
-                <q-item clickable v-close-popup>
-                  <q-item-section class="q-px-sm">Recent activity</q-item-section>
-                </q-item>
-                <q-separator/>
-                <q-item clickable v-close-popup to="/help">
-                  <q-item-section class="q-px-sm">Help</q-item-section>
-                </q-item>
                 <q-separator/>
                 <q-item clickable v-close-popup @click="showLogoutDialog">
                   <q-item-section class="q-px-sm">Logout</q-item-section>
@@ -70,18 +62,10 @@
     <div class="row">
       <div class="col-auto">
         <q-tabs dense align="left">
-          <q-route-tab no-caps to="/one" label="One page"/>
-          <q-route-tab no-caps to="/another" label="Another"/>
-        </q-tabs>
-      </div>
-      <q-space/>
-      <div class="col-auto">
-        <q-tabs dense align="left">
+          <q-route-tab no-caps to="/" label="Home"/>
           <q-route-tab v-if="authStore.user" no-caps to="/swagger" label="Swagger"/>
-          <q-route-tab v-if="authStore.user" no-caps to="/ogc-api" label="OGC API"/>
           <q-route-tab v-if="authStore.user" no-caps to="/processes" label="Processes"/>
           <q-route-tab v-if="authStore.user" no-caps to="/jobs" label="Jobs"/>
-          <q-route-tab no-caps to="/about" label="About"/>
         </q-tabs>
       </div>
     </div>
@@ -91,7 +75,7 @@
 <script setup lang="ts">
 const config = useRuntimeConfig()
 const showHeaderMenu = ref(false)
-const isLoggedUser = ref(false) // TODO: Implement user authentication and pinia storage of user data
+const isLoggedUser = ref(false) // TODO: Implement user authentication and pinia storage o
 const loggedUser = ref({email: 'mathereall@gmail.com'}) // TODO: Implement user authentication and pinia storage of user data
 
 const authStore = useAuthStore()
@@ -139,8 +123,9 @@ const handleLogout = async () => {
       authStore.clearAuth()
 
       const body = new URLSearchParams({
+          'client_id': config.public.NUXT_OIDC_CLIENT_ID,
+          'post_logout_redirect_uri': config.public.AUTH_ORIGIN,
           'id_token_hint': token.id_token,
-          'redirect_uri': config.public.AUTH_ORIGIN,
         });
       console.log("logoutUrl: ", logoutUrl)
       console.log("body: ", body)
@@ -165,10 +150,13 @@ const handleLogout = async () => {
 }
 
 onMounted(() => {
-  if (!!isLoggedUser.value && loggedUser.value.email) {
-    gravatarUrl.value = `https://www.gravatar.com/avatar/${stringToMD5(loggedUser.value.email)}/`
+  console.log("onMounted Header")
+  console.log(loggedUser.value)
+  console.log()
+  console.log("/onMounted Header")
+  if(authStore.user && authStore.user.email) {
+    gravatarUrl.value = `https://www.gravatar.com/avatar/${stringToMD5(authStore.user.email)}/`
   }
-  console.log("process.env", process.env)
 })
 
 </script>

pages/index.vue

@@ -1,6 +1,6 @@
 <template>
   <q-page class="q-pa-md">
-    <p class="text-h4 q-mb-md">Home</p>
+    <!-- <p class="text-h4 q-mb-md">Home</p> -->
 
     <q-card v-if="apiInfo" class="q-pa-md q-mb-lg">
       <q-card-section>
@@ -86,24 +86,36 @@
 
 <script setup lang="ts">
 import { ref, onMounted } from 'vue'
+import {useRuntimeConfig} from '#imports'
 
+const authStore = useAuthStore()
 const landingLinks = ref<any[]>([])
 const apiInfo = ref<any>(null)
 const loading = ref(false)
 
-const landingUrl = 'http://192.168.1.6/ogc-api/'
-const apiSpecUrl = 'http://192.168.1.6/ogc-api/api'
+const config = useRuntimeConfig()
+const landingUrl = `${config.public.NUXT_ZOO_BASEURL}/ogc-api/`
+const apiSpecUrl = `${config.public.NUXT_ZOO_BASEURL}/ogc-api/api`
 
 const fetchLandingAndApiInfo = async () => {
   loading.value = true
   try {
-    const landingRes = await $fetch(landingUrl)
+    const landingRes = await $fetch(landingUrl, {
+      headers: {
+        Authorization: `Bearer ${authStore.token.access_token}`
+      }
+    })
     landingLinks.value = landingRes.links || []
 
     const apiRes = await $fetch(apiSpecUrl)
     apiInfo.value = apiRes.info || {}
   } catch (err) {
     console.error('Error loading homepage data:', err)
+    const landingRes = await $fetch(landingUrl)
+    landingLinks.value = landingRes.links || []
+
+    const apiRes = await $fetch(apiSpecUrl)
+    apiInfo.value = apiRes.info || {}
   } finally {
     loading.value = false
   }

pages/jobs/[jobId].vue

@@ -15,6 +15,8 @@
             <q-separator class="q-my-md" />
 
             <div><strong>Process ID:</strong> {{ jobData.processID }}</div>
+            <div><strong>Progress:</strong> {{ jobData.progress }}</div>
+            <div><strong>Message:</strong> {{ jobData.message }}</div>
             <div><strong>Status:</strong> {{ jobData.status }}</div>
             <div><strong>Created:</strong> {{ jobData.created }}</div>