From 2cf507a807b1070a445cadb28317a41385fbe50b Mon Sep 17 00:00:00 2001
From: Samy Pesse <samypesse@gmail.com>
Date: Fri, 30 Sep 2016 14:16:48 +0200
Subject: [PATCH] Base api to use i18n

---
 book.js                                       |  2 +-
 docs/_layouts/website/page.html               | 26 -------------------
 .../src/components/ContextProvider.js         |  2 +-
 .../{IntlProvider.js => I18nProvider.js}      |  4 +--
 packages/gitbook-core/src/index.js            |  4 +--
 packages/gitbook-core/src/lib/connect.js      | 23 ++++++++++++++--
 .../gitbook-core/src/lib/renderWithContext.js | 11 ++++----
 packages/gitbook-core/src/shapes/i18n.js      | 10 +++++++
 packages/gitbook-core/src/shapes/index.js     |  3 +++
 .../src/components/Input.js                   | 12 ++++++---
 .../src/components/Results.js                 |  7 ++---
 11 files changed, 59 insertions(+), 45 deletions(-)
 delete mode 100644 docs/_layouts/website/page.html
 rename packages/gitbook-core/src/components/{IntlProvider.js => I18nProvider.js} (81%)
 create mode 100644 packages/gitbook-core/src/shapes/i18n.js

