diff --git a/src/components/IFrame.js b/src/components/IFrame.tsx similarity index 80% rename from src/components/IFrame.js rename to src/components/IFrame.tsx index aa85ad03ffbf..7520ad869507 100644 --- a/src/components/IFrame.js +++ b/src/components/IFrame.tsx @@ -1,15 +1,20 @@ -/* eslint-disable es/no-nullish-coalescing-operators */ -import PropTypes from 'prop-types'; import React, {useEffect, useState} from 'react'; -import {withOnyx} from 'react-native-onyx'; +import {OnyxEntry, withOnyx} from 'react-native-onyx'; import ONYXKEYS from '@src/ONYXKEYS'; +import {Session} from '@src/types/onyx'; -function getNewDotURL(url) { +type OldDotIFrameOnyxProps = { + session: OnyxEntry; +}; + +type OldDotIFrameProps = OldDotIFrameOnyxProps; + +function getNewDotURL(url: string): string { const urlObj = new URL(url); const paramString = urlObj.searchParams.get('param') ?? ''; const pathname = urlObj.pathname.slice(1); - let params; + let params: Record; try { params = JSON.parse(paramString); } catch { @@ -48,7 +53,7 @@ function getNewDotURL(url) { return pathname; } -function getOldDotURL(url) { +function getOldDotURL(url: string): string { const urlObj = new URL(url); const pathname = urlObj.pathname; const paths = pathname.slice(1).split('/'); @@ -86,35 +91,27 @@ function getOldDotURL(url) { return pathname; } -const propTypes = { - // The session of the logged in person - session: PropTypes.shape({ - // The email of the logged in person - email: PropTypes.string, - - // The authToken of the logged in person - authToken: PropTypes.string, - }).isRequired, -}; - -function OldDotIFrame({session}) { +function OldDotIFrame({session}: OldDotIFrameProps) { const [oldDotURL, setOldDotURL] = useState('https://staging.expensify.com'); useEffect(() => { setOldDotURL(`https://expensify.com.dev/${getOldDotURL(window.location.href)}`); - window.addEventListener('message', (event) => { + window.addEventListener('message', (event: MessageEvent) => { const url = event.data; // TODO: use this value to navigate to a new path - // eslint-disable-next-line no-unused-vars + // eslint-disable-next-line @typescript-eslint/no-unused-vars const newDotURL = getNewDotURL(url); }); }, []); useEffect(() => { + if (!session) { + return; + } document.cookie = `authToken=${session.authToken}; domain=expensify.com.dev; path=/;`; document.cookie = `email=${session.email}; domain=expensify.com.dev; path=/;`; - }, [session.authToken, session.email]); + }, [session]); return (