🔨 fix CF functions uses of grapher

functions/_common/downloadFunctions.ts

@@ -1,4 +1,8 @@
-import { Grapher } from "@ourworldindata/grapher"
+import {
+    fetchInputTableForConfig,
+    Grapher,
+    GrapherState,
+} from "@ourworldindata/grapher"
 import { OwidColumnDef } from "@ourworldindata/types"
 import { StatusError } from "itty-router"
 import { createZip, File } from "littlezipper"
@@ -21,10 +25,15 @@ export async function fetchMetadataForGrapher(
         env
     )
 
-    await grapher.downloadLegacyDataFromOwidVariableIds()
+    const inputTable = await fetchInputTableForConfig(
+        grapher.grapherState.dimensions,
+        grapher.grapherState.selectedEntityColors,
+        env.DATA_API_URL
+    )
+    grapher.grapherState.inputTable = inputTable
 
     const fullMetadata = assembleMetadata(
-        grapher,
+        grapher.grapherState,
         searchParams ?? new URLSearchParams(""),
         multiDimAvailableDimensions
     )
@@ -44,9 +53,14 @@ export async function fetchZipForGrapher(
         searchParams ?? new URLSearchParams(""),
         env
     )
-    await grapher.downloadLegacyDataFromOwidVariableIds()
+    const inputTable = await fetchInputTableForConfig(
+        grapher.grapherState.dimensions,
+        grapher.grapherState.selectedEntityColors,
+        env.DATA_API_URL
+    )
+    grapher.grapherState.inputTable = inputTable
     ensureDownloadOfDataAllowed(grapher)
-    const metadata = assembleMetadata(grapher, searchParams)
+    const metadata = assembleMetadata(grapher.grapherState, searchParams)
     const readme = assembleReadme(grapher, searchParams)
     const csv = assembleCsv(grapher, searchParams)
     console.log("Fetched the parts, creating zip file")
@@ -67,12 +81,15 @@ export async function fetchZipForGrapher(
         },
     })
 }
