fix: add feedback mutation to DupeForm and UseTemplate wizard

frontend/src/features/admin-form/template/UseTemplateModal/UseTemplateWizardProvider.tsx

@@ -1,6 +1,6 @@
 import { useEffect } from 'react'
 
-import { FormResponseMode } from '~shared/types'
+import { FormResponseMode, PublicFormViewDto } from '~shared/types'
 
 import { useFormTemplate } from '~features/admin-form/common/queries'
 import {
@@ -9,6 +9,7 @@ import {
   CreateFormWizardContextReturn,
 } from '~features/workspace/components/CreateFormModal/CreateFormWizardContext'
 import { useCommonFormWizardProvider } from '~features/workspace/components/CreateFormModal/CreateFormWizardProvider'
+import { useEmailModeFeedbackMutation } from '~features/workspace/mutations'
 
 import { useUseTemplateMutations } from '../mutation'
 
@@ -41,14 +42,16 @@ export const useUseTemplateWizardContext = (
     })
   }, [reset, getValues, isTemplateFormLoading, templateFormData?.form.title])
 
-  const { handleSubmit } = formMethods
+  const { handleSubmit, setValue } = formMethods
 
   const {
     useEmailModeFormTemplateMutation,
     useStorageModeFormTemplateMutation,
     useMultirespondentFormTemplateMutation,
   } = useUseTemplateMutations()
 
