Build from committed content snapshot instead of live APIs

.github/workflows/deploy.yml

@@ -38,6 +38,10 @@ jobs:
       NODE_ENV: production
       LOG_LEVEL: error
       DEBUG: error
+      # Notion and Substack both sit behind Cloudflare, which blocks Actions
+      # runners. Build from the snapshot committed under data/ (refreshed with
+      # `npm run fetch-content` on a dev machine) and fail loudly if it's absent.
+      CONTENT_SOURCE: snapshot
 
     steps:
       - uses: actions/checkout@v2

.github/workflows/pr-preview.yml

@@ -20,6 +20,9 @@ jobs:
       SUBSTACK_HANDLE: ${{ vars.SUBSTACK_HANDLE }}
       NODE_ENV: production
       LOG_LEVEL: error
+      # see deploy.yml — Cloudflare blocks Actions runners, so builds read the
+      # content snapshot committed under data/
+      CONTENT_SOURCE: snapshot
 
     steps:
       - uses: actions/checkout@v2

.gitignore

@@ -11,6 +11,7 @@
 # next.js
 /.next/
 /out/
+tsconfig.tsbuildinfo
 
 # production
 /build

.nvmrc

@@ -0,0 +1 @@
+22.9.0

components/LayoutPost.tsx

@@ -2,8 +2,8 @@ import * as React from "react";
 
 import * as types from "lib/types";
 
-import { Block, BlockMap, PageBlock, ExtendedRecordMap } from "lib/types";
-import { getPageProperty } from "notion-utils";
+import { Block, PageBlock, ExtendedRecordMap } from "lib/types";
+import { getBlockValue, getPageProperty } from "notion-utils";
 
 import { log } from "lib/log";
 /*
@@ -97,16 +97,16 @@ function getPageFromRecords(args: {
     };
   }
 
-  const postRootBlock = (
-    Object.values(recordMap?.block).find((block: BlockMap[string]) => {
-      return block?.value?.id === pageId;
-    }) as BlockMap[string]
-  )?.value as PageBlock;
-  const postContentBlocks = Object.values(recordMap?.block)
-    .filter((block: BlockMap[string]) => {
-      return block?.value?.parent_id === pageId;
-    })
-    .map((b: BlockMap[string]) => b?.value) as Array<Block>;
+  const blocks = Object.values(recordMap?.block).map((entry) =>
+    getBlockValue(entry)
+  );
+
+  const postRootBlock = blocks.find(
+    (block) => block?.id === pageId
+  ) as PageBlock;
+  const postContentBlocks = blocks.filter(
+    (block) => block?.parent_id === pageId
+  ) as Array<Block>;
 
   const page = pageFromBlock({ recordMap, block: postRootBlock });
   return {

components/NotionComponents.tsx

@@ -4,7 +4,12 @@ import Image from "next/image";
 import { useSearchParam } from "react-use";
 
 import { NotionRenderer, NotionComponents, Text } from "react-notion-x";
-import { getBlockTitle, getPageProperty, formatDate } from "notion-utils";
+import {
+  getBlockTitle,
+  getBlockValue,
+  getPageProperty,
+  formatDate,
+} from "notion-utils";
 import { Block, ExtendedRecordMap } from "notion-types";
 
 // utils
@@ -74,8 +79,7 @@ export const getNotionProps = ({ site, recordMap, pageId }): any => {
   }, [site, recordMap, lite]);
 
   const keys = Object.keys(recordMap?.block || {});
-  const block = recordMap?.block?.[keys[0]]?.value;
-  console.log({ keys, block });
+  const block = getBlockValue(recordMap?.block?.[keys[0]]);
 
   // const isRootPage =
   //   parsePageId(block?.id) === parsePageId(site?.rootNotionPageId)

components/NotionPage.tsx

@@ -10,7 +10,12 @@ import { PageBlock } from "notion-types";
 import TweetEmbed from "react-tweet-embed";
 
 // utils
-import { getBlockTitle, getPageProperty, formatDate } from "notion-utils";
+import {
+  getBlockTitle,
+  getBlockValue,
+  getPageProperty,
+  formatDate,
+} from "notion-utils";
 import { mapPageUrl, getCanonicalPageUrl } from "lib/map-page-url";
 import { mapImageUrl } from "lib/map-image-url";
 import { useDarkMode } from "lib/use-dark-mode";
@@ -172,7 +177,7 @@ export const NotionPage: React.FC<types.PageProps> = ({
   const { isDarkMode } = useDarkMode();
 
   const keys = Object.keys(recordMap?.block || {});
-  const block = recordMap?.block?.[keys[0]]?.value;
+  const block = getBlockValue(recordMap?.block?.[keys[0]]);
 
   if (router.isFallback) {
     return <Loading />;