fix(frontend): SSR of create.vue working, add .vscode launch.json, fix launch.json bug due to typescript in nuxt.config.ts

.gitignore

@@ -51,9 +51,6 @@ bin/
 !**/src/main/**/bin/
 !**/src/test/**/bin/
 
-### VS Code ###
-.vscode/
-
 ### Kotlin ###
 .kotlin
 

.vscode/launch.json

@@ -0,0 +1,28 @@
+{
+  // Use IntelliSense to learn about possible attributes.
+  // Hover to view descriptions of existing attributes.
+  "version": "0.2.0",
+  "configurations": [
+    {
+      "type": "chrome",
+      "request": "launch",
+      "name": "client: chrome",
+      "url": "http://localhost:3000",
+      "webRoot": "${workspaceFolder}/legalconsenthub"
+    },
+    {
+      "request": "launch",
+      "name": "server: nuxt",
+      "outputCapture": "std",
+      "cwd": "${workspaceFolder}/legalconsenthub",
+      "type": "node-terminal",
+      "command": "npm run dev"
+    }
+  ],
+  "compounds": [
+    {
+      "name": "fullstack: nuxt",
+      "configurations": ["server: nuxt", "client: chrome"]
+    }
+  ]
+}

.vscode/settings.json

@@ -0,0 +1,3 @@
+{
+  "java.compile.nullAnalysis.mode": "automatic"
+}

legalconsenthub/components/FormEngine.vue

@@ -1,5 +1,5 @@
 <template>
-  <div v-for="(formElement, index) in props.modelValue" :key="formElement.id">
+  <div v-for="formElement in props.modelValue" :key="formElement.id">
     <component
       :is="getResolvedComponent(formElement)"
       :form-options="formElement.options"

legalconsenthub/composables/useApplicationForm.ts

@@ -1,4 +1,9 @@
-import type { CreateApplicationFormDto, ApplicationFormDto, PagedApplicationFormDto } from '~/.api-client'
+import {
+  type CreateApplicationFormDto,
+  type ApplicationFormDto,
+  type PagedApplicationFormDto,
+  ResponseError
+} from '~/.api-client'
 
 const currentApplicationForm: Ref<ApplicationFormDto | undefined> = ref()
 
@@ -11,8 +16,12 @@ export function useApplicationForm() {
     try {
       currentApplicationForm.value = await applicationFormApi.createApplicationForm(createApplicationFormDto)
       return currentApplicationForm.value
-    } catch (e) {
-      console.error('Failed creating application form', e)
+    } catch (e: unknown) {
+      if (e instanceof ResponseError) {
+        console.error('Failed creating application form:', e.response)
+      } else {
+        console.error('Failed creating application form:', e)
+      }
       return Promise.reject(e)
     }
   }
@@ -20,8 +29,12 @@ export function useApplicationForm() {
   async function getAllApplicationForms(): Promise<PagedApplicationFormDto> {
     try {
       return await applicationFormApi.getAllApplicationForms()
-    } catch (e) {
-      console.error('Failed retrieving application forms', e)
+    } catch (e: unknown) {
+      if (e instanceof ResponseError) {
+        console.error('Failed retrieving application forms:', e.response)
+      } else {
+        console.error('Failed retrieving application forms:', e)
+      }
       return Promise.reject(e)
     }
   }
@@ -29,8 +42,12 @@ export function useApplicationForm() {
   async function getApplicationFormById(id: string): Promise<ApplicationFormDto> {
     try {
       return await applicationFormApi.getApplicationFormById(id)
-    } catch (e) {
-      console.error(`Failed retrieving application form with ID ${id}`, e)
+    } catch (e: unknown) {
+      if (e instanceof ResponseError) {
+        console.error(`Failed retrieving application form with ID ${id}:`, e.response)
+      } else {
+        console.error(`Failed retrieving application form with ID ${id}:`, e)
+      }
       return Promise.reject(e)
     }
   }
@@ -42,8 +59,12 @@ export function useApplicationForm() {
     try {
       currentApplicationForm.value = await applicationFormApi.updateApplicationForm(id, applicationFormDto)
       return currentApplicationForm.value
-    } catch (e) {
-      console.error(`Failed deleting application form with ID ${id}`, e)
+    } catch (e: unknown) {
+      if (e instanceof ResponseError) {
+        console.error(`Failed updating application form with ID ${id}:`, e.response)
+      } else {
+        console.error(`Failed updating application form with ID ${id}:`, e)
+      }
       return Promise.reject(e)
     }
   }
@@ -51,8 +72,12 @@ export function useApplicationForm() {
   async function deleteApplicationFormById(id: string): Promise<void> {
     try {
       return await applicationFormApi.deleteApplicationFormById(id)
-    } catch (e) {
-      console.error(`Failed deleting application form with ID ${id}`, e)
+    } catch (e: unknown) {
+      if (e instanceof ResponseError) {
+        console.error(`Failed deleting application form with ID ${id}:`, e.response)
+      } else {
+        console.error(`Failed deleting application form with ID ${id}:`, e)
+      }
       return Promise.reject(e)
     }
   }

legalconsenthub/composables/useApplicationFormApi.ts

@@ -1,13 +1,13 @@
 import { ApplicationFormApi, Configuration } from '../.api-client'
 import type { CreateApplicationFormDto, ApplicationFormDto, PagedApplicationFormDto } from '~/.api-client'
-import { cleanDoubleSlashes } from 'ufo'
+import { cleanDoubleSlashes, withoutTrailingSlash } from 'ufo'
 
 export function useApplicationFormApi() {
   const appBaseUrl = useRuntimeConfig().app.baseURL
   const { serverApiBaseUrl, serverApiBasePath, clientProxyBasePath } = useRuntimeConfig().public
 
-  const basePath = cleanDoubleSlashes(
-    import.meta.client ? appBaseUrl + clientProxyBasePath : serverApiBaseUrl + serverApiBasePath
+  const basePath = withoutTrailingSlash(
+    cleanDoubleSlashes(import.meta.client ? appBaseUrl + clientProxyBasePath : serverApiBaseUrl + serverApiBasePath)
   )
 
   const applicationFormApiClient = new ApplicationFormApi(new Configuration({ basePath }))

legalconsenthub/nuxt.config.ts

@@ -14,9 +14,9 @@ export default defineNuxtConfig({
       pathPrefix: false
     }
   ],
-  typescript: {
-    typeCheck: true
-  },
+  // typescript: {
+  //   typeCheck: true
+  // },
   devtools: { enabled: true },
   compatibilityDate: '2024-11-01'
 })