From f4f7efc3d80c732cf65f08dca9588df90d96db10 Mon Sep 17 00:00:00 2001 From: Rory Powis Date: Thu, 14 Feb 2019 15:05:47 +0100 Subject: [PATCH 1/3] Update account menu to allow defining active link --- .../hmrc-account-header/example.njk | 36 +++++- .../hmrc-account-menu/account-menu.yaml | 110 +++++++++++++----- src/components/hmrc-account-menu/template.njk | 18 +-- .../hmrc-account-menu/template.test.js | 14 +-- 4 files changed, 131 insertions(+), 47 deletions(-) diff --git a/src/components/hmrc-account-header/example.njk b/src/components/hmrc-account-header/example.njk index 3ff71b16..ce356639 100644 --- a/src/components/hmrc-account-header/example.njk +++ b/src/components/hmrc-account-header/example.njk @@ -1,9 +1,41 @@ +{% set hmrcAccountHeader = { + language: "en", + languageToggle: { + en: { + href: "#lang=en" + }, + cy: { + href: "#lang=cy" + } + }, + accountHome:{ + href: "#account-home", + active: true + }, + messages: { + href: "#messages", + messageCount: 10 + }, + checkProgress: { + href: "#check-progress" + }, + paperlessSettings: { + href: "#paperless-settings" + }, + personalDetails: { + href: "#personal-details" + }, + signOut: { + href: "#sign-out" + } +} %} + {% extends 'layout-hmrc-account-header.html' %} {% block content %} -
+

HMRC Account Menu

