diff --git a/CHANGELOG.md b/CHANGELOG.md index 68ef9a86..a5a8ef86 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,9 +1,12 @@ -## 2024, Version 22.0.0, @Rhodine-orleans-lindsay +## 2024, Version 22.0.0 (Stable), @Rhodine-orleans-lindsay * Adds session timeout warning - - user can stay on page or exit form - - adds exit html - - updates confirmation html to a static page - - allows for customisation of session timeout warning dialog content and exit page content + - user can stay on page or exit form + - adds exit html + - user can stay signed in or save and exit the form if the form is a save and exit form + - adds default save-and-exit html + - updates confirmation html to a static page + - allows for customisation of session timeout warning dialog content and exit page content + - Potential **_breaking change_**: Static pages should use the ```{{ class extends superclass { superLocals.message = req.translate('exit.message'); return superLocals; } + + // set the content on /save-and-exit page + if (req.form.options.route === '/save-and-exit' && config.saveExitFormContent === true) { + superLocals.saveExitFormContent = true; + return superLocals; + } else if (req.form.options.route === '/save-and-exit' && config.saveExitFormContent === false) { + superLocals.header = req.translate('save-and-exit.header'); + superLocals.title = req.translate('save-and-exit.title'); + superLocals.message = req.translate('save-and-exit.message'); + return superLocals; + } return superLocals; } }; diff --git a/config/hof-defaults.js b/config/hof-defaults.js index 3b6d6152..8f178174 100644 --- a/config/hof-defaults.js +++ b/config/hof-defaults.js @@ -16,6 +16,7 @@ const defaults = { getAccessibility: false, sessionTimeoutWarningContent: false, exitFormContent: false, + saveExitFormContent: false, viewEngine: 'html', protocol: process.env.PROTOCOL || 'http', noCache: process.env.NO_CACHE || false, diff --git a/frontend/template-partials/translations/src/en/save-and-exit.json b/frontend/template-partials/translations/src/en/save-and-exit.json new file mode 100644 index 00000000..9d235af5 --- /dev/null +++ b/frontend/template-partials/translations/src/en/save-and-exit.json @@ -0,0 +1,4 @@ +{ + "header": "You have been signed out", + "message": "Any answers you saved have not been affected. You can sign back in to your application by returning to the start page." +} diff --git a/frontend/template-partials/views/partials/head.html b/frontend/template-partials/views/partials/head.html index 63670a17..44ce551a 100644 --- a/frontend/template-partials/views/partials/head.html +++ b/frontend/template-partials/views/partials/head.html @@ -26,6 +26,6 @@ {{/deIndex}} diff --git a/frontend/template-partials/views/partials/session-timeout-warning.html b/frontend/template-partials/views/partials/session-timeout-warning.html index 5f7f36ac..851f0c78 100644 --- a/frontend/template-partials/views/partials/session-timeout-warning.html +++ b/frontend/template-partials/views/partials/session-timeout-warning.html @@ -8,15 +8,31 @@ data-url-redirect="/session-timeout" class="modal-dialog dialog" role="dialog" aria-live="polite" aria-labelledby="dialog-title" aria-describedby="at-timer">
+ {{^showSaveAndExit}}

