How to use @govuk-pay/pay-js-commons - 10 common examples

// Local dependencies
const multiSelects = require('./browsered/multi-select')
const {browsered} = require('@govuk-pay/pay-js-commons')
const dashboardActivity = require('./browsered/dashboard-activity')
const targetToShow = require('./browsered/target-to-show')
const analytics = require('gaap-analytics')
const inputConfirm = require('./browsered/input-confirm')
const niceURL = require('./browsered/nice-url')
const copyText = require('./browsered/copy-text')

// GOV.UK Frontend Toolkit dependencies
require('../govuk_modules/govuk_frontend_toolkit/javascripts/govuk/show-hide-content')

multiSelects.enableMultiSelects()
browsered.fieldValidation.enableFieldValidation()
dashboardActivity.init()
targetToShow.init()
analytics.eventTracking.init()
analytics.virtualPageview.init()
inputConfirm()
niceURL()
copyText()

$(document).ready($ => {
  const showHideContent = new window.GOVUK.ShowHideContent()
  showHideContent.init()
})

function niceURL (e) {
    const input = e.target
    // stripping out the (in)definite article (the/a/an) and replacing spaces and other chars with a hyphen
    input.value = removeIndefiniteArticles(input.value).replace(/[\s£&$*_+~.()'"!:@]+/g, '-').toLowerCase()
  }
}

function confirmInput (e) {
    const input = e.target
    // using slugify and also stripping out the (in)definite article (the/a/an)
    let value = input.dataset.confirmationFilter === 'slugify' ? slugify(removeIndefiniteArticles(input.value)) : input.value
    const confirmationId = `${input.id}-confirmation`
    const confirmationPrepend = input.dataset.confirmationPrepend || ''
    let confirmation = document.getElementById(confirmationId)

    if (!confirmation) {
      confirmation = document.createElement('div')
      confirmation.innerHTML = `
      <div class="govuk-inset-text input-confirm" id="${confirmationId}">
        <h3 class="govuk-heading-s govuk-!-margin-bottom-2">${input.dataset.confirmationTitle}</h3>
        <p class="govuk-body">
          ${input.dataset.confirmationLabel}<span class="input-confirmation"></span>
        </p>
      </div>`
      input.closest('.govuk-form-group').after(confirmation)
    }

'use strict'

const { removeIndefiniteArticles } = require('@govuk-pay/pay-js-commons').nunjucksFilters

module.exports = () => {
  const inputs = Array.prototype.slice.call(document.querySelectorAll('[data-slugify]'))

  inputs.forEach(input => {
    input.addEventListener('input', niceURL, false)
  })

  function niceURL (e) {
    const input = e.target
    // stripping out the (in)definite article (the/a/an) and replacing spaces and other chars with a hyphen
    input.value = removeIndefiniteArticles(input.value).replace(/[\s£&$*_+~.()'"!:@]+/g, '-').toLowerCase()
  }
}

'use strict'

// NPM dependencies
const lodash = require('lodash')

// Local dependencies
const paths = require('../../paths')
const productsClient = require('../../services/clients/products_client.js')
const { slugify, removeIndefiniteArticles } = require('@govuk-pay/pay-js-commons').nunjucksFilters

const makeNiceURL = string => {
  return slugify(removeIndefiniteArticles(string))
}

module.exports = (req, res) => {
  const pageData = lodash.get(req, 'session.pageData.createPaymentLink', {})
  let updatedPageData = lodash.cloneDeep(pageData)

  if (updatedPageData.productNamePath === '') {
    req.flash('genericError', `<h2>There was a problem with the details you gave for:</h2><ul class="govuk-list govuk-error-summary__list"><li><a href="#payment-name-path">Please change the website address</a></li></ul>`)
    return res.redirect(paths.paymentLinks.webAddress)
  }

  updatedPageData.productNamePath = makeNiceURL(req.body['payment-name-path'])
  lodash.set(req, 'session.pageData.createPaymentLink', updatedPageData)

'use strict'

// NPM dependencies
const lodash = require('lodash')
const { slugify, removeIndefiniteArticles } = require('@govuk-pay/pay-js-commons').nunjucksFilters

// Local dependencies
const paths = require('../../paths')
const productsClient = require('../../services/clients/products_client.js')

const makeNiceURL = string => {
  return slugify(removeIndefiniteArticles(string))
}

module.exports = (req, res) => {
  const pageData = lodash.get(req, 'session.pageData.createPaymentLink', {})
  let updatedPageData = lodash.cloneDeep(pageData)

  updatedPageData.paymentLinkTitle = req.body['payment-link-title']
  updatedPageData.paymentLinkDescription = req.body['payment-link-description']
  updatedPageData.serviceNamePath = makeNiceURL(req.body['service-name-path'])

'use strict'

// NPM dependencies
const _ = require('lodash')
const moment = require('moment-timezone')
const AWSXRay = require('aws-xray-sdk')
const getNamespace = require('continuation-local-storage').getNamespace

// Custom dependencies
const logger = require('../../utils/logger')(__filename)
const response = require('../../utils/response').response
const CORRELATION_HEADER = require('../../utils/correlation_header').CORRELATION_HEADER
const LedgerClient = require('../../services/clients/ledger_client')
const { isADirectDebitAccount } = require('../../services/clients/direct_debit_connector_client.js')
const auth = require('../../services/auth_service.js')
const { datetime } = require('@govuk-pay/pay-js-commons').nunjucksFilters
const {
  NOT_STARTED,
  ENTERED_ORGANISATION_NAME,
  ENTERED_ORGANISATION_ADDRESS,
  CHOSEN_PSP_STRIPE,
  CHOSEN_PSP_WORLDPAY,
  CHOSEN_PSP_SMARTPAY,
  CHOSEN_PSP_EPDQ,
  TERMS_AGREED_STRIPE,
  TERMS_AGREED_WORLDPAY,
  TERMS_AGREED_SMARTPAY,
  TERMS_AGREED_EPDQ,
  LIVE,
  DENIED
} = require('../../models/go-live-stage')

'use strict'

const { slugify, removeIndefiniteArticles } = require('@govuk-pay/pay-js-commons').nunjucksFilters

// Polyfills introduced as a temporary fix to make Smoketests pass. See PP-3489
require('./polyfills')

module.exports = () => {
  const inputs = Array.prototype.slice.call(document.querySelectorAll('[data-confirmation]'))

  inputs.forEach(input => {
    input.addEventListener('input', confirmInput, false)

    if (input.dataset.confirmationDisplay === 'onload') {
      confirmInput({target: input})
    }
  })

  function confirmInput (e) {

const model = {
    name: req.user.username,
    serviceId: req.service.externalId,
    period,
    links,
    linksToDisplay,
    goLiveNotStarted: req.service.currentGoLiveStage === NOT_STARTED,
    goLiveStarted: goLiveStartedStages.includes(req.service.currentGoLiveStage),
    goLiveRequested: goLiveRequestedStages.includes(req.service.currentGoLiveStage),
    account: req.account
  }

  try {
    const { fromDateTime, toDateTime } = getTransactionDateRange(period)

    const transactionsPeriodString = `fromDate=${encodeURIComponent(datetime(fromDateTime, 'date'))}&fromTime=${encodeURIComponent(datetime(fromDateTime, 'time'))}&toDate=${encodeURIComponent(datetime(toDateTime, 'date'))}&toTime=${encodeURIComponent(datetime(toDateTime, 'time'))}`

    logger.info(`[${correlationId}] successfully logged in`)

    if (isADirectDebitAccount(gatewayAccountId)) {
      // todo implement transaction list for direct debit
      return response(req, res, 'dashboard/index', Object.assign(model, {
        activityError: true
      }))
    }

    const namespace = getNamespace(clsXrayConfig.nameSpaceName)
    const clsSegment = namespace.get(clsXrayConfig.segmentKeyName)

    AWSXRay.captureAsyncFunc('ledgerClient_getTransactionSummary', function (subsegment) {
      LedgerClient.transactionSummary(gatewayAccountId, fromDateTime, toDateTime, { correlationId: correlationId })
        .then(result => {

const makeNiceURL = string => {
  return slugify(removeIndefiniteArticles(string))
}