💄 (gdocs) require title & blurb properties

owid · Feb 2, 2024 · 8bb07e9 · 8bb07e9
1 parent 04a5b37
commit 8bb07e9
Show file tree

Hide file tree

Showing 7 changed files with 37 additions and 115 deletions.
diff --git a/db/model/Gdoc/enrichedToRaw.ts b/db/model/Gdoc/enrichedToRaw.ts
@@ -440,12 +440,10 @@ export function enrichedBlockToRawBlock(
                 value: {
                     datapageUrl: b.datapageUrl,
                     title: b.title,
-                    blurb: b.blurb
-                        ? b.blurb.map((enriched) => ({
-                              type: "text",
-                              value: spansToHtmlText(enriched.value),
-                          }))
-                        : undefined,
+                    blurb: b.blurb.map((enriched) => ({
+                        type: "text",
+                        value: spansToHtmlText(enriched.value),
+                    })),
                     source: b.source,
                 },
             }

diff --git a/db/model/Gdoc/exampleEnrichedBlocks.ts b/db/model/Gdoc/exampleEnrichedBlocks.ts
@@ -538,6 +538,8 @@ export const enrichedBlockExamples: Record<
     "key-indicator": {
         type: "key-indicator",
         datapageUrl: "https://ourworldindata.org/grapher/life-expectancy",
+        title: "How did people's life expectancy change over time?",
+        blurb: [enrichedBlockText],
         parseErrors: [],
     },
 }
diff --git a/db/model/Gdoc/rawToEnriched.ts b/db/model/Gdoc/rawToEnriched.ts
@@ -1894,6 +1894,8 @@ const parseKeyIndicator = (
     ): EnrichedBlockKeyIndicator => ({
         type: "key-indicator",
         datapageUrl,
+        title: "",
+        blurb: [],
         parseErrors: [error],
     })
 
