\n {children}\n
\n \n \r\n {message && (\r\n 
\r\n \r\n );\r\n};\r\n\r\nSpinnerImage.propTypes = {\r\n className: PropTypes.string,\r\n message: PropTypes.node,\r\n white: PropTypes.bool,\r\n};\r\n\r\nconst SpinnerWithLockSVG = ({strokeWidth, color = '#1ea6ed', ...props}) => (\r\n \r\n \r\n \r\n \r\n);\r\n\r\nSpinnerWithLockSVG.propTypes = {\r\n strokeWidth: PropTypes.number,\r\n color: PropTypes.string,\r\n};\r\n\r\nexport const SpinnerWithLockBig = ({className, color, message, label = 'You are being redirected'}) => (\r\n \r\n {message &&\r\n \r\n);\r\n\r\nSpinnerWithLockBig.propTypes = {\r\n className: PropTypes.string,\r\n message: PropTypes.node,\r\n color: PropTypes.string,\r\n label: PropTypes.node,\r\n};\r\n\r\nconst Spinner = ({message}) => (\r\n \n
\n);\n\nSmallSpinner.propTypes = {\n className: PropTypes.string,\n color: PropTypes.string,\n};\n\nexport default SmallSpinner;\n","import React, {Component} from 'react';\nimport style from './TextInput.css';\nimport _get from 'lodash/get';\nimport { SmallSpinner } from './SmallSpinner';\nimport classNames from 'classnames/bind';\nimport PropTypes from 'prop-types';\n\nconst cx = classNames.bind(style);\n\nclass TextInput extends Component {\n\n render() {\n const {\n placeholder,\n onChange,\n id,\n value,\n displaySpinner,\n onKeyDown,\n pattern,\n className,\n autoFocus,\n required,\n autoComplete,\n } = this.props;\n return (\n {\n e.preventDefault();\n this.closeDrawer();\n }} />\n
\n \n ) : null),\n ];\n return (\n \n {children}\n
\n \n \n \n {drawer}\n \n
\n );\n }\n}\n\nMenuDrawer.propTypes = {\n children: PropTypes.node,\n iconColor: PropTypes.string,\n};\n\nMenuDrawer.defaultProps = {\n iconColor: '#000',\n};\n\nexport default MenuDrawer;\n","import MenuDrawer from './MenuDrawer';\n\nexport default MenuDrawer;\n","import React, {Fragment} from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport style from '../../../css/Spinner.css';\r\nimport classNames from 'classnames/bind';\r\nimport spinner from '../../../assets/spinner.svg';\r\nimport '../../../assets/spinner-big.svg';\r\nimport spinnerWhite from '../../../assets/spinner-white.svg';\r\n\r\nconst cx = classNames.bind(style);\r\n\r\nconst defaults = {\r\n big: {\r\n width: 106,\r\n height: 106,\r\n viewBox: '0 0 106 106',\r\n strokeWidth: 10.5,\r\n },\r\n small: {\r\n width: 15,\r\n height: 15,\r\n viewBox: '0 0 106 106',\r\n strokeWidth: 15,\r\n },\r\n};\r\n\r\nconst SpinnerSVG = ({strokeWidth, color = '#1ea6ed', ...props}) => (\r\n \r\n);\r\n\r\nSpinnerSVG.propTypes = {\r\n strokeWidth: PropTypes.number,\r\n color: PropTypes.string,\r\n};\r\n\r\nexport const SpinnerBig = ({className, color, message}) => (\r\n \r\n {message && (\r\n
\r\n);\r\n\r\nSpinnerBig.propTypes = {\r\n className: PropTypes.string,\r\n message: PropTypes.node,\r\n color: PropTypes.string,\r\n};\r\n\r\nexport const SpinnerSmall = ({className, color}) => (\r\n \r\n {message}\r\n
\r\n )}\r\n \r\n {message}\r\n
\r\n )}\r\n \r\n
\r\n ||\r\n \r\n
\r\n \r\n {label}\r\n
\r\n \r\n {message}\r\n
\r\n \r\n
\r\n \r\n
\r\n }\r\n \r\n
\r\n);\r\n\r\nSpinner.propTypes = {\r\n message: PropTypes.node,\r\n};\r\n\r\nexport default Spinner;\r\n","export default \"/assets/spinner-white.svg\";","export default \"/assets/spinner.svg\";","import React from 'react';\nimport style from './SmallSpinner.css';\nimport { SpinnerSmall } from '@token-io/lib-web-components/src/Components/Spinner';\nimport classNames from 'classnames/bind';\nimport PropTypes from 'prop-types';\n\nconst cx = classNames.bind(style);\n\nexport const SmallSpinner = ({className, color}) => (\n \n {\n e.target.select();\n this.setState({\n [id]: {\n isInputFocused: true,\n },\n });\n }}\n className={cx({\n [className]: !!className,\n })}\n pattern={pattern}\n autoFocus={!!autoFocus}\n required={!!required}\n autoComplete={autoComplete}\n onBlur={() => {\n this.setState({\n [id]: {\n isInputFocused: false,\n },\n });\n }} />\n {\n _get(this.state, `[${id}].isInputFocused`) && value\n ?\n \n {placeholder}\n \n :\n \n }\n { displaySpinner &&
\n );\n }\n}\n\nTextInput.propTypes = {\n placeholder: PropTypes.string,\n onChange: PropTypes.func,\n id: PropTypes.string.isRequired,\n value: PropTypes.string,\n displaySpinner: PropTypes.bool,\n onKeyDown: PropTypes.func,\n pattern: PropTypes.string,\n className: PropTypes.string,\n autoFocus: PropTypes.bool,\n required: PropTypes.bool,\n autoComplete: PropTypes.string,\n};\n\nTextInput.defaultProps = {\n placeholder: 'Enter value',\n id: '',\n value: '',\n displaySpinner: false,\n onKeyDown: () => null,\n onChange: () => null,\n className: '',\n autoFocus: false,\n required: false,\n autoComplete: 'on',\n};\n\nexport default TextInput;\n","import React, {Component} from 'react';\nimport PropTypes from 'prop-types';\nimport TextInput from './TextInput';\n\nclass Credentials extends Component {\n render() {\n const {\n setCredentials,\n credentialsValue,\n requiredCredentials,\n onKeyDown,\n } = this.props;\n\n return (\n <>\n { requiredCredentials &&\n Credential fields}\n \n {requiredCredentials?.map(data => {\n return (\n
Configuration
)\n : (\n\n Bank-id\n \n Additional field (optional)\n e.key === 'Enter' && this.confirm(e)}\n placeholder={'Enter Dev Key (Optional)'}\n ref={input => this.input = input}\n value={this.state.devKey}\n onChange={e => this.setState({ devKey: e.target.value })} />\n\n
\n );\n return (\n \n \n \n
\n {this.state.webAppEnabled &&\n \n \n \n
\n }\n {this.state.webAppEnabled && this.state.wav2Enabled &&\n \n \n \n
\n }\n {!this.state.webAppEnabled &&\n \n \n \n
\n }\n {!this.state.webAppEnabled && this.state.isType2Member &&\n \n \n \n
\n }\n \n
\n \n \n {'Confirm'}\n \n
\n !this.state.isOpen && this.setState({ isOpen: !this.state.isOpen })}>\n {inner}\n
\n );\n }\n}\n\nWebAppSelection.propTypes = {\n customSource: PropTypes.object,\n devKey: PropTypes.string,\n dispatch: PropTypes.func.isRequired,\n};\n\nconst mapStateToProps = state => ({\n customSource: state.customSource,\n devKey: state.devKey,\n});\n\nexport default connect(mapStateToProps)(WebAppSelection);\n","import React from 'react';\nimport PropTypes from 'prop-types';\nimport {showIfLocation, Link} from 'SimpleHistory';\nimport './index.css';\nimport MenuDrawer from 'components/MenuDrawer';\nimport logoFinvertex from 'assets/logo-finvertex.png';\nimport logoFinvertexMobile from 'assets/logo-finvertex-mobile.png';\nimport WebAppSelection from './WebAppSelection';\n\nconst Links = () => (\n \n);\n\nconst Outer = ({children}) => (\n \n \n \n \n \n \n \n
\n);\n\nOuter.propTypes = {\n children: PropTypes.node,\n};\n\nexport default showIfLocation(Outer);\n","export default \"/assets/logo-finvertex.png\";","export default \"/assets/logo-finvertex-mobile.png\";","import React from 'react';\nimport {Link, showIfLocation} from 'SimpleHistory';\nimport './Login.css';\n\nconst Login = () => (\n \n
\n \n \n 
\n 
\n \n {
\n \n
\n \n \n
\n);\n\nexport default showIfLocation(Login);\n","import React from 'react';\nimport PropTypes from 'prop-types';\nimport {CSSTransition, TransitionGroup} from 'react-transition-group';\nimport {Link, showIfLocation} from 'SimpleHistory';\nimport './Account.css';\nimport 'assets/breadcrumbs-divider.png';\n\nclass Account extends React.Component {\n getChildren() {\n const {history} = this.props;\n const path = history.location.pathname;\n return this.props.children &&\n \n \n \n {this.getChildren()}\n \n
\n );\n }\n}\n\nAccount.propTypes = {\n children: PropTypes.node,\n history: PropTypes.object,\n};\n\nexport default showIfLocation(Account);\n","import React, { useEffect, useRef } from 'react';\nimport PropTypes from 'prop-types';\nimport { useDispatch } from 'react-redux';\nimport './index.css';\nimport { AispClient } from 'util.js';\nimport commonActions from 'actions/commonActions';\nimport { withHistory } from 'SimpleHistory';\nimport { WEB_APP_ENV } from 'config/constants';\n\nconst SCRIPT_INTERVAL = 30;\n\nfunction TokenEnablerButtonV1(props) {\n const {\n devKey,\n memberType,\n sourceAccount,\n webAppEnabled,\n text,\n onError,\n credentials,\n } = props;\n const dispatch = useDispatch();\n const buttonRef = useRef(null);\n const tokenControllerRef = useRef(null);\n const buttonInstanceRef = useRef(null);\n\n useEffect(() => {\n let isMounted = true;\n async function addAccessButton() {\n if (!window.Token) {\n setTimeout(addAccessButton, SCRIPT_INTERVAL);\n return;\n }\n const token = new window.Token({ env: WEB_APP_ENV });\n if (buttonInstanceRef.current) {\n try {\n buttonInstanceRef.current.destroy();\n } catch (error) {\n console.warn('Error destroying previous button instance:', error);\n }\n }\n buttonInstanceRef.current = token.createTokenButton(buttonRef.current, {\n label: text,\n hideLogo: true,\n });\n tokenControllerRef.current = token.createController({\n onSuccess: data => {\n dispatch(commonActions.setTokenData(data));\n window.document.location.assign('/account/paired');\n },\n onError: error => {\n onError(error.error + ': ' + error.message);\n window.document.location.assign('/account/paired');\n throw error;\n },\n });\n tokenControllerRef.current.bindButtonClick(\n buttonInstanceRef.current,\n token.createRequest(\n redirect => {\n redirect('/getTokenRequestUrl', {\n devKey,\n webAppEnabled,\n sourceAccount,\n memberType,\n credentials,\n });\n },\n async (done, errorCb) => {\n try {\n const tokenRequestUrl = await AispClient.getTokenRequestUrl(\n devKey,\n memberType,\n webAppEnabled,\n sourceAccount,\n credentials,\n false,\n );\n done(tokenRequestUrl);\n } catch (error) {\n errorCb('Error fetching Token Request URL', error);\n }\n },\n ),\n async error => {\n if (error) throw error;\n await AispClient.getAispAlias(memberType);\n if (isMounted && buttonInstanceRef.current) buttonInstanceRef.current.enable();\n },\n {\n desktop: webAppEnabled && 'POPUP' || 'REDIRECT',\n },\n );\n }\n addAccessButton();\n return () => {\n isMounted = false;\n if (buttonInstanceRef.current && buttonRef.current) {\n try {\n buttonInstanceRef.current.destroy();\n } catch (error) {\n console.warn('Error destroying button instance during cleanup:', error);\n }\n buttonInstanceRef.current = null;\n }\n };\n }, [devKey, memberType, sourceAccount, webAppEnabled, text, onError, credentials]);\n\n return (\n \n );\n}\n\nTokenEnablerButtonV1.propTypes = {\n text: PropTypes.string,\n devKey: PropTypes.string,\n credentials: PropTypes.object,\n memberType: PropTypes.string.isRequired,\n sourceAccount: PropTypes.object,\n webAppEnabled: PropTypes.bool.isRequired,\n onError: PropTypes.func,\n};\n\nTokenEnablerButtonV1.defaultProps = {\n text: 'Enable Token V1',\n onError: () => { },\n};\n\nexport default withHistory(TokenEnablerButtonV1);\n","import React, { useEffect, useRef, useCallback, useState } from 'react';\nimport PropTypes from 'prop-types';\nimport { useDispatch } from 'react-redux';\nimport './index.css';\nimport { AispClient } from 'util.js';\nimport commonActions from 'actions/commonActions';\nimport { withHistory } from 'SimpleHistory';\nimport { APP_SDK_ENV } from 'config/constants';\n\nconst TokenEnablerButtonV2 = ({\n devKey,\n memberType,\n webAppEnabled,\n sourceAccount,\n credentials,\n onError,\n text,\n aisApiVersion,\n}) => {\n const appControllerRef = useRef(null);\n const dispatch = useDispatch();\n const [fallbackMessage, setFallbackMessage] = useState(null);\n const [isDisabled, setIsDisabled] = useState(true);\n\n const handleClick = useCallback(async () => {\n try {\n const appModal = appControllerRef.current.initApp();\n if (aisApiVersion === 'v2') {\n const { redirectUrl, consentId } = await AispClient.getConsentUrl({\n bankId: sourceAccount?.bankId,\n });\n dispatch(commonActions.setConsentId(consentId));\n appModal.navigateToUrl(redirectUrl);\n return;\n }\n const tokenRequestUrl = await AispClient.getTokenRequestUrl(\n devKey,\n memberType,\n webAppEnabled,\n sourceAccount,\n credentials,\n true,\n );\n appModal.navigateToUrl(tokenRequestUrl);\n } catch (error) {\n onError(error.message || 'WAV2 flow error');\n if (appControllerRef.current) {\n try {\n appControllerRef.current.cleanUp();\n } catch (cleanupError) {\n console.warn('Error during cleanup:', cleanupError);\n }\n }\n }\n }, [\n devKey, memberType, webAppEnabled, sourceAccount, credentials, onError,\n aisApiVersion, dispatch,\n ]);\n\n const initializeController = useCallback(async () => {\n setFallbackMessage(null);\n setIsDisabled(true);\n\n if (!window.TokenApp) {\n setFallbackMessage('TokenApp SDK not loaded');\n return;\n }\n\n try {\n const appSdk = new window.TokenApp({\n env: APP_SDK_ENV,\n });\n\n appControllerRef.current = appSdk.buildController({\n onDone: data => {\n dispatch(commonActions.setTokenData(data));\n if (appControllerRef.current) {\n try {\n appControllerRef.current.cleanUp();\n } catch (cleanupError) {\n console.warn('Error during cleanup:', cleanupError);\n }\n }\n window.document.location.assign('/account/paired');\n },\n onError: error => {\n onError(error?.message || 'WAV2 flow error');\n if (appControllerRef.current) {\n try {\n appControllerRef.current.cleanUp();\n } catch (cleanupError) {\n console.warn('Error during cleanup:', cleanupError);\n }\n }\n window.document.location.assign('/account/paired');\n },\n });\n\n await AispClient.getAispAlias(memberType);\n setIsDisabled(false);\n } catch (error) {\n if (error.message.includes('TokenApp')) {\n setFallbackMessage('TokenApp initialization failed');\n }\n onError(`Failed to initialize: ${error?.message || 'Unknown error'}`);\n }\n }, [devKey, memberType, sourceAccount, webAppEnabled, text, onError, credentials, dispatch]);\n\n useEffect(() => {\n initializeController();\n }, [initializeController]);\n\n useEffect(() => {\n return () => {\n if (appControllerRef.current) {\n try {\n appControllerRef.current.cleanUp();\n } catch (error) {\n console.warn('Error cleaning up app controller:', error);\n }\n appControllerRef.current = null;\n }\n };\n }, []);\n\n if (fallbackMessage) {\n return (\n \n \n
\n );\n }\n\n return (\n \n \n {text}\n \n
\n );\n};\n\nTokenEnablerButtonV2.propTypes = {\n text: PropTypes.string,\n devKey: PropTypes.string,\n credentials: PropTypes.object,\n memberType: PropTypes.string.isRequired,\n sourceAccount: PropTypes.object,\n webAppEnabled: PropTypes.bool,\n onError: PropTypes.func,\n aisApiVersion: PropTypes.string,\n};\n\nTokenEnablerButtonV2.defaultProps = {\n text: 'Enable Token V2 (WAV2)',\n webAppEnabled: true,\n onError: () => { },\n aisApiVersion: 'v1',\n};\n\nexport default withHistory(TokenEnablerButtonV2);\n","import React, { useEffect } from 'react';\nimport PropTypes from 'prop-types';\nimport TokenEnablerButtonV1 from 'components/TokenEnablerButton/TokenEnablerButtonV1';\nimport TokenEnablerButtonV2 from 'components/TokenEnablerButton/TokenEnablerButtonV2';\nimport { connect } from 'react-redux';\nimport actionCreators from 'actions/commonActions';\nimport { bindActionCreators } from 'redux';\nimport { showIfLocation } from 'SimpleHistory';\nimport './Unpaired.css';\n\nconst Unpaired = ({\n actions,\n devKey,\n webAppEnabled,\n memberType,\n sourceAccount,\n credentials,\n wav2Enabled,\n aisApiVersion,\n}) => {\n\n useEffect(() => {\n actions.setMemberType(memberType);\n }, [memberType]);\n\n const isReady = webAppEnabled || (sourceAccount && sourceAccount.bankId);\n\n const TokenEnablerComponent = (wav2Enabled && webAppEnabled) ?\n TokenEnablerButtonV2 : TokenEnablerButtonV1;\n const buttonText = (wav2Enabled && webAppEnabled)\n ? (aisApiVersion === 'v2' ? 'HPV2 / AIS V2' : 'HPV2')\n : 'V1';\n\n return (\n \n \n \n \n \n
\n );\n};\n\nUnpaired.propTypes = {\n actions: PropTypes.object.isRequired,\n devKey: PropTypes.string,\n webAppEnabled: PropTypes.bool.isRequired,\n memberType: PropTypes.string.isRequired,\n sourceAccount: PropTypes.object,\n credentials: PropTypes.object,\n wav2Enabled: PropTypes.bool,\n aisApiVersion: PropTypes.string,\n};\n\nUnpaired.defaultProps = {\n webAppEnabled: true,\n memberType: 'type1',\n wav2Enabled: false,\n aisApiVersion: 'v1',\n};\n\nconst mapStateToProps = state => {\n return {\n devKey: state.devKey,\n webAppEnabled: state.customSource.webAppEnabled,\n sourceAccount: state.customSource.source,\n memberType: state.customSource.memberType,\n credentials: state.customSource.credentials,\n wav2Enabled: state.customSource.wav2Enabled,\n aisApiVersion: state.customSource.aisApiVersion,\n };\n};\n\nconst mapDispatchToProps = dispatch => {\n return {\n actions: bindActionCreators(actionCreators, dispatch),\n };\n};\n\nexport default showIfLocation(connect(\n mapStateToProps,\n mapDispatchToProps,\n)(Unpaired));\n","import {responsive} from 'util.js';\n\nclass PieChart {\n constructor(el, data) {\n if (!window.d3) throw new Error('D3.js is required.');\n this.buildPieStructure = this.buildPieStructure.bind(this);\n this.update = this.update.bind(this);\n this.data = data;\n this.d3 = window.d3;\n this.el = el;\n if (this.data) {\n this.update(this.data);\n }\n }\n buildPieStructure(el) {\n el.innerHTML = '';\n const size = el.getBoundingClientRect();\n const r = responsive(this.screenWidth);\n\n this.width = size.width;\n this.height = size.height - r({\n phone: 10,\n tablet: 10,\n def: 20,\n });\n this.radius = Math.min(this.width, this.height) / 2;\n\n this.color = this.d3.scale.category20();\n\n this.pie = this.d3.layout.pie()\n .sort(null)\n .value(d => d.value);\n\n this.arc = this.d3.svg.arc()\n .innerRadius(this.radius * r({\n phone: .30,\n tablet: .30,\n def: .25,\n }))\n .outerRadius(this.radius * r({\n phone: .82,\n tablet: .82,\n def: .65,\n }));\n\n this.svg = this.d3.select(el).append('svg')\n .attr('width', this.width)\n .attr('height', this.height)\n .append('g')\n .attr('transform', 'translate(' + this.width / 2 + ',' + this.height / 2 + ')');\n }\n update(data) {\n this.screenWidth = window.innerWidth;\n const dataSet = data\n .filter(acc => parseFloat(acc.balance.current.value, 10) > 0)\n .map(acc => ({\n index: acc.index,\n accountName: acc.name,\n bankName: acc.bankName || acc.bankId,\n value: parseFloat(acc.balance.current.value, 10),\n }));\n\n this.buildPieStructure(this.el);\n\n this.piedata = this.pie(dataSet);\n\n let pathGroup = this.svg.select('g.piePaths');\n if (pathGroup.empty()) {\n pathGroup = this.svg.append('g')\n .attr('class', 'piePaths');\n }\n\n this.path = pathGroup.selectAll('path.pie')\n .data(this.piedata);\n\n this.path.enter().append('path')\n .attr('class', 'pie')\n .attr('fill', d => {\n return getColor(d.data.index);\n })\n .attr('d', this.arc);\n\n this.path.exit()\n .remove();\n }\n}\n\nif (!window.d3) throw new Error('D3.js is required.');\nconst d3color = window.d3.scale.category20();\n\nconst colors = [\n '#f37d6e',\n '#8a67ff',\n '#20bf87',\n '#f3c26e',\n];\n\nconst getColor = i => {\n return colors[i] || d3color(i - colors.length);\n};\n\nexport default {\n PieChart: PieChart,\n getColor: getColor,\n};\n","export default \"/assets/iron-logo.png\";","import React, { Component } from 'react';\nimport PropTypes from 'prop-types';\nimport { connect } from 'react-redux';\nimport './Transactions.css';\nimport TokenChart from 'components/Pages/TokenChart';\nimport { AispClient, getPluralizedString, getDeviceId, getUserAgent } from 'util.js';\nimport { FormattedNumber } from 'react-intl';\nimport { currencySymbols, transactionsLimit } from 'config/constants';\nimport commonActions from 'actions/commonActions';\nimport throttle from 'lodash/throttle';\nimport ironLogo from 'assets/iron-logo.png';\n\nconst TransactionsListControls = ({\n accounts,\n activeAccountId,\n onActiveAccountChange,\n onDateChange,\n onStartDateSelect,\n selectedStartDate,\n}) => (\n \n
\n Get Started - Connect with Token
\n\n actions.setAccessError(err)}\n text={`LINK WITH TOKEN ${buttonText}`}\n credentials={credentials}\n aisApiVersion={aisApiVersion}\n />\n }\n
\n \n Token provides software to banks that allows\n monetization of PSD2 and mitigates\n disintermediation and security risks associated\n with granting access to Third Party Providers.\n
\n {isReady &&\n\n
\n Account Help
\n\n
\n \n Established in 2000, we are your insurance expert\n commited to providing peace of mind to all kinds\n of borrowers by helping them obtain and manage a\n insurance.\n
\n\n
\n);\n\nTransactionsListControls.propTypes = {\n onActiveAccountChange: PropTypes.func,\n accounts: PropTypes.array,\n activeAccountId: PropTypes.string,\n onDateChange: PropTypes.func,\n onStartDateSelect: PropTypes.func,\n selectedStartDate: PropTypes.string,\n};\n\nclass TransactionsList extends Component {\n constructor(props) {\n super(props);\n this.state = {\n isLoading: false,\n };\n this.onScroll = throttle(this.onScroll.bind(this), 500);\n this.fetchTransactions = this.fetchTransactions.bind(this);\n }\n componentDidMount() {\n this.cancelFetch = false;\n window.addEventListener('scroll', this.onScroll, false);\n }\n componentWillUnmount() {\n this.cancelFetch = true;\n window.removeEventListener('scroll', this.onScroll, false);\n }\n componentDidUpdate(prevProps) {\n\n let isDateChanged = false;\n if (this.props.startDate !== prevProps.startDate\n || this.props.endDate !== prevProps.endDate) {\n isDateChanged = true;\n }\n if (this.props.activeAccountId !== prevProps.activeAccountId\n || isDateChanged) {\n this.fetchTransactions(this.props.activeAccountId, this.props.startDate,\n this.props.endDate, false, isDateChanged);\n }\n }\n\n async fetchTransactions(accountId,\n startDate = '',\n endDate = '',\n onScroll = false,\n isDateChanged = false) {\n const isDateRangeSelected = (startDate !== '') ? true : false;\n if (this.state.isLoading) return;\n const { activeAccountId, tokenData, transactions, dispatch, aisApiVersion } = this.props;\n const accountTransactions = transactions[activeAccountId] && transactions[activeAccountId];\n const offset = !isDateChanged && accountTransactions && accountTransactions.offset || '';\n const customerTrackingMetadata = { deviceId: getDeviceId(), userAgent: getUserAgent() };\n if (!isDateRangeSelected && offset === 'EOL') return;\n this.setState({ isLoading: true });\n try {\n const transactions = aisApiVersion === 'v2'\n ? await AispClient.pullTransactionsV2(accountId, offset, startDate, endDate)\n : await AispClient.pullTransactions(\n tokenData,\n accountId,\n offset,\n startDate,\n endDate,\n customerTrackingMetadata);\n !this.cancelFetch && this.setState({ isLoading: false });\n if (!transactions) {\n return;\n }\n const newOffset = transactions.transactions.length\n && transactions.transactions.length === transactionsLimit\n && transactions.offset || 'EOL';\n\n if (isDateRangeSelected && !onScroll || isDateChanged) {\n dispatch(commonActions.setAccountTransactions(\n accountId, transactions.transactions, newOffset,\n ));\n }\n else {\n dispatch(commonActions.appendTransactions(\n accountId, transactions.transactions, newOffset,\n ));\n }\n } catch (e) {\n !this.cancelFetch && this.setState({ isLoading: false });\n throw e;\n }\n }\n onScroll() {\n const { isLoading } = this.state;\n const { activeAccountId, transactions } = this.props;\n if (!activeAccountId) return;\n const accountTransactions = transactions[activeAccountId]\n && transactions[activeAccountId] || {};\n const offset = accountTransactions && accountTransactions.offset || '';\n if (\n (window.innerHeight + window.scrollY) >= (document.body.offsetHeight - 100) &&\n !isLoading && offset !== 'EOL'\n ) {\n this.fetchTransactions(this.props.activeAccountId, this.props.startDate,\n this.props.endDate, true);\n }\n }\n render() {\n const { transactions, accounts, activeAccountId } = this.props;\n if (!activeAccountId) return null;\n const index = accounts.findIndex(item => item.id === activeAccountId);\n const activeAccount = accounts[index];\n const accountTransactions = transactions[activeAccountId]\n && transactions[activeAccountId].transactions || [];\n return (\n \n
\n \n \n {'Show Transactions '}\n \n {\n onActiveAccountChange(e.target.value);\n }}>\n {accounts.map(acc => {\n return (\n \n {acc.name}\n \n );\n })}\n \n
\n \n
\n \n \n
\n \n
\n );\n }\n}\n\nTransactionsList.propTypes = {\n accounts: PropTypes.array,\n activeAccountId: PropTypes.string,\n startDate: PropTypes.string,\n endDate: PropTypes.string,\n tokenData: PropTypes.object,\n transactions: PropTypes.object,\n dispatch: PropTypes.func.isRequired,\n aisApiVersion: PropTypes.string,\n};\n\nconst mapStateToProps = state => ({\n tokenData: state.tokenData,\n transactions: state.transactions,\n aisApiVersion: state.customSource.aisApiVersion,\n});\n\nconst ConnectedTransactionsList = connect(mapStateToProps)(TransactionsList);\n\nconst Transactions = ({\n accounts,\n activeAccountId,\n onActiveAccountChange,\n onDateChange,\n startDate,\n endDate,\n onStartDateSelect,\n selectedStartDate }) => (\n \n 
\n
\n \n {activeAccount.name}\n \n {getPluralizedString(accountTransactions.length, 'Transaction')}\n \n
\n - \n {accountTransactions.map(t => {\n const date = (new Date(parseInt(t.createdAtMs)))\n .toUTCString()\n .replace('GMT', 'UTC');\n const amount = t.amount.value;\n const currencyString =\n `${t.type === 'CREDIT'\n ? '+'\n : '-'}${currencySymbols[t.amount.currency] || ''}`;\n return (\n
- \n \n {t.description}\n\n
\n {date}\n {t.metadata && t.metadata.merchantName}\n {t.metadata && t.metadata.merchantCategoryCode}\n\n {currencyString}\n\n \n );\n })}\n {this.state.isLoading && (\n - \n \n Loading...\n\n \n )}\n
\n
\n);\n\nTransactions.propTypes = {\n accounts: PropTypes.array,\n activeAccountId: PropTypes.string,\n onActiveAccountChange: PropTypes.func,\n onDateChange: PropTypes.func,\n startDate: PropTypes.string,\n endDate: PropTypes.string,\n onStartDateSelect: PropTypes.func,\n selectedStartDate: PropTypes.string,\n};\n\nexport default Transactions;\n","import React from 'react';\nimport PropTypes from 'prop-types';\nimport {FormattedNumber} from 'react-intl';\n\nclass AccountItem extends React.Component {\n constructor() {\n super();\n }\n\n render() {\n const {opacity, color, logo, acc, amount, enabled, currentAccount} = this.props;\n return (\n \n
\n \n Transactions\n
\n {accounts && accounts.length ?\n
\n \n \n
\n \n \n \n
\n \n \n {acc.bankName || acc.bankId}\n
\n \n {acc.name}\n
\n \n {currentAccount.percentage || 0}\n \n %\n \n
\n ) : ''}\n \n );\n }\n}\n\nAccountItem.propTypes = {\n acc: PropTypes.object.isRequired,\n opacity: PropTypes.number.isRequired,\n color: PropTypes.string.isRequired,\n logo: PropTypes.string.isRequired,\n amount: PropTypes.string.isRequired,\n enabled: PropTypes.bool.isRequired,\n currentAccount: PropTypes.object.isRequired,\n};\n\nexport default AccountItem;\n","/* eslint-disable max-len */\nimport React from 'react';\nimport PropTypes from 'prop-types';\nimport { connect } from 'react-redux';\nimport { FormattedNumber } from 'react-intl';\nimport {\n AispClient,\n filterByCurrency,\n getAvailableCurrencies,\n getDeviceId,\n getUserAgent,\n} from 'util.js';\nimport { showIfLocation } from 'SimpleHistory';\nimport commonActions from 'actions/commonActions';\nimport TokenChart from 'components/Pages/TokenChart';\nimport throttle from 'lodash/throttle';\nimport Transactions from 'components/Pages/Transactions';\nimport ironLogo from 'assets/iron-logo.png';\nimport AccountItem from './AccountItem';\n\nconst AccountControls = ({\n currencies,\n activeCurrency,\n onCurrencyChange,\n updateChart,\n}) => (\n \n
\n);\n\nAccountControls.propTypes = {\n onCurrencyChange: PropTypes.func,\n updateChart: PropTypes.func,\n currencies: PropTypes.array,\n activeCurrency: PropTypes.string,\n};\n\nclass Paired extends React.Component {\n _isMounted = false;\n constructor(props) {\n super(props);\n this.updateChart = this.updateChart.bind(this);\n this.onCurrencyChange = this.onCurrencyChange.bind(this);\n this.onActiveAccountChange = this.onActiveAccountChange.bind(this);\n this.onDateChange = this.onDateChange.bind(this);\n this.onStartDateSelect = this.onStartDateSelect.bind(this);\n this.drawChart = this.drawChart.bind(this);\n this.accounts = [];\n this.state = {\n isLoading: false,\n startDate: '',\n endDate: '',\n selectedStartDate: '',\n };\n }\n drawChart() {\n if (!this.accounts.length) return;\n this.tokenPie.update(this.accounts);\n }\n componentDidMount() {\n this._isMounted = true;\n this.tokenPie = new TokenChart.PieChart(this.accountGraph, this.accounts);\n window.addEventListener('resize', throttle(this.drawChart, 500));\n this.updateChart();\n }\n componentWillUnmount() {\n window.removeEventListener('resize', this.drawChart);\n this._isMounted = false;\n }\n\n componentDidUpdate(prevProps) {\n const { accounts, activeCurrency } = this.props;\n if (prevProps.accounts !== accounts || prevProps.activeCurrency !== activeCurrency) {\n if (!accounts.length) return;\n const enabledAccounts = filterByCurrency(accounts, activeCurrency);\n this.accounts = enabledAccounts.accounts;\n this.drawChart();\n }\n }\n onCurrencyChange(cur) {\n const { dispatch } = this.props;\n dispatch(commonActions.setActiveCurrency(cur));\n }\n onActiveAccountChange(accountId) {\n const { dispatch, accounts } = this.props;\n const account = accounts.find(acc => acc.id === accountId);\n if (!account) return;\n dispatch(commonActions.setActiveAccount(accountId));\n }\n\n onDateChange = e => {\n this.setState({\n startDate: e.target.startDate.value,\n endDate: e.target.endDate.value,\n });\n }\n\n onStartDateSelect = startDate => {\n this.setState({\n selectedStartDate: startDate,\n });\n }\n\n async updateChart() {\n const { dispatch, tokenData, customSource, devKey, aisApiVersion, consentId } = this.props;\n this.setState({ isLoading: true });\n try {\n if (aisApiVersion === 'v2') {\n // Best-effort: the consent may already be AUTHORIZED (e.g. Token's own\n // hosted flow resolved it without needing a TPP-side callback query), in\n // which case this can 400/404 - that's fine, fall through to the actual\n // data pull regardless rather than blocking on it.\n const query = tokenData && typeof tokenData === 'object'\n ? new URLSearchParams(tokenData).toString()\n : '';\n await AispClient.confirmConsentAuthentication(consentId, query).catch(() => {});\n\n const { accounts } = await AispClient.pullAccountsV2();\n dispatch(commonActions.setAccounts(accounts || []));\n if (this._isMounted) {\n this.setState({ isLoading: false });\n }\n return;\n }\n const customerTrackingMetadata = { deviceId: getDeviceId(), userAgent: getUserAgent() };\n // Fetch authorized data\n const { accountIds, tokenId, memberType } =\n await AispClient.pullAuthorizedData({\n ...tokenData,\n bankId: customSource?.selectedBank?.id || customSource?.source?.bankId,\n devKey: devKey,\n customerTrackingMetadata: customerTrackingMetadata,\n });\n\n // Use a Set to remove duplicate accountIds\n const uniqueAccountIds = Array.from(new Set(accountIds));\n\n // Update store with memberType and tokenId\n memberType && dispatch(commonActions.setMemberType(memberType));\n tokenId && dispatch(commonActions.setTokenId(tokenId));\n\n const batchSize = 20;\n let startIndex = 0;\n const totalAccounts = uniqueAccountIds.length;\n let allAccounts = [];\n\n while (startIndex < totalAccounts) {\n const endIndex = Math.min(startIndex + batchSize, totalAccounts);\n const batchAccountIds = uniqueAccountIds.slice(startIndex, endIndex);\n\n // Fetch accountInfo for the current batch\n const batchAccountPromises = batchAccountIds.map(async accountId => {\n try {\n const { accountInfo } = await AispClient.pullAccountInfo({\n accId: accountId,\n tokenId,\n customerTrackingMetadata: customerTrackingMetadata,\n devKey: devKey,\n });\n\n return accountInfo;\n } catch (error) {\n // Handle errors for individual account requests if needed\n console.error(`Error fetching account info for accountId ${accountId}:`, error);\n }\n });\n\n // Resolve promises for the current batch all together\n const batchAccounts = await Promise.all(batchAccountPromises);\n\n const accountsWithBalance = batchAccounts.filter(acc => acc && acc.balance);\n\n allAccounts = [...allAccounts, ...accountsWithBalance];\n dispatch(commonActions.setAccounts([...allAccounts]));\n\n startIndex += batchSize;\n }\n\n if (this._isMounted) {\n this.setState({ isLoading: false });\n }\n } catch (e) {\n window.document.location.assign('/account/error');\n throw e;\n }\n }\n render() {\n const { accounts, activeCurrency, activeAccountId } = this.props;\n const currencies = getAvailableCurrencies(accounts);\n const enabledAccounts = filterByCurrency(accounts, activeCurrency);\n const isReady = !this.state.isLoading;\n const accountControls = (\n \n {'Show Accounts '}\n \n {\n onCurrencyChange(e.target.value);\n }}>\n {currencies.map(curr => (\n \n {curr}\n \n ))}\n \n
\n \n \n Refresh\n \n
\n \n
\n );\n }\n}\n\nPaired.propTypes = {\n history: PropTypes.object,\n accounts: PropTypes.array,\n activeCurrency: PropTypes.string,\n activeAccountId: PropTypes.string,\n tokenData: PropTypes.object,\n customSource: PropTypes.object,\n devKey: PropTypes.string,\n dispatch: PropTypes.func.isRequired,\n aisApiVersion: PropTypes.string,\n consentId: PropTypes.string,\n};\n\nconst mapStateToProps = state => ({\n accounts: state.accounts,\n activeCurrency: state.activeCurrency,\n activeAccountId: state.activeAccountId,\n tokenData: state.tokenData,\n customSource: state.customSource,\n devKey: state.devKey,\n aisApiVersion: state.customSource.aisApiVersion,\n consentId: state.consentId,\n});\n\nexport default connect(mapStateToProps)(showIfLocation(Paired));\n","import React from 'react';\nimport PropTypes from 'prop-types';\nimport {Link, showIfLocation} from 'SimpleHistory';\nimport {connect} from 'react-redux';\nimport './Error.css';\n\nconst Error = ({\n error,\n}) => {\n const errorMessage = error === 'FAILURE_NO_ACCOUNTS'\n ? 'No accounts available for access'\n : error;\n return (\n \n
\n \n
\n \n
\n {isReady ? accountControls : null}\n Accounts{!isReady ? …loading : ''}
\n\n
\n (this.accountGraph = accountGraph)}>\n
\n {isReady ? accountControls : null}\n \n {accounts.map((acc, index) => {\n const enabled = acc.balance.current.currency === activeCurrency;\n const opacity = enabled ? 1.0 : 0.35;\n const color = enabled\n ? TokenChart.getColor(index)\n : 'transparent';\n const logo = acc.bankLogo || ironLogo;\n const amount = acc.balance.current.value;\n const currentAccount = enabledAccounts.accounts.find(\n current => current.id === acc.id,\n );\n return (\n
\n \n Account Totals (\n {` ${enabledAccounts.currency} `}\n )\n \n \n
\n ) : ''}\n \n
\n );\n};\n\nError.propTypes = {\n error: PropTypes.string.isRequired,\n};\n\nconst mapStateToProps = state => {\n return {\n error: state.accessError,\n };\n};\n\nexport default showIfLocation(connect(mapStateToProps)(Error));\n","import React from 'react';\nimport PropTypes from 'prop-types';\nimport {Provider} from 'react-redux';\nimport {withHistory} from 'SimpleHistory';\nimport Outer from 'components/Pages';\nimport Login from 'components/Pages/Login';\nimport Account from 'components/Pages/Account';\nimport Unpaired from 'components/Pages/Unpaired';\nimport Paired from 'components/Pages/Paired';\nimport Error from 'components/Pages/Error';\nimport {IntlProvider} from 'react-intl';\nimport {hotModule} from 'config/constants';\n\nclass App extends React.Component {\n render() {\n return (\n Error on access request
\n\n
\n \n {`There was as error requesting access: ${errorMessage}.`}\n
\n {'Please '}\n try again\n