diff --git a/book.js b/book.js
index 31d751b3a..2d9473083 100644
--- a/book.js
+++ b/book.js
@@ -9,7 +9,7 @@ module.exports = {
     gitbook: '3.1.1',
 
     // Use the "official" theme
-    plugins: ['theme-official@2.1.1', '-sharing', '-fontsettings', 'sitemap'],
+    plugins: ['sitemap'],
 
     variables: {
         version: pkg.version
diff --git a/docs/_layouts/website/page.html b/docs/_layouts/website/page.html
deleted file mode 100644
index 47954f780..000000000
--- a/docs/_layouts/website/page.html
+++ /dev/null
@@ -1,26 +0,0 @@
-{% extends template.self %}
-
-{% block header_nav %}
-<a href="https://github.com/GitbookIO/gitbook/blob/master/docs/{{ file.path }}" target="_blank" class="btn btn-link pull-right hidden-xs">
-    <i class="octicon octicon-mark-github"></i> Edit on GitHub
-</a>
-<a href="{{ "faq.md"|resolveFile }}" class="btn btn-link pull-right hidden-xs">
-    F.A.Q
-</a>
-<a href="https://github.com/GitbookIO/gitbook/blob/master/CHANGES.md" target="_blank" class="btn btn-link pull-right hidden-xs">
-    {{ book.version }}
-</a>
-{% endblock %}
-
-{% block page %}
-{{ super() }}
-<hr>
-<div class="btn-group btn-group-justified">
-    {% if page.previous and page.previous.path %}
-    <a class="btn" href="{{ page.previous.path|resolveFile }}"><b>Previous:</b> {{ page.previous.title }}</a>
-    {% endif %}
-    {% if page.next and page.next.path %}
-    <a class="btn" href="{{ page.next.path|resolveFile }}"><b>Next:</b> {{ page.next.title }}</a>
-    {% endif %}
-</div>
-{% endblock %}
diff --git a/packages/gitbook-core/src/components/ContextProvider.js b/packages/gitbook-core/src/components/ContextProvider.js
index 47ed35e47..9b81e9bd4 100644
--- a/packages/gitbook-core/src/components/ContextProvider.js
+++ b/packages/gitbook-core/src/components/ContextProvider.js
@@ -25,7 +25,7 @@ const ContextProvider = React.createClass({
 
     render() {
         const { context, children } = this.props;
-        return <Provider store={context}>{children}</Provider>;
+        return <Provider store={context.store}>{children}</Provider>;
     }
 });
 
diff --git a/packages/gitbook-core/src/components/IntlProvider.js b/packages/gitbook-core/src/components/I18nProvider.js
similarity index 81%
rename from packages/gitbook-core/src/components/IntlProvider.js
rename to packages/gitbook-core/src/components/I18nProvider.js
index 0377b4d51..8e169c470 100644
--- a/packages/gitbook-core/src/components/IntlProvider.js
+++ b/packages/gitbook-core/src/components/I18nProvider.js
@@ -2,7 +2,7 @@ const React = require('react');
 const intl = require('react-intl');
 const ReactRedux = require('react-redux');
 
-const IntlProvider = React.createClass({
+const I18nProvider = React.createClass({
     propTypes: {
         children: React.PropTypes.node
     },
@@ -19,4 +19,4 @@ const IntlProvider = React.createClass({
     }
 });
 
-module.exports = ReactRedux.connect()(IntlProvider);
+module.exports = ReactRedux.connect()(I18nProvider);
diff --git a/packages/gitbook-core/src/index.js b/packages/gitbook-core/src/index.js
index 86370d1b4..4823680a4 100644
--- a/packages/gitbook-core/src/index.js
+++ b/packages/gitbook-core/src/index.js
@@ -13,7 +13,7 @@ const HTMLContent = require('./components/HTMLContent');
 const Link = require('./components/Link');
 const Icon = require('./components/Icon');
 const Button = require('./components/Button');
-const IntlProvider = require('./components/IntlProvider');
+const I18nProvider = require('./components/I18nProvider');
 
 const { registerComponent } = require('./actions/components');
 const ACTIONS = require('./actions/TYPES');
@@ -38,7 +38,7 @@ module.exports = {
     composeReducer,
     registerComponent,
     // React Components
-    IntlProvider,
+    I18nProvider,
     InjectedComponent,
     InjectedComponentSet,
     HTMLContent,
diff --git a/packages/gitbook-core/src/lib/connect.js b/packages/gitbook-core/src/lib/connect.js
index a2f1f467f..e1b267e79 100644
--- a/packages/gitbook-core/src/lib/connect.js
+++ b/packages/gitbook-core/src/lib/connect.js
@@ -1,5 +1,6 @@
 const React = require('react');
 const ReactRedux = require('react-redux');
+const { injectIntl } = require('react-intl');
 
 /**
  * Use the GitBook context provided by ContextProvider to map actions to props
@@ -34,6 +35,21 @@ function connectToActions(Component, mapActionsToProps) {
     });
 }
 
+/**
+ * Connect to i18n
+ * @param {ReactComponent} Component
+ * @return {ReactComponent}
+ */
+function connectToI18n(Component) {
+    return injectIntl(({intl, children, ...props}) => {
+        const i18n = {
+            t: (id, values) => intl.formatMessage({ id }, values)
+        };
+
+        return <Component {...props} i18n={i18n}>{children}</Component>;
+    });
+}
+
 /**
  * Connect a component to the GitBook context (store and actions).
  *
@@ -42,8 +58,11 @@ function connectToActions(Component, mapActionsToProps) {
  * @return {ReactComponent}
  */
 function connect(Component, mapStateToProps, mapActionsToProps) {
-    const connectToStore = ReactRedux.connect(mapStateToProps);
-    return connectToActions(connectToStore(Component), mapActionsToProps);
+    Component = ReactRedux.connect(mapStateToProps)(Component);
+    Component = connectToI18n(Component);
+    Component = connectToActions(Component, mapActionsToProps);
+
+    return Component;
 }
 
 module.exports = connect;
diff --git a/packages/gitbook-core/src/lib/renderWithContext.js b/packages/gitbook-core/src/lib/renderWithContext.js
index 20ec25f3e..32553d9d1 100644
--- a/packages/gitbook-core/src/lib/renderWithContext.js
+++ b/packages/gitbook-core/src/lib/renderWithContext.js
@@ -2,11 +2,12 @@ const React = require('react');
 
 const { InjectedComponent } = require('../components/InjectedComponent');
 const PJAXWrapper = require('../components/PJAXWrapper');
-const IntlProvider = require('../components/IntlProvider');
-const ContextProvider = require('../components/IntlProvider');
+const I18nProvider = require('../components/I18nProvider');
+const ContextProvider = require('../components/ContextProvider');
 
 /**
- * Render the application for a store
+ * Render the application for a GitBook context.
+ *
  * @param  {GitBookContext} context
  * @return {React.Element} element
  */
@@ -14,9 +15,9 @@ function renderWithContext(context) {
     return (
         <ContextProvider context={context}>
             <PJAXWrapper>
-                <IntlProvider>
+                <I18nProvider>
                     <InjectedComponent matching={{ role: 'Body' }} />
-                </IntlProvider>
+                </I18nProvider>
             </PJAXWrapper>
         </ContextProvider>
     );
diff --git a/packages/gitbook-core/src/shapes/i18n.js b/packages/gitbook-core/src/shapes/i18n.js
new file mode 100644
index 000000000..372a24049
--- /dev/null
+++ b/packages/gitbook-core/src/shapes/i18n.js
@@ -0,0 +1,10 @@
+const React  = require('react');
+const {
+    func,
+    shape
+} = React.PropTypes;
+
+
+module.exports = shape({
+    t: func
+});
diff --git a/packages/gitbook-core/src/shapes/index.js b/packages/gitbook-core/src/shapes/index.js
index 68966ba47..59b173500 100644
--- a/packages/gitbook-core/src/shapes/index.js
+++ b/packages/gitbook-core/src/shapes/index.js
@@ -1,7 +1,10 @@
+const React  = require('react');
 const ImmutablePropTypes = require('react-immutable-proptypes');
 
 module.exports = {
     ...ImmutablePropTypes,
+    dispatch:       React.PropTypes.func,
+    i18n:           require('./i18n'),
     Page:           require('./Page'),
     File:           require('./File'),
     Summary:        require('./Summary'),
diff --git a/packages/gitbook-plugin-search/src/components/Input.js b/packages/gitbook-plugin-search/src/components/Input.js
index 71f881342..cf832b942 100644
--- a/packages/gitbook-plugin-search/src/components/Input.js
+++ b/packages/gitbook-plugin-search/src/components/Input.js
@@ -6,7 +6,8 @@ const search = require('../actions/search');
 const SearchInput = React.createClass({
     propTypes: {
         query:    React.PropTypes.string,
-        dispatch: React.PropTypes.func
+        i18n:     GitBook.Shapes.i18n,
+        dispatch: GitBook.Shapes.dispatch
     },
 
     onChange(event) {
@@ -17,11 +18,16 @@ const SearchInput = React.createClass({
     },
 
     render() {
-        const { query } = this.props;
+        const { i18n, query } = this.props;
 
         return (
             <div className="Search/Input">
-                <input type="text" value={query} onChange={this.onChange} />
+                <input
+                    type="text"
+                    value={query}
+                    placeholder={i18n.t('SEARCH_PLACEHOLDER')}
+                    onChange={this.onChange}
+                />
             </div>
         );
     }
diff --git a/packages/gitbook-plugin-search/src/components/Results.js b/packages/gitbook-plugin-search/src/components/Results.js
index dd2bb9c6c..53fc51280 100644
--- a/packages/gitbook-plugin-search/src/components/Results.js
+++ b/packages/gitbook-plugin-search/src/components/Results.js
@@ -20,13 +20,14 @@ const Result = React.createClass({
 
 const SearchResults = React.createClass({
     propTypes: {
-        query:    React.PropTypes.string,
+        i18n:     GitBook.Shapes.i18n,
         results:  GitBook.Shapes.list,
+        query:    React.PropTypes.string,
         children: React.PropTypes.node
     },
 
     render() {
-        const { query, results, children } = this.props;
+        const { i18n, query, results, children } = this.props;
 
         if (!query) {
             return React.Children.only(children);
@@ -34,7 +35,7 @@ const SearchResults = React.createClass({
 
         return (
             <div className="Search/ResultsContainer">
-                <h1>Results for "{query}"</h1>
+                <h1>{i18n.t('SEARCH_RESULTS_TITLE', { query, count: results.size })}</h1>
                 <div className="Search/Results">
                     {results.map((result, i) => {
                         return <Result key={i} result={result} />;