[Feature]: Auto-Generate Dynamic OpenGraph (OG) Images for Model Pages

[nitishchaubeyy]

Description

When users share an AIAtlas model page on platforms like Twitter, LinkedIn, or Discord, it currently shows a generic site preview. We should use Next.js's native ImageResponse to generate dynamic OpenGraph images on the fly that display the specific model's name, provider, and key stats.

Expected Behavior

1. OG Image Route: Create an opengraph-image.tsx file inside the src/app/models/[slug]/ directory.
2. Dynamic Data: Fetch the model data based on the slug inside this file.
3. Image Design: Use standard HTML/CSS (supported by satori) to design a visually appealing card containing the ProviderLogo, Model Name, and perhaps a quick stat (like "Context Window: 128k").
4. Metadata Update: Ensure the model page's generateMetadata function correctly points to this new dynamic image.

Constraints

• Rely strictly on the native @vercel/og functionality provided by Next.js 14. Do not install heavy image generation libraries like Puppeteer.

Labels

enhancement, next.js, growth, v2-roadmap

[nitishchaubeyy]

I would like to work on this under Nsoc 26 Kindly assign this to me!
@AditthyaSS

[Shreeya1207]

Hello @AditthyaSS

I have gone through the project and reviewed the issue details. I am interested in working on this issue as part of NSOC and would like to contribute to its implementation.

Kindly assign this issue to me.

Thank you for your consideration.

[github-actions]

Hey @Shreeya1207 — just letting you know this issue has been assigned to @nitishchaubeyy. 🎉

If you're still interested in contributing, keep an eye on it! If @nitishchaubeyy doesn't open a PR within 5 days, the issue will become available again.

In the meantime, check out other open issues that need help. 💪

[anshul23102]

Interested in contributing under NSoC'26. This is a valuable issue. Happy to work on it.

/assign

[github-actions]

Hey @nitishchaubeyy — it's been 5 days since this issue was assigned and we haven't seen a linked PR yet. 🕐

The issue has been unassigned and is now open again.

@Shreeya1207, @anshul23102 — you expressed interest in this issue! It's available to pick up. Comment "I'd like to work on this" and a maintainer will assign it to you. 💪

If you need more time @nitishchaubeyy, feel free to re-comment and request re-assignment.

[nitishchaubeyy]

@AditthyaSS I am still working on this issue and almost done

/assign