From 5a22a2058687e1fcb30e5f80f1d40ddf854356fe Mon Sep 17 00:00:00 2001
From: Bo Borgerson <gigabo@gmail.com>
Date: Thu, 26 May 2016 10:59:24 -0700
Subject: [PATCH 1/3] Expose new convenience function: `navigateTo`

This is a much nicer interface for kicking off a client transition.

This closes #114.
---
 packages/react-server-test-pages/entrypoints.js |  4 ++++
 .../pages/navigation/navigateTo.js              | 17 +++++++++++++++++
 packages/react-server/core/common.js            |  1 +
 packages/react-server/core/util/navigateTo.js   | 12 ++++++++++++
 4 files changed, 34 insertions(+)
 create mode 100644 packages/react-server-test-pages/pages/navigation/navigateTo.js
 create mode 100644 packages/react-server/core/util/navigateTo.js

diff --git a/packages/react-server-test-pages/entrypoints.js b/packages/react-server-test-pages/entrypoints.js
index 6e3ead569..e9c534a72 100644
--- a/packages/react-server-test-pages/entrypoints.js
+++ b/packages/react-server-test-pages/entrypoints.js
@@ -33,6 +33,10 @@ module.exports = {
 		entry: "/navigation/data-bundle-cache",
 		description: "Data bundle cache",
 	},
