I have a page.tsx file: https://gist.github.com/DylanDevelops/b5ee089ad28351b928c69033689d8007

I want to dynamically generate an opengraph social preview image using data that gets pulled from my backend to lay things out on that page.

How can I do this? I've seen on the Next.js docs that you need to create an opengraph-image.tsx file. However, I don't understand how I am supposed to pass values into that file when I don't call anything in that file from my page.tsx file.

Let me know if anyone an help me out or show me some example code so I can get an idea of what I am supposed to do!