From 12ba5da7bedaa1dc164b8e3a138df54cdac3f759 Mon Sep 17 00:00:00 2001 From: Denis Lugowski Date: Mon, 24 Feb 2025 08:29:44 +0100 Subject: [PATCH] feat(frontend,API): Add PUT operations, integrate API, add first from engine --- .../api/legalconsenthub.yml | 133 ++++++++---------- legalconsenthub/api/legalconsenthub-client.ts | 3 - legalconsenthub/components/FormEngine.vue | 28 ++++ .../components/formelements/TheInput.vue | 14 ++ .../components/formelements/Unimplemented.vue | 3 + .../composables/useApplicationForm.ts | 67 +++++++++ .../composables/useApplicationFormApi.ts | 47 +++++++ legalconsenthub/index.d.ts | 10 ++ legalconsenthub/layouts/default.vue | 124 +--------------- legalconsenthub/nuxt.config.ts | 13 ++ legalconsenthub/pages/create.vue | 46 ++++++ legalconsenthub/pages/index.vue | 36 +---- legalconsenthub/server/api/[...].ts | 14 ++ legalconsenthub/server/api/auth/[...].ts | 2 +- legalconsenthub/tsconfig.json | 3 +- 15 files changed, 312 insertions(+), 231 deletions(-) delete mode 100644 legalconsenthub/api/legalconsenthub-client.ts create mode 100644 legalconsenthub/components/FormEngine.vue create mode 100644 legalconsenthub/components/formelements/TheInput.vue create mode 100644 legalconsenthub/components/formelements/Unimplemented.vue create mode 100644 legalconsenthub/composables/useApplicationForm.ts create mode 100644 legalconsenthub/composables/useApplicationFormApi.ts create mode 100644 legalconsenthub/index.d.ts create mode 100644 legalconsenthub/pages/create.vue create mode 100644 legalconsenthub/server/api/[...].ts diff --git a/legalconsenthub-backend/api/legalconsenthub.yml b/legalconsenthub-backend/api/legalconsenthub.yml index 5569ad0..a8d048a 100644 --- a/legalconsenthub-backend/api/legalconsenthub.yml +++ b/legalconsenthub-backend/api/legalconsenthub.yml @@ -8,7 +8,7 @@ info: email: denis.lugowski@gmail.com servers: - - url: /api/v3 + - url: / paths: /application-forms: @@ -54,18 +54,18 @@ paths: $ref: "https://api.swaggerhub.com/domains/smartbear-public/ProblemDetails/1.0.0#/components/responses/ServiceUnavailable" /application-forms/{id}: + parameters: + - name: id + in: path + required: true + schema: + type: string + format: uuid get: summary: Get a specific ApplicationForm operationId: getApplicationFormById tags: - application-form - parameters: - - name: id - in: path - required: true - schema: - type: string - format: uuid responses: "200": description: Get application form by ID @@ -81,18 +81,37 @@ paths: $ref: "https://api.swaggerhub.com/domains/smartbear-public/ProblemDetails/1.0.0#/components/responses/ServerError" "503": $ref: "https://api.swaggerhub.com/domains/smartbear-public/ProblemDetails/1.0.0#/components/responses/ServiceUnavailable" + put: + summary: Updates a ApplicationForm + operationId: updateApplicationForm + tags: + - application-form + requestBody: + required: true + content: + application/json: + schema: + $ref: "#/components/schemas/ApplicationFormDto" + responses: + "200": + description: Successfully updated application form + content: + application/json: + schema: + $ref: "#/components/schemas/ApplicationFormDto" + "400": + $ref: "https://api.swaggerhub.com/domains/smartbear-public/ProblemDetails/1.0.0#/components/responses/BadRequest" + "401": + $ref: "https://api.swaggerhub.com/domains/smartbear-public/ProblemDetails/1.0.0#/components/responses/Unauthorized" + "500": + $ref: "https://api.swaggerhub.com/domains/smartbear-public/ProblemDetails/1.0.0#/components/responses/ServerError" + "503": + $ref: "https://api.swaggerhub.com/domains/smartbear-public/ProblemDetails/1.0.0#/components/responses/ServiceUnavailable" delete: summary: Delete a ApplicationForm operationId: deleteApplicationForm tags: - application-form - parameters: - - name: id - in: path - required: true - schema: - type: string - format: uuid responses: "204": description: Application Form successfully deleted @@ -148,18 +167,18 @@ paths: $ref: "https://api.swaggerhub.com/domains/smartbear-public/ProblemDetails/1.0.0#/components/responses/ServiceUnavailable" /users/{id}: + parameters: + - name: id + in: path + required: true + schema: + type: string + format: uuid get: summary: Get a specific user operationId: getUserById tags: - user - parameters: - - name: id - in: path - required: true - schema: - type: string - format: uuid responses: "200": description: Get user by ID @@ -180,13 +199,6 @@ paths: operationId: deleteUser tags: - user - parameters: - - name: id - in: path - required: true - schema: - type: string - format: uuid responses: "204": description: User successfully deleted @@ -248,18 +260,18 @@ paths: $ref: "https://api.swaggerhub.com/domains/smartbear-public/ProblemDetails/1.0.0#/components/responses/ServiceUnavailable" /comments/{id}: + parameters: + - name: id + in: path + required: true + schema: + type: string + format: uuid get: summary: Get a specific comment operationId: getCommentById tags: - comment - parameters: - - name: id - in: path - required: true - schema: - type: string - format: uuid responses: "200": description: Get comment by ID @@ -280,13 +292,6 @@ paths: operationId: deleteComment tags: - comment - parameters: - - name: id - in: path - required: true - schema: - type: string - format: uuid responses: "204": description: Comment successfully deleted @@ -350,18 +355,18 @@ paths: $ref: "https://api.swaggerhub.com/domains/smartbear-public/ProblemDetails/1.0.0#/components/responses/ServiceUnavailable" /roles/{id}: + parameters: + - name: id + in: path + required: true + schema: + type: string + format: uuid get: summary: Get a specific role operationId: getRoleById tags: - role - parameters: - - name: id - in: path - required: true - schema: - type: string - format: uuid responses: "200": description: Get role by ID @@ -382,13 +387,6 @@ paths: operationId: deleteRole tags: - role - parameters: - - name: id - in: path - required: true - schema: - type: string - format: uuid responses: "204": description: Role successfully deleted @@ -436,18 +434,18 @@ paths: $ref: "https://api.swaggerhub.com/domains/smartbear-public/ProblemDetails/1.0.0#/components/responses/ServiceUnavailable" /files/{id}: + parameters: + - name: id + in: path + required: true + schema: + type: string + format: uuid get: summary: Get a specific file operationId: getFileById tags: - file - parameters: - - name: id - in: path - required: true - schema: - type: string - format: uuid responses: "200": description: Get file by ID @@ -468,13 +466,6 @@ paths: operationId: deleteFile tags: - file - parameters: - - name: id - in: path - required: true - schema: - type: string - format: uuid responses: "204": description: File successfully deleted diff --git a/legalconsenthub/api/legalconsenthub-client.ts b/legalconsenthub/api/legalconsenthub-client.ts deleted file mode 100644 index 5c8ad37..0000000 --- a/legalconsenthub/api/legalconsenthub-client.ts +++ /dev/null @@ -1,3 +0,0 @@ -import { ApplicationFormApi } from '../.api-client' - -export const applicationFormApiClient = new ApplicationFormApi() diff --git a/legalconsenthub/components/FormEngine.vue b/legalconsenthub/components/FormEngine.vue new file mode 100644 index 0000000..e4d46e5 --- /dev/null +++ b/legalconsenthub/components/FormEngine.vue @@ -0,0 +1,28 @@ + + + diff --git a/legalconsenthub/components/formelements/TheInput.vue b/legalconsenthub/components/formelements/TheInput.vue new file mode 100644 index 0000000..132db2f --- /dev/null +++ b/legalconsenthub/components/formelements/TheInput.vue @@ -0,0 +1,14 @@ + + + diff --git a/legalconsenthub/components/formelements/Unimplemented.vue b/legalconsenthub/components/formelements/Unimplemented.vue new file mode 100644 index 0000000..24629db --- /dev/null +++ b/legalconsenthub/components/formelements/Unimplemented.vue @@ -0,0 +1,3 @@ + diff --git a/legalconsenthub/composables/useApplicationForm.ts b/legalconsenthub/composables/useApplicationForm.ts new file mode 100644 index 0000000..dc8bfb3 --- /dev/null +++ b/legalconsenthub/composables/useApplicationForm.ts @@ -0,0 +1,67 @@ +import type { CreateApplicationFormDto, ApplicationFormDto, PagedApplicationFormDto } from '~/.api-client' + +const currentApplicationForm: Ref = ref() + +export function useApplicationForm() { + const applicationFormApi = useApplicationFormApi() + + async function createApplicationForm( + createApplicationFormDto: CreateApplicationFormDto + ): Promise { + try { + currentApplicationForm.value = await applicationFormApi.createApplicationForm(createApplicationFormDto) + return currentApplicationForm.value + } catch (e) { + console.error('Failed creating application form', e) + return Promise.reject(e) + } + } + + async function getAllApplicationForms(): Promise { + try { + return await applicationFormApi.getAllApplicationForms() + } catch (e) { + console.error('Failed retrieving application forms', e) + return Promise.reject(e) + } + } + + async function getApplicationFormById(id: string): Promise { + try { + return await applicationFormApi.getApplicationFormById(id) + } catch (e) { + console.error(`Failed retrieving application form with ID ${id}`, e) + return Promise.reject(e) + } + } + + async function updateApplicationForm( + id: string, + applicationFormDto: ApplicationFormDto + ): Promise { + try { + currentApplicationForm.value = await applicationFormApi.updateApplicationForm(id, applicationFormDto) + return currentApplicationForm.value + } catch (e) { + console.error(`Failed deleting application form with ID ${id}`, e) + return Promise.reject(e) + } + } + + async function deleteApplicationFormById(id: string): Promise { + try { + return await applicationFormApi.deleteApplicationFormById(id) + } catch (e) { + console.error(`Failed deleting application form with ID ${id}`, e) + return Promise.reject(e) + } + } + + return { + createApplicationForm, + getAllApplicationForms, + getApplicationFormById, + updateApplicationForm, + deleteApplicationFormById + } +} diff --git a/legalconsenthub/composables/useApplicationFormApi.ts b/legalconsenthub/composables/useApplicationFormApi.ts new file mode 100644 index 0000000..d8953db --- /dev/null +++ b/legalconsenthub/composables/useApplicationFormApi.ts @@ -0,0 +1,47 @@ +import { ApplicationFormApi, Configuration } from '../.api-client' +import type { CreateApplicationFormDto, ApplicationFormDto, PagedApplicationFormDto } from '~/.api-client' +import { cleanDoubleSlashes } 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 applicationFormApiClient = new ApplicationFormApi(new Configuration({ basePath })) + + async function createApplicationForm( + createApplicationFormDto: CreateApplicationFormDto + ): Promise { + return applicationFormApiClient.createApplicationForm({ createApplicationFormDto }) + } + + async function getAllApplicationForms(): Promise { + return applicationFormApiClient.getAllApplicationForms() + } + + async function getApplicationFormById(id: string): Promise { + return applicationFormApiClient.getApplicationFormById({ id }) + } + + async function updateApplicationForm( + id: string, + applicationFormDto: ApplicationFormDto + ): Promise { + return applicationFormApiClient.updateApplicationForm({ id, applicationFormDto }) + } + + async function deleteApplicationFormById(id: string): Promise { + return applicationFormApiClient.deleteApplicationForm({ id }) + } + + return { + createApplicationForm, + getAllApplicationForms, + getApplicationFormById, + updateApplicationForm, + deleteApplicationFormById + } +} diff --git a/legalconsenthub/index.d.ts b/legalconsenthub/index.d.ts new file mode 100644 index 0000000..9406c68 --- /dev/null +++ b/legalconsenthub/index.d.ts @@ -0,0 +1,10 @@ +declare module 'nuxt/schema' { + interface PublicRuntimeConfig { + clientProxyBasePath: string + serverApiBaseUrl: string + serverApiBasePath: string + } +} + +// It is always important to ensure you import/export something when augmenting a type +export {} diff --git a/legalconsenthub/layouts/default.vue b/legalconsenthub/layouts/default.vue index 3ba7721..ea0c728 100644 --- a/legalconsenthub/layouts/default.vue +++ b/legalconsenthub/layouts/default.vue @@ -1,6 +1,6 @@ diff --git a/legalconsenthub/nuxt.config.ts b/legalconsenthub/nuxt.config.ts index 7388aed..7963783 100644 --- a/legalconsenthub/nuxt.config.ts +++ b/legalconsenthub/nuxt.config.ts @@ -1,6 +1,19 @@ export default defineNuxtConfig({ modules: ['@nuxt/ui-pro', '@nuxt/eslint'], css: ['~/assets/css/main.css'], + runtimeConfig: { + public: { + clientProxyBasePath: 'NOT_SET', + serverApiBaseUrl: 'NOT_SET', + serverApiBasePath: 'NOT_SET' + } + }, + components: [ + { + path: '~/components', + pathPrefix: false + } + ], typescript: { typeCheck: true }, diff --git a/legalconsenthub/pages/create.vue b/legalconsenthub/pages/create.vue new file mode 100644 index 0000000..cab957f --- /dev/null +++ b/legalconsenthub/pages/create.vue @@ -0,0 +1,46 @@ + - + @@ -39,35 +32,10 @@ - - - - diff --git a/legalconsenthub/server/api/[...].ts b/legalconsenthub/server/api/[...].ts new file mode 100644 index 0000000..46cc92d --- /dev/null +++ b/legalconsenthub/server/api/[...].ts @@ -0,0 +1,14 @@ +import type { H3Event } from 'h3' +import { joinURL } from 'ufo' + +export default defineEventHandler((event: H3Event) => { + const { serverApiBaseUrl, clientProxyBasePath } = useRuntimeConfig().public + const escapedClientProxyBasePath = clientProxyBasePath.replace(/^\//, '\\/') + // Use the escaped value in the regex + const path = event.path.replace(new RegExp(`^${escapedClientProxyBasePath}`), '') + const target = joinURL(serverApiBaseUrl, path) + + console.log('🔀 proxying request to', target) + + return proxyRequest(event, target) +}) diff --git a/legalconsenthub/server/api/auth/[...].ts b/legalconsenthub/server/api/auth/[...].ts index fc9a0bb..cf256ed 100644 --- a/legalconsenthub/server/api/auth/[...].ts +++ b/legalconsenthub/server/api/auth/[...].ts @@ -1,5 +1,5 @@ import { auth } from '../../utils/auth' -import { H3Event } from 'h3' +import type { H3Event } from 'h3' export default defineEventHandler((event: H3Event) => { return auth.handler(toWebRequest(event)) diff --git a/legalconsenthub/tsconfig.json b/legalconsenthub/tsconfig.json index c1bbd0c..432ad50 100644 --- a/legalconsenthub/tsconfig.json +++ b/legalconsenthub/tsconfig.json @@ -5,6 +5,7 @@ // Prevents the following error with openapi generated code (came with nuxt 3.12): // ERROR(vue-tsc) This parameter property must have an 'override' modifier because it overrides a member in base class 'Error'. // FILE /Users/denislugowski/Projekte/legalconsenthub/legalconsenthub/.api-client/runtime.ts:276:5 - "noImplicitOverride": false + "noImplicitOverride": false, + "noErrorTruncation": true } }