feat(docusaurus-og): pass parsed HTML of all pages as a property to the image renderer for enhanced customizability

packages/docusaurus-og/src/server/blog.plugin.ts

@@ -14,7 +14,7 @@ import { PluginOptions } from './types/plugin.types'
 export class BlogPlugin {
   static plugin = 'docusaurus-plugin-content-blog'
 
-  pages: BlogPageData[] = []
+  pages: Omit<BlogPageData, 'document'>[] = []
 
   constructor(
     private context: Props,
@@ -106,21 +106,26 @@ export class BlogPlugin {
 
   generate = async () => {
     for (const page of this.pages) {
+      const document = new Document(this.getHtmlPath(page.permalink))
+
+      await document.load()
+      if (!document.loaded) continue
+
       const image = await this.imageRenderer(
         {
           ...page,
+          document,
           websiteOutDir: this.context.outDir,
         },
         this.context,
       )
 
-      if (!image) continue
+      if (!image) {
+        await document.write()
+        continue
+      }
 
       const generated = await this.imageGenerator.generate(...image)
-      const document = new Document(this.getHtmlPath(page.permalink))
-
-      await document.load()
-      if (!document.loaded) continue
 
       await document.setImage(generated.url)
 

packages/docusaurus-og/src/server/docs.plugin.ts

@@ -1,7 +1,7 @@
 import {
+  PluginOptions as DocsPluginOptions,
   LoadedContent,
   LoadedVersion,
-  PluginOptions as DocsPluginOptions,
 } from '@docusaurus/plugin-content-docs'
 import { LoadedPlugin, Props } from '@docusaurus/types'
 import * as path from 'path'
@@ -14,7 +14,7 @@ import { PluginOptions } from './types/plugin.types'
 export class DocsPlugin {
   static plugin = 'docusaurus-plugin-content-docs'
 
-  docs: DocsPageData[] = []
+  docs: Omit<DocsPageData, 'document'>[] = []
 
   constructor(
     private context: Props,
@@ -63,25 +63,31 @@ export class DocsPlugin {
 
   generate = async () => {
     for (const doc of this.docs) {
+      const document = new Document(this.getHtmlPath(doc)!)
+      await document.load()
+
       const image = await this.imageRenderer(
         {
           ...doc,
+          document,
           websiteOutDir: this.context.outDir,
         },
         this.context,
       )
 
-      if (!image) continue
+      if (!image) {
+        await document.write()
+        continue
+      }
 
       const generated = await this.imageGenerator.generate(...image)
-      const document = new Document(this.getHtmlPath(doc))
-      await document.load()
       await document.setImage(generated.url)
 
       await document.write()
     }
   }
 
-  getHtmlPath = (doc: DocsPageData) =>
+  getHtmlPath = (doc: Partial<DocsPageData>) =>
+    doc.metadata?.permalink &&
     path.join(this.context.outDir, doc.metadata.permalink, 'index.html')
 }

packages/docusaurus-og/src/server/pages.plugin.ts

@@ -13,7 +13,7 @@ import { PluginOptions } from './types/plugin.types'
 export class PagesPlugin {
   static plugin = 'docusaurus-plugin-content-pages'
 
-  pages: PageData[] = []
+  pages: Omit<PageData, 'document'>[] = []
 
   constructor(
     private context: Props,
@@ -68,21 +68,25 @@ export class PagesPlugin {
 
   generate = async () => {
     for (const page of this.pages) {
+      const document = new Document(this.getHtmlPath(page.metadata.permalink))
+      await document.load()
+      if (!document.loaded) continue
+
       const image = await this.imageRenderer(
         {
           ...page,
+          document,
           websiteOutDir: this.context.outDir,
         },
         this.context,
       )
 
-      if (!image) continue
+      if (!image) {
+        await document.write()
+        continue
+      }
 
       const generated = await this.imageGenerator.generate(...image)
-      const document = new Document(this.getHtmlPath(page.metadata.permalink))
-
-      await document.load()
-      if (!document.loaded) continue
 
       await document.setImage(generated.url)
 

packages/docusaurus-og/src/server/types/blog.types.ts

@@ -4,6 +4,7 @@ import {
   BlogTag,
   PluginOptions,
 } from '@docusaurus/plugin-content-blog'
+import { Document } from '../document'
 
 export type BlogPageType =
   | 'post'
@@ -16,6 +17,7 @@ export type BlogPageType =
 export type BlogPageData = {
   plugin: PluginOptions
   permalink: string
+  document: Document
 } & (
   | {
       pageType: Extract<BlogPageType, 'post'>

packages/docusaurus-og/src/server/types/docs.types.ts

@@ -3,9 +3,11 @@ import {
   LoadedVersion,
   PluginOptions,
 } from '@docusaurus/plugin-content-docs'
+import { Document } from '../document'
 
 export type DocsPageData = {
   plugin: PluginOptions
   version: LoadedVersion
   metadata: DocMetadata
+  document: Document
 }

packages/docusaurus-og/src/server/types/pages.types.ts

@@ -1,4 +1,5 @@
 import { Metadata, PluginOptions } from '@docusaurus/plugin-content-pages'
+import { Document } from '../document'
 
 export type PageData = {
   metadata: Omit<Metadata, 'title' | 'description'> & {
@@ -6,4 +7,5 @@ export type PageData = {
     description?: string
   }
   plugin: PluginOptions
+  document: Document
 }