From 43796d3c416c79dbf05f2840bda438e98e858062 Mon Sep 17 00:00:00 2001
From: Kuba Suder <jakub.suder@gmail.com>
Date: Tue, 16 Jun 2026 01:10:41 +0200
Subject: [PATCH] added support for new gallery embed

---
 src/components/embeds/EmbedComponent.svelte  |  6 +--
 src/components/embeds/ImagesComponent.svelte |  4 +-
 src/models/embeds.js                         | 49 ++++++++++++++++++++
 3 files changed, 54 insertions(+), 5 deletions(-)

diff --git a/src/components/embeds/EmbedComponent.svelte b/src/components/embeds/EmbedComponent.svelte
index fa5d44a..d3698dd 100644
--- a/src/components/embeds/EmbedComponent.svelte
+++ b/src/components/embeds/EmbedComponent.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
   import {
-    Embed, RawRecordEmbed, RawRecordWithMediaEmbed, RawImageEmbed, RawLinkEmbed, RawVideoEmbed,
-    InlineRecordEmbed, InlineRecordWithMediaEmbed, InlineImageEmbed, InlineLinkEmbed, InlineVideoEmbed
+    Embed, RawRecordEmbed, RawRecordWithMediaEmbed, RawImageEmbed, RawGalleryEmbed, RawLinkEmbed, RawVideoEmbed,
+    InlineRecordEmbed, InlineRecordWithMediaEmbed, InlineImageEmbed, InlineGalleryEmbed, InlineLinkEmbed, InlineVideoEmbed
   } from '../../models/embeds.js';
 
   import EmbedComponent from './EmbedComponent.svelte';
@@ -23,7 +23,7 @@
     <QuoteComponent record={embed.record} />
   </div>
 
-{:else if embed instanceof RawImageEmbed || embed instanceof InlineImageEmbed}
+{:else if embed instanceof RawImageEmbed || embed instanceof InlineImageEmbed || embed instanceof RawGalleryEmbed || embed instanceof InlineGalleryEmbed}
   <ImagesComponent {embed} />
 
 {:else if embed instanceof RawLinkEmbed || embed instanceof InlineLinkEmbed}
diff --git a/src/components/embeds/ImagesComponent.svelte b/src/components/embeds/ImagesComponent.svelte
index 82b1841..71d662f 100644
--- a/src/components/embeds/ImagesComponent.svelte
+++ b/src/components/embeds/ImagesComponent.svelte
@@ -1,8 +1,8 @@
 <script lang="ts">
   import { getPostContext } from '../posts/PostComponent.svelte';
-  import { InlineImageEmbed, RawImageEmbed } from '../../models/embeds';
+  import { InlineGalleryEmbed, InlineImageEmbed, RawGalleryEmbed, RawImageEmbed } from '../../models/embeds';
 
-  let { embed }: { embed: InlineImageEmbed | RawImageEmbed } = $props();
+  let { embed }: { embed: InlineImageEmbed | RawImageEmbed | InlineGalleryEmbed | RawGalleryEmbed } = $props();
   let { post } = getPostContext();
 
   function imageURL(img: json): string {
diff --git a/src/models/embeds.js b/src/models/embeds.js
index 66d3856..c5f9fcb 100644
--- a/src/models/embeds.js
+++ b/src/models/embeds.js
@@ -27,6 +27,9 @@ export class Embed {
     case 'app.bsky.embed.images#view':
       return new InlineImageEmbed(json);
 
+    case 'app.bsky.embed.gallery#view':
+      return new InlineGalleryEmbed(json);
+
     case 'app.bsky.embed.external#view':
       return new InlineLinkEmbed(json);
 
@@ -60,6 +63,9 @@ export class Embed {
     case 'app.bsky.embed.images':
       return new RawImageEmbed(json);
 
+    case 'app.bsky.embed.gallery':
+      return new RawGalleryEmbed(json);
+
     case 'app.bsky.embed.external':
       return new RawLinkEmbed(json);
 
@@ -87,6 +93,22 @@ export class Embed {
   }
 }
 
+/**
+ * @param {json[] | undefined} items
+ * @param {string} imageType
+ * @returns {json[]}
+ */
+function filterGalleryItems(items, imageType) {
+  return (items ?? []).filter(item => {
+    if (item.$type == imageType) {
+      return true;
+    } else {
+      console.error('Unexpected gallery item type:', item.$type);
+      return false;
+    }
+  });
+}
+
 export class RawImageEmbed extends Embed {
 
   /** @type {json[]} */
@@ -99,6 +121,18 @@ export class RawImageEmbed extends Embed {
   }
 }
 
+export class RawGalleryEmbed extends Embed {
+
+  /** @type {json[]} */
+  images;
+
+  /** @param {json} json */
+  constructor(json) {
+    super(json);
+    this.images = filterGalleryItems(json.items, 'app.bsky.embed.gallery#image');
+  }
+}
+
 export class RawLinkEmbed extends Embed {
 
   /** @type {string | undefined} */
@@ -237,6 +271,21 @@ export class InlineImageEmbed extends Embed {
   }
 }
 
+export class InlineGalleryEmbed extends Embed {
+
+  /** @type {json[]} */
+  images;
+
+  /**
+   * app.bsky.embed.gallery#view
+   * @param {json} json
+   */
+  constructor(json) {
+    super(json);
+    this.images = filterGalleryItems(json.items, 'app.bsky.embed.gallery#viewImage');
+  }
+}
+
 export class InlineVideoEmbed extends Embed {
 
   /** @type {string | undefined} */
-- 
2.51.2