fix: markdown to text rendering can be async

mplewis · Nov 4, 2024 · 3b2745b · 3b2745b
1 parent 33e3b1b
commit 3b2745b
Show file tree

Hide file tree

Showing 5 changed files with 31 additions and 22 deletions.
diff --git a/api/src/lib/markdown.test.ts b/api/src/lib/markdown.test.ts
@@ -15,7 +15,7 @@ Bracket fish: <>< ><>
 
 <img src="shouldnt-render.png">
     `.trim()
-    expect(markdownToHTML(input)).toMatchInlineSnapshot(`
+    expect(await markdownToHTML(input)).toMatchInlineSnapshot(`
       "<h1>Hello, world!</h1>
       <p>This is some prose.</p>
       <p><a target="_blank" href="https://example.com">Link to a website</a></p>

diff --git a/api/src/lib/markdown.ts b/api/src/lib/markdown.ts
@@ -26,8 +26,8 @@ const allowedTags = [
  * @param markdown The Markdown document
  * @returns The converted HTML
  */
-export function markdownToHTML(markdown: string): string {
-  const html = marked.parse(markdown)
+export async function markdownToHTML(markdown: string): Promise<string> {
+  const html = await marked.parse(markdown)
   const clean = sanitize(html, { allowedTags })
   const newWindows = clean.replace(/<a /g, '<a target="_blank" ')
   return newWindows
@@ -38,7 +38,7 @@ export function markdownToHTML(markdown: string): string {
  * @param markdown The Markdown document
  * @returns The converted plain text
  */
-export function markdownToText(markdown: string): string {
-  const html = marked.parse(markdown)
+export async function markdownToText(markdown: string): Promise<string> {
+  const html = await marked.parse(markdown)
   return sanitize(html, { allowedTags: [] })
 }
diff --git a/api/src/lib/schedule/reminder.ts b/api/src/lib/schedule/reminder.ts
@@ -1,17 +1,17 @@
-import { db } from '../db'
+// import { db } from '../db'
 
-/**
- *
- */
-export async function sendOutstandingReminders(now = new Date()) {
-  const reminders = await db.reminder.findMany({
-    where: { confirmed: true, sent: false, sendAt: { lte: now } },
-    include: { response: { include: { event: true } } },
-  })
+// /**
+//  *
+//  */
+// export async function sendOutstandingReminders(now = new Date()) {
+//   const reminders = await db.reminder.findMany({
+//     where: { confirmed: true, sent: false, sendAt: { lte: now } },
+//     include: { response: { include: { event: true } } },
+//   })
 
-  await Promise.all(
-    reminders.map(async (reminder) => {
-      await sendReminder(reminder)
-    })
-  )
-}
+//   await Promise.all(
+//     reminders.map(async (reminder) => {
+//       await sendReminder(reminder)
+//     })
+//   )
+// }
diff --git a/api/src/services/events/ogImage.ts b/api/src/services/events/ogImage.ts
@@ -243,6 +243,6 @@ export async function renderEventPreview(event: {
     day,
     time,
     title: event.title,
-    details: markdownToText(event.description),
+    details: await markdownToText(event.description),
   })
 }
diff --git a/web/src/components/ShowEvent/ShowEvent.tsx b/web/src/components/ShowEvent/ShowEvent.tsx
@@ -1,3 +1,5 @@
+import { useState, useEffect } from 'react'
+
 import pluralize from 'pluralize'
 import { PublicEvent } from 'types/graphql'
 
@@ -139,9 +141,16 @@ const ShowEvent = ({ event }: Props) => {
   } = event
   const tz = _tz ?? 'UTC'
   const icsLink = `${globalThis.RWJS_API_URL}/downloadIcs?event=${slug}`
-  const htmlDesc = markdownToHTML(description)
   const mapHref = `https://www.google.com/maps/search/?api=1&query=${location}`
 
+  const [htmlDesc, setHTMLDesc] = useState('')
+  useEffect(() => {
+    ;(async () => {
+      const htmlDesc = await markdownToHTML(description)
+      setHTMLDesc(htmlDesc)
+    })()
+  }, [description])
+
   return (
     <div className="mt-3">
       <Typ x="p" className="is-italic">