refactor(v2): move themes components from docs blog (#1571)

* refactor(v2): move themes from docs blog

* move mdxprovider to docs and blog only

packages/docusaurus-plugin-content-blog/src/index.js

@@ -338,10 +338,6 @@ module.exports = function(context, opts) {
       }
     },
 
-    getThemePath() {
-      return path.resolve(__dirname, './theme');
-    },
-
     configureWebpack(config, isServer, {getBabelLoader, getCacheLoader}) {
       const {rehypePlugins, remarkPlugins} = options;
       return {

packages/docusaurus-plugin-content-docs/package.json

@@ -17,10 +17,8 @@
   },
   "peerDependencies": {
     "@docusaurus/core": "^2.0.0",
-    "classnames": "^2.2.6",
     "react": "^16.8.4",
-    "react-dom": "^16.8.4",
+    "react-dom": "^16.8.4"
-    "react-router-config": "^5.0.1"
   },
   "engines": {
     "node": ">=8"

packages/docusaurus-plugin-content-docs/src/index.js

@@ -155,10 +155,6 @@ module.exports = function(context, opts) {
       });
     },
 
-    getThemePath() {
-      return path.resolve(__dirname, './theme');
-    },
-
     configureWebpack(config, isServer, {getBabelLoader, getCacheLoader}) {
       const {rehypePlugins, remarkPlugins} = options;
       return {

packages/docusaurus-theme-classic/src/theme/BlogListPage/index.js

@@ -7,7 +7,7 @@
 
 import React from 'react';
 
-import Layout from '@theme/Layout'; // eslint-disable-line
+import Layout from '@theme/Layout';
 import BlogPostItem from '@theme/BlogPostItem';
 import BlogListPaginator from '@theme/BlogListPaginator';
 

packages/docusaurus-theme-classic/src/theme/BlogPostItem/index.js

@@ -6,7 +6,10 @@
  */
 
 import React from 'react';
+import {MDXProvider} from '@mdx-js/react';
+
 import Link from '@docusaurus/Link';
+import MDXComponents from '@theme/MDXComponents';
 
 function BlogPostItem(props) {
   const {children, frontMatter, metadata, truncated} = props;
@@ -80,7 +83,9 @@ function BlogPostItem(props) {
   return (
     <div>
       {renderPostHeader()}
-      <article className="markdown">{children}</article>
+      <article className="markdown">
+        <MDXProvider components={MDXComponents}>{children}</MDXProvider>
+      </article>
       <div className="row margin-vert--lg">
         <div className="col">
           {tags.length > 0 && (

packages/docusaurus-theme-classic/src/theme/BlogPostPage/index.js

@@ -7,7 +7,7 @@
 
 import React from 'react';
 
-import Layout from '@theme/Layout'; // eslint-disable-line
+import Layout from '@theme/Layout';
 import BlogPostItem from '@theme/BlogPostItem';
 import BlogPostPaginator from '@theme/BlogPostPaginator';
 

packages/docusaurus-theme-classic/src/theme/BlogTagsListPage/index.js

@@ -7,7 +7,7 @@
 
 import React from 'react';
 
-import Layout from '@theme/Layout'; // eslint-disable-line
+import Layout from '@theme/Layout';
 import Link from '@docusaurus/Link';
 
 const CHARS_IN_ALPHABET = 26;

packages/docusaurus-theme-classic/src/theme/BlogTagsPostsPage/index.js

@@ -7,7 +7,7 @@
 
 import React from 'react';
 
-import Layout from '@theme/Layout'; // eslint-disable-line
+import Layout from '@theme/Layout';
 import BlogPostItem from '@theme/BlogPostItem';
 import Link from '@docusaurus/Link';
 

packages/docusaurus-theme-classic/src/theme/DocPage/index.js

@@ -6,11 +6,12 @@
  */
 
 import React from 'react';
-import {renderRoutes} from 'react-router-config';
+import {MDXProvider} from '@mdx-js/react';
-
-import Layout from '@theme/Layout'; // eslint-disable-line
 
+import renderRoutes from '@docusaurus/renderRoutes';
+import Layout from '@theme/Layout';
 import DocSidebar from '@theme/DocSidebar';
+import MDXComponents from '@theme/MDXComponents';
 
 function DocPage(props) {
   const {route, docsMetadata, location} = props;
@@ -29,7 +30,9 @@ function DocPage(props) {
             <DocSidebar docsMetadata={docsMetadata} sidebar={sidebar} />
           </div>
           <main className="col">
-            {renderRoutes(route.routes, {docsMetadata})}
+            <MDXProvider components={MDXComponents}>
+              {renderRoutes(route.routes, {docsMetadata})}
+            </MDXProvider>
           </main>
         </div>
       </div>

packages/docusaurus-theme-classic/src/theme/Layout/index.js

@@ -6,13 +6,11 @@
  */
 
 import React from 'react';
-import {MDXProvider} from '@mdx-js/react';
 import Head from '@docusaurus/Head';
 import useDocusaurusContext from '@docusaurus/useDocusaurusContext';
 import withBaseUrl from '@docusaurus/withBaseUrl';
 import Navbar from '@theme/Navbar';
 import Footer from '@theme/Footer';
-import MDXComponents from '@theme/MDXComponents';
 
 import './styles.css';
 
@@ -32,7 +30,7 @@ function Layout(props) {
         )}
       </Head>
       <Navbar />
-      <MDXProvider components={MDXComponents}>{children}</MDXProvider>
+      {children}
       {!noFooter && <Footer />}
     </React.Fragment>
   );

packages/docusaurus/src/client/App.js

@@ -6,11 +6,10 @@
  */
 
 import React from 'react';
-import {renderRoutes} from 'react-router-config';
 
 import routes from '@generated/routes';
 import siteConfig from '@generated/docusaurus.config';
-
+import renderRoutes from '@docusaurus/renderRoutes';
 import DocusaurusContext from '@docusaurus/context';
 import PendingNavigation from './PendingNavigation';
 

packages/docusaurus/src/client/exports/renderRoutes.js

@@ -0,0 +1,10 @@
+/**
+ * Copyright (c) 2017-present, Facebook, Inc.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import {renderRoutes} from 'react-router-config';
+
+export default renderRoutes;

website/docs/writing-docs.mdx

@@ -78,8 +78,9 @@ The headers are well-spaced so that the hierarchy is clear.
 
 - lists will help you
 - present the key points
-- that you want your users to quickly remember
+- that you want your users to remember
-  - and you may nest them - multiple layers
+  - and you may nest them
+    - multiple times
 
 </BrowserWindow>