feat(v2): add draft feature to blog posts (#2335)

packages/docusaurus-plugin-content-blog/src/__tests__/__fixtures__/website/blog/draft.md

@@ -0,0 +1,6 @@
+---
+date: 2020-02-27
+draft: true
+---
+
+this post should not be published yet

packages/docusaurus-plugin-content-blog/src/__tests__/__snapshots__/generateBlogFeed.test.ts.snap

@@ -7,12 +7,19 @@ exports[`blogFeed atom shows feed item for each post 1`] = `
 <feed xmlns=\\"http://www.w3.org/2005/Atom\\">
     <id>https://docusaurus.io/blog</id>
     <title>Hello Blog</title>
-    <updated>2019-01-01T00:00:00.000Z</updated>
+    <updated>2020-02-27T00:00:00.000Z</updated>
     <generator>https://github.com/jpmonette/feed</generator>
     <link rel=\\"alternate\\" href=\\"https://docusaurus.io/blog\\"/>
     <subtitle>Hello Blog</subtitle>
     <icon>https://docusaurus.io/image/favicon.ico</icon>
     <rights>Copyright</rights>
+    <entry>
+        <title type=\\"html\\"><![CDATA[draft]]></title>
+        <id>draft</id>
+        <link href=\\"https://docusaurus.io/blog/2020/02/27/draft\\"/>
+        <updated>2020-02-27T00:00:00.000Z</updated>
+        <summary type=\\"html\\"><![CDATA[this post should not be published yet]]></summary>
+    </entry>
     <entry>
         <title type=\\"html\\"><![CDATA[date-matter]]></title>
         <id>date-matter</id>
@@ -39,10 +46,17 @@ exports[`blogFeed rss shows feed item for each post 1`] = `
         <title>Hello Blog</title>
         <link>https://docusaurus.io/blog</link>
         <description>Hello Blog</description>
-        <lastBuildDate>Tue, 01 Jan 2019 00:00:00 GMT</lastBuildDate>
+        <lastBuildDate>Thu, 27 Feb 2020 00:00:00 GMT</lastBuildDate>
         <docs>http://blogs.law.harvard.edu/tech/rss</docs>
         <generator>https://github.com/jpmonette/feed</generator>
         <copyright>Copyright</copyright>
+        <item>
+            <title><![CDATA[draft]]></title>
+            <link>https://docusaurus.io/blog/2020/02/27/draft</link>
+            <guid>https://docusaurus.io/blog/2020/02/27/draft</guid>
+            <pubDate>Thu, 27 Feb 2020 00:00:00 GMT</pubDate>
+            <description><![CDATA[this post should not be published yet]]></description>
+        </item>
         <item>
             <title><![CDATA[date-matter]]></title>
             <link>https://docusaurus.io/blog/2019/01/01/date-matter</link>

packages/docusaurus-plugin-content-blog/src/__tests__/index.test.ts

@@ -11,15 +11,15 @@ import pluginContentBlog from '../index';
 import {DocusaurusConfig, LoadContext} from '@docusaurus/types';
 
 describe('loadBlog', () => {
-  test('simple website', async () => {
+  const siteDir = path.join(__dirname, '__fixtures__', 'website');
-    const siteDir = path.join(__dirname, '__fixtures__', 'website');
+  const pluginPath = 'blog';
+  const getBlogPosts = async () => {
     const generatedFilesDir: string = path.resolve(siteDir, '.docusaurus');
     const siteConfig = {
       title: 'Hello',
       baseUrl: '/',
       url: 'https://docusaurus.io',
     } as DocusaurusConfig;
-    const pluginPath = 'blog';
     const plugin = pluginContentBlog(
       {
         siteDir,
@@ -27,10 +27,16 @@ describe('loadBlog', () => {
         generatedFilesDir,
       } as LoadContext,
       {
-        path: 'blog',
+        path: pluginPath,
       },
     );
     const {blogPosts} = await plugin.loadContent();
+
+    return blogPosts;
+  };
+
+  test('simple website', async () => {
+    const blogPosts = await getBlogPosts();
     const noDateSource = path.join('@site', pluginPath, 'no date.md');
     const noDateSourceBirthTime = (
       await fs.stat(noDateSource.replace('@site', siteDir))
@@ -40,9 +46,10 @@ describe('loadBlog', () => {
       .substr(0, '2019-01-01'.length)
       .replace(/-/g, '/')}/no date`;
 
-    expect(
+    expect({
-      blogPosts.find(v => v.metadata.title === 'date-matter').metadata,
+      ...blogPosts.find(v => v.metadata.title === 'date-matter').metadata,
-    ).toEqual({
+      ...{prevItem: undefined},
+    }).toEqual({
       permalink: '/blog/2019/01/01/date-matter',
       source: path.join('@site', pluginPath, 'date-matter.md'),
       title: 'date-matter',
@@ -53,12 +60,9 @@ describe('loadBlog', () => {
         permalink: '/blog/2018/12/14/Happy-First-Birthday-Slash',
         title: 'Happy 1st Birthday Slash!',
       },
-      prevItem: {
-        permalink: noDatePermalink,
-        title: 'no date',
-      },
       truncated: false,
     });
+
     expect(
       blogPosts.find(v => v.metadata.title === 'Happy 1st Birthday Slash!')
         .metadata,
@@ -80,9 +84,10 @@ describe('loadBlog', () => {
       truncated: false,
     });
 
-    expect(
+    expect({
-      blogPosts.find(v => v.metadata.title === 'no date').metadata,
+      ...blogPosts.find(v => v.metadata.title === 'no date').metadata,
-    ).toEqual({
+      ...{prevItem: undefined},
+    }).toEqual({
       permalink: noDatePermalink,
       source: noDateSource,
       title: 'no date',
@@ -90,10 +95,17 @@ describe('loadBlog', () => {
       date: noDateSourceBirthTime,
       tags: [],
       nextItem: {
-        permalink: '/blog/2019/01/01/date-matter',
+        permalink: '/blog/2020/02/27/draft',
-        title: 'date-matter',
+        title: 'draft',
       },
       truncated: false,
     });
   });
+
+  test('draft blog post not exists in production build', async () => {
+    process.env.NODE_ENV = 'production';
+    const blogPosts = await getBlogPosts();
+
+    expect(blogPosts.find(v => v.metadata.title === 'draft')).toBeUndefined();
+  });
 });

packages/docusaurus-plugin-content-blog/src/blogUtils.ts

@@ -107,6 +107,10 @@ export async function generateBlogPosts(
       const fileString = await fs.readFile(source, 'utf-8');
       const {frontMatter, content, excerpt} = parse(fileString);
 
+      if (frontMatter.draft && process.env.NODE_ENV === 'production') {
+        return;
+      }
+
       let date;
       // Extract date and title from filename.
       const match = blogFileName.match(FILENAME_PATTERN);

website/docs/blog.md

@@ -52,6 +52,7 @@ The only required field is `title`; however, we provide options to add author in
 - `author_title` - A description of the author.
 - `title` - The blog post title.
 - `tags` - A list of strings to tag to your post.
+- `draft` - A boolean flag to indicate that the blog post is work in process and therefore should not be published yet. However, draft blog posts will be displayed during development.
 
 ## Summary truncation