From 829a9ec66c61bcece504441cf0af8f218bae22a4 Mon Sep 17 00:00:00 2001
From: Ryan Florence <rpflorence@gmail.com>
Date: Wed, 6 Aug 2014 13:50:40 -0600
Subject: [PATCH] [added] <Redirect/> component

closes #159
---
 Redirect.js                      |  1 +
 docs/api/README.md               |  1 +
 docs/api/components/Redirect.md  | 47 ++++++++++++++++++++++++++++++++
 examples/dynamic-segments/app.js |  2 ++
 index.js                         |  1 +
 modules/components/Redirect.js   | 25 +++++++++++++++++
 6 files changed, 77 insertions(+)
 create mode 100644 Redirect.js
 create mode 100644 docs/api/components/Redirect.md
 create mode 100644 modules/components/Redirect.js

diff --git a/Redirect.js b/Redirect.js
new file mode 100644
index 0000000000..d285874a77
--- /dev/null
+++ b/Redirect.js
@@ -0,0 +1 @@
+module.exports = require('./modules/components/Redirect');
diff --git a/docs/api/README.md b/docs/api/README.md
index 004c2a659c..fb2ea15a70 100644
--- a/docs/api/README.md
+++ b/docs/api/README.md
@@ -5,6 +5,7 @@ React Router API
 
 - Components
   - [`Link`](/docs/api/components/Link.md)
+  - [`Redirect`](/docs/api/components/Redirect.md)
   - [`Route`](/docs/api/components/Route.md)
   - [`RouteHandler`](/docs/api/components/RouteHandler.md)
   - [`Routes`](/docs/api/components/Routes.md)
diff --git a/docs/api/components/Redirect.md b/docs/api/components/Redirect.md
new file mode 100644
index 0000000000..c2c67fa814
--- /dev/null
+++ b/docs/api/components/Redirect.md
@@ -0,0 +1,47 @@
+API: `Redirect` (component)
+===========================
+
+Configures a redirect for a path in your route declarations.
+
+Props
+-----
+
+### `from`
+
+The path you want to redirect from, including dynamic segments.
+
+### `to`
+
+The `name` of the route you want to redirect to.
+
+Example
+-------
+
+```xml
+<!--
+  lets say we want to change from `/profile/123` to `/about/123`
+  and redirect `/get-in-touch` to `/contact`
+-->
+<Routes>
+  <Route handler={App}>
+    <Route name="contact" handler={Contact}/>
+    <Route name="about-user" path="about/:userId" handler={UserProfile}/>
+  </Route>
+  
+  <Redirect from="get-in-touch" to="contact" />
+  <Redirect from="profile/:userId" to="about-user" />
+</Routes>
+```
+
+Note that the `<Redirect/>` can be placed anywhere in the route
+hierarchy, if you'd prefer the redirects to be next to their respective
+routes.
+
+```xml
+<Routes>
+  <Route handler={App}>
+    <Route name="contact" handler={Contact}/>
+    <Redirect from="get-in-touch" to="contact" />
+  </Route>
+</Routes>
+```
diff --git a/examples/dynamic-segments/app.js b/examples/dynamic-segments/app.js
index 36495dd5c4..6a94d5ed3d 100644
--- a/examples/dynamic-segments/app.js
+++ b/examples/dynamic-segments/app.js
@@ -3,6 +3,7 @@ var React = require('react');
 var Router = require('../../index');
 var Route = Router.Route;
 var Routes = Router.Routes;
+var Redirect = Router.Redirect;
 var Link = Router.Link;
 
 var App = React.createClass({
@@ -50,6 +51,7 @@ var routes = (
     <Route handler={App}>
       <Route name="user" path="/user/:userId" handler={User}>
         <Route name="task" path="/user/:userId/tasks/:taskId" handler={Task}/>
+        <Redirect from="/user/:userId/todos/:taskId" to="task"/>
       </Route>
     </Route>
   </Routes>
diff --git a/index.js b/index.js
index d2ccce8e4c..cf5778b064 100644
--- a/index.js
+++ b/index.js
@@ -1,6 +1,7 @@
 exports.ActiveState = require('./ActiveState');
 exports.AsyncState = require('./AsyncState');
 exports.Link = require('./Link');
+exports.Redirect = require('./Redirect');
 exports.Route = require('./Route');
 exports.Routes = require('./Routes');
 exports.goBack = require('./goBack');
diff --git a/modules/components/Redirect.js b/modules/components/Redirect.js
new file mode 100644
index 0000000000..3b05f86ec7
--- /dev/null
+++ b/modules/components/Redirect.js
@@ -0,0 +1,25 @@
+var React = require('react');
+var Route = require('./Route');
+
+function Redirect(props) {
+  return Route({
+    path: props.from,
+    handler: createRedirectClass(props.to)
+  });
+}
+
+function createRedirectClass(to) {
+  return React.createClass({
+    statics: {
+      willTransitionTo: function(transition, params, query) {
+        transition.redirect(to, params, query);
+      }
+    },
+
+    render: function() {
+      return null;
+    }
+  });
+}
+
+module.exports = Redirect;