Replace url when bonfire is found

common/components/bonfires/Bonfires.jsx

@@ -1,22 +1,46 @@
 var React = require('react'),
+
+    // ## mixins
+    { ObservableStateMixin } = require('thundercats'),
+
+    // ## components
     SidePanel = require('./SidePanel.jsx'),
     Editor = require('../editor'),
-    BonfireStore = require('./Store'),
-    { ObservableStateMixin } = require('thundercats'),
-    {
-      Grid,
-      Row,
-      Col,
-    } = require('react-bootstrap');
+    { Grid, Row, Col } = require('react-bootstrap'),
+
+    // ## flux
+    BonfireStore = require('./Store');
 
 var Bonfire = React.createClass({
 
   mixins: [ObservableStateMixin],
 
+  contextTypes: {
+    makePath: React.PropTypes.func.isRequired,
+    replaceWith: React.PropTypes.func.isRequired
+  },
+
   getObservable: function() {
     return BonfireStore;
   },
 
+  componentDidMount: function() {
+    // get history object
+    var his = typeof window !== 'undefined' ? window.history : null;
+    // spinal-case bonfireName
+    var bonfireName = this.state.name.toLowerCase().replace(/\s/g, '-');
+    // create proper URI from react-router
+    var path = this.context.makePath('bonfires', { bonfireName: bonfireName });
+
+    // is html5 push state exists, update URI
+    // else we are using hash location and should just cause a re render
+    if (his) {
+      his.replaceState({ path: path }, '', path);
+    } else {
+      this.context.replaceWith('bonfires', { bonfireName: bonfireName});
+    }
+  },
+
   render: function() {
     var {
       name,
@@ -27,15 +51,15 @@ var Bonfire = React.createClass({
 
     // convert bonfire difficulty from floating point string
     // to integer.
-    difficulty = Math.floor(+difficulty);
+    var difficultyInt = Math.floor(+difficulty);
 
     return (
       <Grid>
         <Row>
           <SidePanel
             name={ name }
             brief={ brief }
-            difficulty={ difficulty }
+            difficulty={ difficultyInt }
             description={ description.length > 1 ? description : [] }/>
           <Col
             xs={ 12 }