\r\n\r\n \r\n {parseInt(layout.selectedLoanNumber) > 0 ? <>\r\n LOAN - {layout.selectedLoanNumber} {layout.currentLoan?.helocFlag ? \" ( HELOC )\" : null} \r\n {layout?.currentLoan?.propertyAddressLine1} \r\n :
}\r\n \r\n\r\n \r\n {getActiveFeatures(layout.features, `theme_switcher`, layout.whitelisted) && \r\n }\r\n {loanArray?.length > 1 ?\r\n \r\n ![\"Collapsed]({require(\"../assets/downarrow.png\")})
}\r\n loanStyles={{}}\r\n loans={loanArray.map(s => {\r\n let title = (parseInt(s.lienPriorityType) === 2)? 'Closed End Second' : (s.helocFlag ? `- HELOC - Loan` : \"Mortgage Loan\")\r\n return { loanId: parseInt(s.loanId), propertyStreet: s.propertyAddressLine1, displayTitle: `${title} ${parseInt(s.loanId)}`, lienPriorityType:s.lienPriorityType }\r\n })}\r\n selectedValue={layout.selectedLoanNumber}\r\n contentStyle={{ marginTop: 25 }}\r\n style={{ position: \"relative\", top: \"unset\", left: \"unset\", width: '100%' }}\r\n onValueChange={(itemValue, itemIndex) => {\r\n this.props.trackerDispatcher(UserLanguage_ENUM.English, TrackerCategoryLID_ENUM.NavBar, TrackerHitTypeLID_ENUM.Event, TrackerActionLID_ENUM.Click, \"Loan Selection is changed\", 0)\r\n if (itemValue != layout.selectedLoanNumber) {\r\n this.props.dispatch({ type: SELECT_LOAN, loanId: itemValue })\r\n this.props.refreshSingleLoanData(itemValue)\r\n this.props.refreshResourcesAfterLoanSwitching()\r\n }\r\n }}\r\n />\r\n
\r\n : }\r\n loanStyles={{}}\r\n loans={loanArray.map(s => {\r\n let title = (parseInt(s.lienPriorityType) === 2)? 'Closed End Second' : (s.helocFlag ? `- HELOC - Loan` : \"Mortgage Loan\")\r\n return { loanId: parseInt(s.loanId), propertyStreet: s.propertyAddressLine1, displayTitle: `${title} ${parseInt(s.loanId)}`, lienPriorityType:s.lienPriorityType }\r\n })}\r\n selectedValue={layout.selectedLoanNumber}\r\n contentStyle={{ marginTop: 25 }}\r\n style={{ position: \"relative\", top: \"unset\", left: \"unset\", width: '100%' }}\r\n onValueChange={(itemValue, itemIndex) => {\r\n this.props.trackerDispatcher(UserLanguage_ENUM.English, TrackerCategoryLID_ENUM.NavBar, TrackerHitTypeLID_ENUM.Event, TrackerActionLID_ENUM.Click, \"Loan Selection is changed\", 0)\r\n if (itemValue != layout.selectedLoanNumber) {\r\n this.props.dispatch({ type: SELECT_LOAN, loanId: itemValue })\r\n this.props.refreshSingleLoanData(itemValue)\r\n this.props.refreshResourcesAfterLoanSwitching()\r\n }\r\n }}\r\n />\r\n \r\n\r\n \r\n {parseInt(layout.selectedLoanNumber) > 0 ? <>\r\n LOAN - {layout.selectedLoanNumber} {layout.currentLoan?.helocFlag ? \" ( HELOC )\" : null} \r\n {layout?.currentLoan?.propertyAddressLine1} \r\n :
}\r\n ![\"Expanded]({require(\"../assets/expand-icon.png\")}){kind=icon}
}}\r\n onListItemClick={(d) => {\r\n if (!this.props.layout.loading) {\r\n if (typeof d.action == \"function\") {\r\n d.action()\r\n this.props.trackerDispatcher(UserLanguage_ENUM.English, TrackerCategoryLID_ENUM.NavBar, TrackerHitTypeLID_ENUM.Event, TrackerActionLID_ENUM.Click, d.name + ` Page Viewed`, -1);\r\n } else {\r\n if (d.internal && getActiveFeatures(this.props.layout.features, `View_${d.action}`, this.props.layout.whitelisted)) {\r\n this.props.history.push(`/${d.route}`);\r\n let message = d.action + ` Page Viewed`;\r\n if(d.action === 'Escrow_Analysis_Payment_Change'){\r\n message = \"Escrow Analysis Payment Change Viewed\";\r\n }else if(d.action === \"TaxOptions\"){\r\n message = \"Customer Viewed Tax Option Page\"\r\n }else if(d.route === \"Offers\")\r\n {\r\n message = \"Left-Navigation/Offers|Desktop\"\r\n }\r\n this.props.trackerDispatcher(UserLanguage_ENUM.English, TrackerCategoryLID_ENUM.NavBar, TrackerHitTypeLID_ENUM.Event, TrackerActionLID_ENUM.Click, message, 0)\r\n if (this.props.layout.drawerOpen) {\r\n this.props.dispatch({ type: TOGGLE_DRAWER, toggle: false });\r\n }\r\n\r\n } else {\r\n this.props.clearListCookies({\r\n nav: `${layout.baseRoute}${d.route}`, loading: true, logout: false, tab: false\r\n })\r\n }\r\n }\r\n }\r\n }}\r\n containerStyles={styles.navPanel.containerStyles}\r\n listItemStyles={styles.navPanel.listItemStyles}\r\n subListItemStyles={styles.navPanel.subListItemStyles}\r\n textItemStyles={styles.navPanel.textItemStyles}\r\n listItems={menuItems ? menuItems : listItems}\r\n />\r\n\r\n \r\n );\r\n }\r\n}\r\n\r\nexport default NavBar\r\n","import React, {Component, useState} from \"react\";\r\nimport {View, Text, Image, Platform, TouchableOpacity} from \"react-native\";\r\nimport {connect} from \"react-redux\";\r\nimport {bindActionCreators} from \"redux\";\r\nimport NavBar from \"./NavBar\";\r\nimport Footer from \"./Footer\";\r\nimport {withRouter} from \"react-router\";\r\nimport {\r\n PnmacUIButton,\r\n PnmacAppbarHeader,\r\n PnmacAppbarContent,\r\n PnmacToaster,\r\n PnmacActivityIndicatorGif,\r\n PnmacMediaQuery,\r\n AppActions,\r\n AppEvents,\r\n Events,\r\n MacChat,\r\n Hoverable,\r\n isSubServicingLoan\r\n} from 'pnmac-universal-components'\r\nimport MenuIcon from '@material-ui/icons/Menu';\r\nimport {getActiveFeatures, toCamel, windowObject} from '../utils.js'\r\nimport Button from '@material-ui/core/Button';\r\nimport {withStyles} from '@material-ui/core/styles';\r\nimport {isIE} from 'react-device-detect';\r\nimport {Dialog, DialogContent} from '@material-ui/core';\r\nimport _ from \"underscore\";\r\n\r\nconst {TrackerHitTypeLID_ENUM, TrackerActionLID_ENUM, TrackerCategoryLID_ENUM, UserLanguage_ENUM} = AppEvents\r\nconst {\r\n TOGGLE_DRAWER, LOG_IN, FEATURE_TOGGLES, GET_MESSAGES, PAYMENT_VALIDATION, E_DIS,\r\n CHANGE_LANGUAGE\r\n} = AppActions\r\n\r\nconst StyledDialog = withStyles({\r\n root: {\r\n zIndex: 90,\r\n \"& .MuiPaper-root\": {backgroundColor: \"transparent\", overflow: \"visible\"},\r\n \"& .MuiPaper-elevation24\": {boxShadow: \"none\"}\r\n },\r\n})(Dialog);\r\n\r\nconst BootstrapButton = withStyles({\r\n root: {\r\n boxShadow: 'none',\r\n textTransform: 'none',\r\n fontSize: 16,\r\n padding: '6px 12px',\r\n lineHeight: 1.5,\r\n fontFamily: [\r\n 'HalenoirCompactText-Regular',\r\n '-apple-system',\r\n 'BlinkMacSystemFont',\r\n '\"Segoe UI\"',\r\n 'Roboto',\r\n '\"Helvetica Neue\"',\r\n 'Arial',\r\n 'sans-serif',\r\n '\"Apple Color Emoji\"',\r\n '\"Segoe UI Emoji\"',\r\n '\"Segoe UI Symbol\"',\r\n ].join(',')\r\n },\r\n})(Button);\r\n\r\n\r\nfunction PnmacMenu(props) {\r\n let {translations, matches} = props\r\n const [hovering, setHovering] = useState(false)\r\n const handleClick = (event) => {\r\n props.history.push(`/Account/AccountSettings`)\r\n if (props.layout.drawerOpen) {\r\n props.dispatch({type: TOGGLE_DRAWER, toggle: false});\r\n }\r\n \r\n };\r\n\r\n\r\n return (\r\n \r\n {matches.small ? setHovering(true)}\r\n onHoverOut={() => setHovering(false)}\r\n >\r\n \r\n \r\n {translations.Settings}\r\n \r\n :\r\n \r\n {translations.AccountSettings}\r\n }\r\n
\r\n );\r\n}\r\n\r\nfunction MiniDrawer(props) {\r\n\r\n let {translations, matches, layout} = props\r\n const [hoveringLang, setHoveringLang] = useState(false)\r\n const [hoveringContact, setHoveringContact] = useState(false)\r\n const [hoveringLogout, setHoveringLogout] = useState(false)\r\n\r\n return (\r\n \r\n \r\n\r\n \r\n\r\n \r\n props.dispatch({type: TOGGLE_DRAWER, toggle: true})\r\n }\r\n\r\n >\r\n
\r\n\r\n :\r\n \r\n }/)
\r\n
\r\n\r\n }\r\n />\r\n\r\n\r\n \r\n {matches.small ?\r\n setHoveringLang(true)}\r\n onHoverOut={() => setHoveringLang(false)}\r\n >\r\n {\r\n\r\n props.dispatch({\r\n type: CHANGE_LANGUAGE,\r\n lang: layout.language == \"en\" ? 'es' : 'en', dontPost: true\r\n })\r\n\r\n }}>{layout.language == \"en\" ?\r\n \r\n \r\n Español \r\n \r\n :\r\n \r\n \r\n English \r\n }\r\n \r\n :\r\n {\r\n\r\n props.dispatch({\r\n type: CHANGE_LANGUAGE,\r\n lang: layout.language == \"en\" ? 'es' : 'en', dontPost: true\r\n })\r\n\r\n }}\r\n >{layout.language == \"en\" ?\r\n Español :\r\n English }\r\n \r\n }\r\n\r\n {matches.small ? setHoveringContact(true)}\r\n onHoverOut={() => setHoveringContact(false)}\r\n >\r\n {\r\n\r\n props.history.push(`/Home/Contact`);\r\n props.trackerDispatcher(UserLanguage_ENUM.English, TrackerCategoryLID_ENUM.Button, TrackerHitTypeLID_ENUM.Event, TrackerActionLID_ENUM.Click, \"Contact Us Link Clicked\", 0);\r\n \r\n }}\r\n >\r\n {translations.contactUs}\r\n \r\n :\r\n setHoveringLogout(true)}\r\n onHoverOut={() => setHoveringLogout(false)}\r\n >\r\n {\r\n props.trackerDispatcher(\r\n UserLanguage_ENUM.English,\r\n TrackerCategoryLID_ENUM.Button,\r\n TrackerHitTypeLID_ENUM.Event,\r\n TrackerActionLID_ENUM.Click,\r\n \" LogOut Button Clicked\",\r\n 0\r\n )\r\n props.dispatch({\r\n type: LOG_IN,\r\n logedIn: false\r\n })\r\n props.clearListCookies({\r\n nav: \"/oauth/log_out\",\r\n loading: true,\r\n logout: true\r\n })\r\n }}\r\n >\r\n \r\n {translations.logout} \r\n \r\n :\r\n {\r\n props.trackerDispatcher(\r\n UserLanguage_ENUM.English,\r\n TrackerCategoryLID_ENUM.Button,\r\n TrackerHitTypeLID_ENUM.Event,\r\n TrackerActionLID_ENUM.Click,\r\n \" LogOut Button Clicked\",\r\n 0\r\n )\r\n\r\n props.dispatch({type: LOG_IN, logedIn: false})\r\n props.clearListCookies({nav: \"/oauth/log_out\", loading: true, logout: true})\r\n }}\r\n >\r\n {translations.logout}\r\n : null}\r\n
\r\n \r\n \r\n \r\n {\r\n\r\n props.history.push(`/Home/Contact`);\r\n props.trackerDispatcher(UserLanguage_ENUM.English, TrackerCategoryLID_ENUM.Button, TrackerHitTypeLID_ENUM.Event, TrackerActionLID_ENUM.Click, \"Contact Us Link Clicked\", 0);\r\n \r\n }} style={{\r\n ...(window.location.pathname === '/Home/Contact' ? styles.selectTab : styles.defaultTab),\r\n fontSize: matches.small ? 12 : 16,\r\n padding: matches.small ? '0px 9px' : '6px 12px',\r\n }}>{translations.contactUs} \r\n
}\r\n\r\n {!layout.pennyWise && \r\n
}\r\n {!layout.pennyWise ? matches.small ? {message.toString()}
)\r\n this.setState({\r\n showMessage: true,\r\n incomingMessages: incomingMessages\r\n }, () => {\r\n setTimeout(() => {\r\n incomingMessages.splice(0, 1)\r\n this.setState({showMessage: false})\r\n }, 1000)\r\n })\r\n break;\r\n case \"InternalMessage\":\r\n message = JSON.parse(message)\r\n switch (message.type) {\r\n case '1':\r\n case 1:\r\n let {layout} = this.props\r\n var messag = layout.messages\r\n if (messag.find(s => s.messageId == message.dataModel.MessageId)) {\r\n messag.forEach(s => {\r\n if (s.messageId == message.dataModel.MessageId) {\r\n s.body = message.dataModel.Body;\r\n }\r\n })\r\n } else {\r\n\r\n messag.push({\r\n \"idsUserId\": message.dataModel.IdsUserId,\r\n \"messageId\": message.dataModel.MessageId,\r\n \"parentMessageId\": message.dataModel.ParentMessageId,\r\n \"body\": message.dataModel.Body,\r\n \"receivedDateTimeUtc\": message.dataModel.ReceivedDateTimeUtc,\r\n \"readDateTimeUtc\": message.dataModel.ReadDateTimeUtc,\r\n \"subjectLID\": message.dataModel.SubjectLID,\r\n \"statusLID\": message.dataModel.StatusLID,\r\n \"messageTypeLID\": message.dataModel.MessageTypeLID,\r\n \"documentId\": message.dataModel.DocumentId,\r\n \"recipientLID\": message.dataModel.RecipientLID,\r\n \"senderLID\": message.dataModel.SenderLID,\r\n \"messageSourceLID\": message.dataModel.MessageSourceLID,\r\n \"firstName\": message.dataModel.FirstName,\r\n \"lastName\": message.dataModel.LastName,\r\n \"chatLog\": message.dataModel.ChatLog,\r\n \"loanId\": message.dataModel.LoanId,\r\n \"attachment\": message.dataModel.Attachment,\r\n })\r\n }\r\n\r\n this.props.dispatch({type: GET_MESSAGES, messages: messag})\r\n break;\r\n case 2:\r\n case \"2\":\r\n\r\n let {selectedLoanNumber, closedEndSeconds} = this.props.layout\r\n \r\n if(parseFloat(selectedLoanNumber) > 0 && !closedEndSeconds){\r\n this.props.refreshBankData(selectedLoanNumber)\r\n }\r\n break;\r\n case 3:\r\n case \"3\":\r\n\r\n let {banksToAdd} = this.props.layout\r\n\r\n let newBank = message.dataModel\r\n\r\n if (newBank) {\r\n if (banksToAdd && banksToAdd.length > 0) {\r\n banksToAdd.forEach(s => {\r\n if (s.loanBankDetailAltId == newBank.loanBankDetailAltId) {\r\n return newBank\r\n }\r\n return s\r\n })\r\n } else {\r\n banksToAdd = []\r\n banksToAdd.push(newBank)\r\n }\r\n this.props.dispatch({type: E_DIS, banksToAdd: banksToAdd})\r\n\r\n } else {\r\n\r\n this.props.dispatch({type: E_DIS, banksToAdd: (banksToAdd || []).filter(s => !s.pending)})\r\n\r\n }\r\n\r\n break;\r\n }\r\n\r\n break;\r\n }\r\n\r\n }\r\n\r\n socketPrepend = null\r\n\r\n\r\n render() {\r\n let {layout, translations, dispatch, ...rest} = this.props\r\n let {\r\n chatMessages,\r\n pennyCanTalk,\r\n pennyCanHear,\r\n isSpeaking,\r\n isListening,\r\n chatIsInitialized,\r\n chatIsBlocked\r\n } = layout\r\n let trans = (translations && translations[windowObject.location.pathname]) ? JSON.parse(translations[windowObject.location.pathname]) : []\r\n\r\n return (\r\n \r\n\r\n\r\n \r\n {matches => (\r\n
\r\n )}\r\n \r\n \r\n );\r\n }\r\n}\r\n\r\nconst mapStateToProps = (state) => ({\r\n layout: state,\r\n translations: state.translations\r\n\r\n});\r\n\r\nconst mapDispatchToProps = (dispatch) => {\r\n return {\r\n dispatch: dispatch,\r\n ...bindActionCreators(AppActions, dispatch),\r\n };\r\n};\r\n\r\n\r\nconst styles = {\r\n selectTab: {\r\n fontFamily: \"HalenoirCompactText-Bold\",\r\n fontSize: 12,\r\n color: '#117AAA',\r\n textAlign: 'center',\r\n },\r\n defaultTab: {\r\n fontFamily: \"HalenoirCompactText-Medium\",\r\n fontWeight: '500',\r\n fontSize: 12,\r\n color: '#1B1B1B',\r\n textAlign: 'center',\r\n width: '100%'\r\n },\r\n selectTabBg: {\r\n minWidth: 60,\r\n maxWidth: 80,\r\n backgroundColor: '#EAF5F8',\r\n marginHorizontal: 5,\r\n borderRadius: 5,\r\n alignItems: 'center',\r\n paddingVertical:10,\r\n\r\n },\r\n defaultTabBg: {\r\n paddingVertical:10,\r\n minWidth: 60,\r\n maxWidth: 80,\r\n height: 60,\r\n marginHorizontal: 5,\r\n borderRadius: 10,\r\n alignItems: 'center',\r\n },\r\n hoverTabBg: {\r\n paddingVertical:10,\r\n minWidth: 60,\r\n maxWidth: 80,\r\n marginHorizontal: 5,\r\n borderRadius: 10,\r\n justifyContent: 'center',\r\n alignItems: 'center',\r\n backgroundColor: '#EAF5F8',\r\n borderWidth:1,\r\n borderColor:'#39AFDD'\r\n },\r\n}\r\n\r\nexport default connect(mapStateToProps, mapDispatchToProps)(withRouter(Layout))\r\n\r\n","export const MarketingScripts = (toggle, layout) => {\r\n var env = window.location.host.indexOf(\"-\") > -1 || window.location.host.indexOf(\"localhost\") > -1\r\n window.dataLayer = window.dataLayer || [];\r\n if (toggle) {\r\n if (!isNaN(layout.segmentId)) {\r\n var digitalData = {\r\n user: {\r\n userName: layout.userProfile?.username,\r\n ipAddress: \"174.128.191.1\",\r\n loanNumber: layout.currentLoan.loanId,\r\n loanStatus: layout.currentLoan.loanStatusDescription,\r\n cookiesEnabled: \"Yes\",\r\n state: layout.currentLoan?.propertyRegion,\r\n city: layout.currentLoan?.propertyLocality,\r\n zip: layout.currentLoan?.propertyPostalCode,\r\n segmentId: layout.segmentId\r\n },\r\n page: {\r\n pageName: \"cr\" + window.window.getCurrentPageName(),\r\n channel: \"customers\",\r\n pageUrl: \"\",\r\n environment: \"production\",\r\n lead: {\r\n form1: {\r\n name: {},\r\n fields: {\r\n currentCustomer: {},\r\n loanType: {},\r\n state: {}\r\n },\r\n errors: {}\r\n },\r\n phone: {},\r\n calculator: {\r\n name: {}\r\n },\r\n cta: {\r\n linkName: {}\r\n },\r\n chat: {},\r\n customerWebsite: {\r\n linkName: {}\r\n },\r\n rates: {\r\n request: {\r\n loanPurpose: {},\r\n propertyValue: {},\r\n loanAmount: {},\r\n state: {},\r\n county: {},\r\n isVa: {}\r\n },\r\n response: {\r\n currentProductName: {}\r\n },\r\n mobile: {\r\n direction: {},\r\n section: {}\r\n }\r\n }\r\n }\r\n }\r\n };\r\n window.window.digitalData = digitalData\r\n }\r\n if (!document.getElementById('marketing-script')) {\r\n let data = { event: 'marketingScriptData' },\r\n fields = ['borrowerId', 'borrowerLoans', 'language', 'loanArray', 'loanNumbers', 'logedIn', 'logedInState', 'mobile', 'segmentData', 'segmentId', 'selectedLoanNumber'],\r\n userFields = ['customer_id', 'is_active', 'login_count', 'previous_login_on', 'user_id', 'username', 'verified_email'];\r\n fields.forEach(field => {\r\n if (layout[field])\r\n data[field] = layout[field];\r\n });\r\n if (layout.userProfile) {\r\n data.userProfile = {};\r\n userFields.forEach(field => {\r\n if (layout.userProfile[field])\r\n data.userProfile[field] = layout.userProfile[field];\r\n });\r\n }\r\n window.dataLayer.push(data);\r\n\r\n if (env) {\r\n let lower = document.createElement(\"script\");\r\n lower.setAttribute(\"src\", \"https://assets.adobedtm.com/c52783cec8b1/b490159dbd62/launch-7d7413fb35dc-staging.min.js\");\r\n lower.setAttribute(\"async\", \"true\");\r\n lower.setAttribute(\"id\", \"marketing-script\");\r\n document.body.appendChild(lower);\r\n } else {\r\n let prd = document.createElement(\"script\");\r\n prd.setAttribute(\"src\", \"https://assets.adobedtm.com/c52783cec8b1/b490159dbd62/launch-830b0903b192.min.js\");\r\n prd.setAttribute(\"async\", \"true\");\r\n prd.setAttribute(\"id\", \"marketing-script\");\r\n document.body.appendChild(prd);\r\n }\r\n }\r\n }\r\n}\r\n","import React from \"react\";\r\nimport PropTypes from \"prop-types\";\r\nimport { StyleSheet } from \"react-native\";\r\nimport { PnmacText } from 'pnmac-universal-components';\r\nimport stepStarted from \"../../assets/step-started.svg\";\r\nimport stepFuture from \"../../assets/step-future.svg\";\r\nimport stepCompleted from \"../../assets/step-completed.svg\";\r\nimport step5CompletedMobile from \"../../assets/step5-completed-mobile.svg\";\r\n\r\nconst StepsIndicator = ({\r\n currentStep, steps, matches, completed\r\n}) => {\r\n\r\n const colorCyan = \"#30AEDF\";\r\n const colorGreen = \"#56AC69\"; \r\n const colorGrayMediumDark = \"#5C5C5C\";\r\n\r\n const LargeMedium = () => (\r\n <>\r\n \r\n \r\n \r\n \r\n\r\n \r\n {!layout.wrapedMobile && {this.state.incomingMessages}\r\n
\r\n\r\n \r\n \r\n \r\n
\r\n Loading...
\r\n\r\n
: null}\r\n Penny Wise
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n {!this.props.layout.drawerOpen ?\r\n
: null}\r\n \r\n
\r\n {this.props.children}\r\n \r\n {trans && (\r\n
\r\n )}\r\n \r\n {trans.map((w, i) =>\r\n \r\n \r\n
\r\n )}\r\n \r\n {steps.map((step, index) => { \r\n \r\n let stepColor = currentStep === index ? colorGrayMediumDark : colorGreen;\r\n\r\n if(completed) stepColor = colorGreen;\r\n\r\n return {step.stepNumber} \r\n })}\r\n
\r\n \r\n \r\n {steps.map((step, index) => {\r\n\r\n let stepIcon = stepFuture;\r\n if(currentStep === index) stepIcon = stepStarted; \r\n if(currentStep > index) stepIcon = stepCompleted;\r\n\r\n let stepColor = index === steps.length - 2? colorCyan : colorGreen;\r\n if(completed){ stepColor = colorGreen; stepIcon = stepCompleted };\r\n\r\n return (\r\n <> \r\n 
\r\n \r\n {index < steps.length -1 && (\r\n \r\n )} \r\n \r\n );\r\n })}\r\n
\r\n \r\n \r\n {steps.map((step, index) => {\r\n \r\n let stepColor = currentStep === index ? colorGrayMediumDark : colorGreen;\r\n if(completed) stepColor = colorGreen;\r\n \r\n return (\r\n
\r\n \r\n );\r\n\r\n const currentStepObject = steps[currentStep];\r\n\r\n const Small = () => (\r\n <> \r\n \r\n {step.stepLabel} \r\n
\r\n );\r\n })}\r\n \r\n \r\n
}\r\n\r\n \r\n \r\n {currentStepObject.stepNumber}\r\n \r\n
\r\n \r\n {`STEP ${currentStepObject.stepNumber}/${steps.length}`} \r\n \r\n {currentStepObject.stepLabel}\r\n \r\n
\r\n \r\n\r\n \r\n {steps.map((step, index) => {\r\n\r\n let stepIcon = stepFuture;\r\n if(currentStep === index) stepIcon = stepStarted; \r\n if(currentStep > index) stepIcon = stepCompleted;\r\n\r\n let stepColor = colorGreen;\r\n\r\n if(currentStep === index) stepColor = colorCyan;\r\n if(currentStep > index) stepIcon = colorGreen;\r\n if(completed) stepColor = colorGreen;\r\n\r\n return ( \r\n \r\n );\r\n })}\r\n
\r\n \r\n );\r\n\r\n if(matches.large || matches.medium) return \r\n {translations.AllSet} \r\n \r\n {translations.LoginAnytime}\r\n {\" \"}pennymac.com/login\r\n {\" \"}{translations.OnOurApp}\r\n \r\n \r\n \r\n \r\n {translations.GoToMyAccount}\r\n \r\n\r\n ![\"Chevron]({require(\"../assets/chevron-right.png\")})
\r\n \r\n
\r\n \r\n \r\n \r\n \r\n })
\r\n
\r\n \r\n \r\n\r\n \r\n ![]({require(\"../assets/app-store.png\")})
\r\n \r\n\r\n \r\n ![]({require(\"../assets/google-play.png\")})
\r\n \r\n \r\n \r\n\r\n \r\n );\r\n}\r\n\r\nfunction MiniDrawer(props) {\r\n\r\n let { translations, matches, layout } = props\r\n const [hoveringLang, setHoveringLang] = useState(false)\r\n const [hoveringContact, setHoveringContact] = useState(false)\r\n const [hoveringLogout, setHoveringLogout] = useState(false)\r\n\r\n \r\n return (\r\n \r\n \r\n {!matches.small && (\r\n \r\n \r\n
\r\n }\r\n />\r\n )}\r\n\r\n\r\n \r\n {matches.small ?\r\n setHoveringLang(true)}\r\n onHoverOut={() => setHoveringLang(false)}\r\n >\r\n {\r\n\r\n props.dispatch({\r\n type: CHANGE_LANGUAGE,\r\n lang: layout.language == \"en\" ? 'es' : 'en', dontPost: true\r\n })\r\n\r\n }}>{layout.language == \"en\" ?\r\n \r\n Español \r\n \r\n :\r\n \r\n English \r\n }\r\n \r\n :\r\n {\r\n\r\n props.dispatch({\r\n type: CHANGE_LANGUAGE,\r\n lang: layout.language == \"en\" ? 'es' : 'en', dontPost: true\r\n })\r\n\r\n }}\r\n >{layout.language == \"en\" ?\r\n Español :\r\n English }\r\n \r\n }\r\n\r\n {matches.small ? setHoveringLogout(true)}\r\n onHoverOut={() => setHoveringLogout(false)}\r\n >\r\n {\r\n props.dispatch({ type: LOG_IN, logedIn: false })\r\n window.location.href = \"/oauth/log_out\";\r\n }}\r\n >\r\n {translations.logout} \r\n \r\n :\r\n {\r\n props.dispatch({ type: LOG_IN, logedIn: false })\r\n window.location.href = \"/oauth/log_out\";\r\n }}\r\n >\r\n \r\n {translations.logout}\r\n \r\n }\r\n
\r\n\r\n \r\n \r\n \r\n {!layout.wrapedMobile && \r\n \r\n \r\n : errorType == 3 ?\r\n \r\n \r\n \r\n : errorType == 5 ?\r\n \r\n \r\n \r\n : errorType == 2 ?\r\n \r\n \r\n :\r\n errorType == 4 ?\r\n \r\n \r\n : null\r\n }\r\n \r\n null}\r\n open={this.state.modalOpenTe}\r\n ACE\r\n callbackOnAccept={(data) => {\r\n this.setState({\r\n termsAndConditions: true, modalOpenTe: false, openedTerms: true\r\n })\r\n }}\r\n enject\r\n handleClose={() => this.setState({ modalOpenTe: false })}\r\n data={this.state.modalData}\r\n />\r\n\r\n null}\r\n open={this.state.modalOpenEl}\r\n ACE\r\n callbackOnAccept={(data) => this.setState({\r\n electronicCommunicaitons: true, modalOpenEl: false, openedElectronics: true\r\n\r\n })}\r\n enject\r\n handleClose={() => this.setState({ modalOpenEl: false })}\r\n data={this.state.modalData}\r\n />\r\n\r\n
\r\n \r\n \r\n \r\n )}\r\n \r\n window.history.back()}>\r\n \r\n ![\"Chevron]({require(\"../assets/chevron-left.png\")})
\r\n \r\n {translations.Back}\r\n \r\n
\r\n )}\r\n\r\n }\r\n {this.state.registerComplete && \r\n
\r\n \r\n\r\n {!this.state.registerComplete && \r\n \r\n \r\n\r\n \r\n \r\n\r\n {(matches.large || matches.medium) && (\r\n\r\n {\r\n this.setState({ \r\n loading: true,\r\n errorType: 1,\r\n lastFourError: false,\r\n dobError: false,\r\n loanError: false,\r\n propertyZipError: false }, () => {\r\n this.postRegistration()\r\n })\r\n }}\r\n\r\n >\r\n \r\n {translations.CompleteRegistration}\r\n \r\n\r\n \r\n \r\n
\r\n\r\n {matches.small &&\r\n (\r\n {translations.ConfirmLoanInfo} \r\n \r\n {translations.VerifyAdditionalDetails}\r\n \r\n
\r\n\r\n {(matches.large || matches.medium) && (\r\n
\r\n\r\n \r\n {translations.LoanNumber} \r\n {\r\n if (checkForAllNumbers(text)) {\r\n this.setValue(text, \"loanId\")\r\n }\r\n }}\r\n onBlur={() => {\r\n if (!checkForAllNumbers(this.state.loanId, \"10\")) {\r\n this.setState({ loanError: true });\r\n\r\n } else {\r\n this.setState({ loanError: false })\r\n }\r\n }}\r\n />\r\n {!this.state.loanError && (\r\n {translations.YourLoanNumberIsWelcomeLetter} \r\n )}\r\n {this.state.loanError && (\r\n {translations.ValidLoanId} \r\n )}\r\n
\r\n\r\n \r\n {translations.PropertyZIPCode} \r\n {\r\n if (checkForAllNumbers(text)) {\r\n this.setValue(text, \"propertyZip\")\r\n }\r\n }}\r\n onBlur={() => {\r\n if (!checkForAllNumbers(this.state.propertyZip, \"5\")) {\r\n this.setState({ propertyZipError: true });\r\n } else {\r\n this.setState({ propertyZipError: false })\r\n }\r\n }}\r\n />\r\n\r\n {this.state.propertyZipError && (\r\n {translations.EnterPropertyZip} \r\n )}\r\n
\r\n \r\n
\r\n\r\n \r\n {translations.LastFourSSN} \r\n {\r\n\r\n if (checkForAllNumbers(text)) {\r\n this.setValue(text, \"lastFour\")\r\n }\r\n }}\r\n onBlur={() => {\r\n if (!checkForAllNumbers(this.state.lastFour, \"4\")) {\r\n this.setState({ lastFourError: true });\r\n } else {\r\n this.setState({ lastFourError: false })\r\n }\r\n }}\r\n />\r\n {this.state.lastFourError && (\r\n {translations.EnterLast4DigitsSSN} \r\n )}\r\n
\r\n\r\n \r\n {translations.DateOfBirth} \r\n \r\n {\r\n this.setValue(text, \"dob\")\r\n }}\r\n onBlur={() => {\r\n if (!moment(this.state.dob, \"MM/DD/YYYY\", true).isValid()) {\r\n this.setState({ dobError: true });\r\n\r\n } else {\r\n this.setState({ dobError: false })\r\n }\r\n }}\r\n render={(props) => {\r\n let { style, translationText, multiline, toggleTheme, underlineColorAndroid, editable, selectionColor, toggleLanguage, placeholderTextColor, onChangeText, testID, ...rest } = props\r\n let st = style.reduce(function (a, i) {\r\n return {\r\n ...a,\r\n ...i\r\n }\r\n })\r\n st.paddingTop = 0\r\n st.backgroundColor = 'unset'\r\n st.border = 'unset'\r\n\r\n return (\r\n <>\r\n {\r\n\r\n onChangeText(e.target.value)\r\n }} />\r\n\r\n \r\n )\r\n }}\r\n />\r\n {this.state.dobError && (\r\n {translations.EnterDateOfBirth} \r\n )}\r\n
\r\n \r\n
\r\n {\r\n if (translations.AgreeAndContinue && !this.state.openedTerms) {\r\n this.setState({\r\n modalOpenTe: true,\r\n modalData: {\r\n ...this.state.modalData,\r\n cancel: translations.Close,\r\n node: \"termsAndConditions\",\r\n accept: translations.AgreeAndContinue,\r\n header: translations.TermsContentDescription,\r\n link: `${translations.ViewAsSeparatePage}`,\r\n content: translations.TermsContent,\r\n title: translations.TermsContentDescription\r\n }\r\n })\r\n } else {\r\n this.setState({ termsAndConditions: !this.state.termsAndConditions })\r\n }\r\n }}>\r\n { }}\r\n role=\"checkbox\"\r\n aria-label=\"Checkbox\"\r\n />\r\n
\r\n {\r\n this.setState({\r\n modalOpenTe: true,\r\n modalData: {\r\n ...this.state.modalData,\r\n cancel: translations.Close,\r\n node: \"termsAndConditions\",\r\n accept: translations.AgreeAndContinue,\r\n header: translations.TermsContentDescription,\r\n link: `${translations.ViewAsSeparatePage}`,\r\n content: translations.TermsContent,\r\n title: translations.TermsContentDescription\r\n }\r\n })\r\n\r\n }}>\r\n \r\n \r\n {`${translations.IhaveReadAndAgree}`} {translations.TermsConditionsLink}\r\n \r\n
\r\n \r\n
\r\n {\r\n if (translations.AgreeAndContinue && !this.state.openedElectronics) {\r\n this.setState({\r\n modalOpenEl: true,\r\n modalData: {\r\n ...this.state.modalData,\r\n cancel: translations.Close,\r\n accept: translations.AgreeAndContinue,\r\n node: \"electronicCommunicaitons\",\r\n header: translations.ElectronicCommunicationsDescription,\r\n link: `${translations.ViewAsSeparatePage}`,\r\n content: translations.ElectronicCommunicationsContent,\r\n title: translations.ElectronicCommunicationsDescription\r\n }\r\n })\r\n } else {\r\n this.setState({ electronicCommunicaitons: !this.state.electronicCommunicaitons })\r\n }\r\n }}>\r\n { }}\r\n role=\"checkbox\"\r\n aria-label=\"Checkbox\"\r\n />\r\n
\r\n {\r\n this.setState({\r\n modalOpenEl: true,\r\n modalData: {\r\n ...this.state.modalData,\r\n cancel: translations.Close,\r\n accept: translations.AgreeAndContinue,\r\n node: \"electronicCommunicaitons\",\r\n header: translations.ElectronicCommunicationsDescription,\r\n link: `${translations.ViewAsSeparatePage}`,\r\n content: translations.ElectronicCommunicationsContent,\r\n title: translations.ElectronicCommunicationsDescription\r\n }\r\n })\r\n\r\n }}>\r\n \r\n {`${translations.IhaveReadAndAgree} `} Electronic Communications Disclosure and Consent Agreement.\r\n \r\n
\r\n \r\n \r\n \r\n \r\n
\r\n )\r\n }\r\n}\r\n\r\n\r\nconst mapStateToProps = state => ({\r\n layout: state,\r\n translations: state.translations\r\n\r\n})\r\n\r\nconst mapDispatchToProps = dispatch => {\r\n return {\r\n dispatch: dispatch,\r\n ...bindActionCreators(AppActions,\r\n dispatch\r\n )\r\n }\r\n}\r\n\r\nconst styles = {\r\n selectTab: {\r\n fontFamily: \"HalenoirCompactText-Bold\",\r\n fontSize: 12,\r\n color: '#117AAA',\r\n textAlign: 'center',\r\n },\r\n defaultTab: {\r\n fontFamily: \"HalenoirCompactText-Medium\",\r\n fontWeight: '500',\r\n fontSize: 12,\r\n color: '#1B1B1B',\r\n textAlign: 'center',\r\n width: '100%'\r\n },\r\n selectTabBg: {\r\n minWidth: 60,\r\n maxWidth: 80,\r\n backgroundColor: '#EAF5F8',\r\n marginHorizontal: 5,\r\n borderRadius: 5,\r\n alignItems: 'center',\r\n paddingVertical: 10,\r\n\r\n },\r\n defaultTabBg: {\r\n paddingVertical: 10,\r\n minWidth: 60,\r\n maxWidth: 80,\r\n height: 60,\r\n marginHorizontal: 5,\r\n borderRadius: 10,\r\n alignItems: 'center',\r\n },\r\n hoverTabBg: {\r\n paddingVertical: 10,\r\n minWidth: 60,\r\n maxWidth: 80,\r\n marginHorizontal: 5,\r\n borderRadius: 10,\r\n justifyContent: 'center',\r\n alignItems: 'center',\r\n backgroundColor: '#EAF5F8',\r\n borderWidth: 1,\r\n borderColor: '#39AFDD'\r\n },\r\n}\r\n\r\nexport default connect(mapStateToProps, mapDispatchToProps)(withPnmacContext(Registration))\r\n","import React from 'react'\r\nimport { bindActionCreators } from 'redux'\r\nimport { connect } from 'react-redux'\r\nimport { AppActions } from 'pnmac-universal-components'\r\n\r\n\r\nclass MovrRedirect extends React.Component {\r\n\r\n constructor(props) {\r\n super(props)\r\n this.state = {}\r\n }\r\n\r\n static getDerivedStateFromProps(props, state) {\r\n\r\n let { selectedLoanNumber,movr_url } = props.layout\r\n if (selectedLoanNumber) {\r\n var form = document.createElement(\"form\");\r\n form.action = movr_url;\r\n form.method = \"POST\";\r\n form.target = \"_self\";\r\n\r\n var input = document.createElement(\"input\");\r\n input.name = \"LoanNumber\";\r\n input.value = selectedLoanNumber;\r\n form.appendChild(input);\r\n\r\n form.style.display = 'none';\r\n document.body.appendChild(form);\r\n form.submit();\r\n }\r\n return state\r\n }\r\n\r\n render() {\r\n return \r\n
\r\n \r\n
\r\n Redirecting
\r\n }\r\n}\r\n\r\n\r\nconst mapStateToProps = state => ({\r\n layout: state,\r\n})\r\n\r\nconst mapDispatchToProps = dispatch => {\r\n return {\r\n dispatch: dispatch,\r\n ...bindActionCreators(AppActions,\r\n dispatch\r\n )\r\n }\r\n}\r\n\r\nexport default connect(mapStateToProps, mapDispatchToProps)(MovrRedirect)\r\n","import React, { Component } from 'react';\r\nimport { useEffect } from 'react';\r\n\r\nconst env = window.location.hostname ?\r\n window.location.hostname.indexOf(\"-dev\") > -1 ? \"development\" :\r\n window.location.hostname.indexOf(\"-qa\") > -1 ? \"qa\" :\r\n window.location.hostname.indexOf(\"-stg\") > -1 ? \"staging\" :\r\n window.location.hostname.indexOf(\"localhost\") == -1 ? \"production\" : \"debug\" : \"debug\"\r\n\r\n\r\n\r\nexport default function MovrRedirect() {\r\n useEffect(() => {\r\n const queryString = window.location.search;\r\n const urlParams = new URLSearchParams(queryString);\r\n const cookie = urlParams.get('movr_session_cookie')\r\n const selectedLoanNumber = urlParams.get('selectedLoanNumber')\r\n const movr_url = urlParams.get('movr_url')\r\n\r\n const cookieName = env === 'production' ? '' : '_identity_staging_pennymac_com_session'\r\n document.cookie = cookieName + '=' + cookie\r\n if (selectedLoanNumber && cookie && movr_url) {\r\n const form = document.createElement(\"form\");\r\n form.action = movr_url;\r\n form.method = \"POST\";\r\n form.target = \"_self\";\r\n\r\n const input = document.createElement(\"input\");\r\n input.name = \"LoanNumber\";\r\n input.value = selectedLoanNumber;\r\n form.appendChild(input);\r\n\r\n form.style.display = 'none';\r\n document.body.appendChild(form);\r\n form.submit();\r\n }\r\n }, [])\r\n\r\n\r\n return \r\n}\r\n","\r\nimport React, { Component, Suspense } from 'react';\r\nimport { Route, Switch, withRouter } from 'react-router';\r\nimport PrivateRoute from './Authentication/PrivateRoute.js';\r\nimport GenericLayout from './components/GenericLayout.js';\r\nimport { bindActionCreators } from \"redux\";\r\nimport { LocalizationProvider } from \"@material-ui/pickers\";\r\nimport MomentUtils from '@material-ui/pickers/adapter/moment';\r\nimport { getActiveFeatures, getCookie, setCookie } from './utils.js';\r\nimport './PayoffTileStyle.css'\r\nimport Default from './components/Default.js'\r\nimport Layout from './components/Layout';\r\nimport * as Sentry from \"@sentry/react\";\r\nimport { MarketingScripts } from './components/MarketingScripts.js'\r\nimport TagManager from 'react-gtm-module';\r\n// import FadeLoader from 'pnmac-universal-components/src/Spinners/FadeSpinner/FadeSpinner.js';\r\nimport Registration from './components/Registration'\r\nimport MovrRed from './components/MovrRedirect.js';\r\nimport { connect } from 'react-redux'\r\nimport {\r\n AppActions,\r\n Interstitial,\r\n PnmacSessionTimer,\r\n ForceUpdate,\r\n BillMatrixHolder,\r\n MakeADraw,\r\n Offers,\r\n AchSuccess,\r\n AppEvents,\r\n PnmacContext,\r\n PendingPayments,\r\n Payment,\r\n SuccessfulLogout,\r\n MortgageInsurance,\r\n WisconsinTaxOptions,\r\n EmailVerification,\r\n Landing,\r\n Mod,\r\n ModForms,\r\n PayoffDemand,\r\n LoanActivity,\r\n LoanEscrow,\r\n MessageCenter,\r\n StatementsAndDocuments,\r\n AmortizationCalculator,\r\n FAQ,\r\n ContactUs,\r\n LoanSummary,\r\n AccountSettingsPage,\r\n EscrowAnalysisPaymentChange,\r\n TaxOptions\r\n} from 'pnmac-universal-components';\r\nimport MovrRedirect from './pages/MovrRedirect/index.jsx';\r\n\r\n\r\n\r\n\r\nconst { PENNYWISE, CHANGE_LANGUAGE, SET_TOKEN, LOG_IN, LOG_OUT, OFFLINE_MODE, USER_IDLE_TIMEOUT } = AppActions\r\nconst { TrackerHitTypeLID_ENUM, TrackerActionLID_ENUM, TrackerCategoryLID_ENUM, UserLanguage_ENUM } = AppEvents\r\n\r\nlet env = window.location.hostname ?\r\n window.location.hostname.indexOf(\"-dev\") > -1 ? \"development\" :\r\n window.location.hostname.indexOf(\"-qa\") > -1 ? \"qa\" :\r\n window.location.hostname.indexOf(\"-stg\") > -1 ? \"staging\" :\r\n window.location.hostname.indexOf(\"localhost\") == -1 ? \"production\" : \"debug\" : \"debug\"\r\n\r\nTagManager.initialize({\r\n gtmId: 'GTM-T8X4NKQ'\r\n});\r\nfunction checkConfig(urlParams, props) {\r\n let tok = urlParams.get('token');\r\n fetch(`/api/main/get_app_info?appId=23`, {\r\n method: \"GET\",\r\n headers: {\r\n 'Authorization': `Bearer ${tok}`,\r\n 'Content-Type': 'application/json',\r\n 'pnmac_user': 'True'\r\n }\r\n }).then(s => {\r\n if (s.status >= 200 && s.status <= 299) {\r\n return s.json()\r\n } else {\r\n window.location.href = '/oauth/index'\r\n return false\r\n }\r\n }).then(ss => {\r\n if (ss) {\r\n let url = ss;\r\n if (url) {\r\n props.dispatch({\r\n type: PENNYWISE,\r\n is: true,\r\n url: '/',\r\n token: tok,\r\n loanId: urlParams.get('loanId')\r\n })\r\n props.pennyWiseAuth(tok, \"/\")\r\n props.history.push(\"/\")\r\n }\r\n }\r\n }).catch(err => {\r\n window.location.href = '/oauth/log_out'\r\n console.log(\"Err\", err)\r\n })\r\n}\r\n\r\n//if (window?.performance?.navigation?.type === 2 && window?.location?.pathname === \"/\") {\r\n// window.location.reload();\r\n//}\r\n\r\nconst LogIn = () => {\r\n return window.location.href = `/oauth/index`\r\n}\r\nclass App extends Component {\r\n\r\n constructor(props) {\r\n super(props);\r\n\r\n this.state = {\r\n routeFound: true,\r\n register: null,\r\n languageSet: false,\r\n isMounted: false,\r\n urlParams: new URLSearchParams(window.location.search),\r\n directed: false,\r\n isProductAndFeaturesEnabled: false,\r\n\r\n }\r\n let that = this\r\n window.windowNav = (nav) => {\r\n\r\n props.history.push(`/${nav.route}`);\r\n \r\n }\r\n\r\n this.channel = new BroadcastChannel('app-navigate')\r\n\r\n if (this.state.urlParams.has('dlink')) {\r\n const routerName = this.state.urlParams.get('dlink');\r\n localStorage.setItem('KEY_DLINK_ROUTE',routerName)\r\n }\r\n\r\n if (this.state.urlParams.has('p3nnywis3')) {\r\n if (this.state.urlParams.has('token') && this.state.urlParams.get('token') != null && this.state.urlParams.get('token') !== \"\") {\r\n checkConfig(this.state.urlParams, props)\r\n } else {\r\n window.location.href = '/oauth/index'\r\n }\r\n }\r\n let unloadWindowUTCTimeString = localStorage.getItem(\"PennyWindowUnloadTime\")\r\n if(unloadWindowUTCTimeString != null)\r\n {\r\n localStorage.removeItem(\"PennyWindowUnloadTime\") \r\n const unloadWindowUTCTime = new Date(unloadWindowUTCTimeString);\r\n if(unloadWindowUTCTime!= null)\r\n {\r\n // Get the current time as a Date object\r\n const currentTime = new Date();\r\n \r\n // Calculate the difference in milliseconds\r\n const timeDifference = currentTime.getTime() - unloadWindowUTCTime.getTime();\r\n \r\n // Check if the difference is within 15 minutes (900,000 milliseconds)\r\n if (timeDifference >= 900000) {\r\n this.props.dispatch({ type: LOG_OUT, logedIn: false })\r\n this.props.clearListCookies({ nav: \"/oauth/log_out\", loading: false, logout: true })\r\n }\r\n }\r\n\r\n \r\n }\r\n if (this.state.urlParams.has('ids_token')) {\r\n let mobieWrapped = new URLSearchParams(window.location.search)\r\n\r\n let mobileWr = mobieWrapped?.has('mobile_wrap')\r\n\r\n if (mobileWr) {\r\n localStorage.setItem(\"PennyTime\", mobieWrapped?.get('mobile_wrap'))\r\n }\r\n\r\n props.dispatch({\r\n type: SET_TOKEN,\r\n token: this.state.urlParams.get('ids_token'),\r\n mobileWraped: mobileWr,\r\n ...(mobileWr ? { selectedLoanNumber: mobieWrapped?.get('mobile_wrap') } : null)\r\n })\r\n this.props.history.push(window.location.pathname)\r\n }\r\n window.addEventListener('beforeinstallprompt', e => {\r\n e.preventDefault()\r\n props.dispatch({ type: OFFLINE_MODE, event: e })\r\n })\r\n window.addEventListener('beforeunload', e => {\r\n if(window.location.pathname != '/SuccessfulLogout')\r\n {\r\n props.trackerDispatcher(UserLanguage_ENUM.English,\r\n TrackerCategoryLID_ENUM.Button,\r\n TrackerHitTypeLID_ENUM.Event,\r\n TrackerActionLID_ENUM.Click,\r\n \"Window unloaded by user action or system\", 0);\r\n // Create a new Date object\r\n let currentDateUTC = new Date();\r\n // Get current UTC time as a string\r\n let currentUTCTime = currentDateUTC.toUTCString();\r\n \r\n localStorage.setItem(\"PennyWindowUnloadTime\", currentUTCTime);\r\n\r\n }\r\n\r\n })\r\n localStorage.removeItem(\"navigation\")\r\n window.addEventListener('storage', storageEventHandler, false);\r\n function storageEventHandler(evt) {\r\n let valu = localStorage.getItem(\"navigation\")\r\n\r\n if (valu) {\r\n that.props.history.push(valu)\r\n that.props.authenticate()\r\n }\r\n\r\n }\r\n\r\n this.channel.addEventListener('message', (event) => {\r\n let route = event.data\r\n that.props.history.push(route)\r\n that.props.authenticate()\r\n })\r\n\r\n }\r\n\r\n componentDidUpdate(){\r\n const routerName = localStorage.getItem('KEY_DLINK_ROUTE')\r\n if (this.props.layout?.currentLoan && this.props.layout.currentLoan?.loanId && routerName ) {\r\n localStorage.removeItem('KEY_DLINK_ROUTE')\r\n if(routerName.includes('EscrowAnalysisPaymentChange')){\r\n this.props.trackerDispatcher(UserLanguage_ENUM.English, TrackerCategoryLID_ENUM.Button, TrackerHitTypeLID_ENUM.Event, TrackerActionLID_ENUM.Click, \"Dlink/EscrowPayment Change|WEB\", 0);\r\n }\r\n else if(routerName.includes('Mod')){\r\n this.props.trackerDispatcher(UserLanguage_ENUM.English, TrackerCategoryLID_ENUM.Button, TrackerHitTypeLID_ENUM.Event, TrackerActionLID_ENUM.Click, \"Dlink/Modification|WEB\", 0);\r\n } \r\n else if(routerName.includes('Ach'))\r\n {\r\n this.props.trackerDispatcher(UserLanguage_ENUM.English, TrackerCategoryLID_ENUM.Button, TrackerHitTypeLID_ENUM.Event, TrackerActionLID_ENUM.Click, \"Dlink/Autopay|WEB\", 0);\r\n }\r\n else if(routerName.includes('StatementsAndDocuments'))\r\n {\r\n this.props.trackerDispatcher(UserLanguage_ENUM.English, TrackerCategoryLID_ENUM.Button, TrackerHitTypeLID_ENUM.Event, TrackerActionLID_ENUM.Click,\"Dlink/Statements&Documents|WEB\", 0);\r\n }\r\n else if (routerName.includes('Paperless')){\r\n this.props.trackerDispatcher(UserLanguage_ENUM.English, TrackerCategoryLID_ENUM.Button, TrackerHitTypeLID_ENUM.Event, TrackerActionLID_ENUM.Click,\"Dlink/Paperless|WEB\", 0);\r\n }\r\n else if (routerName.includes('OTPpayment')){\r\n this.props.trackerDispatcher(UserLanguage_ENUM.English, TrackerCategoryLID_ENUM.Button, TrackerHitTypeLID_ENUM.Event, TrackerActionLID_ENUM.Click,\"Dlink/OTP|WEB\" , 0); \r\n } \r\n }\r\n }\r\n\r\n\r\n\r\n static getDerivedStateFromProps(props, state) {\r\n let isProductAndFeaturesEnabled = getActiveFeatures(props.layout?.features, `View_Products_And_Offers_web`, props.layout?.whitelisted)\r\n\r\n var isDirected = false;\r\n if (env == \"staging\" || env == \"development\") {\r\n window.layout = props.layout\r\n }\r\n if (props?.layout?.selectedLoanNumber) {\r\n Sentry.configureScope(scope => {\r\n scope.setTag(\"transaction_id\", `Pennymac Loan NUmber: ${props.layout.selectedLoanNumber}`);\r\n });\r\n }\r\n\r\n if (props.layout?.pennyWise) {\r\n } else if (props.layout && props.layout?.currentLoan) {\r\n MarketingScripts(getActiveFeatures(props.layout?.features, `ad_butler_code`, false), props.layout);\r\n }\r\n\r\n if (!state.languageSet && props.layout?.customerPreference && props.layout?.customerPreference.length > 0) {\r\n let lang = props.layout?.customerPreference?.find(s => s.prefenceTypeId == 300097)?.prefenceValueTypeId == 300100 ? \"es\" : \"en\"\r\n props.dispatch({ type: CHANGE_LANGUAGE, lang: lang, dontPost: true })\r\n state.languageSet = true\r\n }\r\n return {\r\n ...state,\r\n directed: isDirected,\r\n isProductAndFeaturesEnabled: isProductAndFeaturesEnabled,\r\n }\r\n\r\n }\r\n\r\n updateTracking = () => {\r\n let { layout } = this.props\r\n if (parseInt(layout.selectedLoanNumber) > 0) {\r\n\r\n let there = localStorage.getItem(\"PennyTime\")\r\n let currentLoanId = parseInt(there) || layout.selectedLoanNumber\r\n\r\n if (currentLoanId > 0 || there == \"there\") {\r\n fetch(`/api/account/track_ui_session`, {\r\n method: \"POST\",\r\n headers: {\r\n 'Content-Type': 'application/json',\r\n 'Authorization': `Bearer ${layout.token}`,\r\n },\r\n body: JSON.stringify({ loanId: layout.selectedLoanNumber })\r\n }).catch(err => { })\r\n } else {\r\n this.props.trackerDispatcher(UserLanguage_ENUM.English,\r\n TrackerCategoryLID_ENUM.Button,\r\n TrackerHitTypeLID_ENUM.Event,\r\n TrackerActionLID_ENUM.Click,\r\n \"LogOut Clicked Via Web SessionTimeOut\", 0)\r\n this.props.clearListCookies({ nav: \"/oauth/log_out\", loading: false, logout: true })\r\n }\r\n }\r\n }\r\n\r\n handleOnIdle = (event) => {\r\n this.props.trackerDispatcher(UserLanguage_ENUM.English,\r\n TrackerCategoryLID_ENUM.Button,\r\n TrackerHitTypeLID_ENUM.Event,\r\n TrackerActionLID_ENUM.Click,\r\n \"LogOut Clicked Via Web SessionTimeOut\", 0)\r\n this.props.dispatch({ type: LOG_IN, logedIn: false })\r\n this.props.clearListCookies({ nav: \"/oauth/log_out\", loading: true, logout: true })\r\n }\r\n\r\n setupTest = (data) => {\r\n if (env == \"staging\" || env == \"development\") {\r\n window.layout = data\r\n }\r\n }\r\n render() {\r\n\r\n let { layout, translations, dispatch } = this.props\r\n\r\n\r\n const blackListRoutes = ['/EmailVerification', '/SuccessfulLogout', '/post_debit_payment', '/Home/Terms', '/Movr/redirect']\r\n return \r\n
\r\n }> */}\r\n {(blackListRoutes.find(e => window.location.pathname.indexOf(e) > -1) == undefined) ? \r\n
\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nclass AppDemo extends React.Component {\r\n constructor(props) {\r\n super(props)\r\n this.state = {\r\n\r\n }\r\n }\r\n\r\n componentDidCatch(error, errorInfo) {\r\n // You can also log the error to an error reporting service\r\n console.log(error, errorInfo);\r\n this.setState({error: error, errorInfo: errorInfo})\r\n }\r\n\r\n componentDidMount() {\r\n if (!pennyWise) {\r\n //unregister()\r\n if (window.location.hostname.indexOf(\"customers\") > -1) {\r\n unregister()\r\n } else {\r\n registerServiceWorker();\r\n }\r\n\r\n }\r\n\r\n }\r\n\r\n static getDerivedStateFromError(error) {\r\n // Update state so the next render will show the fallback UI.\r\n return { hasError: true };\r\n }\r\n\r\n render() {\r\n\r\n return (\r\n this.state.hasError ?