From e5518b734a8632e343ba57390252b484e6e5e8f8 Mon Sep 17 00:00:00 2001 From: Daniel O'Connell Date: Fri, 1 Mar 2024 12:52:12 +0100 Subject: [PATCH] fix see more --- app/components/Article/Contents.tsx | 11 +++++++++++ app/server-utils/parsing-utils.ts | 2 +- app/server-utils/stampy.ts | 17 +++++++++++++---- 3 files changed, 25 insertions(+), 5 deletions(-) diff --git a/app/components/Article/Contents.tsx b/app/components/Article/Contents.tsx index c425e82c..105a333c 100644 --- a/app/components/Article/Contents.tsx +++ b/app/components/Article/Contents.tsx @@ -146,6 +146,17 @@ const Contents = ({pageid, html, glossary}: {pageid: PageId; html: string; gloss updateTextNodes(el, insertGlossary(pageid, glossary)) + const toggleClass = (e: Event) => { + e.preventDefault() + const target = e.target as HTMLElement + target.classList.toggle('visible') + } + Array.from(document.getElementsByClassName('see-more')).forEach((e) => { + const elem = e.cloneNode(true) + elem.addEventListener('click', toggleClass) + e.replaceWith(elem) + }) + // In theory this could be extended to all links el.querySelectorAll('.footnote-ref > a').forEach((e) => { const footnote = footnoteHTML(el, e as HTMLAnchorElement) diff --git a/app/server-utils/parsing-utils.ts b/app/server-utils/parsing-utils.ts index 570e4f93..1cb8b3df 100644 --- a/app/server-utils/parsing-utils.ts +++ b/app/server-utils/parsing-utils.ts @@ -56,7 +56,7 @@ export const convertToHtmlAndWrapInDetails = (markdown: string): string => { // On the other hand, if the whole text isn't rendered as one, footnotes will break. // To get round this, replace the [See more...] button with a magic string, render the // markdown, then mangle the resulting HTML to add an appropriate button link - markdown = markdown.replaceAll(/\s*\[[Ss]ee more\W*?\]\s*/g, seeMoreToken) + markdown = markdown.replaceAll(/\[[Ss]ee more\W*?\]/g, seeMoreToken) markdown = md.render(markdown) markdown = wrap(markdown.split(seeMoreToken)) diff --git a/app/server-utils/stampy.ts b/app/server-utils/stampy.ts index 9729a541..a3d8834e 100644 --- a/app/server-utils/stampy.ts +++ b/app/server-utils/stampy.ts @@ -132,7 +132,7 @@ export type AnswersRow = CodaRowCommon & { Banners: '' | Entity[] 'Rich Text': string Subtitle?: string - Icon?: string + Icon?: Entity | string | Entity[] Parents?: Entity[] Order?: number } @@ -250,7 +250,7 @@ const renderText = (pageid: PageId, markdown: string | null): string | null => { if (!markdown) return null markdown = extractText(markdown) - markdown = urlToIframe(markdown) + markdown = urlToIframe(markdown || '') let html = convertToHtmlAndWrapInDetails(markdown) html = uniqueFootnotes(html, pageid) @@ -260,8 +260,17 @@ const renderText = (pageid: PageId, markdown: string | null): string | null => { return html } +// Icons can be returned as strings or objects +const extractIcon = (val?: string | string[] | Entity | Entity[]): string | undefined => { + if (!val) return val + const item = head(val) + if (typeof item === 'string') return extractText(val as string) + if (item) return (item as Entity).url + return undefined +} + // Sometimes string fields are returned as lists. This can happen when there are duplicate entries in Coda -const head = (item: string | string[]) => { +const head = (item: any | any[]) => { if (Array.isArray(item)) return item[0] return item } @@ -291,7 +300,7 @@ const convertToQuestion = ({name, values, updatedAt} = {} as AnswersRow): Questi status: values['Status']?.name as QuestionStatus, alternatePhrasings: extractText(values['Alternate Phrasings']), subtitle: extractText(values.Subtitle), - icon: extractText(values.Icon), + icon: extractIcon(values.Icon), parents: !values.Parents ? [] : values.Parents?.map(({name}) => name), updatedAt: updatedAt || values['Doc Last Edited'], order: values.Order || 0,