misc(v2): rename components (facebook#1434)

* misc(v2): clean up work * misc(v2): rename components
shakcho · May 17, 2019 · 8c04491 · 8c04491
1 parent ca340b4
commit 8c04491
Show file tree

Hide file tree

Showing 16 changed files with 51 additions and 46 deletions.
diff --git a/packages/docusaurus-plugin-content-blog/src/index.js b/packages/docusaurus-plugin-content-blog/src/index.js
@@ -24,8 +24,8 @@ const DEFAULT_OPTIONS = {
   routeBasePath: 'blog', // URL Route.
   include: ['*.md', '*.mdx'], // Extensions to include.
   pageCount: 10, // How many entries per page.
-  blogPageComponent: '@theme/BlogPage',
-  blogPostComponent: '@theme/BlogPost',
+  blogListComponent: '@theme/BlogList',
+  blogItemComponent: '@theme/BlogPost',
 };
 
 class DocusaurusPluginContentBlog {
@@ -113,7 +113,7 @@ class DocusaurusPluginContentBlog {
   }
 
   async contentLoaded({content, actions}) {
-    const {blogPageComponent, blogPostComponent} = this.options;
+    const {blogListComponent, blogItemComponent} = this.options;
     const {addRoute, createData} = actions;
     await Promise.all(
       content.map(async metadataItem => {
@@ -125,7 +125,7 @@ class DocusaurusPluginContentBlog {
         if (isBlogPage) {
           addRoute({
             path: permalink,
-            component: blogPageComponent,
+            component: blogListComponent,
             exact: true,
             modules: {
               entries: metadataItem.posts.map(post => ({
@@ -145,7 +145,7 @@ class DocusaurusPluginContentBlog {
 
         addRoute({
           path: permalink,
-          component: blogPostComponent,
+          component: blogItemComponent,
           exact: true,
           modules: {
             content: metadataItem.source,

diff --git a/packages/docusaurus-plugin-content-docs/src/index.js b/packages/docusaurus-plugin-content-docs/src/index.js
@@ -21,8 +21,8 @@ const DEFAULT_OPTIONS = {
   // TODO: Change format to array.
   sidebarPath: '', // Path to sidebar configuration for showing a list of markdown pages.
   // TODO: Settle themeing.
-  docLayoutComponent: '@theme/Doc',
-  docItemComponent: '@theme/DocBody',
+  docLayoutComponent: '@theme/DocPage',
+  docItemComponent: '@theme/DocItem',
 };
 
 class DocusaurusPluginContentDocs {

diff --git a/packages/docusaurus-plugin-content-pages/src/index.js b/packages/docusaurus-plugin-content-pages/src/index.js
@@ -13,7 +13,7 @@ const DEFAULT_OPTIONS = {
   path: 'pages', // Path to data on filesystem, relative to site dir.
   routeBasePath: '', // URL Route.
   include: ['**/*.{js,jsx}'], // Extensions to include.
-  component: '@theme/Pages',
+  component: '@theme/Page',
 };
 
 class DocusaurusPluginContentPages {

diff --git a/packages/docusaurus/lib/client/App.js b/packages/docusaurus/lib/client/App.js
@@ -5,7 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import React, {useState} from 'react';
+import React from 'react';
 import {renderRoutes} from 'react-router-config';
 
 import Head from '@docusaurus/Head'; // eslint-disable-line
@@ -15,9 +15,8 @@ import DocusaurusContext from '@docusaurus/context'; // eslint-disable-line
 import PendingNavigation from './PendingNavigation';
 
 function App() {
-  const [context, setContext] = useState({});
   return (
-    <DocusaurusContext.Provider value={{siteConfig, ...context, setContext}}>
+    <DocusaurusContext.Provider value={{siteConfig}}>
       {/* TODO: this link stylesheet to infima is temporary */}
       <Head>
         <link

diff --git a/...aurus/lib/default-theme/BlogPage/index.js → ...aurus/lib/default-theme/BlogList/index.js b/...aurus/lib/default-theme/BlogPage/index.js → ...aurus/lib/default-theme/BlogList/index.js
@@ -8,7 +8,7 @@
 import React from 'react';
 
 import Layout from '@theme/Layout'; // eslint-disable-line
-import Post from '../Post';
+import BlogPostItem from '../BlogPostItem';
 
 function BlogPage(props) {
   const {
@@ -23,9 +23,9 @@ function BlogPage(props) {
           <div className="col col--6 col--offset-3">
             {BlogPosts.map((PostContent, index) => (
               <div className="margin-bottom--xl" key={index}>
-                <Post truncated metadata={posts[index]}>
+                <BlogPostItem truncated metadata={posts[index]}>
                   <PostContent />
-                </Post>
+                </BlogPostItem>
               </div>
             ))}
           </div>

diff --git a/packages/docusaurus/lib/default-theme/BlogPost/index.js b/packages/docusaurus/lib/default-theme/BlogPost/index.js
@@ -8,20 +8,20 @@
 import React from 'react';
 
 import Layout from '@theme/Layout'; // eslint-disable-line
-import Post from '../Post';
+import BlogPostItem from '../BlogPostItem';
+
+function BlogPostPage(props) {
+  const {content: BlogPostContents, metadata} = props;
 
-function BlogPost(props) {
-  const {content, metadata} = props;
-  const BlogPostContents = content;
   return (
     <Layout title={metadata.title}>
       {BlogPostContents && (
         <div className="container margin-vert--xl">
           <div className="row">
             <div className="col col--6 col--offset-3">
-              <Post metadata={metadata}>
+              <BlogPostItem metadata={metadata}>
                 <BlogPostContents />
-              </Post>
+              </BlogPostItem>
             </div>
           </div>
         </div>
@@ -30,4 +30,4 @@ function BlogPost(props) {
   );
 }
 
-export default BlogPost;
+export default BlogPostPage;
diff --git a/...ocusaurus/lib/default-theme/Post/index.js → ...s/lib/default-theme/BlogPostItem/index.js b/...ocusaurus/lib/default-theme/Post/index.js → ...s/lib/default-theme/BlogPostItem/index.js
@@ -8,7 +8,7 @@
 import React from 'react';
 import Link from '@docusaurus/Link';
 
-function Post(props) {
+function BlogPostItem(props) {
   const {metadata, children, truncated} = props;
   const renderPostHeader = () => {
     if (!metadata) {
@@ -86,7 +86,7 @@ function Post(props) {
   return (
     <div>
       {renderPostHeader()}
-      <article>{children}</article>
+      <article className="markdown">{children}</article>
       {truncated && (
         <div className="text--right">
           <Link className="button button--secondary" to={metadata.permalink}>
@@ -98,4 +98,4 @@ function Post(props) {
   );
 }
 
-export default Post;
+export default BlogPostItem;
diff --git a/...saurus/lib/default-theme/DocBody/index.js → ...saurus/lib/default-theme/DocItem/index.js b/...saurus/lib/default-theme/DocBody/index.js → ...saurus/lib/default-theme/DocItem/index.js
@@ -7,12 +7,13 @@
 
 import React from 'react';
 
-import DocsPaginator from '@theme/DocsPaginator'; // eslint-disable-line
 import Head from '@docusaurus/Head';
 
+import DocPaginator from '../DocPaginator';
+
 import styles from './styles.module.css';
 
-const Headings = ({headings, isChild}) => {
+function Headings({headings, isChild}) {
   if (!headings.length) return null;
   return (
     <ul className={isChild ? 'contents' : 'contents contents__left-border'}>
@@ -26,10 +27,11 @@ const Headings = ({headings, isChild}) => {
       ))}
     </ul>
   );
-};
+}
 
-function DocBody(props) {
+function DocItem(props) {
   const {metadata, content: DocContent, docsMetadata} = props;
+
   return (
     <div className={styles.docBody}>
       <Head>
@@ -46,9 +48,9 @@ function DocBody(props) {
                 <DocContent />
               </div>
             </article>
-            <div className="margin-vert--lg">
-              <DocsPaginator docsMetadata={docsMetadata} metadata={metadata} />
-            </div>
+            <div className="margin-vert--lg" />
+
+            <DocPaginator docsMetadata={docsMetadata} metadata={metadata} />
           </div>
           <div className="col col--3 col--offset-1">
             {DocContent.rightToc && <Headings headings={DocContent.rightToc} />}
@@ -59,4 +61,4 @@ function DocBody(props) {
   );
 }
 
-export default DocBody;
+export default DocItem;
diff --git a/...b/default-theme/DocBody/styles.module.css → ...b/default-theme/DocItem/styles.module.css b/...b/default-theme/DocBody/styles.module.css → ...b/default-theme/DocItem/styles.module.css
diff --git a/...docusaurus/lib/default-theme/Doc/index.js → ...saurus/lib/default-theme/DocPage/index.js b/...docusaurus/lib/default-theme/Doc/index.js → ...saurus/lib/default-theme/DocPage/index.js
@@ -9,16 +9,18 @@ import React from 'react';
 import {renderRoutes} from 'react-router-config';
 
 import Layout from '@theme/Layout'; // eslint-disable-line
-import Sidebar from '@theme/Sidebar'; // eslint-disable-line
 
-function Doc(props) {
+import DocSidebar from '../DocSidebar';
+
+function DocPage(props) {
   const {route, docsMetadata, location} = props;
+
   return (
     <Layout noFooter>
       <div className="container container--fluid">
         <div className="row">
           <div className="col col--3">
-            <Sidebar docsMetadata={docsMetadata} location={location} />
+            <DocSidebar docsMetadata={docsMetadata} location={location} />
           </div>
           <div className="col col--9">
             {renderRoutes(route.routes, {docsMetadata})}
@@ -29,4 +31,4 @@ function Doc(props) {
   );
 }
 
-export default Doc;
+export default DocPage;
diff --git a/.../lib/default-theme/DocsPaginator/index.js → ...s/lib/default-theme/DocPaginator/index.js b/.../lib/default-theme/DocsPaginator/index.js → ...s/lib/default-theme/DocPaginator/index.js
@@ -8,9 +8,11 @@
 import React from 'react';
 import Link from '@docusaurus/Link';
 
-function DocsPaginator(props) {
-  const {docsMetadata, metadata} = props;
-  const {docs} = docsMetadata;
+function DocPaginator(props) {
+  const {
+    docsMetadata: {docs},
+    metadata,
+  } = props;
 
   return (
     <div className="row">
@@ -39,4 +41,4 @@ function DocsPaginator(props) {
   );
 }
 
-export default DocsPaginator;
+export default DocPaginator;
diff --git a/...saurus/lib/default-theme/Sidebar/index.js → ...rus/lib/default-theme/DocSidebar/index.js b/...saurus/lib/default-theme/Sidebar/index.js → ...rus/lib/default-theme/DocSidebar/index.js
@@ -11,7 +11,7 @@ import Link from '@docusaurus/Link'; // eslint-disable-line
 
 import './styles.css';
 
-function Sidebar(props) {
+function DocSidebar(props) {
   const {docsMetadata, location} = props;
 
   const id =
@@ -85,4 +85,4 @@ function Sidebar(props) {
   );
 }
 
-export default Sidebar;
+export default DocSidebar;
diff --git a/...urus/lib/default-theme/Sidebar/styles.css → ...s/lib/default-theme/DocSidebar/styles.css b/...urus/lib/default-theme/Sidebar/styles.css → ...s/lib/default-theme/DocSidebar/styles.css
diff --git a/packages/docusaurus/lib/default-theme/Loading/index.js b/packages/docusaurus/lib/default-theme/Loading/index.js
@@ -11,7 +11,7 @@ import styles from './styles.module.css';
 
 export default props => {
   if (props.error) {
-    console.log(props.error);
+    console.warn(props.error);
     return <div align="center">Error</div>;
   }
 

diff --git a/...cusaurus/lib/default-theme/Pages/index.js → ...ocusaurus/lib/default-theme/Page/index.js b/...cusaurus/lib/default-theme/Pages/index.js → ...ocusaurus/lib/default-theme/Page/index.js
@@ -8,12 +8,13 @@
 import React from 'react';
 import Layout from '@theme/Layout'; // eslint-disable-line
 
-function Pages({content: PageContent}) {
+function Page(props) {
+  const {content: PageContent} = props;
   return (
     <Layout>
       <PageContent />
     </Layout>
   );
 }
 
-export default Pages;
+export default Page;
diff --git a/packages/docusaurus/lib/server/load/theme.js b/packages/docusaurus/lib/server/load/theme.js
@@ -15,7 +15,6 @@ module.exports = function loadConfig(siteDir) {
     : path.resolve(__dirname, '../../default-theme');
 
   const requiredComponents = ['Loading', 'NotFound'];
-
   requiredComponents.forEach(component => {
     try {
       require.resolve(path.join(themePath, component));