Skip to content

Commit

Permalink
feat: update InternalLink to be spec compliant (#1781)
Browse files Browse the repository at this point in the history 
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.
  • Loading branch information
@tm-ruxandra
tm-ruxandra authored Jul 17, 2024
1 parent 0395913 commit 512517f
Show file tree
Hide file tree
Showing 7 changed files with 56 additions and 183 deletions.
67 changes: 13 additions & 54 deletions dev-client/__tests__/integration/__snapshots__/CreateProjectScreen-test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1199,65 +1199,24 @@ exports[`renders correctly 1`] = `
</Text>
Sites that belong to a private project are visible to project team members. A project manager can change the privacy at any time. 
</Text>
<View
accessibilityRole="link"
accessibilityState={
{
"busy": undefined,
"checked": undefined,
"disabled": undefined,
"expanded": undefined,
"selected": undefined,
}
}
accessibilityValue={
{
"max": undefined,
"min": undefined,
"now": undefined,
"text": undefined,
}
}
accessible={true}
collapsable={false}
dataSet={{}}
focusable={true}
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
onResponderGrant={[Function]}
onResponderMove={[Function]}
onResponderRelease={[Function]}
onResponderTerminate={[Function]}
onResponderTerminationRequest={[Function]}
onStartShouldSetResponder={[Function]}
<Text
letterSpacing="0.15px"
lineHeight="24px"
onPress={[Function]}
onPressIn={[Function]}
onPressOut={[Function]}
role="link"
style={
{
"flexDirection": "row",
"height": "auto",
"width": "auto",
"color": "#028843",
"fontSize": 16,
"fontWeight": "700",
"textDecorationLine": "underline",
}
}
>
<Text
dataSet={{}}
style={
{
"backgroundColor": undefined,
"color": "#028843",
"fontFamily": undefined,
"fontSize": 16,
"fontStyle": "normal",
"fontWeight": "800",
"letterSpacing": 0.15,
"lineHeight": 24,
"textDecorationLine": "underline",
}
}
>
Read more about our data privacy policy.
</Text>
</View>
Read more about our data privacy policy.
</Text>
</View>
</View>
</View>
Expand Down
67 changes: 13 additions & 54 deletions dev-client/__tests__/integration/__snapshots__/CreateSiteScreen-test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1440,65 +1440,24 @@ exports[`renders correctly 1`] = `
</Text>
Sites that belong to a private project are visible to project team members. A project manager can change the privacy at any time. 
</Text>
<View
accessibilityRole="link"
accessibilityState={
{
"busy": undefined,
"checked": undefined,
"disabled": undefined,
"expanded": undefined,
"selected": undefined,
}
}
accessibilityValue={
{
"max": undefined,
"min": undefined,
"now": undefined,
"text": undefined,
}
}
accessible={true}
collapsable={false}
dataSet={{}}
focusable={true}
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
onResponderGrant={[Function]}
onResponderMove={[Function]}
onResponderRelease={[Function]}
onResponderTerminate={[Function]}
onResponderTerminationRequest={[Function]}
onStartShouldSetResponder={[Function]}
<Text
letterSpacing="0.15px"
lineHeight="24px"
onPress={[Function]}
onPressIn={[Function]}
onPressOut={[Function]}
role="link"
style={
{
"flexDirection": "row",
"height": "auto",
"width": "auto",
"color": "#028843",
"fontSize": 16,
"fontWeight": "700",
"textDecorationLine": "underline",
}
}
>
<Text
dataSet={{}}
style={
{
"backgroundColor": undefined,
"color": "#028843",
"fontFamily": undefined,
"fontSize": 16,
"fontStyle": "normal",
"fontWeight": "800",
"letterSpacing": 0.15,
"lineHeight": 24,
"textDecorationLine": "underline",
}
}
>
Read more about our data privacy policy.
</Text>
</View>
Read more about our data privacy policy.
</Text>
</View>
</View>
</View>
Expand Down
67 changes: 13 additions & 54 deletions dev-client/__tests__/integration/__snapshots__/ProjectViewScreen-test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1609,65 +1609,24 @@ exports[`renders correctly 1`] = `
</Text>
Sites that belong to a private project are visible to project team members. A project manager can change the privacy at any time. 
</Text>
<View
accessibilityRole="link"
accessibilityState={
{
"busy": undefined,
"checked": undefined,
"disabled": undefined,
"expanded": undefined,
"selected": undefined,
}
}
accessibilityValue={
{
"max": undefined,
"min": undefined,
"now": undefined,
"text": undefined,
}
}
accessible={true}
collapsable={false}
dataSet={{}}
focusable={true}
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
onResponderGrant={[Function]}
onResponderMove={[Function]}
onResponderRelease={[Function]}
onResponderTerminate={[Function]}
onResponderTerminationRequest={[Function]}
onStartShouldSetResponder={[Function]}
<Text
letterSpacing="0.15px"
lineHeight="24px"
onPress={[Function]}
onPressIn={[Function]}
onPressOut={[Function]}
role="link"
style={
{
"flexDirection": "row",
"height": "auto",
"width": "auto",
"color": "#028843",
"fontSize": 16,
"fontWeight": "700",
"textDecorationLine": "underline",
}
}
>
<Text
dataSet={{}}
style={
{
"backgroundColor": undefined,
"color": "#028843",
"fontFamily": undefined,
"fontSize": 16,
"fontStyle": "normal",
"fontWeight": "800",
"letterSpacing": 0.15,
"lineHeight": 24,
"textDecorationLine": "underline",
}
}
>
Read more about our data privacy policy.
</Text>
</View>
Read more about our data privacy policy.
</Text>
</View>
</View>
</View>
Expand Down
1 change: 1 addition & 0 deletions dev-client/package-lock.json
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions dev-client/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -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",
Expand Down
25 changes: 15 additions & 10 deletions dev-client/src/components/links/InternalLink.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -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 && (
<Link
_text={{color: 'primary.main'}}
isUnderlined={true}
<Text
role="link"
color={pressed ? 'primary.dark' : 'primary.main'}
underline={true}
fontWeight={700}
onPressIn={() => setPressed(true)}
onPressOut={() => setPressed(false)}
onPress={onPress ? onPress : openUrl}>
{label}
</Link>
</Text>
)
);
}
11 changes: 0 additions & 11 deletions dev-client/src/theme.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -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: {
Expand Down

0 comments on commit 512517f

Please sign in to comment.