PYIC-9087: Add renamed International user pages.

locales/cy/translation.json

@@ -388,6 +388,23 @@
         }
       }
     },
+    "needApp": {
+      "title": "Mae angen i chi ddefnyddio’r ap GOV.UK One Login i brofi pwy ydych chi",
+      "header": "Mae angen i chi ddefnyddio’r ap GOV.UK One Login i brofi pwy ydych chi",
+      "content": {
+        "paragraph1": "Os nad ydych chi’n byw yn y DU, gallwch ond defnyddio’r ap a ffôn clyfar i brofi pwy ydych chi gyda GOV.UK One Login.",
+        "subHeading1": "Beth hoffech chi ei wneud?",
+        "formRadioButtons": {
+          "continueToServiceButtonText": "Mynd i’r gwasanaeth roeddech chi’n ceisio ei ddefnyddio i chwilio am ffyrdd eraill o’i gyrchu",
+          "appSmartphoneButtonText": "Defnyddio’r ap a ffôn clyfar i brofi pwy ydych chi"
+        },
+        "formErrorMessage": {
+          "errorSummaryTitleText": "Mae problem",
+          "errorSummaryDescriptionText": "Dewiswch beth hoffech chi ei wneud",
+          "errorRadioMessage": "Dewiswch beth hoffech chi ei wneud"
+        }
+      }
+    },
     "pyiContinueWithPassport": {
       "title": "Parhau profi eich hunaniaeth ar-lein",
       "header": "Parhau profi eich hunaniaeth ar-lein",
@@ -1447,6 +1464,23 @@
         }
       }
     },
+    "passportBiometricChip": {
+      "title": "Oes gennych chi basbort gyda sglodyn biometrig?",
+      "header": "Oes gennych chi basbort gyda sglodyn biometrig?",
+      "content": {
+        "hintText": "Mae gan eich pasbort sglodyn biometrig os yw’r clawr blaen yn dangos symbol hirsgwar gyda chylch yn y canol.",
+        "passportImageAltText": "Clawr blaen pasbort gyda’r symbol sglodyn biometrig wedi’i chwyddo.",
+        "formRadioButtons": {
+          "nextButtonText": "Oes",
+          "abandonButtonText": "Na"
+        },
+        "formErrorMessage": {
+          "errorSummaryTitleText": "Mae problem",
+          "errorSummaryDescriptionText": "Dewiswch oes os oes gennych chi basbort gyda sglodyn biometrig",
+          "errorRadioMessage": "Dewiswch oes os oes gennych chi basbort gyda sglodyn biometrig"
+        }
+      }
+    },
     "nonUkNoPassport": {
       "title": "Mae angen i chi ddefnyddio pasbort gyda sglodyn biometrig i brofi eich hunaniaeth",
       "header": "Mae angen i chi ddefnyddio pasbort gyda sglodyn biometrig i brofi eich hunaniaeth",
@@ -1464,6 +1498,23 @@
         }
       }
     },
+    "needBiometricPassport": {
+      "title": "Mae angen i chi ddefnyddio pasbort gyda sglodyn biometrig i brofi eich hunaniaeth",
+      "header": "Mae angen i chi ddefnyddio pasbort gyda sglodyn biometrig i brofi eich hunaniaeth",
+      "content": {
+        "paragraph1": "Os nad ydych yn byw yn y DU, gallwch ond profi eich hunaniaeth gydag ap GOV.UK One Login drwy ddefnyddio pasbort gyda sglodyn biometrig.",
+        "subHeading1": "Beth hoffech chi ei wneud?",
+        "formRadioButtons": {
+          "returnToRpButtonText": "Mynd i’r gwasanaeth roeddech yn ceisio ei ddefnyddio i chwilio am ffyrdd eraill o gael mynediad ato",
+          "useAppButtonText": "Defnyddio pasbort gyda sglodyn biometrig i brofi pwy ydych chi"
+        },
+        "formErrorMessage": {
+          "errorSummaryTitleText": "Mae problem",
+          "errorSummaryDescriptionText": "Dewiswch beth hoffech chi ei wneud",
+          "errorRadioMessage": "Dewiswch beth hoffech chi ei wneud"
+        }
+      }
+    },
     "weMatchedYouToYourOneLogin": {
       "title": "Rydym wedi eich paru â’ch GOV.UK One Login",
       "header": "Rydym wedi eich paru â’ch GOV.UK One Login",

locales/en/translation.json

@@ -359,6 +359,23 @@
         }
       }
     },