+  const { emailModeFeedbackMutation } = useEmailModeFeedbackMutation()
+
   const handleCreateStorageModeOrMultirespondentForm = handleSubmit(
     ({ title, responseMode }) => {
       if (!formId) return
@@ -81,6 +84,33 @@ export const useUseTemplateWizardContext = (
     },
   )
 
+  // TODO: (Kill Email Mode) Remove this route after kill email mode is fully implemented.
+  // Collect email mode usage feedback before creating the form
+  const handleEmailFeedbackSubmit = () => {
+    // explicit set response to email as email feedback "button" interaction
+    // is not handled handled in FormResponseOptions
+    setValue('responseMode', FormResponseMode.Email)
+    setCurrentStep([CreateFormFlowStates.EmailFeedback, 1])
+  }
+
+  // TODO: (Kill Email Mode) Remove this route after kill email mode is fully implemented.
+  const handleCreateEmailModeForm = (feedbackForm: PublicFormViewDto) =>
+    handleSubmit((inputs) => {
+      if (!inputs.reason) {
+        return new Error('Reason is required')
+      }
+      emailModeFeedbackMutation.mutate({
+        body: { reason: inputs.reason },
+        feedbackForm,
+      })
+      return useEmailModeFormTemplateMutation.mutate({
+        formIdToDuplicate: formId,
+        emails: inputs.emails.filter(Boolean),
+        title: inputs.title,
+        responseMode: FormResponseMode.Email,
+      })
+    })
+
   const handleDetailsSubmit = handleSubmit((inputs) => {
     if (!formId) return
     if (inputs.responseMode === FormResponseMode.Email) {
@@ -106,6 +136,8 @@ export const useUseTemplateWizardContext = (
     formMethods,
     handleDetailsSubmit,
     handleCreateStorageModeOrMultirespondentForm,
+    handleEmailFeedbackSubmit,
+    handleCreateEmailModeForm,
     isSingpass,
     modalHeader: 'Duplicate form',
   }

frontend/src/features/workspace/components/CreateFormModal/CreateFormWizardProvider.tsx

@@ -6,7 +6,10 @@ import { FormResponseMode, PublicFormViewDto } from '~shared/types'
 
 import formsgSdk from '~utils/formSdk'
 
-import { useCreateFormMutations } from '~features/workspace/mutations'
+import {
+  useCreateFormMutations,
+  useEmailModeFeedbackMutation,
+} from '~features/workspace/mutations'
 import { useWorkspaceContext } from '~features/workspace/WorkspaceContext'
 
 import {
@@ -64,9 +67,10 @@ const useCreateFormWizardContext = (): CreateFormWizardContextReturn => {
     createEmailModeFormMutation,
     createStorageModeFormMutation,
     createMultirespondentModeFormMutation,
-    emailModeFeedbackMutation,
   } = useCreateFormMutations()
 
+  const { emailModeFeedbackMutation } = useEmailModeFeedbackMutation()
+
   const { activeWorkspace, isDefaultWorkspace } = useWorkspaceContext()
 
   // do not mutate with workspaceId if it is 'All Forms' (default workspace)

frontend/src/features/workspace/components/DuplicateFormModal/DupeFormWizardProvider.tsx

@@ -1,9 +1,12 @@
 import { useEffect } from 'react'
 
-import { FormResponseMode } from '~shared/types'
+import { FormResponseMode, PublicFormViewDto } from '~shared/types'
 
 import { usePreviewForm } from '~features/admin-form/common/queries'
-import { useDuplicateFormMutations } from '~features/workspace/mutations'
+import {
+  useDuplicateFormMutations,
+  useEmailModeFeedbackMutation,
+} from '~features/workspace/mutations'
 import { useDashboard } from '~features/workspace/queries'
 import { makeDuplicateFormTitle } from '~features/workspace/utils/createDuplicateFormTitle'
 import { useWorkspaceContext } from '~features/workspace/WorkspaceContext'
@@ -57,14 +60,16 @@ export const useDupeFormWizardContext = (): CreateFormWizardContextReturn => {
     dashboardForms,
   ])
 
-  const { handleSubmit } = formMethods
+  const { handleSubmit, setValue } = formMethods
 
   const {
     dupeEmailModeFormMutation,
     dupeStorageModeFormMutation,
     dupeMultirespondentModeFormMutation,
   } = useDuplicateFormMutations()
 
+  const { emailModeFeedbackMutation } = useEmailModeFeedbackMutation()
+
   const { activeWorkspace, isDefaultWorkspace } = useWorkspaceContext()
 
   // do not mutate with workspaceId if it is 'All Forms' (default workspace)
@@ -105,17 +110,36 @@ export const useDupeFormWizardContext = (): CreateFormWizardContextReturn => {
     },
   )
 
-  const handleDetailsSubmit = handleSubmit((inputs) => {
-    if (!activeFormMeta?._id) return
-    if (inputs.responseMode === FormResponseMode.Email) {
+  // TODO: (Kill Email Mode) Remove this route after kill email mode is fully implemented.
+  // Collect email mode usage feedback before creating the form
+  const handleEmailFeedbackSubmit = () => {
+    // explicit set response to email as email feedback "button" interaction
+    // is not handled handled in FormResponseOptions
+    setValue('responseMode', FormResponseMode.Email)
+    setCurrentStep([CreateFormFlowStates.EmailFeedback, 1])
+  }
+
+  // TODO: (Kill Email Mode) Remove this route after kill email mode is fully implemented.
+  const handleCreateEmailModeForm = (feedbackForm: PublicFormViewDto) =>
+    handleSubmit((inputs) => {
+      if (!activeFormMeta?._id) return
+      if (!inputs.reason) {
+        return new Error('Reason is required')
+      }
+      emailModeFeedbackMutation.mutate({
+        body: { reason: inputs.reason },
+        feedbackForm,
+      })
       return dupeEmailModeFormMutation.mutate({
         formIdToDuplicate: activeFormMeta._id,
         emails: inputs.emails.filter(Boolean),
         title: inputs.title,
-        responseMode: inputs.responseMode,
+        responseMode: FormResponseMode.Email,
         workspaceId,
       })
-    }
+    })
+
+  const handleDetailsSubmit = handleSubmit(() => {
     setCurrentStep([CreateFormFlowStates.Landing, 1])
   })
 
@@ -131,6 +155,8 @@ export const useDupeFormWizardContext = (): CreateFormWizardContextReturn => {
     formMethods,
     handleDetailsSubmit,
     handleCreateStorageModeOrMultirespondentForm,
+    handleEmailFeedbackSubmit,
+    handleCreateEmailModeForm,
     isSingpass,
     modalHeader: 'Duplicate form',
   }

frontend/src/features/workspace/mutations.ts

@@ -103,19 +103,10 @@ export const useCreateFormMutations = () => {
     onError: handleError,
   })
 
-  // TODO: (Kill Email Mode) Remove this route after kill email mode is fully implemented.
-  const emailModeFeedbackMutation = useMutation(
-    (params: {
-      body: AdminUseEmailModeFeedbackDto
-      feedbackForm: PublicFormViewDto
-    }) => submitUseEmailFormFeedback(params),
-  )
-
   return {
     createEmailModeFormMutation,
     createStorageModeFormMutation,
     createMultirespondentModeFormMutation,
-    emailModeFeedbackMutation,
   }
 }
 
@@ -297,3 +288,15 @@ export const useWorkspaceMutations = () => {
     removeFormFromWorkspacesMutation,
   }
 }
+
+// TODO: (Kill Email Mode) Remove this route after kill email mode is fully implemented.
+export const useEmailModeFeedbackMutation = () => {
+  const emailModeFeedbackMutation = useMutation(
+    (params: {
+      body: AdminUseEmailModeFeedbackDto
+      feedbackForm: PublicFormViewDto
+    }) => submitUseEmailFormFeedback(params),
+  )
+
+  return { emailModeFeedbackMutation }
+}