Deep Linking Additions and Parameter Parsing

[jwh70]

Universal Linking with Parameter Parsing

• First of all, love the library and the work you guys are doing!
• Saw the most recent pull request Deep linking #2148 to support deep linking (which is awesome!) and I'd like to propose some additions that would allow for both deep linking and universal linking with url parameter parsing.
• Often, the use case for deep/universal linking is to mirror a uri pattern that exists on the web, not just a deep link to a native app. With libraries like React Router, we can express our path schema with syntax from a widely accepted URI standard (https://tools.ietf.org/html/rfc6570). We should be able to parse urls like this in RNRF too!
• Beyond just handling a deep link with RNRF, we certainly need to be able to parse url parameters and pass those params to our deeply linked scene, especially if we otherwise assume that the given scene's component will always be routed to with params.

Use Case

• Consider a web app and mobile app pairing for a social network, which might have a url https://thesocialnetwork.com/profile/1234/.
• If we were building both a web app and a mobile app, we'd like to be able to express that uri scheme across platforms with the path /profile/:id/.
• On the web, we might want React-Router to to open up our <Profile /> component with the props { id: 1234 }.
• On mobile, if we've correctly set up our Android/iOS environment to launch our application and open our RNRF <Router />, then we also want to navigate to our mobile <Profile /> scene with the params { id: 1234 }

This PR Includes

• A very small change to navigationStore to append a key path if a path prop is supplied to a given scene.
• A set of functions to safely match universal urls to the paths provided via props to our <Router /> (which is based heavily on the path matching algorithm that React Router uses at https://github.com/ReactTraining/react-router/blob/master/packages/react-router/docs/api/match.md).

Usage

• Very similar to the recently merged in spec, this allows for the same exact syntax. One can declare a Router such as:

<Router uriPrefix={'thesocialnetwork.com'}>
  <Scene key="root">
     <Scene key={'home'} component={Home} />
     <Scene key={'profile'} path={"/profile/:id/"} component={Profile} />
     <Scene key={'profileForm'} path={"/edit/profile/:id/"} component={ProfileForm} />
  </Scene>
</Router>

If a user clicks on http://thesocialnetwork.com/profile/1234/ on their device, they'll open the <Router /> and then call Actions.profile({ id: 1234 })

[aksonov]

LGTM, good job! Could you also add your great use case/usage to docs?

[jwh70]

yes can have a pr with docs later today!