diff --git a/locales/en.json b/locales/en.json index 0fa25c61..e7a5d256 100644 --- a/locales/en.json +++ b/locales/en.json @@ -63,7 +63,8 @@ "numAvailablePlural": "available", "errors": { "title": "Proxiwash message", - "button": "More info" + "button": "More info", + "openSite": "In the meantime, open the website by tapping the button in the top-right corner." }, "washinsa": { "title": "INSA laundromat", diff --git a/locales/fr.json b/locales/fr.json index e7242b3c..0fa1507d 100644 --- a/locales/fr.json +++ b/locales/fr.json @@ -63,7 +63,8 @@ "numAvailablePlural": "disponibles", "errors": { "title": "Message laverie", - "button": "En savoir plus" + "button": "En savoir plus", + "openSite": "En attendant, ouvre le site avec le bouton en haute à droite" }, "washinsa": { "title": "Laverie INSA", diff --git a/src/components/Screens/WebSectionList.tsx b/src/components/Screens/WebSectionList.tsx index 80b3dc4e..832151b5 100644 --- a/src/components/Screens/WebSectionList.tsx +++ b/src/components/Screens/WebSectionList.tsx @@ -25,7 +25,7 @@ import { SectionListProps, StyleSheet, } from 'react-native'; -import ErrorView from './ErrorView'; +import ErrorView, { ErrorProps } from './ErrorView'; import CollapsibleSectionList from '../Collapsible/CollapsibleSectionList'; import RequestScreen, { RequestScreenProps } from './RequestScreen'; import { CollapsibleComponentPropsType } from '../Collapsible/CollapsibleComponent'; @@ -92,6 +92,17 @@ function WebSectionList(props: Props) { }; }; + const renderEmptyList = props.renderError + ? props.renderError + : (errorProps: ErrorProps) => ( + + ); + const render = ( data: RawData | undefined, loading: boolean, @@ -138,22 +149,21 @@ function WebSectionList(props: Props) { : null } ListEmptyComponent={ - loading ? undefined : ( - refreshData(), - } - : undefined - } - /> - ) + loading + ? undefined + : renderEmptyList({ + status, + code, + message, + button: + code !== API_RESPONSE_CODE.BAD_TOKEN + ? { + icon: 'refresh', + text: i18n.t('general.retry'), + onPress: () => refreshData(), + } + : undefined, + }) } getItemLayout={ itemHeight ? (d, i) => getItemLayout(itemHeight, d, i) : undefined @@ -172,6 +182,7 @@ function WebSectionList(props: Props) { request={props.request} render={render} + renderError={props.renderError} showError={false} showLoading={false} autoRefreshTime={props.autoRefreshTime} diff --git a/src/screens/Proxiwash/ProxiwashScreen.tsx b/src/screens/Proxiwash/ProxiwashScreen.tsx index db518562..b2348905 100644 --- a/src/screens/Proxiwash/ProxiwashScreen.tsx +++ b/src/screens/Proxiwash/ProxiwashScreen.tsx @@ -62,6 +62,7 @@ import { import { useProxiwashPreferences } from '../../context/preferencesContext'; import { useSubsequentEffect } from '../../utils/customHooks'; import { MainRoutes } from '../../navigation/MainNavigator'; +import ErrorView, { ErrorProps } from '../../components/Screens/ErrorView'; const REFRESH_TIME = 1000 * 10; // Refresh every 10 seconds const LIST_ITEM_HEIGHT = 64; @@ -462,6 +463,21 @@ function ProxiwashScreen() { } }; + const renderError = (props: ErrorProps) => { + let message = props.message ? props.message : i18n.t('errors.unknown'); + message += '\n' + i18n.t('screens.proxiwash.errors.openSite'); + + return ( + + ); + }; + let data: LaundromatType; switch (selectedWash) { case 'tripodeB': @@ -480,6 +496,7 @@ function ProxiwashScreen() { } createDataset={createDataset} renderItem={getRenderItem} + renderError={renderError} renderSectionHeader={getRenderSectionHeader} autoRefreshTime={REFRESH_TIME} refreshOnFocus={true}