OJS: Template Literals Markdown

[scottfranz]

Hey I am using template literals in my markdown and ran into this. Not sure what is going on here.

I have an observable input filtering my dataset. I am just looking up twitter usernames and linking it in markdown.

data = FileAttachment("legislators-current.csv").csv({ typed: true });

data

viewof rep = Inputs.select(data, {label: "Congress", format: x => x.full_name, value: data.find(t => t.full_name === "Debbie Dingell")})

rep

rep.twitter

md`[Twitter](https://twitter.com/${rep.twitter})`

This twitter link works fine when I write in markdown in OJS.

When I write it like this https://twitter.com/${rep.twitter} or this ${rep.twitter} in quarto markdown it works fine and shows the representative's twitter account.

But when I try to link it like this [Twitter](https://twitter.com/${rep.twitter}) it does not work it links to https://twitter.com/$%7Brep.twitter%7D.

How am I supposed to format it to link correctly within quarto markdown?

[cscheid]

(This is a good one!)

Unfortunately, this is a bug/limitation on our treatment of OJS. What happens here is that we support the resolution of OJS reactives into DOM values, but we do not support the resolution of OJS reactives into DOM attributes (which is what the content of a link resolves to, <a href='{{this stuff right here}}'>...</a>.

This will be very hard to fix in general. Specifically, this is not a context free transformation (the result of the OJS transformation depends on the surrounding syntax), and that's hard to do with our present setup. It requires our infrastructure to know precisely where each OJS reference lives, what Markdown constructs resolve to what DOM construct, keeping track of the association, and building the correct code paths. That's genuinely unfortunate, because I would like to make this work. We just won't be able to in the near term.

You can work around this by creating a link that behaves like a button, and has an OJS event handler.

[scottfranz]

Oh I see. I just thought I was formatting it wrong. That makes sense. I was honestly amazed from the reactive magic in quarto markdown that I assumed it was possible.

I ended up just using the OJS markdown because the link ended up being just one word that was part of a whole paragraph. It renders on the page similarly to quarto markdown. The only difference is that the template literal heading ## ${rep.full_name} doesn't show up in my table of contents when rendered in OJS markdown. I assume another funky thing is happening here as well? Which isn't a big deal for me.

[cscheid]

The only difference is that the template literal heading ## ${rep.full_name} doesn't show up in my table of contents when rendered in OJS markdown. I assume another funky thing is happening here as well? Which isn't a big deal for me.

Hm. The page itself should update with that one, and might be a bug on our side. The TOC will not update, because we don't keep track of "copied" elements in that way. That's likely a bug we won't be able to fix.

[scottfranz]

Yes. The heading in the page shows up just fine. It just doesn't show up in the table of contents. I figured the TOC wasn't configured that way. That is fine. Thanks!