From 5f8aee783757a566240d4a62a09fec3bd0d06f15 Mon Sep 17 00:00:00 2001 From: chowyiyin Date: Tue, 11 May 2021 10:50:08 +0800 Subject: [PATCH 01/15] build: add response id to submit form directive and end page component --- .../modules/forms/base/componentViews/end-page.html | 9 ++++++++- .../forms/base/components/end-page.client.component.js | 1 + src/public/modules/forms/base/css/end-page.css | 8 ++++++++ .../base/directiveViews/submit-form.directive.view.html | 1 + .../forms/base/directives/submit-form.directive.js | 6 ++++-- 5 files changed, 22 insertions(+), 3 deletions(-) diff --git a/src/public/modules/forms/base/componentViews/end-page.html b/src/public/modules/forms/base/componentViews/end-page.html index 858e4b7669..f1873e3b4e 100644 --- a/src/public/modules/forms/base/componentViews/end-page.html +++ b/src/public/modules/forms/base/componentViews/end-page.html @@ -5,7 +5,14 @@

- Form submitted {{ vm.timestamp }} + + Response ID: {{ vm.responseId }} + +
+ + Form submitted + {{ vm.timestamp }} +

{{ vm.title }}

diff --git a/src/public/modules/forms/base/components/end-page.client.component.js b/src/public/modules/forms/base/components/end-page.client.component.js index 02df4dcf52..6890c48528 100644 --- a/src/public/modules/forms/base/components/end-page.client.component.js +++ b/src/public/modules/forms/base/components/end-page.client.component.js @@ -11,6 +11,7 @@ angular.module('forms').component('endPageComponent', { authType: '@', isAdminPreview: '<', colorTheme: '@', + responseId: '<', }, controller: ['SpcpSession', '$window', 'moment', endPageController], controllerAs: 'vm', diff --git a/src/public/modules/forms/base/css/end-page.css b/src/public/modules/forms/base/css/end-page.css index 286ee159d2..2b601fcba9 100644 --- a/src/public/modules/forms/base/css/end-page.css +++ b/src/public/modules/forms/base/css/end-page.css @@ -6,3 +6,11 @@ #end-page-header #end-page-timestamp { font-weight: bold; } + +#end-page-header #end-page-responseid { + font-size: 12px; +} + +#end-page-header #end-page-responseid #end-page-id { + text-transform: lowercase; +} diff --git a/src/public/modules/forms/base/directiveViews/submit-form.directive.view.html b/src/public/modules/forms/base/directiveViews/submit-form.directive.view.html index ebdb917966..0444289d8f 100644 --- a/src/public/modules/forms/base/directiveViews/submit-form.directive.view.html +++ b/src/public/modules/forms/base/directiveViews/submit-form.directive.view.html @@ -91,6 +91,7 @@ auth-type="{{ form.authType }}" is-admin-preview="false" color-theme="{{ form.startPage.colorTheme }}" + response-id="{{ responseId }}" > diff --git a/src/public/modules/forms/base/directives/submit-form.directive.js b/src/public/modules/forms/base/directives/submit-form.directive.js index 8e58cf2126..1c7bd5fb36 100644 --- a/src/public/modules/forms/base/directives/submit-form.directive.js +++ b/src/public/modules/forms/base/directives/submit-form.directive.js @@ -59,6 +59,7 @@ function submitFormDirective( logoUrl: '<', myInfoError: '<', disableSubmitButton: '<', + responseId: '<', }, link: function (scope, _element, _attrs, _ctrl) { const startDate = Date.now() // Used to calculate time spent on form @@ -321,7 +322,7 @@ function submitFormDirective( responseMode: form.responseMode, }, submissionContent, // POST body - ).then(handleSubmitSuccess, handleSubmitFailure) + ).then((response) => handleSubmitSuccess(response), handleSubmitFailure) } /** @@ -334,7 +335,8 @@ function submitFormDirective( * Returns a callback for form submission success, which updates UI * state and Google Analytics. */ - const handleSubmitSuccess = () => { + const handleSubmitSuccess = (response) => { + scope.responseId = response.id setFormState(FORM_STATES.SUBMITTED) GTag.submitFormSuccess(scope.form, startDate, Date.now()) if (shouldTrackPersistentLoginUse()) { From 2f2d89236042707ef8b28c64c2a92369a8a257ce Mon Sep 17 00:00:00 2001 From: chowyiyin Date: Tue, 11 May 2021 10:52:16 +0800 Subject: [PATCH 02/15] build: ireturn submission id in response in and --- .../services/submissions.client.factory.js | 23 +++++++++++-------- 1 file changed, 14 insertions(+), 9 deletions(-) diff --git a/src/public/modules/forms/services/submissions.client.factory.js b/src/public/modules/forms/services/submissions.client.factory.js index 8491e80dbc..f11e7aad9a 100644 --- a/src/public/modules/forms/services/submissions.client.factory.js +++ b/src/public/modules/forms/services/submissions.client.factory.js @@ -93,18 +93,20 @@ function SubmissionsFactory( xhr.send(fd) // On Response xhr.onreadystatechange = function () { - // 4 DONE The operation is complete. const OPERATION_DONE = 4 if (xhr.readyState === OPERATION_DONE) { // waterfall is successful + let response = {} + try { + response = JSON.parse(xhr.responseText) + // eslint-disable-next-line no-empty + } catch (e) {} if (xhr.status === HttpStatus.OK) { - deferred.resolve('Submission has finished.') + deferred.resolve({ + message: 'Submission has finished.', + id: response.submissionId || 'Not available', + }) } else { - let response = {} - try { - response = JSON.parse(xhr.responseText) - // eslint-disable-next-line no-empty - } catch (e) {} deferred.reject( `${ response.message || @@ -133,8 +135,11 @@ function SubmissionsFactory( version: body.version, }) .then( - function () { - deferred.resolve('Submission has finished.') + function (response) { + deferred.resolve({ + message: 'Submission has finished.', + id: response.submissionId, + }) }, function (error) { deferred.reject( From eaba80e256f55ca4fda3ac99e3ccf841916d5ed9 Mon Sep 17 00:00:00 2001 From: chowyiyin Date: Tue, 11 May 2021 12:50:22 +0800 Subject: [PATCH 03/15] fix: change bbindings in --- .../modules/forms/base/components/end-page.client.component.js | 2 +- .../modules/forms/base/directives/submit-form.directive.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/public/modules/forms/base/components/end-page.client.component.js b/src/public/modules/forms/base/components/end-page.client.component.js index 6890c48528..ce5d888d4a 100644 --- a/src/public/modules/forms/base/components/end-page.client.component.js +++ b/src/public/modules/forms/base/components/end-page.client.component.js @@ -11,7 +11,7 @@ angular.module('forms').component('endPageComponent', { authType: '@', isAdminPreview: '<', colorTheme: '@', - responseId: '<', + responseId: '@', }, controller: ['SpcpSession', '$window', 'moment', endPageController], controllerAs: 'vm', diff --git a/src/public/modules/forms/base/directives/submit-form.directive.js b/src/public/modules/forms/base/directives/submit-form.directive.js index 1c7bd5fb36..a286c5982c 100644 --- a/src/public/modules/forms/base/directives/submit-form.directive.js +++ b/src/public/modules/forms/base/directives/submit-form.directive.js @@ -59,7 +59,6 @@ function submitFormDirective( logoUrl: '<', myInfoError: '<', disableSubmitButton: '<', - responseId: '<', }, link: function (scope, _element, _attrs, _ctrl) { const startDate = Date.now() // Used to calculate time spent on form @@ -355,6 +354,7 @@ function submitFormDirective( * @param {string?} toastMessage The toast message to display, if any. */ const handleSubmitFailure = (error, toastMessage) => { + scope.responseId = '' const form = scope.form console.error('Submission error:\t', error) setFormState(FORM_STATES.SUBMISSION_ERROR) From 5e4fd7409b631a239fcf7a345b4e6af01be5d506 Mon Sep 17 00:00:00 2001 From: chowyiyin Date: Wed, 12 May 2021 14:57:21 +0800 Subject: [PATCH 04/15] refactor: explicitly defined handleSubmitFailure input parameters for consistency --- .../modules/forms/base/directives/submit-form.directive.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/src/public/modules/forms/base/directives/submit-form.directive.js b/src/public/modules/forms/base/directives/submit-form.directive.js index a286c5982c..a4b774e823 100644 --- a/src/public/modules/forms/base/directives/submit-form.directive.js +++ b/src/public/modules/forms/base/directives/submit-form.directive.js @@ -321,7 +321,10 @@ function submitFormDirective( responseMode: form.responseMode, }, submissionContent, // POST body - ).then((response) => handleSubmitSuccess(response), handleSubmitFailure) + ).then( + (response) => handleSubmitSuccess(response), + (err, message) => handleSubmitFailure(err, message), + ) } /** From 9c365d538df3e3569119e0a05ea8d1e961c5f5b1 Mon Sep 17 00:00:00 2001 From: chowyiyin Date: Fri, 14 May 2021 09:21:34 +0800 Subject: [PATCH 05/15] refactor: changed response key from id to submissionId and removed paramters to improve readability and handled error for response parsing --- .../base/directives/submit-form.directive.js | 8 ++----- .../services/submissions.client.factory.js | 23 +++++++++---------- 2 files changed, 13 insertions(+), 18 deletions(-) diff --git a/src/public/modules/forms/base/directives/submit-form.directive.js b/src/public/modules/forms/base/directives/submit-form.directive.js index a4b774e823..296412e3e8 100644 --- a/src/public/modules/forms/base/directives/submit-form.directive.js +++ b/src/public/modules/forms/base/directives/submit-form.directive.js @@ -321,10 +321,7 @@ function submitFormDirective( responseMode: form.responseMode, }, submissionContent, // POST body - ).then( - (response) => handleSubmitSuccess(response), - (err, message) => handleSubmitFailure(err, message), - ) + ).then(handleSubmitSuccess, handleSubmitFailure) } /** @@ -338,7 +335,7 @@ function submitFormDirective( * state and Google Analytics. */ const handleSubmitSuccess = (response) => { - scope.responseId = response.id + scope.responseId = response.submissionId setFormState(FORM_STATES.SUBMITTED) GTag.submitFormSuccess(scope.form, startDate, Date.now()) if (shouldTrackPersistentLoginUse()) { @@ -357,7 +354,6 @@ function submitFormDirective( * @param {string?} toastMessage The toast message to display, if any. */ const handleSubmitFailure = (error, toastMessage) => { - scope.responseId = '' const form = scope.form console.error('Submission error:\t', error) setFormState(FORM_STATES.SUBMISSION_ERROR) diff --git a/src/public/modules/forms/services/submissions.client.factory.js b/src/public/modules/forms/services/submissions.client.factory.js index f11e7aad9a..9c3522fc3e 100644 --- a/src/public/modules/forms/services/submissions.client.factory.js +++ b/src/public/modules/forms/services/submissions.client.factory.js @@ -99,19 +99,18 @@ function SubmissionsFactory( let response = {} try { response = JSON.parse(xhr.responseText) + if (xhr.status === HttpStatus.OK) { + deferred.resolve({ + message: 'Submission has finished.', + submissionId: response.submissionId, + }) + } else { + deferred.reject(`${response.message}`) + } // eslint-disable-next-line no-empty - } catch (e) {} - if (xhr.status === HttpStatus.OK) { - deferred.resolve({ - message: 'Submission has finished.', - id: response.submissionId || 'Not available', - }) - } else { + } catch (e) { deferred.reject( - `${ - response.message || - "Please refresh and try again. If this doesn't work, try switching devices or networks." - }`, + "Please refresh and try again. If this doesn't work, try switching devices or networks.", ) } } @@ -138,7 +137,7 @@ function SubmissionsFactory( function (response) { deferred.resolve({ message: 'Submission has finished.', - id: response.submissionId, + submissionId: response.submissionId, }) }, function (error) { From fb50a36402161d4a0570f5b5b5d1694650939c1b Mon Sep 17 00:00:00 2001 From: chowyiyin Date: Mon, 17 May 2021 09:57:58 +0800 Subject: [PATCH 06/15] build: add response ID to confirmation email --- src/app/services/mail/mail.service.ts | 2 ++ src/app/views/templates/submit-form-autoreply.server.view.html | 2 ++ 2 files changed, 4 insertions(+) diff --git a/src/app/services/mail/mail.service.ts b/src/app/services/mail/mail.service.ts index 62feeecf98..3a1ef6cfb3 100644 --- a/src/app/services/mail/mail.service.ts +++ b/src/app/services/mail/mail.service.ts @@ -241,10 +241,12 @@ export class MailService { autoReplyMailData.sender || form.admin.agency.fullName ).replace('(', '\\(') + const responseId = submission.id const defaultBody = `Dear Sir or Madam,\n\nThank you for submitting this form.\n\nRegards,\n${form.admin.agency.fullName}` const autoReplyBody = (autoReplyMailData.body || defaultBody).split('\n') const templateData = { + responseId, autoReplyBody, // Only destructure formSummaryRenderData if form summary is included. ...(autoReplyMailData.includeFormSummary && formSummaryRenderData), diff --git a/src/app/views/templates/submit-form-autoreply.server.view.html b/src/app/views/templates/submit-form-autoreply.server.view.html index 14d3f0ae9b..5e0c0edd0f 100644 --- a/src/app/views/templates/submit-form-autoreply.server.view.html +++ b/src/app/views/templates/submit-form-autoreply.server.view.html @@ -1,6 +1,8 @@ + Response ID: <%= responseId %> +
<% autoReplyBody.forEach(function(line) { %> <%= line %>
<% }) %> <% if (locals.refNo) { %>
From 687b10ff27a30538adf500e04d6b7fee1610a13f Mon Sep 17 00:00:00 2001 From: chowyiyin Date: Mon, 17 May 2021 09:58:54 +0800 Subject: [PATCH 07/15] build: add response ID to email confirmation preview --- src/public/modules/forms/admin/css/edit-form.css | 4 ++++ .../modules/forms/admin/views/edit-fields.client.modal.html | 2 ++ 2 files changed, 6 insertions(+) diff --git a/src/public/modules/forms/admin/css/edit-form.css b/src/public/modules/forms/admin/css/edit-form.css index f8d910a2c0..38f1a362ef 100644 --- a/src/public/modules/forms/admin/css/edit-form.css +++ b/src/public/modules/forms/admin/css/edit-form.css @@ -916,6 +916,10 @@ padding: 20px; } +.edit-modal-window .preview-field-panel #email-preview #response-id { + color: #979797; +} + .edit-modal-window .preview-field-panel #email-preview .editable-text { color: #283d86; text-align: justify; diff --git a/src/public/modules/forms/admin/views/edit-fields.client.modal.html b/src/public/modules/forms/admin/views/edit-fields.client.modal.html index 70fdfa5cff..ddec389925 100644 --- a/src/public/modules/forms/admin/views/edit-fields.client.modal.html +++ b/src/public/modules/forms/admin/views/edit-fields.client.modal.html @@ -1380,6 +1380,8 @@