-function assembleCsv(grapher: Grapher, searchParams: URLSearchParams): string {
+function assembleCsv(
+    grapherState: GrapherState,
+    searchParams: URLSearchParams
+): string {
     const useShortNames = searchParams.get("useColumnShortNames") === "true"
-    const fullTable = grapher.inputTable
-    const filteredTable = grapher.isOnTableTab
-        ? grapher.tableForDisplay
-        : grapher.transformedTable
+    const fullTable = grapherState.inputTable
+    const filteredTable = grapherState.isOnTableTab
+        ? grapherState.tableForDisplay
+        : grapherState.transformedTable
     const table =
         searchParams.get("csvType") === "filtered" ? filteredTable : fullTable
     return table.toPrettyCsv(useShortNames)
@@ -89,20 +106,28 @@ export async function fetchCsvForGrapher(
         searchParams ?? new URLSearchParams(""),
         env
     )
-    await grapher.downloadLegacyDataFromOwidVariableIds()
+    const inputTable = await fetchInputTableForConfig(
+        grapher.grapherState.dimensions,
+        grapher.grapherState.selectedEntityColors,
+        env.DATA_API_URL
+    )
+    grapher.grapherState.inputTable = inputTable
     console.log("checking if download is allowed")
-    ensureDownloadOfDataAllowed(grapher)
+    ensureDownloadOfDataAllowed(grapher.grapherState)
     console.log("data download is allowed")
-    const csv = assembleCsv(grapher, searchParams ?? new URLSearchParams(""))
+    const csv = assembleCsv(
+        grapher.grapherState,
+        searchParams ?? new URLSearchParams("")
+    )
     return new Response(csv, {
         headers: {
             "Content-Type": "text/csv",
         },
     })
 }
-function ensureDownloadOfDataAllowed(grapher: Grapher) {
+function ensureDownloadOfDataAllowed(grapherState: GrapherState) {
     if (
-        grapher.inputTable.columnsAsArray.some(
+        grapherState.inputTable.columnsAsArray.some(
             (col) => (col.def as OwidColumnDef).nonRedistributable
         )
     ) {
@@ -126,7 +151,12 @@ export async function fetchReadmeForGrapher(
         env
     )
 
-    await grapher.downloadLegacyDataFromOwidVariableIds()
+    const inputTable = await fetchInputTableForConfig(
+        grapher.grapherState.dimensions,
+        grapher.grapherState.selectedEntityColors,
+        env.DATA_API_URL
+    )
+    grapher.grapherState.inputTable = inputTable
 
     const readme = assembleReadme(
         grapher,
@@ -145,9 +175,9 @@ function assembleReadme(
     searchParams: URLSearchParams,
     multiDimAvailableDimensions?: string[]
 ): string {
-    const metadataCols = getColumnsForMetadata(grapher)
+    const metadataCols = getColumnsForMetadata(grapher.grapherState)
     return constructReadme(
-        grapher,
+        grapher.grapherState,
         metadataCols,
         searchParams,
         multiDimAvailableDimensions

functions/_common/env.ts

@@ -9,6 +9,7 @@ export interface Env {
     CLOUDFLARE_IMAGES_API_KEY: string
     CLOUDFLARE_IMAGES_URL: string
     ENV: string
+    DATA_API_URL: string
 }
 // We collect the possible extensions here so we can easily take them into account
 // when handling redirects

functions/_common/grapherRenderer.ts

@@ -12,6 +12,7 @@ import PlayfairSemiBold from "../_common/fonts/PlayfairDisplayLatin-SemiBold.ttf
 import { Env } from "./env.js"
 import { ImageOptions, extractOptions } from "./imageOptions.js"
 import { GrapherIdentifier, initGrapher } from "./grapherTools.js"
+import { fetchInputTableForConfig } from "@ourworldindata/grapher"
 
 declare global {
     // eslint-disable-next-line no-var
@@ -71,8 +72,17 @@ async function fetchAndRenderGrapherToSvg(
 
     grapherLogger.log("initGrapher")
     const promises = []
-    promises.push(grapher.downloadLegacyDataFromOwidVariableIds())
-    if (options.details && grapher.detailsOrderedByReference.length) {
+    promises.push(
+        fetchInputTableForConfig(
+            grapher.grapherState.dimensions,
+            grapher.grapherState.selectedEntityColors,
+            env.DATA_API_URL
+        )
+    )
+    if (
+        options.details &&
+        grapher.grapherState.detailsOrderedByReference.length
+    ) {
         promises.push(
             await fetch("https://ourworldindata.org/dods.json")
                 .then((r) => r.json())
@@ -82,13 +92,16 @@ async function fetchAndRenderGrapherToSvg(
         )
     }
 
-    await Promise.all(promises) // Run these (potentially) two fetches in parallel
+    const results = await Promise.all(promises) // Run these (potentially) two fetches in parallel
     grapherLogger.log("fetchDataAndDods")
 
-    const svg = grapher.generateStaticSvg()
+    const inputTable = results[0]
+    if (inputTable) grapher.grapherState.inputTable = inputTable
+
+    const svg = grapher.grapherState.generateStaticSvg()
     grapherLogger.log("generateStaticSvg")
 
-    return { svg, backgroundColor: grapher.backgroundColor }
+    return { svg, backgroundColor: grapher.grapherState.backgroundColor }
 }
 
 export const fetchAndRenderGrapher = async (

functions/_common/grapherTools.ts

@@ -1,4 +1,8 @@
-import { generateGrapherImageSrcSet, Grapher } from "@ourworldindata/grapher"
+import {
+    generateGrapherImageSrcSet,
+    Grapher,
+    GrapherState,
+} from "@ourworldindata/grapher"
 import {
     GrapherInterface,
     MultiDimDataPageConfigEnriched,
@@ -213,7 +217,7 @@ export async function initGrapher(
     }
 
     const bounds = new Bounds(0, 0, options.svgWidth, options.svgHeight)
-    const grapher = new Grapher({
+    const grapherState = new GrapherState({
         ...grapherConfigResponse.grapherConfig,
         bakedGrapherURL: grapherBaseUrl,
         queryStr: "?" + searchParams.toString(),
@@ -222,8 +226,9 @@ export async function initGrapher(
         baseFontSize: options.fontSize,
         ...options.grapherProps,
     })
-    grapher.isExportingToSvgOrPng = true
-    grapher.shouldIncludeDetailsInStaticExport = options.details
+    grapherState.isExportingToSvgOrPng = true
+    grapherState.shouldIncludeDetailsInStaticExport = options.details
+    const grapher = new Grapher({ grapherState })
 
     return {
         grapher,

functions/_common/metadataTools.ts

@@ -1,4 +1,4 @@
-import { Grapher } from "@ourworldindata/grapher"
+import { Grapher, GrapherState } from "@ourworldindata/grapher"
 import {
     OwidTableSlugs,
     OwidOrigin,
@@ -34,7 +34,7 @@ type MetadataColumn = {
     fullMetadata: string
 }
 
-export const getColumnsForMetadata = (grapher: Grapher) => {
+export const getColumnsForMetadata = (grapherState: GrapherState) => {
     const columnsToIgnore = new Set(
         [
             OwidTableSlugs.entityId,
@@ -47,20 +47,20 @@ export const getColumnsForMetadata = (grapher: Grapher) => {
         ].map((slug) => slug.toString())
     )
 
-    const colsToGet = grapher.inputTable.columnSlugs.filter(
+    const colsToGet = grapherState.inputTable.columnSlugs.filter(
         (col) => !columnsToIgnore.has(col)
     )
 
-    return grapher.inputTable.getColumns(colsToGet)
+    return grapherState.inputTable.getColumns(colsToGet)
 }
 export function assembleMetadata(
-    grapher: Grapher,
+    grapherState: GrapherState,
     searchParams: URLSearchParams,
     multiDimAvailableDimensions?: string[]
 ) {
     const useShortNames = searchParams.get("useColumnShortNames") === "true"
 
-    const metadataCols = getColumnsForMetadata(grapher)
+    const metadataCols = getColumnsForMetadata(grapherState)
 
     const columns: [string, MetadataColumn][] = metadataCols.map((col) => {
         const {
@@ -179,14 +179,14 @@ export function assembleMetadata(
 
     const fullMetadata = {
         chart: {
-            title: grapher.title,
-            subtitle: grapher.subtitle,
-            note: grapher.note,
-            xAxisLabel: grapher.xAxis.label,
-            yAxisLabel: grapher.yAxis.label,
-            citation: grapher.sourcesLine,
-            originalChartUrl: grapher.canonicalUrl,
-            selection: grapher.selectedEntityNames,
+            title: grapherState.title,
+            subtitle: grapherState.subtitle,
+            note: grapherState.note,
+            xAxisLabel: grapherState.xAxis.label,
+            yAxisLabel: grapherState.yAxis.label,
+            citation: grapherState.sourcesLine,
+            originalChartUrl: grapherState.canonicalUrl,
+            selection: grapherState.selectedEntityNames,
         },
         columns: Object.fromEntries(columns),
         // date downloaded should be YYYY-MM-DD

functions/_common/readmeTools.ts

@@ -16,7 +16,7 @@ import {
     isEmpty,
 } from "@ourworldindata/utils"
 import { CoreColumn } from "@ourworldindata/core-table"
-import { Grapher } from "@ourworldindata/grapher"
+import { Grapher, GrapherState } from "@ourworldindata/grapher"
 import { getGrapherFilters } from "./urlTools.js"
 
 const markdownNewlineEnding = "  "
@@ -255,7 +255,7 @@ function* activeFilterSettings(
 }
 
 export function constructReadme(
-    grapher: Grapher,
+    grapherState: GrapherState,
     columns: CoreColumn[],
     searchParams: URLSearchParams,
     multiDimAvailableDimensions?: string[]
@@ -268,13 +268,13 @@ export function constructReadme(
         )
         .flatMap((col) => [...columnReadmeText(col)])
     let readme: string
-    const urlWithFilters = `${grapher.canonicalUrl}`
+    const urlWithFilters = `${grapherState.canonicalUrl}`
 
     const downloadDate = formatDate(new Date()) // formats the date as "October 10, 2024"
     if (isSingleColumn)
-        readme = `# ${grapher.displayTitle} - Data package
+        readme = `# ${grapherState.displayTitle} - Data package
 
-This data package contains the data that powers the chart ["${grapher.displayTitle}"](${urlWithFilters}) on the Our World in Data website. It was downloaded on ${downloadDate}.
+This data package contains the data that powers the chart ["${grapherState.displayTitle}"](${urlWithFilters}) on the Our World in Data website. It was downloaded on ${downloadDate}.
 ${[...activeFilterSettings(searchParams, multiDimAvailableDimensions)].join("\n")}
 ## CSV Structure
 
@@ -300,9 +300,9 @@ ${sources.join("\n")}
 
     `
     else
-        readme = `# ${grapher.displayTitle} - Data package
+        readme = `# ${grapherState.displayTitle} - Data package
 
-This data package contains the data that powers the chart ["${grapher.displayTitle}"](${urlWithFilters}) on the Our World in Data website.
+This data package contains the data that powers the chart ["${grapherState.displayTitle}"](${urlWithFilters}) on the Our World in Data website.
 
 ## CSV Structure
 

wrangler.toml

@@ -9,7 +9,7 @@ ENV = "development"
 GRAPHER_CONFIG_R2_BUCKET_URL = "https://grapher-configs-staging.owid.io"
 GRAPHER_CONFIG_R2_BUCKET_FALLBACK_URL = "https://grapher-configs.owid.io"
 GRAPHER_CONFIG_R2_BUCKET_FALLBACK_PATH = "v1"
-
+DATA_API_URL = "https://api.ourworldindata.org/v1/indicators/"
 
 # Overrides for CF preview deployments
 [env.preview.vars]