···

       
1
       
1
       
 
       
<script lang="ts">

     

       
2
       
2
       
 
       
	import { type AtpClient } from '$lib/at/client';

     

       
3
       
3
       
-
       
	import { AppBskyFeedPost } from '@atcute/bluesky';

     

       
3
       
3
       
+
       
	import {

     

       
4
       
4
       
+
       
		AppBskyEmbedExternal,

     

       
5
       
5
       
+
       
		AppBskyEmbedImages,

     

       
6
       
6
       
+
       
		AppBskyEmbedVideo,

     

       
7
       
7
       
+
       
		AppBskyFeedPost

     

       
8
       
8
       
+
       
	} from '@atcute/bluesky';

     

       
4
       
9
       
 
       
	import {

     

       
5
       
10
       
 
       
		parseCanonicalResourceUri,

     

       
6
       
11
       
 
       
		type ActorIdentifier,

     
···

       
299
       
304
       
 
       
				{#if !isOnPostComposer && record.embed}

     

       
300
       
305
       
 
       
					{@const embed = record.embed}

     

       
301
       
306
       
 
       
					<div class="mt-2">

     

       
307
       
307
       
+
       
						{#snippet embedMedia(

     

       
308
       
308
       
+
       
							embed: AppBskyEmbedImages.Main | AppBskyEmbedVideo.Main | AppBskyEmbedExternal.Main

     

       
309
       
309
       
+
       
						)}

     

       
310
       
310
       
+
       
							{#if embed.$type === 'app.bsky.embed.images'}

     

       
311
       
311
       
+
       
								<!-- todo: improve how images are displayed, and pop out on click -->

     

       
312
       
312
       
+
       
								{#each embed.images as image (image.image)}

     

       
313
       
313
       
+
       
									{#if isBlob(image.image)}

     

       
314
       
314
       
+
       
										<img

     

       
315
       
315
       
+
       
											class="rounded-sm"

     

       
316
       
316
       
+
       
											src={img('feed_thumbnail', did, image.image.ref.$link)}

     

       
317
       
317
       
+
       
											alt={image.alt}

     

       
318
       
318
       
+
       
										/>

     

       
319
       
319
       
+
       
									{/if}

     

       
320
       
320
       
+
       
								{/each}

     

       
321
       
321
       
+
       
							{:else if embed.$type === 'app.bsky.embed.video'}

     

       
322
       
322
       
+
       
								{#if isBlob(embed.video)}

     

       
323
       
323
       
+
       
									{#await didDoc then didDoc}

     

       
324
       
324
       
+
       
										{#if didDoc.ok}

     

       
325
       
325
       
+
       
											<!-- svelte-ignore a11y_media_has_caption -->

     

       
326
       
326
       
+
       
											<video

     

       
327
       
327
       
+
       
												class="rounded-sm"

     

       
328
       
328
       
+
       
												src={blob(didDoc.value.pds, did, embed.video.ref.$link)}

     

       
329
       
329
       
+
       
												controls

     

       
330
       
330
       
+
       
											></video>

     

       
331
       
331
       
+
       
										{/if}

     

       
332
       
332
       
+
       
									{/await}

     

       
333
       
333
       
+
       
								{/if}

     

       
334
       
334
       
+
       
							{/if}

     

       
335
       
335
       
+
       
						{/snippet}

     

       
302
       
336
       
 
       
						{#snippet embedPost(uri: ResourceUri)}

     

       
303
       
337
       
 
       
							{#if quoteDepth < 2}

     

       
304
       
338
       
 
       
								{@const parsedUri = expect(parseCanonicalResourceUri(uri))}

     
···

       
320
       
354
       
 
       
								{@render embedBadge(record)}

     

       
321
       
355
       
 
       
							{/if}

     

       
322
       
356
       
 
       
						{/snippet}

     

       
323
       
323
       
-
       
						{#if embed.$type === 'app.bsky.embed.images'}

     

       
324
       
324
       
-
       
							<!-- todo: improve how images are displayed, and pop out on click -->

     

       
325
       
325
       
-
       
							{#each embed.images as image (image.image)}

     

       
326
       
326
       
-
       
								{#if isBlob(image.image)}

     

       
327
       
327
       
-
       
									<img

     

       
328
       
328
       
-
       
										class="rounded-sm"

     

       
329
       
329
       
-
       
										src={img('feed_thumbnail', did, image.image.ref.$link)}

     

       
330
       
330
       
-
       
										alt={image.alt}

     

       
331
       
331
       
-
       
									/>

     

       
332
       
332
       
-
       
								{/if}

     

       
333
       
333
       
-
       
							{/each}

     

       
334
       
334
       
-
       
						{:else if embed.$type === 'app.bsky.embed.video'}

     

       
335
       
335
       
-
       
							{#if isBlob(embed.video)}

     

       
336
       
336
       
-
       
								{#await didDoc then didDoc}

     

       
337
       
337
       
-
       
									{#if didDoc.ok}

     

       
338
       
338
       
-
       
										<!-- svelte-ignore a11y_media_has_caption -->

     

       
339
       
339
       
-
       
										<video

     

       
340
       
340
       
-
       
											class="rounded-sm"

     

       
341
       
341
       
-
       
											src={blob(didDoc.value.pds, did, embed.video.ref.$link)}

     

       
342
       
342
       
-
       
											controls

     

       
343
       
343
       
-
       
										></video>

     

       
344
       
344
       
-
       
									{/if}

     

       
345
       
345
       
-
       
								{/await}

     

       
346
       
346
       
-
       
							{/if}

     

       
357
       
357
       
+
       
						{#if embed.$type === 'app.bsky.embed.images' || embed.$type === 'app.bsky.embed.video'}

     

       
358
       
358
       
+
       
							{@render embedMedia(embed)}

     

       
347
       
359
       
 
       
						{:else if embed.$type === 'app.bsky.embed.record'}

     

       
348
       
360
       
 
       
							{@render embedPost(embed.record.uri)}

     

       
349
       
361
       
 
       
						{:else if embed.$type === 'app.bsky.embed.recordWithMedia'}

     

       
350
       
350
       
-
       
							{@render embedPost(embed.record.record.uri)}

     

       
362
       
362
       
+
       
							<div class="space-y-1.5">

     

       
363
       
363
       
+
       
								{@render embedPost(embed.record.record.uri)}

     

       
364
       
364
       
+
       
								{@render embedMedia(embed.media)}

     

       
365
       
365
       
+
       
							</div>

     

       
351
       
366
       
 
       
						{/if}

     

       
352
       
367
       
 
       
						<!-- todo: implement external link embeds -->

     

       
353
       
368
       
 
       
					</div>