Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

add embed widget support, tee up support for oembed/opengraph embeds #4448

Open
wants to merge 11 commits into
base: develop
Choose a base branch
from

Conversation

patosullivan
Copy link
Member

@patosullivan patosullivan commented Feb 20, 2025

fixes tlon-2318

This adds a new EmbedContent component that can render either a "GenericEmbed" (data loaded from oembed or opengraph) or embed widgets from trusted providers (just Twitter, Tiktok, Youtube, and Spotify for now).

For now, this hooks into InlineRenderer via the InlineLink component. If we have a link that matches one of our supported providers, we'll render the embed. Note that this does mean that we don't know the heights in advance and so the scroller will jump a bit, but it doesn't seem to cause notable issues with scrolling to a post.

On mobile, the widgets are rendered in a WebView. We post message events from the WebView back to the parent component to update the WebView height (or to know when the embed is fully loaded, in the case of the twitter embed where it will briefly load the unstyled tweet text).

On web, we load the iframe.

In galleries, the preview in the index is just the link (full embed will be displayed in the detail view).

I also updated the AudioEmbed and AudioPlayer components to look/work like a normal audio player (and look identical on either web or mobile) and to show whenever we have a link to an audio file, but we can take that out if it's unnecessary (we'd just remove the isAudio stuff from EmbedContent).

Copy link

linear bot commented Feb 20, 2025

Copy link
Member

@arthyn arthyn left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

lgtm I'm seeing some oddities, for example scrolling over embeds in desktop is inverted and if you happen to be scrolling over the embed your scroll will all of a sudden reverse. we may have to do the double inversion trick for these embeds.

additionally these seem to disappear every time a re-render happens even if they're fully rendered already, perhaps the embedHtml value is flapping?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants