Open links from news articles in an external web browser about aao-react-native HOT 5 CLOSED

I vote for the "ideal" scenario.

from aao-react-native.

In #721, I said this:

Currently, we disable any hyperlinks in News articles.

I'd prefer to catch navigation events from the NewsDetail WebView, and call the appropriate embedded browser view (SFWebView or Chrome Custom Tabs, as appropriate) so that the user can actually view the links.

I'd like to at least link the libraries before we ship the next version, so that we can enable them later on via CodePush.

@drewvolz, @mattk410, @zimmer18: any of you feel up for doing a PR that's just, like,

npm i --save react-native-safari-view
react-native link react-native-safari-view
git add .
git commit -m "linked SFWebView library"

npm i --save react-native-custom-tabs
react-native link react-native-custom-tabs
git add .
git commit -m "linked Chrome Custom Tabs library"

or something?

from aao-react-native.

Links for embedded browsers:

SFViewController: https://www.npmjs.com/package/react-native-safari-view
Chrome Custom Tabs: https://www.npmjs.com/package/react-native-custom-tabs

from aao-react-native.

Looking at the WebView example,

onNavigationStateChange = (navState) => {
  this.setState({
    backButtonEnabled: navState.canGoBack,
    forwardButtonEnabled: navState.canGoForward,
    url: navState.url,
    status: navState.title,
    loading: navState.loading,
    scalesPageToFit: true
  });
};

The API for both of the native browser components looks something like

import SFWebView from 'react-native-safari-view'
SFWebView.show(url)

so my proposal for linking them together is pretty much call .show(navState.url).

I explicitly do not want to replace our current WebView system, only enhance it: we cannot provide custom HTML to either native webview, and I think that it would be an unacceptable loss of speed if we went and downloaded the HTML of the page again, when we already have the contents locally from the RSS/WP-JSON feed.

So this issue is solely, I think, about opening an SFWebView/Custom Tab when the user interacts with a link in a News article.

A PR for this will also need to remove the a {} styles from news/news-item.js, as that disables all user interaction with links.

from aao-react-native.

(We'll also want to use the .isAvailable() method on the SFWebView component, as I don't think that SFWebView was around on iOS 8 and I know that we've got … 3 people? still back there.)

from aao-react-native.