{"version":3,"file":"613.bundle.js","mappings":"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","sources":["webpack:///./components/article-content/index.js","webpack:///./components/article-links/index.js","webpack:///./pages/topic-details/index.js"],"sourcesContent":["import { HeadingText } from '@paypalcorp/pp-react'\nimport React, { useEffect, useRef } from 'react'\nimport { PAYPAL_OBJECTS_BASE_URL } from '../../constants'\nimport useTracking from '../../hooks/useTracking'\nimport { componentNames, fptiTypes } from '../../utils/analytics/fpti-constants'\nimport {\n getArticleVideoIframeSrcDoc,\n loadYTIframeScript,\n} from '../../utils/helper'\nimport { ARTICLE_CONTENT_DATA } from '../../utils/prop-type-shape'\nimport _isEmpty from 'lodash/isEmpty'\n\n// styles\nimport './article-content.less'\n\n// Article Component\nfunction ArticleContent(props) {\n const { articleContent, articleId, exp } = props\n const { trackActivity, trackClick } = useTracking()\n const articleContentRef = useRef(null)\n // get the ECM API tags from article data\n const { ecmComponentIds, ecmDocId } = articleContent\n const helpDocId = ecmDocId || articleId || ''\n const helpComponentIds = ecmComponentIds || ''\n\n // On component mount\n useEffect(() => {\n const loadYTIframeAPI = (onScriptLoad) => {\n loadYTIframeScript()\n window.onYouTubeIframeAPIReady = onScriptLoad\n }\n\n const handleClickOnLinks = (e, link) => {\n const href = link.getAttribute('href')\n\n if (!href) {\n e.preventDefault()\n trackClick({\n name: componentNames.ARTICLE_CONTENT,\n articleContentExp: exp,\n type: fptiTypes.ON_CLICK,\n help_doc_id: helpDocId,\n help_component_ids: helpComponentIds,\n link: `article-content|${helpDocId}|broken-link-clicked`,\n })\n } else {\n trackClick({\n name: componentNames.ARTICLE_CONTENT,\n articleContentExp: exp,\n type: fptiTypes.ON_CLICK,\n help_doc_id: helpDocId,\n help_component_ids: helpComponentIds,\n link: `article-content|${helpDocId}|link-clicked|${href}`,\n })\n }\n }\n\n const trackVideoPlayEvents = (videoSrc) => {\n // Add FPTI event for when video would be played\n trackClick({\n name: componentNames.ARTICLE_CONTENT,\n articleContentExp: exp,\n link: `article-content-video-played|${videoSrc}`,\n help_doc_id: helpDocId,\n help_component_ids: helpComponentIds,\n event_name: 'article_content_video_played_in_article_page',\n type: fptiTypes.SUCCESS,\n })\n }\n\n const trackVideoPauseEvents = (videoSrc) => {\n // Add FPTI event for when video would be paused\n trackClick({\n name: componentNames.ARTICLE_CONTENT,\n articleContentExp: exp,\n link: `article-content-video-paused|${videoSrc}`,\n help_doc_id: helpDocId,\n help_component_ids: helpComponentIds,\n event_name: 'article_content_video_paused_in_article_page',\n type: fptiTypes.SUCCESS,\n })\n }\n\n const onPlayerStateChange = (event, videoSrc) => {\n // eslint-disable-next-line default-case\n switch (event.data) {\n case window.YT.PlayerState.PLAYING:\n trackVideoPlayEvents(videoSrc)\n break\n case window.YT.PlayerState.PAUSED:\n trackVideoPauseEvents(videoSrc)\n break\n }\n }\n\n const trackYTVideoEvents = (videos) => {\n videos.forEach((video) => {\n if (window.YT) {\n // eslint-disable-next-line no-new\n new window.YT.Player(video, {\n events: {\n onStateChange: (e) => onPlayerStateChange(e, video.src),\n onReady: () => {\n trackActivity({\n name: componentNames.ARTICLE_CONTENT,\n exp,\n link: `article-content-video-displayed|${video.src}`,\n event_name: 'article_content_video_displayed_in_article_page',\n help_doc_id: helpDocId,\n help_component_ids: helpComponentIds,\n type: fptiTypes.SUCCESS,\n })\n },\n },\n })\n }\n })\n }\n\n // FPTI Events for video play and pause controls\n const addFPTIsForVideoPlayPause = (videoElement, videoSrc) => {\n videoElement.addEventListener('play', () =>\n trackVideoPlayEvents(videoSrc),\n )\n\n videoElement.addEventListener('pause', () =>\n trackVideoPauseEvents(videoSrc),\n )\n }\n\n const parseArticleContent = () => {\n // Adding setTimeout on top as tag element is not picked immediately safari and IE versions\n setTimeout(() => {\n if (!articleContentRef) {\n return\n }\n\n // Link click Tracking in Article Component\n const contentLinks =\n articleContentRef.current.querySelectorAll('a[href]')\n Array.from(contentLinks).forEach((link) => {\n link.addEventListener('click', (e) => {\n const clickTarget = e.target\n const { id } = clickTarget\n\n // To check if the click content is solutionLink\n if (id && clickTarget.name === 'solutionLink') {\n // make the faqId the href for fpti usage\n link.href = id\n }\n\n handleClickOnLinks(e, link)\n })\n })\n\n // warp image in the article content\n let imageTags = articleContentRef.current.getElementsByTagName('img')\n imageTags = Array.prototype.slice.call(imageTags)\n imageTags.forEach((tag) => {\n const divEl = document.createElement('img')\n divEl.setAttribute('src', tag.src)\n divEl.style.height = `${tag.height}px`\n divEl.style.maxWidth = `${tag.width}px`\n divEl.setAttribute('alt', tag.alt)\n divEl.className = 'hc_article-content__image'\n tag.parentNode.replaceChild(divEl, tag)\n })\n\n // Logic to add video event listeners for play and pause for the videos [Paypal object videos] that are inside iframe.\n let iframeTags =\n articleContentRef.current.getElementsByTagName('iframe')\n iframeTags = Array.prototype.slice.call(iframeTags)\n const ytVideos = []\n iframeTags.forEach((tag) => {\n const videoEl = tag\n videoEl.className = 'hc_article-content__iFrame'\n\n if (tag.src && tag.src.includes('youtube')) {\n videoEl.setAttribute(\n 'src',\n tag.src &&\n tag.src.replace('youtube.com', 'youtube-nocookie.com') +\n '?enablejsapi=1',\n )\n ytVideos.push(videoEl)\n return\n }\n\n // This should not be done ideally, we should get proper format from ECM to display video and track events\n if (\n videoEl.src &&\n videoEl.src.startsWith(PAYPAL_OBJECTS_BASE_URL) &&\n !videoEl.srcdoc\n ) {\n videoEl.setAttribute('srcdoc', getArticleVideoIframeSrcDoc(videoEl))\n }\n tag.parentNode.replaceChild(videoEl, tag)\n\n videoEl.onload = function () {\n const iFrameDocument = videoEl.contentDocument\n const videoSrc = videoEl.src\n\n if (iFrameDocument) {\n const videoElement =\n iFrameDocument.getElementsByTagName('video')[0] || null\n if (videoElement) {\n // set video element width to 100% to display videos appropriatly for all device resolutions\n videoElement.setAttribute('width', '100%')\n\n trackActivity({\n name: componentNames.ARTICLE_CONTENT,\n articleContentExp: exp,\n link: `article-content-video-displayed|${videoSrc}`,\n event_name: 'article_content_video_displayed_in_article_page',\n help_doc_id: helpDocId,\n help_component_ids: helpComponentIds,\n type: fptiTypes.SUCCESS,\n })\n\n addFPTIsForVideoPlayPause(videoElement, videoSrc)\n }\n }\n }\n })\n\n if (ytVideos.length) {\n loadYTIframeAPI(() => trackYTVideoEvents(ytVideos))\n }\n\n // Logic to add video event listeners for play and pause for the videos\n // that are coming directly with out iframe.\n let videoTags = articleContentRef.current.getElementsByTagName('video')\n videoTags = Array.prototype.slice.call(videoTags)\n\n videoTags.forEach((videoElement) => {\n const videoSrc = videoElement.currentSrc\n\n trackActivity({\n name: componentNames.ARTICLE_CONTENT,\n articleContentExp: exp,\n link: `article-content-video-displayed|${videoSrc}`,\n event_name: 'article_content_video_displayed_in_article_page',\n help_doc_id: helpDocId,\n help_component_ids: helpComponentIds,\n type: fptiTypes.SUCCESS,\n })\n\n // FPTI event listeners for play and pause\n addFPTIsForVideoPlayPause(videoElement, videoSrc)\n })\n })\n }\n if (_isEmpty(articleContent) || _isEmpty(articleContent.articleContent)) {\n return trackActivity({\n name: componentNames.ARTICLE_CONTENT,\n articleContentExp: exp,\n type: fptiTypes.ERROR,\n help_doc_id: helpDocId,\n help_component_ids: helpComponentIds,\n })\n }\n\n parseArticleContent()\n\n return trackActivity({\n name: componentNames.ARTICLE_CONTENT,\n articleContentExp: exp,\n type: fptiTypes.SUCCESS,\n help_doc_id: helpDocId,\n help_component_ids: helpComponentIds,\n })\n }, [\n articleContent,\n exp,\n helpComponentIds,\n helpDocId,\n articleContentRef,\n trackActivity,\n trackClick,\n ])\n\n return (\n <>\n \n {articleContent.articleTitle}\n \n\n \n \n )\n}\n\nArticleContent.propTypes = ARTICLE_CONTENT_DATA\n\nexport default ArticleContent\n","import { Link } from '@paypalcorp/pp-react'\nimport React, { useEffect } from 'react'\nimport { Message } from '@paypalcorp/worldready-react'\nimport { ARTICLE_LINKS_DATA } from '../../utils/prop-type-shape'\nimport { getTitleForArticleUrl } from '../../utils/helper'\nimport { componentNames, fptiTypes } from '../../utils/analytics/fpti-constants'\n\n// Hooks\nimport useTracking from '../../hooks/useTracking'\nimport { useHelper } from '../../hooks/useHelper'\n\n// styles\nimport './article-links.less'\n\nconst linkTargetMappings = {\n [componentNames.COMMUNITY_POSTS]: '_blank',\n}\n\n// Note: If you need to implement any custom logic for any of the sections using this component, please clone it.\n// Ref: https://github.paypal.com/Customer-Support-R/helpcenternodeweb/pull/35#discussion_r4273361\nfunction ArticleLinks({ articleId, articlesData, componentName }) {\n const { trackActivity, trackClick } = useTracking()\n const { generateLinkWithCoBrand } = useHelper()\n\n // Component onmount\n useEffect(() => {\n trackActivity({\n name: componentName,\n type: fptiTypes.SUCCESS,\n })\n }, [componentName, trackActivity])\n\n // article link onclick handler\n const articleOnClickHandler = (e, url, articleData) => {\n e.preventDefault()\n\n // FPTI\n const fptiOptions = {\n name: componentName,\n type: fptiTypes.ON_CLICK,\n help_doc_id: articleId,\n link: `${componentName}|${articleId}|${articleData.articleId}|clicked|${url}`,\n }\n trackClick(fptiOptions)\n window.open(url, linkTargetMappings[componentName] || '_self')\n }\n\n const isArticleLinksExist = () =>\n articlesData && Array.isArray(articlesData) && articlesData.length\n\n const renderLinkTitle = (articleTitle, views) => {\n if (componentName === componentNames.COMMUNITY_POSTS) {\n return (\n \n )\n }\n return articleTitle\n }\n const renderArticleLinks = () => {\n if (isArticleLinksExist()) {\n return articlesData.map((articleData) => {\n const formattedTitle = () =>\n getTitleForArticleUrl(articleData.articleTitle, articleData.articleId)\n const url =\n articleData.link ||\n generateLinkWithCoBrand(`/cshelp/article/${formattedTitle()}`)\n\n return (\n
\n articleOnClickHandler(e, url, articleData)}\n >\n {renderLinkTitle(articleData.articleTitle, articleData.views)}\n \n
\n )\n })\n }\n return null\n }\n return <>{renderArticleLinks()}\n}\n\nArticleLinks.propTypes = ARTICLE_LINKS_DATA\n\nexport default ArticleLinks\n","import { Container, HeadingText, Row } from '@paypalcorp/pp-react'\nimport { Message } from '@paypalcorp/worldready-react'\nimport React, { Suspense, useEffect } from 'react'\nimport Alerts from '../../components/alerts'\nimport ArticleContent from '../../components/article-content'\nimport ArticleLinks from '../../components/article-links'\nimport ContactChannels from '../../components/contact-channels'\nimport HeroModule from '../../components/hero-module'\nimport ShimmerLoader from '../../components/loaders/shimmerLoader'\nimport { CHAT_ENTRY_POINT_NAMES } from '../../constants'\nimport { API_NAMES } from '../../constants/api'\nimport { useAppContext } from '../../contexts/app-context'\nimport useAPI from '../../hooks/useAPI'\nimport useTracking from '../../hooks/useTracking'\nimport {\n ARTICLE_INTENTS_NO_DATA_EVENT,\n componentNames,\n fptiTypes,\n} from '../../utils/analytics/fpti-constants'\n\nexport default function TopicDetails() {\n const appCtx = useAppContext()\n const { fptiTypeByStatusCode, trackActivity } = useTracking()\n const { postAPI } = useAPI()\n const {\n pageProps,\n reqContextData: { exp, isLoggedIn },\n } = appCtx\n const { apiData, pageName } = pageProps\n const { article = {}, contactOptions } = apiData\n\n const isArticleContentExist = () => article?.articleContent?.articleContent\n\n const isRelatedArticlesExist = () =>\n isArticleContentExist() &&\n Array.isArray(article?.articleContent?.relatedArticles) &&\n article.articleContent.relatedArticles.length\n\n const getArticleId = () => article?.articleContent?.articleId\n\n const renderArticleContent = () => {\n if (isArticleContentExist()) {\n const {\n articleContent,\n ecmComponentIds,\n ecmDocId,\n articleId,\n articleTitle,\n } = article.articleContent\n return (\n \n )\n }\n\n const { isError, statusCode } = article\n const type = isError && fptiTypeByStatusCode(statusCode)\n trackActivity({\n name: componentNames.ARTICLE_CONTENT,\n type,\n help_doc_id: getArticleId(),\n })\n return null\n }\n\n const setOCPContext = async () => {\n // set ocp context for loggedin user and when article content exists\n if (isLoggedIn && isArticleContentExist()) {\n const tags = article?.articleContent?.tags\n // extract predictions from tags if exist\n const predictions =\n Array.isArray(tags) && tags.length && tags[0].predictions\n if (Array.isArray(predictions) && predictions.length) {\n const intents = predictions.map(({ intent, score, intent_code }) => ({\n customer_intent: intent,\n score,\n code: intent_code,\n }))\n try {\n const body = {\n intents,\n articleId: getArticleId(),\n customerConfirmed: true,\n }\n await postAPI(API_NAMES.OCP_SET_CONTEXT, { body })\n } catch (error) {\n // In case of failure ignore it\n }\n } else {\n // This FPTI will help to know which articles are missing the intent mappings.\n trackActivity({\n name: componentNames.ARTICLE_INTENTS,\n type: fptiTypes.NO_DATA,\n event_name: ARTICLE_INTENTS_NO_DATA_EVENT,\n help_doc_id: getArticleId(),\n })\n }\n }\n }\n\n useEffect(() => {\n setOCPContext()\n }, [])\n\n const renderRelatedTopics = () => {\n const renderRelatedArticles = () => {\n return (\n \n )\n }\n\n if (isRelatedArticlesExist()) {\n return (\n <>\n \n \n \n {renderRelatedArticles()}\n \n )\n }\n\n trackActivity({\n name: componentNames.RELATED_ARTICLES,\n type: fptiTypes.NO_DATA,\n help_doc_id: getArticleId(),\n })\n return null\n }\n\n const renderContactChannels = () => {\n const { data, isError, statusCode } = contactOptions\n if (!isError) {\n return (\n \n )\n }\n\n // FPTI Tracking\n const type = isError && fptiTypeByStatusCode(statusCode)\n trackActivity({\n name: componentNames.CONTACT_CHANNELS,\n type,\n })\n return null\n }\n\n const renderTopicDetails = () => {\n return (\n
\n \n \n }>\n \n \n \n \n \n \n {renderArticleContent()}\n {renderRelatedTopics()}\n {renderContactChannels()}\n \n
\n )\n }\n\n return renderTopicDetails()\n}\n"],"names":["ArticleContent","props","articleContent","articleId","exp","useTracking","trackActivity","trackClick","articleContentRef","useRef","ecmComponentIds","helpDocId","ecmDocId","helpComponentIds","useEffect","trackVideoPlayEvents","videoSrc","name","componentNames","ARTICLE_CONTENT","articleContentExp","link","help_doc_id","help_component_ids","event_name","type","fptiTypes","SUCCESS","trackVideoPauseEvents","addFPTIsForVideoPlayPause","videoElement","addEventListener","_isEmpty","ERROR","setTimeout","contentLinks","current","querySelectorAll","Array","from","forEach","e","clickTarget","target","id","href","getAttribute","ON_CLICK","preventDefault","handleClickOnLinks","imageTags","getElementsByTagName","prototype","slice","call","tag","divEl","document","createElement","setAttribute","src","style","height","maxWidth","width","alt","className","parentNode","replaceChild","iframeTags","onScriptLoad","ytVideos","videoEl","includes","replace","push","startsWith","PAYPAL_OBJECTS_BASE_URL","srcdoc","getArticleVideoIframeSrcDoc","onload","iFrameDocument","contentDocument","length","video","window","YT","Player","events","onStateChange","event","data","PlayerState","PLAYING","PAUSED","onPlayerStateChange","onReady","loadYTIframeScript","onYouTubeIframeAPIReady","videoTags","currentSrc","as","size","articleTitle","dangerouslySetInnerHTML","__html","ref","propTypes","ARTICLE_CONTENT_DATA","linkTargetMappings","COMMUNITY_POSTS","ArticleLinks","articlesData","componentName","generateLinkWithCoBrand","useHelper","isArray","map","articleData","views","url","getTitleForArticleUrl","key","onClick","fptiOptions","open","articleOnClickHandler","Message","title","ARTICLE_LINKS_DATA","TopicDetails","appCtx","useAppContext","fptiTypeByStatusCode","postAPI","useAPI","pageProps","reqContextData","isLoggedIn","apiData","pageName","article","contactOptions","isArticleContentExist","getArticleId","setOCPContext","tags","predictions","intents","customer_intent","intent","score","code","intent_code","body","customerConfirmed","API_NAMES","OCP_SET_CONTEXT","ARTICLE_INTENTS","NO_DATA","ARTICLE_INTENTS_NO_DATA_EVENT","Suspense","fallback","xxl","A","isError","statusCode","renderArticleContent","relatedArticles","RELATED_ARTICLES","chatEntryPointName","CHAT_ENTRY_POINT_NAMES","CONTACT_PAGE_INTENT_MESSAGE_US","channels","urls","topicRefId","CONTACT_CHANNELS","renderContactChannels"],"sourceRoot":""}