Sync search with querystring

4 files changed, 111 insertions, 38 deletions

diff --git a/packages/gitbook-core/src/actions/TYPES.js b/packages/gitbook-core/src/actions/TYPES.js
index 3177dbd..e758a44 100644
--- a/packages/gitbook-core/src/actions/TYPES.js
+++ b/packages/gitbook-core/src/actions/TYPES.js
@@ -7,8 +7,6 @@ module.exports = {
     PAGE_FETCH_START:     'navigation/fetch:start',
     PAGE_FETCH_END:       'navigation/fetch:end',
     PAGE_FETCH_ERROR:     'navigation/fetch:error',
-    PAGE_UPDATE_ANCHOR:   'navigation/update:anchor',
-    PAGE_UPDATE_QUERY:    'navigation/update:query',
     // i18n
     I18N_REGISTER_LOCALE: 'i18n/register:locale'
 };
diff --git a/packages/gitbook-core/src/actions/navigation.js b/packages/gitbook-core/src/actions/navigation.js
index f13e878..4afd4fb 100644
--- a/packages/gitbook-core/src/actions/navigation.js
+++ b/packages/gitbook-core/src/actions/navigation.js
@@ -1,5 +1,10 @@
+const { createBrowserHistory, createMemoryHistory } = require('history');
+
 const ACTION_TYPES = require('./TYPES');
 const getPayload = require('../lib/getPayload');
+const Location = require('../models/Location');
+
+const isServerSide = (typeof window === 'undefined');
 
 const SUPPORTED = (
     typeof window !== 'undefined' &&
@@ -8,48 +13,39 @@ const SUPPORTED = (
     !navigator.userAgent.match(/((iPod|iPhone|iPad).+\bOS\s+[1-4]\D|WebApps\/.+CFNetwork)/)
 );
 
-let PUSH_ID = 0;
-
-/**
- * Generate a new state to be pushed or replaced
- * @param {Object}
- */
-function genState() {
-    return {
-        id: (PUSH_ID++)
-    };
-}
+// Create tge history instance
+const history = isServerSide ? createMemoryHistory() : createBrowserHistory();
 
 /**
  * Push a new url into the navigation
- * @param {String} uri
+ * @param {String|Location} location
  * @return {Action} action
  */
-function pushURI(uri) {
+function pushURI(location) {
     return () => {
-        const state = genState();
+        location = Location.fromNative(location);
 
         if (SUPPORTED) {
-            window.history.pushState(state, '', uri);
+            history.push(location.toNative());
         } else {
-            redirect(uri);
+            redirect(location.toString());
         }
     };
 }
 
 /**
  * Replace current state in navigation
- * @param {String} uri
+ * @param {String|Location} location
  * @return {Action} action
  */
-function replaceURI(uri) {
+function replaceURI(location) {
     return () => {
-        const state = genState();
+        location = Location.fromNative(location);
 
         if (SUPPORTED) {
-            window.history.replaceState(state, '', uri);
+            history.replace(location.toNative());
         } else {
-            redirect(uri);
+            redirect(location.toString());
         }
     };
 }
@@ -66,6 +62,20 @@ function redirect(uri) {
 }
 
 /**
+ * Listen to url change
+ * @param {Function} fn
+ * @return {Action} action
+ */
+function listen(fn) {
+    return (dispatch, getState) => {
+        history.listen(location => {
+            location = Location.fromNative(location);
+            fn(location, dispatch, getState);
+        });
+    };
+}
+
+/**
  * Fetch a new page and update the store accordingly
  * @param {String} uri
  * @param {Boolean} options.replace
@@ -125,11 +135,11 @@ function fetchArticle(article) {
 
 /**
  * Update anchor for current page
- * @param {String} anchor
+ * @param {String} hash
  * @return {Action} action
  */
-function updateAnchor(anchor) {
-    return { type: ACTION_TYPES.PAGE_UPDATE_ANCHOR, anchor };
+function updateAnchor(hash) {
+    return pushURI({ hash });
 }
 
 /**
@@ -138,10 +148,11 @@ function updateAnchor(anchor) {
  * @return {Action} action
  */
 function updateQuery(query) {
-    return { type: ACTION_TYPES.PAGE_UPDATE_QUERY, query };
+    return pushURI({ query });
 }
 
 module.exports = {
+    listen,
     pushURI,
     fetchPage,
     fetchArticle,
diff --git a/packages/gitbook-core/src/models/Location.js b/packages/gitbook-core/src/models/Location.js
new file mode 100644
index 0000000..3b62bef
--- /dev/null
+++ b/packages/gitbook-core/src/models/Location.js
@@ -0,0 +1,73 @@
+const { Record, Map } = require('immutable');
+const querystring = require('querystring');
+
+const DEFAULTS = {
+    pathname: String(''),
+    // Hash without the #
+    hash:     String(''),
+    // If query is a non empty map
+    query:    Map()
+};
+
+class Location extends Record(DEFAULTS) {
+    get search() {
+        const { query } = this;
+        return query.size === 0 ?
+            '' :
+            '?' + querystring.stringify(query.toJS());
+    }
+
+    /**
+     * Convert this location to a string.
+     * @return {String}
+     */
+    toString() {
+
+    }
+
+    /**
+     * Convert this immutable instance to an object
+     * for "history".
+     * @return {Object}
+     */
+    toNative() {
+        return {
+            pathname: this.pathname,
+            hash:     this.hash ? `#${this.hash}` : '',
+            search:   this.search
+        };
+    }
+
+    /**
+     * Convert an instance from "history" to Location.
+     * @param {Object|String} location
+     * @return {Location}
+     */
+    static fromNative(location) {
+        if (typeof location === 'string') {
+            location = { pathname: location };
+        }
+
+        const pathname = location.pathname;
+        let hash = location.hash || '';
+        let search = location.search || '';
+        let query = location.query;
+
+        hash = hash[0] === '#' ? hash.slice(1) : hash;
+        search = search[0] === '?' ? search.slice(1) : search;
+
+        if (query) {
+            query = Map(query);
+        } else {
+            query = Map(querystring.parse(search));
+        }
+
+        return new Location({
+            pathname,
+            hash,
+            query
+        });
+    }
+}
+
+module.exports = Location;
diff --git a/packages/gitbook-core/src/reducers/navigation.js b/packages/gitbook-core/src/reducers/navigation.js
index 625adef..9831cd5 100644
--- a/packages/gitbook-core/src/reducers/navigation.js
+++ b/packages/gitbook-core/src/reducers/navigation.js
@@ -1,15 +1,11 @@
-const { Record, Map } = require('immutable');
+const { Record } = require('immutable');
 const ACTION_TYPES = require('../actions/TYPES');
 
 const NavigationState = Record({
     // Are we loading a new page
     loading: Boolean(false),
     // Did we fail loading a page?
-    error:   null,
-    // Query string
-    query:   Map(),
-    // Current anchor
-    anchor:  String('')
+    error:   null
 });
 
 function reduceNavigation(state, action) {
@@ -32,11 +28,6 @@ function reduceNavigation(state, action) {
             error:   action.error
         });
 
-    case ACTION_TYPES.PAGE_UPDATE_ANCHOR:
-        return state.merge({
-            anchor: action.anchor
-        });
-
     default:
         return state;