diff --git a/confiture-web-app/src/pages/FeedbackPage.vue b/confiture-web-app/src/pages/FeedbackPage.vue index 81c17864..35ec73ca 100644 --- a/confiture-web-app/src/pages/FeedbackPage.vue +++ b/confiture-web-app/src/pages/FeedbackPage.vue @@ -11,8 +11,12 @@ import PageMeta from "../components/PageMeta"; import DsfrField from "../components/ui/DsfrField.vue"; import { useNotifications } from "../composables/useNotifications"; import { usePreviousRoute } from "../composables/usePreviousRoute"; +import { paths } from "../types/confiture-api"; import { captureWithPayloads } from "../utils"; +export type CreateFeedbackRequestData = + paths["/feedback"]["post"]["requestBody"]["content"]["application/json"]; + const availableRadioAnswers = [ { label: "Oui", slug: "yes", emoji: emojiYes }, { label: "Moyen", slug: "medium", emoji: emojiMedium }, @@ -29,14 +33,14 @@ const availableJobs = [ "Autre" ]; -const easyToUse = ref(""); -const easyToUnderstand = ref(""); +const easyToUse = ref(); +const easyToUnderstand = ref(); const feedback = ref(""); const suggestions = ref(""); const contact = ref(); const name = ref(""); const email = ref(""); -const occupations = ref([]); +const occupations = ref([]); const showSuccess = ref(false); @@ -46,18 +50,23 @@ const notify = useNotifications(); * Submit form and display success notice */ function submitFeedback() { + const body: CreateFeedbackRequestData = { + easyToUse: easyToUse.value!, + easyToUnderstand: easyToUnderstand.value!, + feedback: feedback.value, + suggestions: suggestions.value, + ...(contact.value === "yes" && { + email: email.value, + name: name.value, + occupations: + // FIXME: the @nestjs/swagger CLI plugin generating the API types doesnt seem to pick up on the each option + // see: https://github.com/nestjs/swagger/issues/2027 + occupations.value as unknown as CreateFeedbackRequestData["occupations"] + }) + }; + ky.post("/api/feedback", { - json: { - easyToUse: easyToUse.value, - easyToUnderstand: easyToUnderstand.value, - feedback: feedback.value, - suggestions: suggestions.value, - ...(contact.value === "yes" && { - email: email.value, - name: name.value, - occupations: occupations.value - }) - } + json: body }) .then(() => { showSuccess.value = true; @@ -130,6 +139,7 @@ const previousPageName = type="radio" name="easyToUse" :value="answer.label" + required />