More display options for tweets?

[Kay]

It's real great what we've got here. However I must say that I was disappointed when there was no way to change what parts of the tweet are displayed. Now, I'm not asking for like, custom layouts or rendering of the tweet, but according to the official oEmbed API spec from Twitt- 𝕏, there are a few options for the returned data.

I think this project, in addition to displaying tweets, should allow us to choose what parts of the tweet to display. Let's start basic. Why can't we hide media/cards/images? Why not the conversation thread or the quoted tweet?

There's two things that I think can be done here, from what I understand just by looking at the code. Disclaimer: I haven't actually ran the project myself to test some things since I don't have enough time right now, but I would be open to writing a pull request that implements the following later.

1. Add options (in the form of more props for the Tweet component) that passes them on to the oEmbed API. ¹

2. Simply don't render the components according to the provided options (again, as props), but still fetch everything from the API.

It's just... kind of annoying that I have to add in a CSS hack to target the elements of the tweet I don't want and vanish them. You don't have to do exactly this, but I am looking forward to some sort of update in order to add these kinds of options.

Happily awaiting feedback,

Kelsey

P.S. I think the documentation is quite lacking in some parts. Although I acknowledge it is hard to write documentation when the project is as conceptually and technically simple as this. Maybe I will write a pull request that revamps the docs...

¹ When I was messing around, trying to get oEmbed work for myself, I 1) saw that the fetch was never getting executed, which I'll chalk up to my own ineptitude because I honestly have no idea where the data is coming from, and 2) when using curl/Postman on the oEmbed API, it seems like it just ignores the options you give it. So I think no. 2 is the only way to go.

[Kay]

If anyone's interested, the CSS would look like the following. In my specific case, I wanted to hide media and quoted tweets, and also the "Follow" button because the tweets displayed were already people being followed.

.react-tweet-theme > article > div[class^="_root_"],
.react-tweet-theme > article > div[class^="_replies_"],
.react-tweet-theme > article > div > div > div > div {
    display: none;
}

I don't think the package should give that fine a control on what to display like the "Follow" button, but I think having the option to hide media and quoted tweets is reasonable.

[Ty Carlson]

I may not fully understand exactly what you're trying to accomplish, but I believe you'd be able to conditionally render any of the pieces of the Tweet by using the exported partial components. It's buried under a vague "Advanced" heading, but the docs show this approach here.

While that certainly may not be as ergonomic as you're looking for, it seems possible to compose a fully custom rendering of the tweet data to include/exclude whatever pieces you want, or choose to not use any of the provided component parts at all and make it completely unique.

[Kay]

Oh you're right about that. I somehow skipped over it in the docs; but yeah that is quite cumbersome to use. Thanks anyways!