Mark article as active in summary

1 files changed, 16 insertions, 4 deletions

diff --git a/packages/gitbook-plugin-theme-default/src/components/Summary.js b/packages/gitbook-plugin-theme-default/src/components/Summary.js
index 8c5c4a1..ba21a04 100644
--- a/packages/gitbook-plugin-theme-default/src/components/Summary.js
+++ b/packages/gitbook-plugin-theme-default/src/components/Summary.js
@@ -1,23 +1,35 @@
 const React = require('react');
+const classNames = require('classnames');
 const GitBook = require('gitbook-core');
 
-const SummaryArticle = React.createClass({
+let SummaryArticle = React.createClass({
     propTypes: {
+        active: React.PropTypes.bool,
         article: GitBook.Shapes.SummaryArticle
     },
 
     render() {
-        const { article } = this.props;
+        const { article, active } = this.props;
+        const className = classNames('SummaryArticle', {
+            active
+        });
 
         return (
             <GitBook.InjectedComponent matching={{ role: 'summary:article' }} props={this.props}>
-                <li className="SummaryArticle">
-                    <span>{article.title}</span>
+                <li className={className}>
+                    {article.ref ?
+                        <GitBook.Link to={article}>{article.title}</GitBook.Link>
+                        : <span>{article.title}</span>}
                 </li>
             </GitBook.InjectedComponent>
         );
     }
 });
+SummaryArticle = GitBook.connect(SummaryArticle, ({page}, {article}) => {
+    return {
+        active: page.level === article.level
+    };
+});
 
 const SummaryArticles = React.createClass({
     propTypes: {