Make sure to use the link as a key for transaction

src/components/BlockingViews/BlockingView.js

@@ -9,6 +9,7 @@ import themeColors from '../../styles/themes/default';
 import TextLink from '../TextLink';
 import Navigation from '../../libs/Navigation/Navigation';
 import AutoEmailLink from '../AutoEmailLink';
+import useLocalize from '../../hooks/useLocalize';
 
 const propTypes = {
     /** Expensicon for the page */
@@ -24,7 +25,7 @@ const propTypes = {
     subtitle: PropTypes.string,
 
     /** Link message below the subtitle */
-    link: PropTypes.string,
+    linkKey: PropTypes.string,
 
     /** Whether we should show a link to navigate elsewhere */
     shouldShowLink: PropTypes.bool,
@@ -43,13 +44,14 @@ const defaultProps = {
     iconColor: themeColors.offline,
     subtitle: '',
     shouldShowLink: false,
-    link: 'notFound.goBackHome',
+    linkKey: 'notFound.goBackHome',
     iconWidth: variables.iconSizeSuperLarge,
     iconHeight: variables.iconSizeSuperLarge,
     onLinkPress: () => Navigation.dismissModal(),
 };
 
 function BlockingView(props) {
+    const {translate} = useLocalize();
     return (
         <View style={[styles.flex1, styles.alignItemsCenter, styles.justifyContentCenter, styles.ph10]}>
             <Icon
@@ -68,7 +70,7 @@ function BlockingView(props) {
                     onPress={props.onLinkPress}
                     style={[styles.link, styles.mt2]}
                 >
-                    {props.link}
+                    {translate(props.linkKey)}
                 </TextLink>
             ) : null}
         </View>

src/components/BlockingViews/FullPageNotFoundView.js

@@ -3,16 +3,13 @@ import PropTypes from 'prop-types';
 import {View} from 'react-native';
 import BlockingView from './BlockingView';
 import * as Illustrations from '../Icon/Illustrations';
-import withLocalize, {withLocalizePropTypes} from '../withLocalize';
 import HeaderWithBackButton from '../HeaderWithBackButton';
 import Navigation from '../../libs/Navigation/Navigation';
 import variables from '../../styles/variables';
 import styles from '../../styles/styles';
+import useLocalize from '../../hooks/useLocalize';
 
 const propTypes = {
-    /** Props to fetch translation features */
-    ...withLocalizePropTypes,
-
     /** Child elements */
     children: PropTypes.node,
 
@@ -54,35 +51,36 @@ const defaultProps = {
 };
 
 // eslint-disable-next-line rulesdir/no-negated-variables
-function FullPageNotFoundView(props) {
-    if (props.shouldShow) {
+function FullPageNotFoundView({children, shouldShow, titleKey, subtitleKey, linkKey, onBackButtonPress, shouldShowLink, shouldShowBackButton, onLinkPress}) {
+    const {translate} = useLocalize();
+    if (shouldShow) {
         return (
             <>
                 <HeaderWithBackButton
-                    onBackButtonPress={props.onBackButtonPress}
-                    shouldShowBackButton={props.shouldShowBackButton}
+                    onBackButtonPress={onBackButtonPress}
+                    shouldShowBackButton={shouldShowBackButton}
                 />
                 <View style={[styles.flex1, styles.blockingViewContainer]}>
                     <BlockingView
                         icon={Illustrations.ToddBehindCloud}
                         iconWidth={variables.modalTopIconWidth}
                         iconHeight={variables.modalTopIconHeight}
-                        title={props.translate(props.titleKey)}
-                        subtitle={props.translate(props.subtitleKey)}
-                        link={props.translate(props.linkKey)}
-                        shouldShowLink={props.shouldShowLink}
-                        onLinkPress={props.onLinkPress}
+                        title={translate(titleKey)}
+                        subtitle={translate(subtitleKey)}
+                        linkKey={linkKey}
+                        shouldShowLink={shouldShowLink}
+                        onLinkPress={onLinkPress}
                     />
                 </View>
             </>
         );
     }
 
-    return props.children;
+    return children;
 }
 
 FullPageNotFoundView.propTypes = propTypes;
 FullPageNotFoundView.defaultProps = defaultProps;
 FullPageNotFoundView.displayName = 'FullPageNotFoundView';
 
-export default withLocalize(FullPageNotFoundView);
+export default FullPageNotFoundView;