Social cards for economic impact charts

[nikhilwoodruff]

This is a probably technically complex (or not, maybe there's an easy way to do it) task. But the social card for each chart page could be a screenshot of that titled chart. This would be massively useful on Twitter, where we get most of our engagement (it would probably boost that by a fair amount: currently, we put up screenshots and bury the PolicyEngine link in a later tweet in a thread- with this, we could post a screenshot and a link all in one).

I think the way we'd want to do this is:

• In the Flask app, check if the URL has a ?social=True query parameter
• If it does, render the page in a headless browser in Python[^1]
• Save the image somewhere (probably locally - can always regenerate them)
• Set the twitter social card metadata in the index.html tags, including the URL of the saved image

[^1]: Or make the image with some Python package. It seems easier to mirror the web app by taking a screenshot though

[nikhilwoodruff]

Just in case it's helpful, I think this plugin might be the easiest way:

• User clicks a button (@QianruZhang78 is making progress on that, so OK to just add a placeholder for now)
• React takes a screenshot of the chart region
• React uploads it somewhere (App flask backend local storage? GitHub? GCP via the API? Something else? in order of complexity[^1]) with a predictable URL
• The app flask backend fills in the meta tags with the URL if it does exist for a given URL

[^1]: The app flask backend would probably get wiped on redeploys though

[nikhilwoodruff]

Reopening because it doesn't seem like it works anymore