From 70938b779f95fe97cc9551a1b7cd689ba0980228 Mon Sep 17 00:00:00 2001 From: Nicolay Arefyeu Date: Thu, 9 Mar 2023 17:27:08 +0200 Subject: [PATCH 1/2] Add go back link to initial route on Not Found Page --- src/components/BlockingViews/BlockingView.js | 20 +++++++++++++++++++ .../BlockingViews/FullPageNotFoundView.js | 10 ++++++++++ src/languages/en.js | 1 + src/languages/es.js | 1 + src/pages/ErrorPage/NotFoundPage.js | 2 +- 5 files changed, 33 insertions(+), 1 deletion(-) diff --git a/src/components/BlockingViews/BlockingView.js b/src/components/BlockingViews/BlockingView.js index f4b0d36e4726..efdb69579d1e 100644 --- a/src/components/BlockingViews/BlockingView.js +++ b/src/components/BlockingViews/BlockingView.js @@ -6,6 +6,9 @@ import variables from '../../styles/variables'; import Icon from '../Icon'; import Text from '../Text'; import themeColors from '../../styles/themes/default'; +import TextLink from '../TextLink'; +import Navigation from '../../libs/Navigation/Navigation'; +import ROUTES from '../../ROUTES'; const propTypes = { /** Expensicon for the page */ @@ -19,10 +22,18 @@ const propTypes = { /** Subtitle message below the title */ subtitle: PropTypes.string.isRequired, + + /** Link message below the subtitle */ + link: PropTypes.string, + + /** Whether we should show a go back home link */ + shouldShowBackHomeLink: PropTypes.bool, }; const defaultProps = { iconColor: themeColors.offline, + shouldShowBackHomeLink: false, + link: 'notFound.goBackHome', }; const BlockingView = props => ( @@ -37,6 +48,15 @@ const BlockingView = props => ( /> {props.title} {props.subtitle} + {!!props.shouldShowBackHomeLink + && ( + Navigation.navigate(ROUTES.REPORT)} + style={[styles.link, styles.mt2]} + > + {props.link} + + )} ); diff --git a/src/components/BlockingViews/FullPageNotFoundView.js b/src/components/BlockingViews/FullPageNotFoundView.js index 84014c43d148..5f0a5b5cebcc 100644 --- a/src/components/BlockingViews/FullPageNotFoundView.js +++ b/src/components/BlockingViews/FullPageNotFoundView.js @@ -31,6 +31,12 @@ const propTypes = { /** Whether we should show a close button */ shouldShowCloseButton: PropTypes.bool, + /** Whether we should show a go back home link */ + shouldShowBackHomeLink: PropTypes.bool, + + /** The key in the translations file to use for the go back link */ + linkKey: PropTypes.string, + /** Method to trigger when pressing the back button of the header */ onBackButtonPress: PropTypes.func, }; @@ -40,7 +46,9 @@ const defaultProps = { shouldShow: false, titleKey: 'notFound.notHere', subtitleKey: 'notFound.pageNotFound', + linkKey: 'notFound.goBackHome', shouldShowBackButton: true, + shouldShowBackHomeLink: false, shouldShowCloseButton: true, onBackButtonPress: () => Navigation.dismissModal(), }; @@ -61,6 +69,8 @@ const FullPageNotFoundView = (props) => { icon={Expensicons.QuestionMark} title={props.translate(props.titleKey)} subtitle={props.translate(props.subtitleKey)} + link={props.translate(props.linkKey)} + shouldShowBackHomeLink={props.shouldShowBackHomeLink} /> diff --git a/src/languages/en.js b/src/languages/en.js index a47b9410a000..19969013b9f1 100755 --- a/src/languages/en.js +++ b/src/languages/en.js @@ -642,6 +642,7 @@ export default { notHere: "Hmm... it's not here", pageNotFound: 'That page is nowhere to be found.', noAccess: 'You don\'t have access to this chat', + goBackHome: 'Go back to Home page', }, setPasswordPage: { enterPassword: 'Enter a password', diff --git a/src/languages/es.js b/src/languages/es.js index 7c80857ec75e..849d7736f53f 100644 --- a/src/languages/es.js +++ b/src/languages/es.js @@ -641,6 +641,7 @@ export default { notHere: 'Hmm… no está aquí', pageNotFound: 'La página que buscas no existe.', noAccess: 'No tienes acceso a este chat', + goBackHome: 'Volver a la página principal', }, setPasswordPage: { enterPassword: 'Escribe una contraseña', diff --git a/src/pages/ErrorPage/NotFoundPage.js b/src/pages/ErrorPage/NotFoundPage.js index 10b65f0d4ad7..68581353bfad 100644 --- a/src/pages/ErrorPage/NotFoundPage.js +++ b/src/pages/ErrorPage/NotFoundPage.js @@ -5,7 +5,7 @@ import FullPageNotFoundView from '../../components/BlockingViews/FullPageNotFoun // eslint-disable-next-line rulesdir/no-negated-variables const NotFoundPage = () => ( - + ); From be57fe917e2dad2a831d16b3233cb9187b42ec5d Mon Sep 17 00:00:00 2001 From: Nicolay Arefyeu Date: Fri, 10 Mar 2023 14:27:57 +0200 Subject: [PATCH 2/2] Use same patter of checks --- src/components/BlockingViews/BlockingView.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/components/BlockingViews/BlockingView.js b/src/components/BlockingViews/BlockingView.js index efdb69579d1e..4267d696af8f 100644 --- a/src/components/BlockingViews/BlockingView.js +++ b/src/components/BlockingViews/BlockingView.js @@ -48,15 +48,15 @@ const BlockingView = props => ( /> {props.title} {props.subtitle} - {!!props.shouldShowBackHomeLink - && ( + {props.shouldShowBackHomeLink + ? ( Navigation.navigate(ROUTES.REPORT)} style={[styles.link, styles.mt2]} > {props.link} - )} + ) : null} );