+    "needApp": {
+      "title": "You need to use the GOV.UK One Login app to prove your identity",
+      "header": "You need to use the GOV.UK One Login app to prove your identity",
+      "content": {
+        "paragraph1": "If you do not live in the UK, you can only use the app and a smartphone to prove your identity with GOV.UK One Login.",
+        "subHeading1": "What would you like to do?",
+        "formRadioButtons": {
+          "continueToServiceButtonText": "Go to the service you were trying to use to look for other ways to access it",
+          "appSmartphoneButtonText": "Use the app and a smartphone to prove your identity"
+        },
+        "formErrorMessage": {
+          "errorSummaryTitleText": "There is a problem",
+          "errorSummaryDescriptionText": "Select what you would like to do",
+          "errorRadioMessage": "Select what you would like to do"
+        }
+      }
+    },
     "pyiContinueWithPassport": {
       "title": "Continue proving your identity online",
       "header": "Continue proving your identity online",
@@ -1447,6 +1464,23 @@
         }
       }
     },
+    "passportBiometricChip": {
+      "title": "Do you have a passport with a biometric chip?",
+      "header": "Do you have a passport with a biometric chip?",
+      "content": {
+        "hintText": "Your passport has a biometric chip if the front cover shows a rectangular symbol with a circle in the middle.",
+        "passportImageAltText": "The front cover of a passport with the biometric chip symbol enlarged.",
+        "formRadioButtons": {
+          "nextButtonText": "Yes",
+          "abandonButtonText": "No"
+        },
+        "formErrorMessage": {
+          "errorSummaryTitleText": "There is a problem",
+          "errorSummaryDescriptionText": "Select yes if you have a passport with a biometric chip",
+          "errorRadioMessage": "Select yes if you have a passport with a biometric chip"
+        }
+      }
+    },
     "nonUkNoPassport": {
       "title": "You need to use a passport with a biometric chip to prove your identity",
       "header": "You need to use a passport with a biometric chip to prove your identity",
@@ -1464,6 +1498,23 @@
         }
       }
     },
