chore: Updated blog for v2.0.2 release

This also changed some of the blog behavior so that the bullet links can
be disabled with a new comment as well as the "Read More" button being
able to link to GitHub issues or external links.

packages/documentation/src/blogs/index.md

@@ -1,8 +1,32 @@
+Title: react-md 2.0.2
+
+Date: 06/30/2020
+
+Read More: #877
+
+Summary:<!-- no-bullets -->
+
+This release focused on fixing bundle sizes with webpack as well as increasing
+build performance with the `sideEffects` field for each `package.json`. For more
+information, check out the v2.0.2 release PR #877 which goes into details about
+build time and sizing changes.
+
+This release also includes the following changes:
+
+- **LICENSE:** Removed the time range from license since it was incorrect
+  (50c9021)
+- Added unpkg url for base react-md package (d0efc59)
+- Updated the changelogs to be updated by
+  [conventional commits](https://www.conventionalcommits.org/) which allows for
+  a combined root [CHANGELOG.md]({{GITHUB_FILE_URL}}/CHANGELOG.md) (46f4e26)
+
+---
+
 Title: react-md 2.0.1
 
 Date: 06/17/2020
 
-Summary:
+Summary:<!-- no-bullets -->
 
 This is _technically_ a breaking change for the UMD bundle since this splits the
 material-icon component wrappers into separate bundles to minimize the library's
@@ -12,12 +36,12 @@ upgraded to v2 or even using the UMD bundle to begin with.
 
 react-md will now be available as these bundles:
 
-1. Base `ReactMD` library:<br />
-   https://unpkg.com/react-md@2.0.1/dist/umd/react-md.production.min.js
-1. `ReactMD` with `*FontIcon` components:<br />
-   https://unpkg.com/react-md@2.0.1/dist/umd/react-md-with-font-icons.production.min.js
-1. `ReactMD` with `*SVGIcon` components:<br />
-   https://unpkg.com/react-md@2.0.1/dist/umd/react-md-with-svg-icons.production.min.js
+- Base `ReactMD` library:<br />
+  https://unpkg.com/react-md@2.0.1/dist/umd/react-md.production.min.js
+- `ReactMD` with `*FontIcon` components:<br />
+  https://unpkg.com/react-md@2.0.1/dist/umd/react-md-with-font-icons.production.min.js
+- `ReactMD` with `*SVGIcon` components:<br />
+  https://unpkg.com/react-md@2.0.1/dist/umd/react-md-with-svg-icons.production.min.js
 
 The
 [advanced installation guide](/guides/advanced-installation#react-md--material-icons-umd-bundle)

packages/documentation/src/components/Blog/Blog.tsx

@@ -15,7 +15,9 @@ export default function Blog({ children }: BlogProps): ReactElement {
       const titleMatch = postMarkdown.match(/^Title: (.+)$/m);
       const dateMatch = postMarkdown.match(/^Date: (\d{2}\/\d{2}\/\d{4})$/m);
       const readMoreMatch = postMarkdown.match(/^Read More: (.+)$/m);
-      const summaryMatch = postMarkdown.match(/^Summary:$/m);
+      const summaryMatch = postMarkdown.match(
+        /^Summary:(<!-- no-bullets -->)?$/m
+      );
       if (!titleMatch) {
         throw new Error("A blog post must have a title.");
       }
@@ -32,12 +34,15 @@ export default function Blog({ children }: BlogProps): ReactElement {
       const [, date] = dateMatch;
       const readMore = readMoreMatch?.[1] || null;
       let summary = postMarkdown
-        .substring(summaryMatch.index + "Summary:".length)
+        .substring(summaryMatch.index + summaryMatch[0].length)
         .trim();
 
-      const bulletsMatch = summary.match(/^- /m);
+      const bulletsMatch =
+        !summaryMatch[0].includes("<!-- no-bullets -->") &&
+        summary.match(/^- /m);
+
       let bullets: string[] = [];
-      if (bulletsMatch?.index) {
+      if (bulletsMatch && bulletsMatch.index) {
         bullets = summary
           .substring(bulletsMatch.index)
           .split("- ")

packages/documentation/src/components/Blog/Post.tsx

@@ -4,12 +4,13 @@ import { TextIconSpacing } from "@react-md/icon";
 import { KeyboardArrowRightSVGIcon } from "@react-md/material-icons";
 import { Text, TextContainer } from "@react-md/typography";
 
+import { GITHUB_URL } from "constants/github";
 import Heading from "components/Heading";
+import Link from "components/Link";
 import LinkButton from "components/LinkButton";
 import { Markdown } from "components/Markdown";
 import RelativeDate from "components/RelativeDate";
 import { toId } from "utils/toTitle";
-import Link from "components/Link";
 
 import styles from "./Post.module.scss";
 
@@ -25,7 +26,26 @@ export interface PostProps extends BlogPost {
   isLast: boolean;
 }
 
-const href = "/blog/[id]";
+function resolveReadMore(
+  readMore: string | null
+): [] | [string] | [string, string] {
+  if (readMore === null) {
+    return [];
+  }
+
+  // github issue read more
+  if (readMore.startsWith("#")) {
+    return [`${GITHUB_URL}/issues/${readMore.substring(1)}`];
+  }
+
+  // general link
+  if (/^https?:\/\//.test(readMore)) {
+    return [readMore];
+  }
+
+  // link to specific blog
+  return ["/blog/[id]", `/blog/${readMore}`];
+}
 
 const Post: FC<PostProps> = ({
   title,
@@ -35,7 +55,7 @@ const Post: FC<PostProps> = ({
   bullets,
   isLast,
 }) => {
-  const asLink = `/blog/${readMore}`;
+  const [href, asLink] = resolveReadMore(readMore);
 
   return (
     <>
@@ -46,13 +66,12 @@ const Post: FC<PostProps> = ({
         <Text color="secondary" type="body-2" component="p" margin="bottom">
           <RelativeDate date={date} />
         </Text>
-        {/* hackily converts "lists" into bulleted lists without it be converted to the bullets part of a post */}
-        <Markdown>{summary.replace(/^1. /gm, "- ")}</Markdown>
+        <Markdown>{summary}</Markdown>
         {bullets.length > 0 && (
           <Text component="ul" type="subtitle-1">
             {bullets.map((bullet) => {
-              let content: ReactNode = bullet;
-              if (readMore) {
+              let content: ReactNode = <Markdown>{bullet}</Markdown>;
+              if (asLink) {
                 const id = toId(bullet);
                 content = (
                   <Link as={`${asLink}#${id}`} href={`${href}#${id}`}>
@@ -65,7 +84,7 @@ const Post: FC<PostProps> = ({
             })}
           </Text>
         )}
-        {readMore && (
+        {href && (
           <LinkButton
             as={asLink}
             href={href}