\n \n \n \n \n );\n }\n return null;\n }\n}\n\nOfferDetail.propTypes = {\n offerProgram: PropTypes.object.isRequired,\n success: PropTypes.bool,\n};\n\nexport default OfferDetail;\n","import { getInitialData } from './formator';\nimport get from 'lodash/get';\nimport getContent from 'pp-react-l10n';\n\nconst cache = {};\n\nexport const getTouchpoint = (touchpointCode) => {\n if (cache[touchpointCode]) {\n return cache[touchpointCode];\n }\n const personalizedMessages = getInitialData().personalizedMessages || [];\n\n for (let touchpoint of personalizedMessages) {\n if (touchpoint.touchpoint_code === touchpointCode) {\n cache[touchpointCode] = touchpoint;\n return touchpoint;\n }\n }\n return null;\n};\n\nexport const getPersonalizedMessages = (\n touchpointCode,\n { merge = false, isHtml = true, includeImpressionUrl = false } = {}\n) => {\n const touchpoint = getTouchpoint(touchpointCode);\n if (!touchpoint || !touchpoint.messages) {\n return merge ? [] : {};\n }\n\n if (merge) {\n const messages = [];\n touchpoint.messages.forEach((message) => {\n if (message.content?.json) {\n Object.keys(message.content.json)\n .sort()\n .forEach((contentKey) => {\n if (isHtml) {\n messages.push(\n getContent(\n `personalized.${touchpointCode}.${contentKey}`,\n null,\n {\n useHTML: true,\n }\n ),\n ' '\n );\n } else {\n messages.push(message.content.json[contentKey]);\n }\n });\n }\n });\n return messages;\n }\n\n let messages = {};\n touchpoint.messages.forEach((message) => {\n if (message.content?.json) {\n Object.keys(message.content.json).forEach((contentKey) => {\n messages[contentKey] = isHtml\n ? getContent(`personalized.${touchpointCode}.${contentKey}`, null, {\n useHTML: true,\n })\n : message.content.json[contentKey];\n });\n }\n if (includeImpressionUrl) {\n messages = {\n content: messages,\n trackingDetails: {\n impressionUrl: message.tracking_details.impression_url,\n },\n };\n }\n });\n return messages;\n};\n\nexport const hasPersonalizedMessages = (touchpointCode) => {\n const touchpoint = getTouchpoint(touchpointCode);\n return touchpoint?.messages[0]?.content?.json;\n};\n\nexport const getPersonalizedMessagesAsContentLoaderStandard = () => {\n const personalizedMessages = getInitialData().personalizedMessages || [];\n const result = {};\n for (let touchpoint of personalizedMessages) {\n result[touchpoint.touchpoint_code] = get(\n touchpoint,\n 'messages[0].content.json',\n {}\n );\n }\n return result;\n};\n","import React from 'react';\nimport * as AppActions from '../actions/AppActions';\n\nexport default function withCurrentPageUpdate(WrappedComponent, currentPage) {\n return class WithCurrentPageUpdate extends React.Component {\n componentDidMount() {\n AppActions.updateCurrentPage({\n currentPage: currentPage,\n });\n }\n\n render() {\n return ;\n }\n };\n}\n","import React from 'react';\nimport withCurrentPageUpdate from '../../confirmation/withCurrentPageUpdate';\nimport withPageTrack from '../../confirmation/withPageTrack';\nimport withPostTransactionRequest from '../../confirmation/withPostTransactionRequest';\nimport PendingView from '../../confirmation/PendingView';\nimport SuccessView from '../../confirmation/SuccessView';\n\nconst PAGE_UPDATE_TAG = 'memberConfirmation';\nconst POST_TRANSACTION_URL = '/donate/member/postTransaction';\nconst FLOW = 'member';\n\nexport const MemberConfirmationPending = withPageTrack(\n withCurrentPageUpdate(\n withPostTransactionRequest(PendingView, POST_TRANSACTION_URL),\n PAGE_UPDATE_TAG\n ),\n FLOW,\n 'pending'\n);\n\nexport const MemberConfirmationRecurring = withPageTrack(\n withCurrentPageUpdate(SuccessView, 'MemberRecurringConfirmation'),\n FLOW,\n 'success'\n);\n\nexport const MemberConfirmationSuccess = withPageTrack(\n withCurrentPageUpdate(\n withPostTransactionRequest(SuccessView, POST_TRANSACTION_URL),\n PAGE_UPDATE_TAG\n ),\n FLOW,\n 'success'\n);\n","import React, { useEffect, useState } from 'react';\nimport { localsMessages } from '../../utility/getTemplateData';\nimport { Tooltip } from '@paypalcorp/pp-react';\nimport AppDispatcher from '../../dispatcher/AppDispatcher';\nimport * as AppConstants from '../../utility/constants';\nimport AppStore from '../../stores/AppStore';\nimport PropTypes from 'prop-types';\n\nconst messages = localsMessages('common/ppcc');\n\nfunction PPCC({ isHeader }) {\n const [showTooltip, setShowTooltip] = useState(AppStore.getPPCCStatus());\n let dispatcherMessages;\n const registerAppDispatcherMessages = () => {\n dispatcherMessages = AppDispatcher.register((payload) => {\n if (\n payload.action &&\n payload.action.actionType === AppConstants.UPDATE_PPCC_STATUS\n ) {\n setShowTooltip(payload.action.item);\n }\n });\n };\n\n useEffect(() => {\n registerAppDispatcherMessages();\n return function cleanup() {\n AppDispatcher.unregister(dispatcherMessages);\n };\n }, []);\n\n if (!showTooltip) {\n return null;\n }\n return (\n \n );\n}\n\nPPCC.propTypes = {\n isHeader: PropTypes.bool,\n};\n\nexport default PPCC;\n","/*\n * Returns the interval between navigationStart and current time\n */\nconst getTimeToInteract = () => {\n const startTime = window?.performance?.timing?.navigationStart;\n // send the difference only when startTime is available\n\n return startTime ? Date.now() - startTime : 0;\n};\n\n/*\n * Function that returns the page load time\n */\nconst getPageLoadTime = () => {\n const time = window?.performance?.timing || {};\n\n // send the difference only when time is available\n return time ? time.loadEventEnd - time.navigationStart : 0;\n};\n\nconst getDeviceAndNetworkInfo = () => {\n const networkInfo = window?.navigator?.connection || {};\n\n return {\n screen_width: window?.innerWidth || document?.documentElement?.clientWidth, // fallback to clientWidth to support ie\n screen_height:\n window?.innerHeight || document?.documentElement?.clientHeight, // fallback to clientHeight to support ie\n network_effectiveType: networkInfo?.effectiveType, // 2g, 3g, wifi , etc calculated from downlink and etc\n };\n};\n\n/**\n *\n * @param { action, uicomp, uitype, page } params\n */\n\nexport const logPerformance = (params) => {\n if (!window?.PAYPAL?.analytics?.logPerformance) {\n return;\n }\n\n const deviceAndNetworkInfo = getDeviceAndNetworkInfo(),\n logPerformanceData = {\n ...params,\n tt: getPageLoadTime(), // tt - The whole process of navigation and page load\n view: {\n t11: getTimeToInteract(),\n et: deviceAndNetworkInfo?.network_effectiveType, // network connection type\n pt: document.title, // page title\n ru: document.referrer, // referrer\n cd: window.screen.colorDepth, // screenColorDepth\n sw: window.screen.width, // screenWidth\n sh: window.screen.height, // screenHeight\n dw: window.screen.width * (window.devicePixelRatio || 1), // deviceWidth\n dh: window.screen.height * (window.devicePixelRatio || 1), // deviceHeight\n bw: deviceAndNetworkInfo?.screen_width, // browserWidth\n bh: deviceAndNetworkInfo?.screen_height, // browserHeight\n },\n };\n\n try {\n window.PAYPAL.analytics.logPerformance(logPerformanceData);\n } catch (error) {\n console.log('Error populating log performance data: ', error);\n }\n};\n\nexport const startCustomCPLTrackingForConfirmationPage = () => {\n const page = `${window.fpti.page.split('success:')[0]}confirmationView:web:`;\n window.PAYPAL.analytics.startCPLTracking({\n page,\n action: 'confirmation_page_loaded',\n uicomp: 'confirmationView',\n uitype: 'page',\n });\n};\n\nexport const endCustomCPLTrackingForConfirmationPage = () => {\n const page = `${window.fpti.page.split('success:')[0]}confirmationView:web:`;\n window.PAYPAL.analytics.endCPLTracking({\n page,\n action: 'confirmation_page_loaded',\n uicomp: 'confirmationView',\n uitype: 'page',\n });\n};\n","import React, { useEffect, useState } from 'react';\nimport { CaptionText } from '@paypalcorp/pp-react';\nimport PropTypes from 'prop-types';\nimport isEmpty from 'lodash/isEmpty';\nimport { EVENT_NAME } from '../utility/constants';\nimport { trackLinkClick } from '../fpti/fpti';\n\nexport default function Disclaimer(props) {\n const [content, setContent] = useState(null);\n\n useEffect(() => {\n setContent(props.content);\n }, []);\n\n useEffect(() => {\n const terms = document.querySelectorAll(\n 'div[data-testid=\"disclaimer-content\"] > span > a'\n );\n if (terms?.length > 0 && props.content) {\n // terms is a NodeList of type object\n for (let i = 0; i < terms.length; i++) {\n terms[i].addEventListener('click', () => {\n const link = terms[i].href?.split('/').pop();\n trackLinkClick(link, {\n eventName: EVENT_NAME.DW_GIVING_DONATE_SETUP_TERMS_PRESSED,\n });\n });\n }\n }\n }, [content]);\n\n if (isEmpty(content)) {\n return null;\n }\n\n return (\n \n {content}\n \n );\n}\n\nDisclaimer.propTypes = {\n content: PropTypes.oneOfType([\n PropTypes.array,\n PropTypes.string,\n PropTypes.element,\n ]),\n};\n","import templateData from './getTemplateData';\nimport { getParameterByName } from './queryStringHelper';\nconst languagesList = templateData.languagesList;\n\nexport function getCurrentLangName() {\n const languageCode = templateData.language;\n let currentLanguage = 'English';\n languagesList.forEach((lang) => {\n const languageName = lang.split('-')[0];\n const locale = lang.split('-')[1];\n if (locale.split('_')[0] === languageCode) {\n currentLanguage = languageName;\n }\n });\n\n return currentLanguage;\n}\n\nexport function getLanguageOptions() {\n const lang_options = [];\n languagesList.forEach((lang) => {\n const languageName = lang.split('-')[0];\n lang_options.push({\n title: languageName,\n });\n });\n\n return lang_options;\n}\n\nexport function updatePageLanguageByLocale(locale) {\n const urlParams = `token=${templateData.token}&locale.x=${locale}`;\n const isOnGuestForm =\n window.location.href.indexOf('/guest') > 0 ||\n ![undefined, null].includes(getParameterByName('signup'));\n\n let updatedUrl;\n if (isOnGuestForm) {\n const clientState = encodeURIComponent(`/donate/guest?${urlParams}`);\n updatedUrl = `/donate/?${urlParams}&clientState=${clientState}`;\n } else {\n updatedUrl = `${window.location.href.split('?')[0]}?${urlParams}`;\n }\n\n window.location.href = updatedUrl;\n}\n","import React, { useState } from 'react';\nimport { ActionMenu, Button, Icon } from '@paypalcorp/pp-react';\nimport templateData from '../utility/getTemplateData';\nimport { showSpinnerOverlay } from '../utility/helper';\nimport {\n getCurrentLangName,\n updatePageLanguageByLocale,\n getLanguageOptions,\n} from '../utility/languageSelector';\n\nconst languagesList = templateData.languagesList;\n\nexport default function LanguageSelector() {\n const [isOpen, setIsOpen] = useState(false);\n const currentLanguage = getCurrentLangName();\n const options = getLanguageOptions();\n\n if (!options) return null;\n\n const openMenu = () => {\n setIsOpen(!isOpen);\n };\n\n const closeMenu = () => {\n setIsOpen(false);\n };\n\n const getLocale = (index) => {\n const lang = languagesList[index];\n const locale = `${lang.split('-')[1].split('_')[0]}_${\n templateData.country\n }`;\n return locale;\n };\n\n const selectMenuItem = (index) => {\n showSpinnerOverlay();\n const locale = getLocale(index);\n updatePageLanguageByLocale(locale);\n };\n\n return (\n
\n \n \n
\n );\n}\n","import React from 'react';\nimport getContent from 'pp-react-l10n';\nimport PropTypes from 'prop-types';\nimport { Col, Row, Link } from '@paypalcorp/pp-react';\nconst getFooterContent = getContent('locals')('common/footerDonate');\n\nexport const Help = () => (\n