+    "needBiometricPassport": {
+      "title": "You need to use a passport with a biometric chip to prove your identity",
+      "header": "You need to use a passport with a biometric chip to prove your identity",
+      "content": {
+        "paragraph1": "If you do not live in the UK, you can only prove your identity with GOV.UK One Login using a passport with a biometric chip.",
+        "subHeading1": "What would you like to do?",
+        "formRadioButtons": {
+          "returnToRpButtonText": "Go to the service you were trying to use to look for other ways to access it",
+          "useAppButtonText": "Use a passport with a biometric chip to prove your identity"
+        },
+        "formErrorMessage": {
+          "errorSummaryTitleText": "There is a problem",
+          "errorSummaryDescriptionText": "Select what you would like to do",
+          "errorRadioMessage": "Select what you would like to do"
+        }
+      }
+    },
     "weMatchedYouToYourOneLogin": {
       "title": "We’ve matched you to your GOV.UK One Login",
       "header": "We’ve matched you to your GOV.UK One Login",

src/constants/ipv-pages.ts

@@ -5,6 +5,8 @@ const IPV_PAGES = Object.freeze({
   LIVE_IN_UK: "live-in-uk",
   PROBLEM_DIFFERENT_BROWSER: "problem-different-browser",
   IDENTIFY_DEVICE: "identify-device",
+  NEED_APP: "need-app",
+  NEED_BIOMETRIC_PASSPORT: "need-biometric-passport",
   NEED_ID_PROVE_IDENTITY_AGAIN_APP: "need-id-prove-identity-again-app",
   NEED_MORE_INFORMATION_CONFIRM_CHANGE_DETAILS:
     "need-more-information-confirm-change-details",
@@ -34,6 +36,7 @@ const IPV_PAGES = Object.freeze({
   PAGE_PRE_EXPERIAN_KBV_TRANSITION: "page-pre-experian-kbv-transition",
   PAGE_UPDATE_NAME: "page-update-name",
   PAGE_PRE_DWP_KBV_TRANSITION: "page-pre-dwp-kbv-transition",
+  PASSPORT_BIOMETRIC_CHIP: "passport-biometric-chip",
   PERSONAL_INDEPENDENCE_PAYMENT: "personal-independence-payment",
   PHOTO_ID_SECURITY_QUESTIONS_FIND_ANOTHER_WAY:
     "photo-id-security-questions-find-another-way",

src/test-utils/pages-and-contexts.ts

@@ -21,6 +21,8 @@ export const pagesAndContexts: PagesAndContexts = {
     NO_CONTEXT_VARIANT,
   ],
   "live-in-uk": [],
+  "need-app": [],
+  "need-biometric-passport": [],
   "need-id-prove-identity-again-app": [],
   "need-prove-identity-again-app": [],
   "need-prove-identity-again-no-app": [],
@@ -68,6 +70,7 @@ export const pagesAndContexts: PagesAndContexts = {
   ],
   "page-different-security-questions": [],
   "page-not-found": [],
+  "passport-biometric-chip": [],
   "personal-independence-payment": [],
   "photo-id-security-questions-find-another-way": [
     { dropout: { reason: "dropout" } },

views/README.md

@@ -151,6 +151,13 @@ Breaking this example down:
         handleJourneyActionRequest,
     );
     ```
+### Add new page to constants:
+
+When adding new pages make sure those are also added to the required constants
+
+- In [ipv-pages.ts](../src/constants/ipv-pages.ts) file update IPV_PAGES object with new page
+
+- In [pages-and-contexts.ts](../src/test-utils/pages-and-contexts.ts) file update pagesAndContexts object with new page and contexts values
 
 ### Notes
 

views/ipv/page/need-app.njk

@@ -0,0 +1,53 @@
+{% extends "shared/base.njk" %}
+{% from "govuk/components/button/macro.njk" import govukButton %}
+{% from "govuk/components/radios/macro.njk" import govukRadios %}
+{% set pageTitleKey = 'pages.needApp.title' %}
+{% set googleTagManagerPageId = "needApp" %}
+
+{% set errorState = pageErrorState %}
+{% set errorTitle = 'pages.needApp.content.formErrorMessage.errorSummaryTitleText' | translate %}
+{% set errorText = 'pages.needApp.content.formErrorMessage.errorSummaryDescriptionText' | translate %}
+{% set errorHref = "#needAppForm" %}
+
+{% set isPageDataSensitive = false %}
+{% set contentID = 'aa01d261-c2de-41cb-b3de-205c56716ea4'%}
+
+{% block content %}
+  <h1 class="govuk-heading-l" id="header" data-page="{{ googleTagManagerPageId }}">{{ 'pages.needApp.header' | translate }}</h1>
+  <p class="govuk-body">{{ 'pages.needApp.content.paragraph1' | translate }}</p>
+
+  <form id="needAppForm" action="/ipv/page/{{ pageId }}" method="POST">
+    <input type="hidden" name="_csrf" value="{{ csrfToken }}">
+    {% set radiosConfig = {
+      idPrefix: "journey",
+      name: "journey",
+      fieldset: {
+        legend: {
+          text: 'pages.needApp.content.subHeading1' | translate,
+          classes: "govuk-fieldset__legend--m"
+        }
+      },
+      items: [
+        {
+          value: "returnToRp",
+          text: 'pages.needApp.content.formRadioButtons.continueToServiceButtonText' | translate
+        },
+        {
+          value: "useApp",
+          text: 'pages.needApp.content.formRadioButtons.appSmartphoneButtonText' | translate
+        }
+      ]
+    } %}
+
+    {% if errorState %}
+      {% set errorMessageObject = { 'text': 'pages.needApp.content.formErrorMessage.errorRadioMessage' | translate } %}
+      {% set radiosConfig = radiosConfig | setAttribute('errorMessage', errorMessageObject) %}
+    {% endif %}
+
+    {{ govukRadios(radiosConfig) }}
+    {{ govukButton({
+      id: "submitButton",
+      text: 'general.buttons.next' | translate
+    }) }}
+  </form>
+{% endblock %}

views/ipv/page/need-biometric-passport.njk

@@ -0,0 +1,57 @@
+{% extends "shared/base.njk" %}
+{% from "govuk/components/button/macro.njk" import govukButton %}
+{% from "govuk/components/details/macro.njk" import govukDetails %}
+{% from "govuk/components/radios/macro.njk" import govukRadios %}
+{% set pageTitleKey = 'pages.needBiometricPassport.title' %}
+{% set googleTagManagerPageId = "needBiometricPassport" %}
+
+{% set errorState = pageErrorState %}
+{% set errorTitle = 'pages.needBiometricPassport.content.formErrorMessage.errorSummaryTitleText' | translate %}
+{% set errorText = 'pages.needBiometricPassport.content.formErrorMessage.errorSummaryDescriptionText' | translate %}
+{% set errorHref = "#needBiometricPassportForm" %}
+
+{% set isPageDataSensitive = false %}
+{% set contentID = '059cc6c8-6e04-4de9-a6c0-5d26cd9e53c0'%}
+
+{% set showBack = true %}
+{% set hrefBack = "/ipv/journey/need-biometric-passport/back" %}
+
+{% block content %}
+  <h1 class="govuk-heading-l" id="header" data-page="{{ googleTagManagerPageId }}">{{ 'pages.needBiometricPassport.header' | translate }}</h1>
+  <p class="govuk-body">{{ 'pages.needBiometricPassport.content.paragraph1' | translate }}</p>
+
+  <form id="needBiometricPassportForm" action="/ipv/page/{{ pageId }}" method="POST">
+    <input type="hidden" name="_csrf" value="{{ csrfToken }}">
+    {% set radiosConfig = {
+      idPrefix: "journey",
+      name: "journey",
+      fieldset: {
+        legend: {
+          text: 'pages.needBiometricPassport.content.subHeading1' | translate,
+          classes: "govuk-fieldset__legend--m"
+        }
+      },
+      items: [
+        {
+          value: "returnToRp",
+          text: 'pages.needBiometricPassport.content.formRadioButtons.returnToRpButtonText' | translate
+        },
+        {
+          value: "useApp",
+          text: 'pages.needBiometricPassport.content.formRadioButtons.useAppButtonText' | translate
+        }
+      ]
+    } %}
+
+    {% if errorState %}
+      {% set errorMessageObject = { 'text': 'pages.needBiometricPassport.content.formErrorMessage.errorRadioMessage' | translate } %}
+      {% set radiosConfig = radiosConfig | setAttribute('errorMessage', errorMessageObject) %}
+    {% endif %}
+
+    {{ govukRadios(radiosConfig) }}
+    {{ govukButton({
+      id: "submitButton",
+      text: 'general.buttons.next' | translate
+    }) }}
+  </form>
+{% endblock %}

views/ipv/page/passport-biometric-chip.njk

@@ -0,0 +1,68 @@
+{% extends "shared/base.njk" %}
+{% from "govuk/components/button/macro.njk" import govukButton %}
+{% from "govuk/components/details/macro.njk" import govukDetails %}
+{% from "govuk/components/radios/macro.njk" import govukRadios %}
+{% set pageTitleKey = 'pages.passportBiometricChip.title' %}
+{% set googleTagManagerPageId = "passportBiometricChip" %}
+
+{% set errorState = pageErrorState %}
+{% set errorTitle = 'pages.passportBiometricChip.content.formErrorMessage.errorSummaryTitleText' | translate %}
+{% set errorText = 'pages.passportBiometricChip.content.formErrorMessage.errorSummaryDescriptionText' | translate %}
+{% set errorHref = "#passportBiometricChipForm" %}
+
+
+{% set isPageDataSensitive = false %}
+{% set contentID = 'caf75ee8-82fe-455b-9559-57087f009867'%}
+
+{% set showBack = true %}
+{% set hrefBack = "/ipv/journey/passport-biometric-chip/back" %}
+
+{% block content %}
+
+  {% set radioHintHtml %}
+    {{ 'pages.passportBiometricChip.content.hintText' | translate }}
+    <picture>
+      <source srcset="/public/images/passport-icon.svg"/>
+      <img width="174" height="121" loading="lazy" src="/public/images/passport-icon-1x.png" srcset="/public/images/passport-icon-2x.png 2x" alt="{{ 'pages.passportBiometricChip.content.passportImageAltText' | translate }}" />
+    </picture>
+  {% endset -%}
+
+  <form id="passportBiometricChipForm" action="/ipv/page/{{ pageId }}" method="POST">
+    <input type="hidden" name="_csrf" value="{{ csrfToken }}">
+    {% set radiosConfig = {
+      idPrefix: "journey",
+      name: "journey",
+      fieldset: {
+        legend: {
+          text: 'pages.passportBiometricChip.header' | translate,
+          isPageHeading: true,
+          classes: "govuk-fieldset__legend--l"
+        }
+      },
+      hint: {
+        html: radioHintHtml
+      },
+      items: [
+        {
+          value: "next",
+          text: 'pages.passportBiometricChip.content.formRadioButtons.nextButtonText' | translate
+        },
+        {
+          value: "abandon",
+          text: 'pages.passportBiometricChip.content.formRadioButtons.abandonButtonText' | translate
+        }
+      ]
+    } %}
+
+    {% if errorState %}
+      {% set errorMessageObject = { 'text': 'pages.passportBiometricChip.content.formErrorMessage.errorRadioMessage' | translate } %}
+      {% set radiosConfig = radiosConfig | setAttribute('errorMessage', errorMessageObject) %}
+    {% endif %}
+
+    {{ govukRadios(radiosConfig) }}
+    {{ govukButton({
+      id: "submitButton",
+      text: 'general.buttons.next' | translate
+    }) }}
+  </form>
+{% endblock %}