From 512517fb6303b92ed8d71f2f78ec7dcee207e0cc Mon Sep 17 00:00:00 2001 From: tm-ruxandra Date: Wed, 17 Jul 2024 10:47:34 -0400 Subject: [PATCH] feat: update InternalLink to be spec compliant (#1781) Reimplement InternalLink to be compliant with spec, discarding old NativeBase Link implementation for a pressable Text element. Incorporate expo-web-browser for embedded web view functionality. --- .../CreateProjectScreen-test.tsx.snap | 67 ++++--------------- .../CreateSiteScreen-test.tsx.snap | 67 ++++--------------- .../ProjectViewScreen-test.tsx.snap | 67 ++++--------------- dev-client/package-lock.json | 1 + dev-client/package.json | 1 + .../src/components/links/InternalLink.tsx | 25 ++++--- dev-client/src/theme.ts | 11 --- 7 files changed, 56 insertions(+), 183 deletions(-) diff --git a/dev-client/__tests__/integration/__snapshots__/CreateProjectScreen-test.tsx.snap b/dev-client/__tests__/integration/__snapshots__/CreateProjectScreen-test.tsx.snap index 23e4b4963..779b19059 100644 --- a/dev-client/__tests__/integration/__snapshots__/CreateProjectScreen-test.tsx.snap +++ b/dev-client/__tests__/integration/__snapshots__/CreateProjectScreen-test.tsx.snap @@ -1199,65 +1199,24 @@ exports[`renders correctly 1`] = ` Sites that belong to a private project are visible to project team members. A project manager can change the privacy at any time.  - - - Read more about our data privacy policy. - - + Read more about our data privacy policy. + diff --git a/dev-client/__tests__/integration/__snapshots__/CreateSiteScreen-test.tsx.snap b/dev-client/__tests__/integration/__snapshots__/CreateSiteScreen-test.tsx.snap index 62311dd08..00bc8b04f 100644 --- a/dev-client/__tests__/integration/__snapshots__/CreateSiteScreen-test.tsx.snap +++ b/dev-client/__tests__/integration/__snapshots__/CreateSiteScreen-test.tsx.snap @@ -1440,65 +1440,24 @@ exports[`renders correctly 1`] = ` Sites that belong to a private project are visible to project team members. A project manager can change the privacy at any time.  - - - Read more about our data privacy policy. - - + Read more about our data privacy policy. + diff --git a/dev-client/__tests__/integration/__snapshots__/ProjectViewScreen-test.tsx.snap b/dev-client/__tests__/integration/__snapshots__/ProjectViewScreen-test.tsx.snap index 56d9f9ec0..fec1a7373 100644 --- a/dev-client/__tests__/integration/__snapshots__/ProjectViewScreen-test.tsx.snap +++ b/dev-client/__tests__/integration/__snapshots__/ProjectViewScreen-test.tsx.snap @@ -1609,65 +1609,24 @@ exports[`renders correctly 1`] = ` Sites that belong to a private project are visible to project team members. A project manager can change the privacy at any time.  - - - Read more about our data privacy policy. - - + Read more about our data privacy policy. + diff --git a/dev-client/package-lock.json b/dev-client/package-lock.json index dcb50a95c..a78f8c699 100644 --- a/dev-client/package-lock.json +++ b/dev-client/package-lock.json @@ -34,6 +34,7 @@ "expo-media-library": "~16.0.4", "expo-screen-orientation": "~7.0.5", "expo-sensors": "~13.0.9", + "expo-web-browser": "~13.0.3", "formik": "^2.4.6", "haversine": "^1.1.1", "i18next": "^23.11.5", diff --git a/dev-client/package.json b/dev-client/package.json index 5a47e9384..25e88698a 100644 --- a/dev-client/package.json +++ b/dev-client/package.json @@ -43,6 +43,7 @@ "expo-media-library": "~16.0.4", "expo-screen-orientation": "~7.0.5", "expo-sensors": "~13.0.9", + "expo-web-browser": "~13.0.3", "formik": "^2.4.6", "haversine": "^1.1.1", "i18next": "^23.11.5", diff --git a/dev-client/src/components/links/InternalLink.tsx b/dev-client/src/components/links/InternalLink.tsx index 07050c901..ed6ce5101 100644 --- a/dev-client/src/components/links/InternalLink.tsx +++ b/dev-client/src/components/links/InternalLink.tsx @@ -15,32 +15,37 @@ * along with this program. If not, see https://www.gnu.org/licenses/. */ -import {useCallback, useMemo} from 'react'; -import {Linking} from 'react-native'; +import {useCallback, useMemo, useState} from 'react'; +import {PressableProps} from 'react-native'; -import {Link} from 'native-base'; -import {InterfaceLinkProps} from 'native-base/lib/typescript/components/primitives/Link/types'; +import {openBrowserAsync} from 'expo-web-browser'; +import {Text} from 'terraso-mobile-client/components/NativeBaseAdapters'; import {validateUrl} from 'terraso-mobile-client/util'; type InternalLinkProps = { label: string; - onPress?: InterfaceLinkProps['onPress']; + onPress?: PressableProps['onPress']; url: string; }; export default function InternalLink({label, onPress, url}: InternalLinkProps) { const isValidUrl = useMemo(() => validateUrl(url), [url]); - const openUrl = useCallback(() => Linking.openURL(url), [url]); + const openUrl = useCallback(() => openBrowserAsync(url), [url]); + const [pressed, setPressed] = useState(false); return ( isValidUrl && ( - setPressed(true)} + onPressOut={() => setPressed(false)} onPress={onPress ? onPress : openUrl}> {label} - + ) ); } diff --git a/dev-client/src/theme.ts b/dev-client/src/theme.ts index 7f3db1b50..cd963e36f 100644 --- a/dev-client/src/theme.ts +++ b/dev-client/src/theme.ts @@ -471,17 +471,6 @@ export const theme = extendTheme({ }, }, }, - Link: { - baseStyle: { - _text: { - fontSize: '16px', - fontWeight: 800, - lineHeight: '24px', - letterSpacing: '0.15px', - color: 'primary.main', - }, - }, - }, Image: { variants: { profilePic: {