Latex Cell Mode Hack For Observable JS

[thegilpatrick]

Hey I came across this hack in an old Observable notebook where you can hijack the LaTex cell mode to use other languages within Observable. He originally used it for SQL, but it can be used for other languages and was extended in this Observable Notebook I was able to successfully use it for SQL and Logo.

import {DatasetteClient as OldDatasetteClient} from '@asg017/datasette-client-core'

db = OldDatasetteClient("https://congress-legislators.datasettes.com/legislators")

sql = ({
  block: db.table
})

sql.block`SELECT 
  id_bioguide,
  name, 
  bio_gender,
  bio_birthday,
  id_wikipedia
FROM legislators 
WHERE name LIKE 'SCOTT%';`

import {tex as logo} from "@zekenie/hello-logo"

logo.block`to fern :size :sign
  if :size < 1 [ stop ]
  fd :size
  rt 70 * :sign fern :size * 0.5 :sign * -1 lt 70 * :sign
  fd :size
  lt 70 * :sign fern :size * 0.5 :sign rt 70 * :sign
  rt 7 * :sign fern :size - 1 :sign lt 7 * :sign
  bk :size * 2
end
window clearscreen pu bk 150 pd
fern 25 1`

But I am now trying to use it for SPARQL (a query language for WikiData) used in this Observable Notebook. I had it working at one point, but now it renders the code in LaTex insted of doing the query.

import {tex as sparql} from "@lukesmurray/wikidata-sparql-cell-mode-hack"

sparql.block`
%sparql
SELECT ?parent ?parentLabel ?count
WHERE
{
  {
    SELECT ?parent (COUNT(?child) AS ?count)
    WHERE
    {
      ?parent wdt:P40 ?child.
    }
    GROUP BY ?parent
    ORDER BY DESC(?count)
    LIMIT 10
  }
  SERVICE wikibase:label { bd:serviceParam wikibase:language "en". }
}
ORDER BY DESC(?count)
LIMIT 10`

I realize that this is a super niche/weird question but I was just wondering how I could trouble shoot what was going on here? It is over my head.