-
+
{% endblock %} {% block bodyEnd %} diff --git a/src/components/hmrc-account-menu/account-menu.yaml b/src/components/hmrc-account-menu/account-menu.yaml index f061d793..31c741ba 100644 --- a/src/components/hmrc-account-menu/account-menu.yaml +++ b/src/components/hmrc-account-menu/account-menu.yaml @@ -1,50 +1,100 @@ params: -- name: accountHomeHref - type: string +- name: accountHome + type: object required: false - description: "The url of the Account home menu item. Defaults to #" -- name: messagesHref - type: string + description: The Account home menu item. + params: + - name: href + type: string + required: false + description: "The url of the Account home item. Defaults to #." + - name: active + type: boolean + required: false + description: Flag to mark the Account home item as active or not. +- name: messages + type: object required: false - description: The url of the Messages menu item. Defaults to / -- name: messageCount - type: number + description: The Messages menu item. + params: + - name: href + type: string + required: false + description: "The url of the Messages item. Defaults to #." + - name: active + type: string + required: false + description: Flag to mark the Messages item as active or not. + - name: messageCount + type: number + required: false + description: The number of messages to display in the notifacation badge next to Messages. Defaults to not being displayed. +- name: checkProgress + type: object required: false - description: "The number of messages to display in the notifacation badge next to Messages. Defaults to not being displayed" -- name: checkProgressHref - type: string - required: false - description: "The url of the Check progress menu item. Defaults to #" -- name: paperlessSettingsHref - type: string + description: The Check progress menu item. + params: + - name: href + type: string + required: false + description: "The url of the Check progress item. Defaults to #." + - name: active + type: string + required: false + description: Flag to mark the Check progress item as active or not. +- name: paperlessSettings + type: object required: false - description: "The url of the Manage your paperless settings submenu item. Defaults to #" -- name: personalDetailsHref + description: The Manage your paperless settings submenu item. + params: + - name: href + type: string + required: false + description: "The url of the Manage your paperless settings submenu item. Defaults to #." +- name: personalDetails type: string required: false - description: "The url of the Manage your personal details submenu item. Defaults to #" -- name: signOutHref + description: The Manage your personal details submenu item. + params: + - name: href + type: string + required: false + description: "The url of the Manage your personal details submenu item. Defaults to #." +- name: signOut type: string required: false - description: "The url of the Sign out menu item. Defaults to #" + description: The Sign out menu item. + params: + - name: href + type: string + required: false + description: "The url of the Sign out menu item. Defaults to #." examples: - name: default - description: The standard account menu as used on Personal Tax Account pages + description: The standard account menu as used on Personal Tax Account pages. data: {} - name: with-unread-messages - description: If you need to show the user they have unread messages + description: If you need to show the user they have unread messages. data: - messageCount: 2 + messages: + messageCount: 2 - name: with-navigaiton-urls - description: If you need to provide a custom urls for the menu items + description: If you need to provide a custom urls for the menu items. data: - accountHomeHref: "#account-home" - messagesHref: "#messages" - checkProgressHref: "#check-progress" - paperlessSettingsHref: "#paperless-settings" - personalDetailsHref: "#personal-details" - signOutHref: "#sign-out" + accountHome: + href: "#account-home" + active: true + messages: + href: "#messages" + checkProgress: + href: "#check-progress" + paperlessSettings: + href: "#paperless-settings" + personalDetails: + href: "#personal-details" + signOut: + href: "#sign-out" diff --git a/src/components/hmrc-account-menu/template.njk b/src/components/hmrc-account-menu/template.njk index a6d7a7b1..c152ec96 100644 --- a/src/components/hmrc-account-menu/template.njk +++ b/src/components/hmrc-account-menu/template.njk @@ -1,8 +1,10 @@ {% from "hmrc-notification-badge/macro.njk" import hmrcNotificationBadge %} +{% set defaultAccountHomeAsActive = not params.messages.active and not params.checkProgress.active %} + diff --git a/src/components/hmrc-account-menu/template.test.js b/src/components/hmrc-account-menu/template.test.js index 38c64576..5547b648 100644 --- a/src/components/hmrc-account-menu/template.test.js +++ b/src/components/hmrc-account-menu/template.test.js @@ -47,12 +47,12 @@ describe('Account Menu', () => { const $detailsLink = $nav.find('a:contains("personal details")') const $signOutLink = $nav.find('a:contains("Sign out")') - expect($accountHomeLink.attr('href')).toEqual(example.accountHomeHref) - expect($messagesLink.attr('href')).toEqual(example.messagesHref) - expect($progressLink.attr('href')).toEqual(example.checkProgressHref) - expect($paperlessLink.attr('href')).toEqual(example.paperlessSettingsHref) - expect($detailsLink.attr('href')).toEqual(example.personalDetailsHref) - expect($signOutLink.attr('href')).toEqual(example.signOutHref) + expect($accountHomeLink.attr('href')).toEqual(example.accountHome.href) + expect($messagesLink.attr('href')).toEqual(example.messages.href) + expect($progressLink.attr('href')).toEqual(example.checkProgress.href) + expect($paperlessLink.attr('href')).toEqual(example.paperlessSettings.href) + expect($detailsLink.attr('href')).toEqual(example.personalDetails.href) + expect($signOutLink.attr('href')).toEqual(example.signOut.href) }) it('renders a notification badge with a message count', () => { @@ -62,7 +62,7 @@ describe('Account Menu', () => { const $messageCount = $('.hmrc-notification-badge') expect($messageCount).not.toBeNull() - expect($messageCount.text()).toEqual(example.messageCount.toString()) + expect($messageCount.text()).toEqual(example.messages.messageCount.toString()) }) }) }) From 6fc5cd737b1126237e03ecec967e89683be7f81d Mon Sep 17 00:00:00 2001 From: Mat Carey Date: Tue, 19 Feb 2019 10:09:13 +0000 Subject: [PATCH 2/3] Allowing everything in the header and account menu to be set through the hmrcAccountHeader variable. --- src/components/hmrc-account-menu/template.njk | 4 +--- src/govuk-prototype-kit.config.json | 2 +- src/layouts/layout-hmrc-account-header.html | 11 +++++++---- 3 files changed, 9 insertions(+), 8 deletions(-) diff --git a/src/components/hmrc-account-menu/template.njk b/src/components/hmrc-account-menu/template.njk index c152ec96..8e598669 100644 --- a/src/components/hmrc-account-menu/template.njk +++ b/src/components/hmrc-account-menu/template.njk @@ -1,10 +1,8 @@ {% from "hmrc-notification-badge/macro.njk" import hmrcNotificationBadge %} -{% set defaultAccountHomeAsActive = not params.messages.active and not params.checkProgress.active %} -