diff --git a/src/components/WalletStatementModal/index.js b/src/components/WalletStatementModal/index.js index cd6ce783acc1..8d7d000ad72d 100644 --- a/src/components/WalletStatementModal/index.js +++ b/src/components/WalletStatementModal/index.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {useState} from 'react'; import {withOnyx} from 'react-native-onyx'; import lodashGet from 'lodash/get'; import {View} from 'react-native'; @@ -13,63 +13,55 @@ import ROUTES from '../../ROUTES'; import Navigation from '../../libs/Navigation/Navigation'; import * as Report from '../../libs/actions/Report'; -class WalletStatementModal extends React.Component { - constructor(props) { - super(props); - - this.state = { - isLoading: true, - }; - } +function WalletStatementModal({statementPageURL, session}) { + const [isLoading, setIsLoading] = useState(true); + const authToken = lodashGet(session, 'authToken', null); /** * Handles in-app navigation for iframe links * - * @param {MessageEvent} e + * @param {MessageEvent} event */ - navigate(e) { - if (!e.data || !e.data.type || (e.data.type !== 'STATEMENT_NAVIGATE' && e.data.type !== 'CONCIERGE_NAVIGATE')) { + const navigate = (event) => { + if (!event.data || !event.data.type || (event.data.type !== 'STATEMENT_NAVIGATE' && event.data.type !== 'CONCIERGE_NAVIGATE')) { return; } - if (e.data.type === 'CONCIERGE_NAVIGATE') { + if (event.data.type === 'CONCIERGE_NAVIGATE') { Report.navigateToConciergeChat(); } - if (e.data.type === 'STATEMENT_NAVIGATE' && e.data.url) { + if (event.data.type === 'STATEMENT_NAVIGATE' && event.data.url) { const iouRoutes = [ROUTES.IOU_REQUEST, ROUTES.IOU_SEND, ROUTES.IOU_BILL]; - const navigateToIOURoute = _.find(iouRoutes, (iouRoute) => e.data.url.includes(iouRoute)); + const navigateToIOURoute = _.find(iouRoutes, (iouRoute) => event.data.url.includes(iouRoute)); if (navigateToIOURoute) { Navigation.navigate(navigateToIOURoute); } } - } + }; - render() { - const authToken = lodashGet(this.props, 'session.authToken', null); - return ( - <> - {this.state.isLoading && } - -