@newskit-render/core 1.27.2 → 1.29.1

package/CHANGELOG.md

@@ -3,6 +3,93 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [1.29.1](https://github.com/newscorp-ghfb/ncu-newskit-render/compare/@newskit-render/core@1.29.0...@newskit-render/core@1.29.1) (2022-03-01)
+
+
+### Bug Fixes
+
+* **PPDSR-667:** make theme selector overridable ([#610](https://github.com/newscorp-ghfb/ncu-newskit-render/issues/610)) ([4017c6b](https://github.com/newscorp-ghfb/ncu-newskit-render/commit/4017c6baf796dbad2727712d60b9719fb190efcb))
+
+
+
+
+
+# [1.29.0](https://github.com/newscorp-ghfb/ncu-newskit-render/compare/@newskit-render/core@1.28.0...@newskit-render/core@1.29.0) (2022-02-28)
+
+
+### Features
+
+* **PPDSR-474:** intergate new MAIN Zuora mutation ([#604](https://github.com/newscorp-ghfb/ncu-newskit-render/issues/604)) ([bf62a52](https://github.com/newscorp-ghfb/ncu-newskit-render/commit/bf62a5270f5d5d0236e67222db81697f5e74cd01))
+
+
+
+
+
+# [1.28.0](https://github.com/newscorp-ghfb/ncu-newskit-render/compare/@newskit-render/core@1.27.8...@newskit-render/core@1.28.0) (2022-02-25)
+
+
+### Features
+
+* **PPDSR-542:** sitemap add support for custom urls ([#601](https://github.com/newscorp-ghfb/ncu-newskit-render/issues/601)) ([dd51e1f](https://github.com/newscorp-ghfb/ncu-newskit-render/commit/dd51e1ff4404b44ba64381f987551f4f88da9b8f))
+
+
+
+
+
+## [1.27.8](https://github.com/newscorp-ghfb/ncu-newskit-render/compare/@newskit-render/core@1.27.7...@newskit-render/core@1.27.8) (2022-02-25)
+
+**Note:** Version bump only for package @newskit-render/core
+
+
+
+
+
+## [1.27.7](https://github.com/newscorp-ghfb/ncu-newskit-render/compare/@newskit-render/core@1.27.6...@newskit-render/core@1.27.7) (2022-02-25)
+
+**Note:** Version bump only for package @newskit-render/core
+
+
+
+
+
+## [1.27.6](https://github.com/newscorp-ghfb/ncu-newskit-render/compare/@newskit-render/core@1.27.5...@newskit-render/core@1.27.6) (2022-02-24)
+
+**Note:** Version bump only for package @newskit-render/core
+
+
+
+
+
+## [1.27.5](https://github.com/newscorp-ghfb/ncu-newskit-render/compare/@newskit-render/core@1.27.4...@newskit-render/core@1.27.5) (2022-02-23)
+
+
+### Bug Fixes
+
+* **PPDSR-690:** update version to fix pipeline ([#605](https://github.com/newscorp-ghfb/ncu-newskit-render/issues/605)) ([16ae9b5](https://github.com/newscorp-ghfb/ncu-newskit-render/commit/16ae9b57c726899d3138e3112fb36571a6b01e77))
+
+
+
+
+
+## [1.27.4](https://github.com/newscorp-ghfb/ncu-newskit-render/compare/@newskit-render/core@1.27.3...@newskit-render/core@1.27.4) (2022-02-23)
+
+**Note:** Version bump only for package @newskit-render/core
+
+
+
+
+
+## [1.27.3](https://github.com/newscorp-ghfb/ncu-newskit-render/compare/@newskit-render/core@1.27.2...@newskit-render/core@1.27.3) (2022-02-21)
+
+
+### Bug Fixes
+
+* **PPDSR-674:** Footer menu not horizontal on large screens ([#596](https://github.com/newscorp-ghfb/ncu-newskit-render/issues/596)) ([904927d](https://github.com/newscorp-ghfb/ncu-newskit-render/commit/904927d938227514b18cc35a2535b9eed349a61f))
+
+
+
+
+
 ## [1.27.2](https://github.com/newscorp-ghfb/ncu-newskit-render/compare/@newskit-render/core@1.27.1...@newskit-render/core@1.27.2) (2022-02-18)
 
 **Note:** Version bump only for package @newskit-render/core

package/cypress/e2e/account/account-page.spec.js

@@ -160,29 +160,38 @@ describe('My account personal details', () => {
   //   )
   // })
 
-  // it('Should go to edit page and change password', () => {
-  //   cy.get('a[href="/account/edit/password"]')
-  //     .should('be.visible')
-  //     .click({ force: true })
+  it('Should go to edit page and change password', () => {
+    cy.get('a[href="/account/edit/password"]')
+      .should('be.visible')
+      .click({ force: true })
 
-  //   cy.get('[data-testid="primary-button"]').should('have.text', 'Send link')
-  //   cy.get('[data-testid="primary-button"]').scrollIntoView().click()
+    cy.get('[data-testid="primary-button"]').should('have.text', 'Send link')
+    cy.get('[data-testid="primary-button"]').scrollIntoView().click()
 
-  //   cy.get('[data-testid="primary-button"]').should('not.exist')
+    cy.get('[data-testid="primary-button"]').should('not.exist')
+    cy.get('a[href="/account/edit/password"]')
+      .should('be.visible')
+      .click({ force: true })
+    cy.get('[data-testid="inline-message"]')
+      .children()
+      .should(
+        'contain',
+        'Email sent to temp.account@tempaccount.com with a password reset link. If you haven’t received it in a couple of minutes, you may request a new link by clicking on the button below.'
+      )
+  })
 
-  //   cy.get('a[href="/account/edit/password"]')
-  //     .should('be.visible')
-  //     .click({ force: true })
+  it('Should show success toast', () => {
+    cy.get('a[href="/account/edit/password"]')
+      .should('be.visible')
+      .click({ force: true })
 
-  //   cy.get('[data-testid="inline-message"]')
-  //     .children()
-  //     .should(
-  //       'contain',
-  //       `Email sent to ${Cypress.env(
-  //         'newEmail'
-  //       )} with a password reset link. If you haven’t received it in a couple of minutes, you may request a new link by clicking on the button below.`
-  //     )
-  // })
+    cy.get('[data-testid="primary-button"]').should('have.text', 'Send link')
+    cy.get('[data-testid="primary-button"]').scrollIntoView().click()
+    cy.contains(
+      '[data-testid="toast-container"]',
+      'Email sent with a password reset link'
+    )
+  })
 
   it('Should go to edit page and change landline', () => {
     cy.get('a[href="/account/edit/landline"]')

package/cypress/e2e/account/payment-page.spec.js

@@ -1,42 +1,42 @@
-describe('My account Payment page', () => {
-  beforeEach(() => {
-    cy.mockConsentAndVisit('/account/payment')
-  })
+// describe('My account Payment page', () => {
+//   beforeEach(() => {
+//     cy.mockConsentAndVisit('/account/payment')
+//   })
 
-  it('should load the zuora iFrame', () => {
-    cy.get('iframe').should('exist')
-  })
+//   it('should load the zuora iFrame', () => {
+//     cy.get('iframe').should('exist')
+//   })
 
-  it('should successully send the form', () => {
-    if (Cypress.config('chromeWebSecurity')) {
-      throw new Error(
-        'To get Zuora element `chromeWebSecurity` must be disabled'
-      )
-    }
+//   it('should successully send the form', () => {
+//     if (Cypress.config('chromeWebSecurity')) {
+//       throw new Error(
+//         'To get Zuora element `chromeWebSecurity` must be disabled'
+//       )
+//     }
 
-    cy.get('iframe').should('exist')
-    cy.getZuoraElement('input[name="field_creditCardHolderName"]').type(
-      'Gabriel Dimitrov'
-    )
-    cy.getZuoraElement('input[name="field_creditCardNumber"]').type(
-      '4111 1111 1111 1111'
-    )
-    cy.getZuoraElement('input[name="field_cardSecurityCode"]').type('123')
-    cy.getZuoraElement('input[name="field_creditCardPostalCode"]').type(
-      'E11 9HB'
-    )
+//     cy.get('iframe').should('exist')
+//     cy.getZuoraElement('input[name="field_creditCardHolderName"]').type(
+//       'Gabriel Dimitrov'
+//     )
+//     cy.getZuoraElement('input[name="field_creditCardNumber"]').type(
+//       '4111 1111 1111 1111'
+//     )
+//     cy.getZuoraElement('input[name="field_cardSecurityCode"]').type('123')
+//     cy.getZuoraElement('input[name="field_creditCardPostalCode"]').type(
+//       'E11 9HB'
+//     )
 
-    cy.getZuoraElement('select[name="field_creditCardExpirationMonth"]').select(
-      '11'
-    )
-    cy.getZuoraElement('select[name="field_creditCardExpirationYear"]').select(
-      '2026'
-    )
-    cy.getZuoraElement('#submitButton').click()
+//     cy.getZuoraElement('select[name="field_creditCardExpirationMonth"]').select(
+//       '11'
+//     )
+//     cy.getZuoraElement('select[name="field_creditCardExpirationYear"]').select(
+//       '2026'
+//     )
+//     cy.getZuoraElement('#submitButton').click()
 
-    cy.contains(
-      '[data-testid="toast-container"]',
-      'Your payment method has been updated'
-    )
-  })
-})
+//     cy.contains(
+//       '[data-testid="toast-container"]',
+//       'Your payment method has been updated'
+//     )
+//   })
+// })

package/helpers/__tests__/createThemeDropdownObject.test.ts

@@ -0,0 +1,34 @@
+import { createThemeDropdownObject } from '../createThemeDropdownObject'
+
+describe('createThemeDropdownObject', () => {
+  const setTheme = jest.fn()
+  test('should return themeDropdownObject', () => {
+    const themeDropdownObject = createThemeDropdownObject(setTheme)
+    expect(themeDropdownObject).toEqual({
+      setTheme,
+      clientHeaderImages: {
+        'The-Sun': 'display-personalDetails-header-sun.svg',
+        'Virgin-Radio': 'display-personalDetails-header-vr.svg',
+        'The-Times': 'display-personalDetails-header-times.svg',
+      },
+      clientNavigationLogos: {
+        'The-Sun': {
+          src: 'navigationPrimary-brandMark-sun.svg',
+          width: '115px',
+          top: '0',
+        },
+        'Virgin-Radio': {
+          src: 'navigationPrimary-brandMark-vr.svg',
+          width: '150px',
+          top: '0',
+        },
+        'The-Times': {
+          src: 'navigationPrimary-brandMark-times.svg',
+          width: '150px',
+          top: '0',
+        },
+      },
+      options: expect.any(Object),
+    })
+  })
+})

package/helpers/createThemeDropdownObject.ts

@@ -0,0 +1,49 @@
+import { UncompiledTheme } from 'newskit'
+import {
+  sharedTheme,
+  timesTheme,
+  virginRadioTheme,
+  theSunTheme,
+  ThemeDropdownObject,
+} from '@newskit-render/shared-components'
+
+const clientHeaderImages = {
+  'The-Sun': 'display-personalDetails-header-sun.svg',
+  'Virgin-Radio': 'display-personalDetails-header-vr.svg',
+  'The-Times': 'display-personalDetails-header-times.svg',
+}
+
+const clientNavigationLogos = {
+  'The-Sun': {
+    src: 'navigationPrimary-brandMark-sun.svg',
+    width: '115px',
+    top: '0',
+  },
+  'Virgin-Radio': {
+    src: 'navigationPrimary-brandMark-vr.svg',
+    width: '150px',
+    top: '0',
+  },
+  'The-Times': {
+    src: 'navigationPrimary-brandMark-times.svg',
+    width: '150px',
+    top: '0',
+  },
+}
+
+export const createThemeDropdownObject = (
+  setTheme: (T: UncompiledTheme) => void
+): ThemeDropdownObject => {
+  const themeDropdownObject = {
+    setTheme,
+    clientHeaderImages,
+    clientNavigationLogos,
+    options: {
+      sharedTheme,
+      timesTheme,
+      virginRadioTheme,
+      theSunTheme,
+    },
+  }
+  return themeDropdownObject
+}

package/infrastructure/.circleci/config.yml

@@ -259,6 +259,8 @@ orbs:
                 echo 'export HELM_OPT_SET="$HELM_OPT_SET --set secret.items.SN_PASSWORD=${SN_PASSWORD}"' >> $BASH_ENV
                 echo 'export HELM_OPT_SET="$HELM_OPT_SET --set secret.items.SN_USERNAME=${SN_USERNAME}"' >> $BASH_ENV
                 echo 'export HELM_OPT_SET="$HELM_OPT_SET --set secret.items.SN_ENVIRONMENT=${SN_ENVIRONMENT}"' >> $BASH_ENV
+                echo 'export HELM_OPT_SET="$HELM_OPT_SET --set secret.items.ZUORA_RSA_SIGNATURE_URI=${ZUORA_RSA_SIGNATURE_URI}"' >> $BASH_ENV
+                echo 'export HELM_OPT_SET="$HELM_OPT_SET --set secret.items.OPTIMIZELY_SDK_KEY=${OPTIMIZELY_SDK_KEY}"' >> $BASH_ENV
                 echo 'export HELM_PATH="helm"' >> $BASH_ENV
                 echo 'export HELM_VALUES="--values $HELM_PATH/values-$HELM_VAL_ENV.yaml"' >> $BASH_ENV
                 echo 'export HELM_INSTALL="helm install --atomic $HELM_VALUES $HELM_OPT_SET $HELM_OPT_NAMESPACE"' >> $BASH_ENV

package/infrastructure/helm/values-dev.yaml

@@ -10,6 +10,7 @@ envs:
   NEWSKIT_API_ENV_URL: 'https://newskit.dev.newsapis.co.uk/graphql'
   SITE_HOST: ''
   PUBLISHER: ''
+  TITLE: ''
   SITEMAP_PUBLICATION_NAME: ''
   SITEMAP_FIRST_PUBLICATION_DATE: ''
   TWITTER_USERNAME: ''

package/infrastructure/helm/values-pr.yaml

@@ -10,6 +10,7 @@ envs:
   NEWSKIT_API_ENV_URL: 'https://newskit.dev.newsapis.co.uk/graphql'
   SITE_HOST: ''
   PUBLISHER: ''
+  TITLE: ''
   SITEMAP_PUBLICATION_NAME: ''
   SITEMAP_FIRST_PUBLICATION_DATE: ''
   TWITTER_USERNAME: ''

package/infrastructure/helm/values-prod.yaml

@@ -10,6 +10,7 @@ envs:
   NEWSKIT_API_ENV_URL: 'https://newskit.newsapis.co.uk/graphql'
   SITE_HOST: ''
   PUBLISHER: ''
+  TITLE: ''
   SITEMAP_PUBLICATION_NAME: ''
   SITEMAP_FIRST_PUBLICATION_DATE: ''
   TWITTER_USERNAME: ''

package/infrastructure/helm/values-staging.yaml

@@ -10,6 +10,7 @@ envs:
   NEWSKIT_API_ENV_URL: 'https://newskit.staging.newsapis.co.uk/graphql'
   SITE_HOST: ''
   PUBLISHER: ''
+  TITLE: ''
   SITEMAP_PUBLICATION_NAME: ''
   SITEMAP_FIRST_PUBLICATION_DATE: ''
   TWITTER_USERNAME: ''

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@newskit-render/core",
-  "version": "1.27.2",
+  "version": "1.29.1",
   "description": "Newskit Render - Core package",
   "author": "",
   "license": "UNLICENSED",
@@ -33,14 +33,14 @@
   },
   "dependencies": {
     "@apollo/client": "3.4.16",
-    "@newskit-render/api": "^0.14.1",
-    "@newskit-render/auth": "^0.28.1",
-    "@newskit-render/checkout": "^0.23.1",
-    "@newskit-render/feature-flags": "^0.10.1",
-    "@newskit-render/my-account": "^0.138.1",
-    "@newskit-render/shared-components": "^0.35.1",
-    "@newskit-render/sitemap": "^0.34.1",
-    "@newskit-render/validation": "^0.34.1",
+    "@newskit-render/api": "^0.15.0",
+    "@newskit-render/auth": "^0.29.0",
+    "@newskit-render/checkout": "^0.24.1",
+    "@newskit-render/feature-flags": "^0.11.0",
+    "@newskit-render/my-account": "^0.142.1",
+    "@newskit-render/shared-components": "^0.37.1",
+    "@newskit-render/sitemap": "^0.35.0",
+    "@newskit-render/validation": "^0.36.0",
     "cross-fetch": "3.1.5",
     "graphql": "15.6.0",
     "newrelic": "7.1.0",

package/pages/account/cancellation/index.tsx

@@ -2,10 +2,18 @@ import React, { useContext } from 'react'
 import { Cancellation, getProviderProps } from '@newskit-render/my-account'
 import newrelic from 'newrelic'
 import { AppContext } from '../../../app-context/AppContext'
+import { createThemeDropdownObject } from '../../../helpers/createThemeDropdownObject'
 
 const AccountCancellation = (props) => {
   const { theme, setTheme } = useContext(AppContext)
-  return <Cancellation {...props} customTheme={theme} setTheme={setTheme} />
+  const themeDropdownObject = createThemeDropdownObject(setTheme)
+  return (
+    <Cancellation
+      {...props}
+      customTheme={theme}
+      themeDropdownObject={themeDropdownObject}
+    />
+  )
 }
 
 export default AccountCancellation

package/pages/account/edit/[field].tsx

@@ -8,10 +8,12 @@ import {
 } from '@newskit-render/my-account'
 import validation from '../../../validation'
 import { AppContext } from '../../../app-context/AppContext'
+import { createThemeDropdownObject } from '../../../helpers/createThemeDropdownObject'
 
 const AccountEditField = (props) => {
   const doesEditPageExist = Object.keys(componentMap).includes(props.data.type)
   const { theme, setTheme } = useContext(AppContext)
+  const themeDropdownObject = createThemeDropdownObject(setTheme)
 
   if (doesEditPageExist) {
     return (
@@ -19,7 +21,7 @@ const AccountEditField = (props) => {
         {...props}
         validation={validation}
         customTheme={theme}
-        setTheme={setTheme}
+        themeDropdownObject={themeDropdownObject}
       />
     )
   }

package/pages/account/index.tsx

@@ -2,10 +2,18 @@ import newrelic from 'newrelic'
 import { PersonalDetails, getProviderProps } from '@newskit-render/my-account'
 import React, { useContext } from 'react'
 import { AppContext } from '../../app-context/AppContext'
+import { createThemeDropdownObject } from '../../helpers/createThemeDropdownObject'
 
 const AccountPersonalDetails = (props) => {
   const { theme, setTheme } = useContext(AppContext)
-  return <PersonalDetails {...props} customTheme={theme} setTheme={setTheme} />
+  const themeDropdownObject = createThemeDropdownObject(setTheme)
+  return (
+    <PersonalDetails
+      {...props}
+      customTheme={theme}
+      themeDropdownObject={themeDropdownObject}
+    />
+  )
 }
 
 export default AccountPersonalDetails

package/pages/account/newsletters-and-alerts/index.tsx

@@ -5,11 +5,17 @@ import {
 import newrelic from 'newrelic'
 import React, { useContext } from 'react'
 import { AppContext } from '../../../app-context/AppContext'
+import { createThemeDropdownObject } from '../../../helpers/createThemeDropdownObject'
 
 const AccountNewslettersAndAlerts = (props) => {
   const { theme, setTheme } = useContext(AppContext)
+  const themeDropdownObject = createThemeDropdownObject(setTheme)
   return (
-    <NewslettersAndAlerts {...props} customTheme={theme} setTheme={setTheme} />
+    <NewslettersAndAlerts
+      {...props}
+      customTheme={theme}
+      themeDropdownObject={themeDropdownObject}
+    />
   )
 }
 

package/pages/account/payment/index.tsx

@@ -6,10 +6,18 @@ import {
 } from '@newskit-render/my-account'
 import React, { useContext } from 'react'
 import { AppContext } from '../../../app-context/AppContext'
+import { createThemeDropdownObject } from '../../../helpers/createThemeDropdownObject'
 
 const AccountCancellation = (props) => {
   const { theme, setTheme } = useContext(AppContext)
-  return <Payment {...props} customTheme={theme} setTheme={setTheme} />
+  const themeDropdownObject = createThemeDropdownObject(setTheme)
+  return (
+    <Payment
+      {...props}
+      customTheme={theme}
+      themeDropdownObject={themeDropdownObject}
+    />
+  )
 }
 
 export default AccountCancellation

package/pages/account/subscription-and-billing/index.tsx

@@ -5,14 +5,16 @@ import {
 import newrelic from 'newrelic'
 import React, { useContext } from 'react'
 import { AppContext } from '../../../app-context/AppContext'
+import { createThemeDropdownObject } from '../../../helpers/createThemeDropdownObject'
 
 const AccountSubscriptionAndBilling = (props) => {
   const { theme, setTheme } = useContext(AppContext)
+  const themeDropdownObject = createThemeDropdownObject(setTheme)
   return (
     <SubscriptionAndBilling
       {...props}
       customTheme={theme}
-      setTheme={setTheme}
+      themeDropdownObject={themeDropdownObject}
     />
   )
 }

package/pages/api/sitemap.ts

@@ -1,6 +1,15 @@
 import { NextApiRequest, NextApiResponse } from 'next'
-import { genericSitemap, PublisherGroup } from '@newskit-render/sitemap'
+import {
+  genericSitemap,
+  PublisherGroup,
+  CustomStaticPage,
+} from '@newskit-render/sitemap'
 
+const defaultCustomStaticPagesCollection: CustomStaticPage[] = [
+  {
+    channel: 'test-custom-page',
+  },
+]
 const handler = async (req: NextApiRequest, res: NextApiResponse) =>
   genericSitemap({
     res,
@@ -9,6 +18,7 @@ const handler = async (req: NextApiRequest, res: NextApiResponse) =>
     domain: new URL(process.env.SITE_HOST as string).host,
     firstArticleDate: process.env.SITEMAP_FIRST_PUBLICATION_DATE as string,
     publicationName: process.env.SITEMAP_PUBLICATION_NAME as string,
+    customStaticPageCollection: defaultCustomStaticPagesCollection,
   })
 
 export default handler

package/pages/checkout/account-creation/index.tsx

@@ -2,14 +2,16 @@ import { AccountCreation, getProviderProps } from '@newskit-render/checkout'
 import React, { useContext } from 'react'
 import { AppContext } from '../../../app-context/AppContext'
 import validation from '../../../validation'
+import { createThemeDropdownObject } from '../../../helpers/createThemeDropdownObject'
 
 const AccountCreationPage = (props) => {
   const { theme, setTheme } = useContext(AppContext)
+  const themeDropdownObject = createThemeDropdownObject(setTheme)
   return (
     <AccountCreation
       {...props}
       customTheme={theme}
-      setTheme={setTheme}
+      themeDropdownObject={themeDropdownObject}
       validation={validation}
     />
   )

package/pages/checkout/payment-details/index.tsx

@@ -1,10 +1,18 @@
 import { PaymentDetails, getProviderProps } from '@newskit-render/checkout'
 import React, { useContext } from 'react'
 import { AppContext } from '../../../app-context/AppContext'
+import { createThemeDropdownObject } from '../../../helpers/createThemeDropdownObject'
 
 const PaymentDetailsPage = (props) => {
   const { theme, setTheme } = useContext(AppContext)
-  return <PaymentDetails {...props} customTheme={theme} setTheme={setTheme} />
+  const themeDropdownObject = createThemeDropdownObject(setTheme)
+  return (
+    <PaymentDetails
+      {...props}
+      customTheme={theme}
+      themeDropdownObject={themeDropdownObject}
+    />
+  )
 }
 
 export default PaymentDetailsPage