Skip to content

Commit

Permalink
Improvement: shareable SimpleWebView (#604)
Browse files Browse the repository at this point in the history
* make shareable simple web view

* test

* check for navigation

* update ios
  • Loading branch information
estebanmino authored Apr 12, 2019
1 parent 164f0fe commit a6cd49b
Show file tree
Hide file tree
Showing 3 changed files with 47 additions and 6 deletions.
27 changes: 22 additions & 5 deletions app/components/UI/Navbar/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,8 @@ import { Text, Platform, TouchableOpacity, View, StyleSheet, Image, Keyboard } f
import { fontStyles, colors } from '../../../styles/common';
import IonicIcon from 'react-native-vector-icons/Ionicons';
import AntIcon from 'react-native-vector-icons/AntDesign';
import EvilIcons from 'react-native-vector-icons/EvilIcons';
import MaterialCommunityIcon from 'react-native-vector-icons/MaterialCommunityIcons';
import URL from 'url-parse';
import { strings } from '../../../../locales/i18n';
import AppConstants from '../../../core/AppConstants';
Expand All @@ -33,6 +35,12 @@ const styles = StyleSheet.create({
backIcon: {
color: colors.primary
},
backIconIOS: {
marginHorizontal: 5
},
shareIconIOS: {
marginHorizontal: -5
},
backButton: {
paddingLeft: Platform.OS === 'android' ? 22 : 18,
paddingRight: Platform.OS === 'android' ? 22 : 18,
Expand Down Expand Up @@ -375,6 +383,9 @@ export function getNetworkNavbarOptions(title, translate, navigation) {
*/
export function getWebviewNavbar(navigation) {
const title = navigation.getParam('title', '');
const share = navigation.getParam('dispatch', () => {
'';
});
return {
title,
headerTitleStyle: {
Expand All @@ -389,16 +400,22 @@ export function getWebviewNavbar(navigation) {
<IonicIcon name={'md-arrow-back'} size={24} style={styles.backIcon} />
</TouchableOpacity>
) : (
<View />
// eslint-disable-next-line react/jsx-no-bind
<TouchableOpacity onPress={() => navigation.pop()} style={styles.backButton}>
<IonicIcon name="ios-close" size={38} style={[styles.backIcon, styles.backIconIOS]} />
</TouchableOpacity>
),
headerRight:
Platform.OS === 'ios' ? (
Platform.OS === 'android' ? (
// eslint-disable-next-line react/jsx-no-bind
<TouchableOpacity onPress={() => navigation.pop()} style={styles.backButton}>
<IonicIcon name="ios-close" size={38} style={styles.closeIcon} />
<TouchableOpacity onPress={() => share()} style={styles.backButton}>
<MaterialCommunityIcon name="share-variant" size={24} style={styles.backIcon} />
</TouchableOpacity>
) : (
<View />
// eslint-disable-next-line react/jsx-no-bind
<TouchableOpacity onPress={() => share()} style={styles.backButton}>
<EvilIcons name="share-apple" size={32} style={[styles.backIcon, styles.shareIconIOS]} />
</TouchableOpacity>
)
};
}
17 changes: 17 additions & 0 deletions app/components/Views/SimpleWebview/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,8 @@ import React, { Component } from 'react';
import PropTypes from 'prop-types';
import Web3Webview from 'react-native-web3-webview';
import { getWebviewNavbar } from '../../UI/Navbar';
import Share from 'react-native-share'; // eslint-disable-line import/default
import Logger from '../../../util/Logger';

export default class SimpleWebview extends Component {
static navigationOptions = ({ navigation }) => getWebviewNavbar(navigation);
Expand All @@ -13,6 +15,21 @@ export default class SimpleWebview extends Component {
navigation: PropTypes.object
};

componentDidMount = () => {
const { navigation } = this.props;
navigation && navigation.setParams({ dispatch: this.share });
};

share = () => {
const { navigation } = this.props;
const uri = navigation && navigation.getParam('url', 'about:blank');
Share.open({
url: uri
}).catch(err => {
Logger.log('Error while trying to share simple web view', err);
});
};

render() {
const uri = this.props.navigation.getParam('url', 'about:blank');
return <Web3Webview source={{ uri }} />;
Expand Down
9 changes: 8 additions & 1 deletion app/components/Views/SimpleWebview/index.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,14 @@ import SimpleWebview from './';
describe('SimpleWebview', () => {
it('should render correctly', () => {
const wrapper = shallow(
<SimpleWebview navigation={{ getParam: () => ({ url: 'https://etherscan.io', title: 'etherscan' }) }} />
<SimpleWebview
navigation={{
getParam: () => ({ url: 'https://etherscan.io', title: 'etherscan' }),
setParams: () => {
'';
}
}}
/>
);
expect(wrapper).toMatchSnapshot();
});
Expand Down

0 comments on commit a6cd49b

Please sign in to comment.