site: migrate MainContent to bisheng

package.json

@@ -75,7 +75,7 @@
     "babel-eslint": "^6.0.2",
     "babel-jest": "^12.0.2",
     "babel-plugin-antd": "^0.4.0",
-    "bisheng": "^0.2.0",
+    "bisheng": "^0.3.0",
     "dom-scroll-into-view": "^1.1.0",
     "enquire.js": "^2.1.1",
     "es6-shim": "^0.35.0",

site/theme/index.js

@@ -12,9 +12,6 @@ export default {
     Navigation: 3,
     Other: 4,
   },
-  redirects: {
-    CHANGELOG: 'docs/react/changelog',
-  },
   docVersions: {
     '0.9.x': 'http://09x.ant.design/',
     '0.10.x': 'http://010x.ant.design/',
@@ -23,5 +20,9 @@ export default {
   },
   routes: {
     '/': './template/Home/index',
+    '/docs/resource/:children': './template/Content/index',
+  },
+  redirects: {
+    '/docs/resource': '/docs/resource/download',
   },
 };

site/theme/static/style.js

@@ -2,5 +2,5 @@ import './common.less';
 import './header.less';
 import './footer.less';
 import './home.less';
-
+import './page-nav.less';
 import './not-found.less';

site/theme/template/Content/MainContent.jsx

@@ -2,10 +2,15 @@ import React from 'react';
 import { Link } from 'react-router';
 import scrollIntoView from 'dom-scroll-into-view';
 import { Row, Col, Menu } from 'antd';
-import config from '../../website.config';
+import * as utils from '../utils';
+import config from '../../';
 const SubMenu = Menu.SubMenu;
 
 export default class MainContent extends React.Component {
+  static contextTypes = {
+    intl: React.PropTypes.object.isRequired,
+  }
+
   componentDidMount() {
     this.scrollToAnchor(this.props);
   }
@@ -39,20 +44,20 @@ export default class MainContent extends React.Component {
     return props.params.children;
   }
 
-  fileNameToPath(fileName) {
-    const snippets = fileName.replace(/(\/index)?((\.zh-CN)|(\.en-US))?\.md$/i, '').split('/');
+  fileNameToPath(filename) {
+    const snippets = filename.replace(/(\/index)?((\.zh-CN)|(\.en-US))?\.md$/i, '').split('/');
     return snippets[snippets.length - 1];
   }
 
   generateMenuItem(isTop, item) {
-    const key = this.fileNameToPath(item.fileName);
+    const key = this.fileNameToPath(item.filename);
     const text = isTop ?
             item.title || item.chinese || item.english : [
               <span key="english">{item.title || item.english}</span>,
               <span className="chinese" key="chinese">{item.subtitle || item.chinese}</span>,
             ];
     const disabled = item.disabled;
-    const url = item.fileName.replace(/(\/index)?((\.zh-CN)|(\.en-US))?\.md$/i, '');
+    const url = item.filename.replace(/(\/index)?((\.zh-CN)|(\.en-US))?\.md$/i, '');
     const child = !item.link ?
       <Link to={url} disabled={disabled}>
         {text}
@@ -95,7 +100,8 @@ export default class MainContent extends React.Component {
 
   getMenuItems() {
     const props = this.props;
-    const menuItems = props.menuItems;
+    // TODO: data
+    const menuItems = utils.getMenuItems(props.data.docs.resource, this.context.intl.locale);
     const topLevel = this.generateSubMenuItems(menuItems.topLevel);
     const subMenu = Object.keys(menuItems).filter(this.isNotTopLevel)
             .sort((a, b) => {
@@ -149,7 +155,7 @@ export default class MainContent extends React.Component {
         <Row>
           <Col lg={4} md={6} sm={24} xs={24}>
             <Menu className="aside-container" mode="inline"
-              defaultOpenKeys={Object.keys(this.props.menuItems)}
+              defaultOpenKeys={Object.keys(utils.getMenuItems(this.props.data.docs.resource, this.context.intl.locale))}
               selectedKeys={[activeMenuItem]}>
               {menuItems}
             </Menu>

site/theme/template/Content/index.jsx

@@ -0,0 +1,11 @@
+import React from 'react';
+import Layout from '../Layout';
+import MainContent from './MainContent';
+
+export default (props) => {
+  return (
+    <Layout {...props}>
+      <MainContent {...props} />
+    </Layout>
+  );
+};

site/theme/template/Layout/Header.jsx

@@ -88,10 +88,17 @@ export default class Header extends React.Component {
     let activeMenuItem = (routes[1] && routes[1].path) || 'home';
     activeMenuItem = activeMenuItem === 'components' ? 'docs/react' : activeMenuItem;
 
-    const componentsList = Object.keys(data.components)
-            .map((component) => data.components[component].index)
-            .filter(item => item);
     const locale = this.context.intl.locale;
+    const componentsList = Object.keys(data.components)
+            .map((component) => {
+              const index = data.components[component].index;
+              if (index.meta) {
+                return index;
+              }
+              return index[locale];
+            })
+            .filter(item => item);
+
     const options = Object.keys(componentsList)
             .map((key) => {
               const value = componentsList[key];

site/theme/template/utils.jsx

@@ -0,0 +1,29 @@
+export function getMenuItems(data, locale) {
+  const menuMeta = Object.keys(data)
+          .map((key) => data[key])
+          .map((file) => {
+            if (file.meta) {
+              return file.meta;
+            }
+            return file[locale].meta;
+          });
+
+  const menuItems = {};
+  menuMeta.sort((a, b) => {
+    return parseInt(a.order, 10) - parseInt(b.order, 10);
+  }).forEach((meta) => {
+    const category = meta.category || 'topLevel';
+    if (!menuItems[category]) {
+      menuItems[category] = {};
+    }
+
+    const type = meta.type || 'topLevel';
+    if (!menuItems[category][type]) {
+      menuItems[category][type] = [];
+    }
+
+    menuItems[category][type].push(meta);
+  });
+
+  return menuItems;
+}