[BUG][🕹️] Dynamic Link Preview broken incl. shortened links

[jobenjada]

Issue Summary

This issue has two elements:

1. The Dynamic Link Preview does not work anymore:

// solved

2. The Link Preview does not (and maybe never did) work for Shortened URLs.

In Formbricks, you can shorten URLs via the top right menu:

The shortened links do not have a preview:

Please fix it :)

Steps to Reproduce

1. Create a link survey
2. Share URL in any service which creates link previews
3. Shorten URL and try again

Expected behavior

Same dynamic link preview for both

Other information

No response

Screenshots

No response

Environment

• [ ] Formbricks Cloud (app.formbricks.com)
• [ ] Self-hosted Formbricks

Desktop (please complete the following information)

- OS:
- Node:
- npm:

[adityadeshlahre]

i would like to give it a try :smiley: !

[Dhruwang]

Sure, go for it @adityadeshlahre 😊🚀

[adityadeshlahre]

Seems like

1 Dynamic Link Preview works fine

2 Shortened URLs Link Previews are dead

on the way to fix :smiley:

[jobenjada]

@adityadeshlahre any updates? :)

[adityadeshlahre]

Hey @jobenjada @Dhruwang really sorry for late replay i am still trying to fix the bug !

I got to know which component is responsable for image generation [file] but stuck on how the file is getting called at time of publishing New Survey

For now preview image generation is only happening for main /s/[surveyId] link only and not for the short URL /[shortUrlId] link. [maybe be VERCEL og-image-generation doesn't work for shortURL because lack of Metadata/Props](might am wrong here)

on shorting [main URL] from different URL shorting service its PREVIEW-IMAGE working fine.

need more lights on the bug !

[jobenjada]

hmm @mattinannt maybe you have an idea?

// can confirm the normal preview generation works :)

[mattinannt]

@adityadeshlahre Yes, this is the right endpoint for generating the image :-) The image from the og endpoint is used in the generateMetadata function of the /s/[surveyId] page: https://github.com/formbricks/formbricks/blob/be4534da2d8d7bd197a40a87fc9d32ed2bf06fac/apps/web/app/s/%5BsurveyId%5D/page.tsx#L63

So one thing you could try is to also add a generateMetadata function to apps/web/app/[shortUrlId]/page.tsx.

But this may lead to duplicated code and issues since we also need to query all the data in the shortUrl redirect. There might be a better option where we can reference the content of the redirected page in the meta data so we tell the preview loaders where to look for the meta data. See this stackOverflow thread for an example: https://stackoverflow.com/questions/54160345/how-to-make-open-graph-links-work-with-301-redirects

[jobenjada]

@adityadeshlahre will you pick this up again? :)

[adityadeshlahre]

Hey @jobenjada sorry for not responding for way long !

would like get this issue unassigned for now .

I think i will take back seat and learn from the changes if anyone contributes on this issue :slightly_smiling_face:

Thank You

[mattinannt]

@adityadeshlahre No worries, thanks for trying to solve it 😊💪

[KapadiaNaitik]

/assign