API Reference

This is the reference for the utility functions that react-tweet provides for building your own tweet components or simply fetching a tweet. Navigate to the docs for the Twitter theme if you want to render the existing Tweet components instead.

`getTweet`


import { getTweet, type Tweet } from 'react-tweet/api'
 
function getTweet(
  id: string,
  fetchOptions?: RequestInit,
): Promise<Tweet | undefined>

Fetches and returns a Tweet. It accepts the following params:

id - string: the tweet ID. For example in https://twitter.com/reactiive_/status/2040511285998313827 the tweet ID is 2040511285998313827.
fetchOptions - RequestInit (Optional): options to pass to fetch.

If a tweet is not found it returns undefined.

`fetchTweet`


function fetchTweet(
  id: string,
  fetchOptions?: RequestInit,
): Promise<{
  data?: Tweet | undefined
  tombstone?: true | undefined
  notFound?: true | undefined
}>

Fetches and returns a Tweet just like getTweet, but it also returns additional information about the tweet:

data - Tweet (Optional): The tweet data.
tombstone - true (Optional): Indicates if the tweet has been made private.
notFound - true (Optional): Indicates if the tweet was not found.

`enrichTweet`


import { enrichTweet, type EnrichedTweet } from 'react-tweet'
 
const enrichTweet: (tweet: Tweet) => EnrichedTweet

Enriches a Tweet as returned by getTweet with additional data. This is useful to more easily build custom tweet components.

It returns an EnrichedTweet.

`useTweet`

If your app supports React Server Components, use getTweet instead.


import { useTweet } from 'react-tweet'
 
const useTweet: (
  id?: string,
  apiUrl?: string,
  fetchOptions?: RequestInit,
) => {
  isLoading: boolean
  data: Tweet | null | undefined
  error: any
}

SWR hook for fetching a tweet in the browser. It accepts the following parameters:

id - string: the tweet ID. For example in https://twitter.com/reactiive_/status/2040511285998313827 the tweet ID is 2040511285998313827. This parameter is not used if apiUrl is provided.
apiUrl - string: the API URL to fetch the tweet from. Defaults to https://react-tweet.vercel.app/api/tweet/:id.
fetchOptions - RequestInit (Optional): options to pass to fetch. Try to pass down a reference to the same object to avoid unnecessary re-renders.

We highly recommend adding your own API endpoint in apiUrl for production:


const tweet = useTweet(null, id && `/api/tweet/${id}`)

It’s likely you’ll never use this hook directly, and apiUrl is passed as a prop to a component instead:


<Tweet apiUrl={id && `/api/tweet/${id}`} />

Or if the tweet component already knows about the endpoint it needs to use, you can use id instead:


<Tweet id={id} />