@@ -1915,7 +1917,13 @@ const parseKeyIndicator = (
 
     const url = extractUrl(val.datapageUrl)
 
-    if (val.blurb && !isArray(val.blurb))
+    if (!val.title)
+        return createError(
+            { message: "title property is missing or empty" },
+            url
+        )
+
+    if (!isArray(val.blurb))
         return createError(
             {
                 message:
@@ -1924,14 +1932,13 @@ const parseKeyIndicator = (
             url
         )
 
-    const blurb = val.blurb ?? []
-    const parsedBlurb = blurb.map(parseText)
+    const parsedBlurb = val.blurb.map(parseText)
     const parsedBlurbErrors = parsedBlurb.flatMap((block) => block.parseErrors)
 
     return omitUndefinedValues({
         type: "key-indicator",
         datapageUrl: url,
-        blurb: parsedBlurb.length > 0 ? parsedBlurb : undefined,
+        blurb: parsedBlurb,
         title: val.title,
         source: val.source,
         parseErrors: parsedBlurbErrors,

diff --git a/packages/@ourworldindata/types/src/gdocTypes/ArchieMlComponents.ts b/packages/@ourworldindata/types/src/gdocTypes/ArchieMlComponents.ts
@@ -101,8 +101,8 @@ export type RawBlockKeyIndicator = {
 export type EnrichedBlockKeyIndicator = {
     type: "key-indicator"
     datapageUrl: string
-    title?: string
-    blurb?: EnrichedBlockText[]
+    title: string
+    blurb: EnrichedBlockText[]
     source?: string
 } & EnrichedBlockWithParseErrors
 

diff --git a/packages/@ourworldindata/types/src/gdocTypes/Gdoc.ts b/packages/@ourworldindata/types/src/gdocTypes/Gdoc.ts
@@ -29,11 +29,7 @@ export interface LinkedChart {
 export interface LinkedIndicator {
     id: number
     title: string
-    titleVariant?: string
-    attributionShort?: string
-    dateRange?: string
-    lastUpdated?: string
-    descriptionShort?: string
+    source?: string
 }
 
 export enum OwidGdocType {

diff --git a/packages/@ourworldindata/utils/src/metadataHelpers.ts b/packages/@ourworldindata/utils/src/metadataHelpers.ts
@@ -7,6 +7,7 @@ import {
     OwidSource,
     OwidVariableWithSourceAndDimension,
     LinkedIndicator,
+    joinTitleFragments,
 } from "@ourworldindata/types"
 import { compact, uniq, last, excludeUndefined } from "./Util"
 import dayjs from "./dayjs.js"
@@ -293,15 +294,14 @@ export function grabMetadataForGdocLinkedIndicator(
 ): Omit<LinkedIndicator, "id"> {
     return {
         title:
-            metadata.presentation?.titlePublic ??
-            metadata.presentation?.grapherConfigETL?.title ??
-            metadata.display?.name ??
-            metadata.name ??
+            metadata.presentation?.titlePublic ||
+            metadata.presentation?.grapherConfigETL?.title ||
+            metadata.display?.name ||
+            metadata.name ||
             "",
-        titleVariant: metadata.presentation?.titleVariant,
-        attributionShort: metadata.presentation?.attributionShort,
-        dateRange: metadata.timespan,
-        lastUpdated: getLastUpdatedFromVariable(metadata),
-        descriptionShort: metadata.descriptionShort,
+        source: joinTitleFragments(
+            metadata.presentation?.attributionShort,
+            metadata.presentation?.titleVariant
+        ),
     }
 }
diff --git a/site/gdocs/components/KeyIndicator.tsx b/site/gdocs/components/KeyIndicator.tsx
@@ -6,14 +6,8 @@ import { faArrowRight } from "@fortawesome/free-solid-svg-icons"
 import {
     EnrichedBlockKeyIndicator,
     EnrichedBlockText,
-    LinkedIndicator,
 } from "@ourworldindata/types"
-import {
-    makeDateRange,
-    makeLastUpdated,
-    SimpleMarkdownText,
-} from "@ourworldindata/components"
-import { capitalize, joinTitleFragments } from "@ourworldindata/utils"
+import { capitalize } from "@ourworldindata/utils"
 
 import Chart from "./Chart.js"
 import Paragraph from "./Paragraph.js"
@@ -34,14 +28,7 @@ export default function KeyIndicator({
     if (!linkedChart) return null
     if (!linkedIndicator) return null
 
-    const source =
-        d.source ||
-        capitalize(
-            joinTitleFragments(
-                linkedIndicator.attributionShort,
-                linkedIndicator.titleVariant
-            )
-        )
+    const source = capitalize(d.source || linkedIndicator.source)
 
     return (
         <div className={cx("key-indicator grid grid-cols-12", className)}>
@@ -50,11 +37,12 @@ export default function KeyIndicator({
                     {linkedIndicator.title}{" "}
                     <span className="indicator-source">{source}</span>
                 </div>
-                {d.title || d.blurb ? (
-                    <IndicatorNarrative block={d} />
-                ) : (
-                    <IndicatorMetadata linkedIndicator={linkedIndicator} />
-                )}
+                <h4 className="narrative-title">{d.title}</h4>
+                <div className="blurb">
+                    {d.blurb.map((textBlock: EnrichedBlockText, i: number) => (
+                        <Paragraph d={textBlock} key={i} />
+                    ))}
+                </div>
                 <a
                     className="datapage-link datapage-link-desktop"
                     href={linkedChart.resolvedUrl}
@@ -81,72 +69,3 @@ export default function KeyIndicator({
         </div>
     )
 }
-
-function IndicatorNarrative({
-    block,
-}: {
-    block: EnrichedBlockKeyIndicator
-}): JSX.Element {
-    return (
-        <>
-            {block.title && <h4 className="narrative-title">{block.title}</h4>}
-            {block.blurb && (
-                <div className="blurb">
-                    {block.blurb.map(
-                        (textBlock: EnrichedBlockText, i: number) => (
-                            <Paragraph d={textBlock} key={i} />
-                        )
-                    )}
-                </div>
-            )}
-        </>
-    )
-}
-
-function IndicatorMetadata({
-    linkedIndicator,
-}: {
-    linkedIndicator: LinkedIndicator
-}): JSX.Element {
-    const dateRange = makeDateRange({
-        dateRange: linkedIndicator.dateRange,
-    })
-    const lastUpdated = makeLastUpdated({
-        lastUpdated: linkedIndicator.lastUpdated,
-    })
-
-    return (
-        <>
-            {linkedIndicator.descriptionShort && (
-                <div className="description">
-                    <SimpleMarkdownText
-                        text={linkedIndicator.descriptionShort}
-                    />
-                </div>
-            )}
-            <div className="metadata grid grid-cols-4">
-                {dateRange && (
-                    <div className="metadata-entry col-start-1 span-cols-2">
-                        <div className="metadata-entry__title">Date range</div>
-                        <div className="metadata-entry__value">{dateRange}</div>
-                    </div>
-                )}
-                {lastUpdated && (
-                    <div
-                        className={cx("metadata-entry", {
-                            "col-start-3 span-cols-2": !!dateRange,
-                            "col-start-1 span-cols-4": !dateRange,
-                        })}
-                    >
-                        <div className="metadata-entry__title">
-                            Last updated
-                        </div>
-                        <div className="metadata-entry__value">
-                            {lastUpdated}
-                        </div>
-                    </div>
-                )}
-            </div>
-        </>
-    )
-}