# SvelteKit Tweet

[![ sveltekit-tweet Installation](https://nodei.co/npm/sveltekit-tweet.png?downloads=true&downloadRank=true&stars=true)](https://www.npmjs.com/package/sveltekit-tweet)

The best way to embed tweets in your SvelteKit app, supporting both SSR and static prerendering modes.

- The tweet is loaded in the server-side.
- No need for any additonal client-side scripts.
- No need for any loading UI, the tweet is available immediately.
- Supports both SSR and prerendering.

> This package is a sveltekit version of [vercel/react-tweet](https://github.com/vercel/react-tweet) licensed under MIT License, many thanks to the original authors for making it possible!

## Installation

```bash
npm install sveltekit-tweet
```

## Usage

1.  Go to the tweet you want to embed. You will find the URL i
2.  Use the `getTweet` function in your `+page.server.ts` file to fetch the tweet data.

    ```ts
    import { getTweet } from 'sveltekit-tweet/server';

    export const load = async () => {
    	try {
    		const tweet = await getTweet('1694201062717034868');

    		return {
    			tweet
    		};
    	} catch (error) {
    		return {
    			status: 500,
    			error: 'Could not load tweet'
    		};
    	}
    };
    ```

3.  Use the `Tweet` component in your `+page.svelte` file to render the tweet.

    ```svelte
    <script lang="ts">
    	import Tweet from 'sveltekit-tweet/server';
    	import type { PageData } from './$types';

    	let { data }: {
			data: PageData;
		} = $props();
    </script>

    {#if data.tweet}
    	<Tweet tweet={data.tweet} />
    {:else if data.error}
    	<p>{data.error}</p>
    {/if}
    ```

## TODOs

- [ ] Add tests.
- [ ] Drop external dependencies.
- [ ] Add support for Quoted Tweets.
- [ ] Add TweetNotFound component.
- [X] Add easy way for mdsvex integration.