The debug logs show the exact error: NotAllowedError: The request is not allowed by the user agent or the platform in the current context, possibly because the user denied permission. -- the navigator.clipboard.write() API for binary image data requires the call to originate from a direct user gesture (synchronous click handler). The current code await fetch() then await clipboard.write() breaks the user gesture chain because the async fetch happens in between.

The fix: use the ClipboardItem constructor with a Promise<Blob> (supported in modern browsers) so the clipboard write starts immediately in the click handler while the fetch resolves in the background.

The clipboard copy was failing because navigator.clipboard.write() with binary image data requires the call to happen synchronously within a user gesture (click). The old code broke that chain by await fetch() first. The fix passes a Promise<Blob> directly to ClipboardItem -- this lets clipboard.write() be called immediately in the click handler while the image fetch resolves asynchronously in the background. This is the standard pattern for clipboard image writes.

Yes, this already works. The generateMetadata function reads searchParams and builds the OG image URL dynamically from them. So when someone visits:

The server generates OG meta tags with an /api/og?username=@whale_king&rewarded=$5,000&depositsFound=$20M image URL. Every unique combination of params produces a unique OG image.

You can test it right now by opening this in a browser:

That will render the PNG directly. And social platforms (Twitter, Discord, Slack) will pick up the OG tags automatically when someone shares a URL with those params. The "Share link" button in the sidebar already builds and copies a URL with all current card params baked in.