{{#dialogTitle}}{{#t}}pages.session-timeout-warning.dialog-title{{/t}}{{/dialogTitle}}{{^dialogTitle}}Your page will time out soon{{/dialogTitle}}

+
- {{#dialogExitLink}}{{#t}}pages.session-timeout-warning.dialog-exit-link{{/t}}{{/dialogExitLink}}{{^dialogExitLink}}Exit this form{{/dialogExitLink}} + {{#dialogExitLink}}{{#t}}pages.session-timeout-warning.dialog-exit-link{{/t}}{{/dialogExitLink}}{{^dialogExitLink}}Exit this form{{/dialogExitLink}} + {{/showSaveAndExit}} + {{#showSaveAndExit}} +

+ {{#dialogTitle}}{{#t}}pages.session-timeout-warning.dialog-title{{/t}}{{/dialogTitle}}{{^dialogTitle}}You will be signed out soon{{/dialogTitle}} +

+
+ +
+ + +
+ + {{#dialogExitLink}}{{#t}}pages.session-timeout-warning.dialog-exit-link{{/t}}{{/dialogExitLink}}{{^dialogExitLink}}Sign out{{/dialogExitLink}} + {{/showSaveAndExit}}
diff --git a/frontend/template-partials/views/save-and-exit.html b/frontend/template-partials/views/save-and-exit.html new file mode 100644 index 00000000..a1fb9007 --- /dev/null +++ b/frontend/template-partials/views/save-and-exit.html @@ -0,0 +1,17 @@ +{{ partials-navigation}} + {{/propositionHeader}} + + {{$header}} + {{header}} + {{/header}} + + {{$content}} +

{{#saveExitFormContent}}{{#t}}pages.save-and-exit.message{{/t}}{{/saveExitFormContent}}{{^saveExitFormContent}}{{{message}}}{{/saveExitFormContent}}

+ {{/content}} +{{/layout}} diff --git a/frontend/themes/gov-uk/client-js/session-timeout-dialog.js b/frontend/themes/gov-uk/client-js/session-timeout-dialog.js index 935f6274..135205fb 100644 --- a/frontend/themes/gov-uk/client-js/session-timeout-dialog.js +++ b/frontend/themes/gov-uk/client-js/session-timeout-dialog.js @@ -13,7 +13,7 @@ window.GOVUK.sessionDialog = { $fallBackElement: $('.govuk-timeout-warning-fallback'), dialogIsOpenClass: 'dialog-is-open', timers: [], - warningTextPrefix: 'To protect your information, this page will time out in ', + warningTextPrefix: $('.dialog-text-prefix').text(), warningTextSuffix: '.', warningText: $('.dialog-text').text(), warningTextExtra: '', diff --git a/index.js b/index.js index ae25be7b..9e733c37 100644 --- a/index.js +++ b/index.js @@ -154,6 +154,7 @@ function bootstrap(options) { res.locals.sessionTimeOutWarning = config.sessionTimeOutWarning; res.locals.sessionTimeoutWarningContent = config.sessionTimeoutWarningContent; res.locals.exitFormContent = config.exitFormContent; + res.locals.saveExitFormContent = config.saveExitFormContent; next(); }); diff --git a/sandbox/apps/sandbox/index.js b/sandbox/apps/sandbox/index.js index 8de53d06..36f89a9d 100644 --- a/sandbox/apps/sandbox/index.js +++ b/sandbox/apps/sandbox/index.js @@ -30,6 +30,7 @@ module.exports = { }, '/dob': { fields: ['dateOfBirth'], + locals: { showSaveAndExit: true }, next: '/address' }, '/address': { @@ -92,6 +93,7 @@ module.exports = { next: '/confirm' }, '/session-timeout': {}, - '/exit': {} + '/exit': {}, + '/save-and-exit': {} } }; diff --git a/sandbox/apps/sandbox/translations/src/en/pages.json b/sandbox/apps/sandbox/translations/src/en/pages.json index 12f59c9b..d8b7524c 100644 --- a/sandbox/apps/sandbox/translations/src/en/pages.json +++ b/sandbox/apps/sandbox/translations/src/en/pages.json @@ -58,9 +58,15 @@ "message": "We have cleared your information to keep it secure. Your information has not been saved." }, "session-timeout-warning": { - "dialog-title": "Your application will close soon", - "dialog-text": "If that happens, your progress will not be saved.", - "timeout-continue-button": "Stay on this page", - "dialog-exit-link": "Exit this form" + "dialog-title": "{{^showSaveAndExit}}Your application will close soon{{/showSaveAndExit}}{{#showSaveAndExit}}You will be signed out soon{{/showSaveAndExit}}", + "dialog-text": "{{^showSaveAndExit}}If that happens, your progress will not be saved.{{/showSaveAndExit}}{{#showSaveAndExit}}Any answers you have saved will not be affected, but your progress on this page will not be saved.{{/showSaveAndExit}}", + "timeout-continue-button": "{{^showSaveAndExit}}Stay on this page{{/showSaveAndExit}}{{#showSaveAndExit}}Stay signed in{{/showSaveAndExit}}", + "dialog-exit-link": "{{^showSaveAndExit}}Exit this form{{/showSaveAndExit}}{{#showSaveAndExit}}Sign out{{/showSaveAndExit}}" + }, + "save-and-exit": { + "header": "You have been signed out", + "paragraph-1": "Your form doesn't appear to have been worked on for 30 minutes so we closed it for security.", + "paragraph-2": "Any answers you saved have not been affected.", + "paragraph-3": "You can sign back in to your application at any time by returning to the start page." } } diff --git a/sandbox/apps/sandbox/views/save-and-exit.html b/sandbox/apps/sandbox/views/save-and-exit.html new file mode 100644 index 00000000..15d4c9e0 --- /dev/null +++ b/sandbox/apps/sandbox/views/save-and-exit.html @@ -0,0 +1,19 @@ +{{ partials-navigation}} + {{/propositionHeader}} + + {{$header}} + {{header}} + {{/header}} + + {{$content}} +

{{#t}}pages.save-and-exit.paragraph-1{{/t}}

+

{{#t}}pages.save-and-exit.paragraph-2{{/t}}

+

{{#t}}pages.save-and-exit.paragraph-3{{/t}}

+ {{/content}} +{{/layout}} diff --git a/test/components/session-timeout-warning.spec.js b/test/components/session-timeout-warning.spec.js index 5a16f464..24ea206c 100644 --- a/test/components/session-timeout-warning.spec.js +++ b/test/components/session-timeout-warning.spec.js @@ -113,6 +113,30 @@ describe('session timeout warning component', () => { locals.should.have.property('message').and.deep.equal('exit.message'); }); + it('sets the custom content to true on the save-and-exit page if saveExitFormContent is set to true', () => { + config.saveExitFormContent = true; + req.form = { + options: { + route: '/save-and-exit' + } + }; + const locals = instance.locals(req, res); + locals.should.have.property('saveExitFormContent').and.deep.equal(true); + }); + + it('does sets the default content on the save-and-exit page if saveExitFormContent is set to false', () => { + config.saveExitFormContent = false; + req.form = { + options: { + route: '/save-and-exit' + } + }; + const locals = instance.locals(req, res); + locals.should.have.property('header').and.deep.equal('save-and-exit.header'); + locals.should.have.property('title').and.deep.equal('save-and-exit.title'); + locals.should.have.property('message').and.deep.equal('save-and-exit.message'); + }); + afterEach(() => { Base.prototype.locals.restore(); });