+	NavigateTo: {
+		entry: "/navigation/navigateTo",
+		description: "Navigate using `navigateTo()`",
+	},
 	ErrorLogs: {
 		entry: "/error/logs",
 		description: "Generate errors in the logs",
diff --git a/packages/react-server-test-pages/pages/navigation/navigateTo.js b/packages/react-server-test-pages/pages/navigation/navigateTo.js
new file mode 100644
index 000000000..9eb6e7991
--- /dev/null
+++ b/packages/react-server-test-pages/pages/navigation/navigateTo.js
@@ -0,0 +1,17 @@
+import {navigateTo} from "react-server";
+
+const go = page => navigateTo(
+	`/navigation/navigateTo?cur=${page}`,
+	{reuseDom: true}
+)
+
+const Nav = ({cur}) => <div onClick={() => go(cur+1)}>
+	<div>Current page: {cur}</div>
+	<div>Click for next page</div>
+</div>
+
+export default class NavigateToPage {
+	getElements() {
+		return <Nav cur={+this.getRequest().getQuery().cur||0} />
+	}
+}
diff --git a/packages/react-server/core/common.js b/packages/react-server/core/common.js
index ab7b473bd..4d182223c 100644
--- a/packages/react-server/core/common.js
+++ b/packages/react-server/core/common.js
@@ -5,6 +5,7 @@ module.exports = {
 	RootElement: require("./components/RootElement"),
 	Link: require('./components/Link'),
 	History: require('./components/History'),
+	navigateTo: require('./util/navigateTo').default,
 	ClientRequest: require('./ClientRequest'),
 	FramebackController: require('./FramebackController'),
 	components: {
diff --git a/packages/react-server/core/util/navigateTo.js b/packages/react-server/core/util/navigateTo.js
new file mode 100644
index 000000000..413ca3ada
--- /dev/null
+++ b/packages/react-server/core/util/navigateTo.js
@@ -0,0 +1,12 @@
+import ClientRequest from "../ClientRequest";
+import History from "../components/History";
+import {getCurrentRequestContext} from "../context/RequestContext";
+
+// This initiates a client transition to `path` with `options`.
+// Just a convenience wrapper.
+export default function navigateTo(path, options) {
+	getCurrentRequestContext().navigate(
+		new ClientRequest(path, options),
+		History.events.PUSHSTATE
+	);
+}

From 4854dce6d1efc8a055907d9a6f330aee3f6c7614 Mon Sep 17 00:00:00 2001
From: Bo Borgerson <gigabo@gmail.com>
Date: Thu, 26 May 2016 11:07:56 -0700
Subject: [PATCH 2/3] Use `navigateTo` in `Link`

---
 .../react-server/core/components/Link.jsx     | 19 +++++++------------
 1 file changed, 7 insertions(+), 12 deletions(-)

diff --git a/packages/react-server/core/components/Link.jsx b/packages/react-server/core/components/Link.jsx
index 1648b1820..baa7e9657 100644
--- a/packages/react-server/core/components/Link.jsx
+++ b/packages/react-server/core/components/Link.jsx
@@ -1,8 +1,6 @@
 
 var React = require('react'),
-	ClientRequest = require("../ClientRequest"),
-	History = require("./History"),
-	getCurrentRequestContext = require("../context/RequestContext").getCurrentRequestContext;
+	navigateTo = require("../util/navigateTo").default;
 
 module.exports = React.createClass({
 	displayName: 'Link',
@@ -39,15 +37,12 @@ module.exports = React.createClass({
 			e.preventDefault();
 			e.stopPropagation();
 			const {bundleData, frameback, reuseDom, reuseFrame} = this.props;
-			getCurrentRequestContext().navigate(
-				new ClientRequest(this.props.path, {
-					bundleData,
-					frameback,
-					reuseDom,
-					reuseFrame,
-				}),
-				History.events.PUSHSTATE
-			);
+			navigateTo(this.props.path, {
+				bundleData,
+				frameback,
+				reuseDom,
+				reuseFrame,
+			});
 		} else {
 			// do normal browser navigate
 		}

From d80b52b0691bf34fa23f83a6b40e854e06dce86a Mon Sep 17 00:00:00 2001
From: Bo Borgerson <gigabo@gmail.com>
Date: Thu, 26 May 2016 11:10:29 -0700
Subject: [PATCH 3/3] Update docs to use `navigateTo`

---
 docs/client-transitions.md | 25 +++++++++----------------
 1 file changed, 9 insertions(+), 16 deletions(-)

diff --git a/docs/client-transitions.md b/docs/client-transitions.md
index e539a55d4..5c97d1e40 100644
--- a/docs/client-transitions.md
+++ b/docs/client-transitions.md
@@ -11,7 +11,7 @@ That's where _client transitions_ come in.  Navigation between `react-server`
 pages can be done without ever hitting the server.  It's easy.  Pages don't
 need to do anything tricky to make this work.  It's part of the framework!
 
-## The `<Link>`
+## The `<Link>` component
 
 How easy is it?
 
@@ -27,22 +27,15 @@ transitions.  Middle-clicks, command-clicks, etc, all still behave as
 expected, but a normal left-click to navigate becomes a light-weight
 transition within the browser.
 
-## The `ClientRequest`
+## The `navigateTo()` function
 
 Want to manage your own `<a>` tags and click handlers?  Want to navigate based
 on some other action?
 
 ```javascript
-const {
-	ClientRequest
-	History,
-	getCurrentRequestContext,
-} = require("react-server");
-
-getCurrentRequestContext().navigate(
-	new ClientRequest(this.props.path),
-	History.events.PUSHSTATE
-);
+const {navigateTo} = require("react-server");
+
+navigateTo("/my-page");
 ```
 
 This is what the `<Link>` tag does for you on click.
@@ -61,7 +54,7 @@ key/value pair in an `options` object passed as a second argument to the
 ```javascript
 <Link path={path} bundleData={true}>...</Link>
 
-new ClientRequest(path, {bundleData: true});
+navigateTo(path, {bundleData: true});
 ```
 
 In order to render the new page in the browser, we first need to fetch the
@@ -83,7 +76,7 @@ the results in the bundle and we don't need to fire actual XHRs!
 ```javascript
 <Link path={path} reuseDom={true}>...</Link>
 
-new ClientRequest(path, {reuseDom: true});
+navigateTo(path, {reuseDom: true});
 ```
 
 This is useful for "single-page app" style navigation, where there may be UI
@@ -98,7 +91,7 @@ page that are the same as the previous page are _re-used_.  This includes
 ```javascript
 <Link path={path} frameback={true}>...</Link>
 
-new ClientRequest(path, {frameback: true});
+navigateTo(path, {frameback: true});
 ```
 
 This one addresses a very specific navigation pattern:  A _list_ page that's
@@ -118,7 +111,7 @@ the list.
 ```javascript
 <Link path={path} frameback={true} reuseFrame={true}>...</Link>
 
-new ClientRequest(path, {frameback: true, reuseFrame: true});
+navigateTo(path, {frameback: true, reuseFrame: true});
 ```
 
 This one only affects the behavior of `frameback`.  Ordinarily each new