feat(reddit): add support for multi-image gallery posts

- Allow scheduling Reddit posts with 2-20 images (posted as gallery)
- Update uploadFileToReddit() to capture asset IDs for gallery items
- Implement gallery branch with fallback to single image
- Add 1 second delay between asset uploads (respects 1 req/sec limit)
- Update frontend validation to allow multiple images
- Add defensive WebSocket guard for missing URLs
- Preserve existing single-image and video post behavior

Fixes limitation where Reddit posts could only be scheduled with a single media item.

Author: MichaelYochpaz

apps/frontend/src/components/new-launch/providers/reddit/reddit.provider.tsx

@@ -215,21 +215,44 @@ export default withProvider({
   CustomPreviewComponent: undefined,
   dto: RedditSettingsDto,
   checkValidity: async (posts, settings: any) => {
-    if (
-      settings?.subreddit?.some(
-        (p: any, index: number) =>
-          p?.value?.type === 'media' && posts[0].length !== 1
-      )
-    ) {
-      return 'When posting a media post, you must attached exactly one media file.';
-    }
+    // Check if type is media in any subreddit setting
+    const hasMediaType = settings?.subreddit?.some(
+      (p: any) => p?.value?.type === 'media'
+    );
 
-    if (
-      posts.some((p) =>
-        p.some((a) => !a.thumbnail && a.path.indexOf('mp4') > -1)
-      )
-    ) {
-      return 'You must attach a thumbnail to your video post.';
+    if (hasMediaType && posts[0]) {
+      const firstPost = posts[0];
+      
+      // Detect video and image media
+      const hasVideo = firstPost.some((m: any) => m.path.indexOf('mp4') > -1);
+      const hasImage = firstPost.some((m: any) => m.path.indexOf('mp4') === -1);
+      
+      // Disallow mixed media (video + images)
+      if (hasVideo && hasImage) {
+        return 'You cannot mix videos and images in a Reddit post. Please use either a video or images, not both.';
+      }
+      
+      // Video validation
+      if (hasVideo) {
+        if (firstPost.length !== 1) {
+          return 'When posting a video, you must attach exactly one media file.';
+        }
+        
+        // Check for thumbnail
+        const videoMedia = firstPost.find((m: any) => m.path.indexOf('mp4') > -1);
+        if (!videoMedia?.thumbnail) {
+          return 'You must attach a thumbnail to your video post.';
+        }
+      } else {
+        // Image validation (no video)
+        if (firstPost.length === 0) {
+          return 'When posting a media post, you must attach at least one image.';
+        }
+        
+        if (firstPost.length > 20) {
+          return 'Reddit allows a maximum of 20 images per post.';
+        }
+      }
     }
 
     return true;

libraries/nestjs-libraries/src/integrations/social/reddit.provider.ts

@@ -123,15 +123,13 @@ export class RedditProvider extends SocialAbstract implements SocialProvider {
     };
   }
 
-  private async uploadFileToReddit(accessToken: string, path: string) {
+  private async uploadFileToReddit(accessToken: string, path: string): Promise<{ url: string; assetId?: string }> {
     const mimeType = lookup(path);
     const formData = new FormData();
     formData.append('filepath', path.split('/').pop());
     formData.append('mimetype', mimeType || 'application/octet-stream');
 
-    const {
-      args: { action, fields },
-    } = await (
+    const responseData = await (
       await this.fetch(
         'https://oauth.reddit.com/api/media/asset',
         {
@@ -147,6 +145,11 @@ export class RedditProvider extends SocialAbstract implements SocialProvider {
       )
     ).json();
 
+    const {
+      args: { action, fields },
+      asset,
+    } = responseData;
+
     const { data } = await axios.get(path, {
       responseType: 'arraybuffer',
     });
@@ -169,7 +172,12 @@ export class RedditProvider extends SocialAbstract implements SocialProvider {
       body: upload,
     });
 
-    return [...(await d.text()).matchAll(/<Location>(.*?)<\/Location>/g)][0][1];
+    const url = [...(await d.text()).matchAll(/<Location>(.*?)<\/Location>/g)][0][1];
+    
+    // Extract asset_id from the asset object if available
+    const assetId = asset?.asset_id || asset?.id;
+
+    return { url, assetId };
   }
 
   async post(
@@ -181,53 +189,165 @@ export class RedditProvider extends SocialAbstract implements SocialProvider {
 
     const valueArray: PostResponse[] = [];
     for (const firstPostSettings of post.settings.subreddit) {
-      const postData = {
+      // Detect media type
+      const hasVideo = post.media?.some((m) => m.path.indexOf('mp4') > -1) === true;
+      const images = (post.media || []).filter((m) => m.path.indexOf('mp4') === -1);
+
+      // Determine kind based on media type
+      let kind: string = firstPostSettings.value.type;
+      if (firstPostSettings.value.type === 'media') {
+        if (hasVideo) {
+          kind = 'video';
+        } else if (images.length > 1) {
+          kind = 'gallery';
+        } else {
+          kind = 'image';
+        }
+      }
+
+      // Build postData
+      let postData: any = {
         api_type: 'json',
         title: firstPostSettings.value.title || '',
-        kind:
-          firstPostSettings.value.type === 'media'
-            ? post.media[0].path.indexOf('mp4') > -1
-              ? 'video'
-              : 'image'
-            : firstPostSettings.value.type,
+        kind,
+        text: post.message,
+        sr: firstPostSettings.value.subreddit,
         ...(firstPostSettings.value.flair
           ? { flair_id: firstPostSettings.value.flair.id }
           : {}),
-        ...(firstPostSettings.value.type === 'link'
-          ? {
-              url: firstPostSettings.value.url,
-            }
-          : {}),
-        ...(firstPostSettings.value.type === 'media'
-          ? {
-              url: await this.uploadFileToReddit(
-                accessToken,
-                post.media[0].path
-              ),
-              ...(post.media[0].path.indexOf('mp4') > -1
-                ? {
-                    video_poster_url: await this.uploadFileToReddit(
-                      accessToken,
-                      post.media[0].thumbnail
-                    ),
-                  }
-                : {}),
-            }
-          : {}),
-        text: post.message,
-        sr: firstPostSettings.value.subreddit,
       };
 
-      const all = await (
-        await this.fetch('https://oauth.reddit.com/api/submit', {
-          method: 'POST',
-          headers: {
-            Authorization: `Bearer ${accessToken}`,
-            'Content-Type': 'application/x-www-form-urlencoded',
-          },
-          body: new URLSearchParams(postData),
-        })
-      ).json();
+      // Add type-specific fields
+      if (firstPostSettings.value.type === 'link') {
+        postData.url = firstPostSettings.value.url;
+      } else if (firstPostSettings.value.type === 'media') {
+        if (kind === 'gallery') {
+          // Gallery: upload all images and build items array
+          const uploads: { url: string; assetId?: string }[] = [];
+          for (let i = 0; i < images.length; i++) {
+            const uploaded = await this.uploadFileToReddit(accessToken, images[i].path);
+            uploads.push(uploaded);
+            
+            // Add delay between Reddit API calls to respect rate limit (1 req/sec)
+            if (i < images.length - 1) {
+              await timer(1000);
+            }
+          }
+          
+          // Build items array with media_ids
+          const items = uploads
+            .filter((u) => u.assetId)
+            .map((u) => ({ media_id: u.assetId }));
+          
+          // Reddit requires at least 2 items for a gallery
+          if (items.length >= 2) {
+            postData.items = JSON.stringify(items);
+          } else {
+            // Fallback: if less than 2 asset IDs, use first image as single image
+            console.warn(`Reddit gallery: only ${items.length} valid asset ID(s), falling back to single image`);
+            kind = 'image';
+            postData.kind = 'image';
+            postData.url = uploads[0].url;
+          }
+        } else if (kind === 'video') {
+          // Video: upload video and thumbnail
+          const videoUpload = await this.uploadFileToReddit(accessToken, post.media[0].path);
+          postData.url = videoUpload.url;
+          
+          if (post.media[0].thumbnail) {
+            const thumbnailUpload = await this.uploadFileToReddit(accessToken, post.media[0].thumbnail);
+            postData.video_poster_url = thumbnailUpload.url;
+          }
+        } else {
+          // Single image
+          const imageUpload = await this.uploadFileToReddit(accessToken, post.media[0].path);
+          postData.url = imageUpload.url;
+        }
+      }
+
+      // Try to submit, with fallback for gallery
+      let all: any;
+      try {
+        all = await (
+          await this.fetch('https://oauth.reddit.com/api/submit', {
+            method: 'POST',
+            headers: {
+              Authorization: `Bearer ${accessToken}`,
+              'Content-Type': 'application/x-www-form-urlencoded',
+            },
+            body: new URLSearchParams(postData),
+          })
+        ).json();
+
+        // Check for gallery-specific errors and fallback to single image
+        if (
+          kind === 'gallery' &&
+          all?.json?.errors?.length > 0 &&
+          (all.json.errors.some((e: any) =>
+            e[0] === 'INVALID_OPTION' ||
+            e[0] === 'BAD_GALLERY' ||
+            (typeof e[1] === 'string' && e[1].toLowerCase().includes('gallery'))
+          ))
+        ) {
+          console.warn('Reddit gallery not supported in this subreddit, falling back to single image');
+          
+          // Fallback: post as single image using first image
+          const firstImageUpload = await this.uploadFileToReddit(accessToken, images[0].path);
+          postData = {
+            api_type: 'json',
+            title: firstPostSettings.value.title || '',
+            kind: 'image',
+            url: firstImageUpload.url,
+            text: post.message,
+            sr: firstPostSettings.value.subreddit,
+            ...(firstPostSettings.value.flair
+              ? { flair_id: firstPostSettings.value.flair.id }
+              : {}),
+          };
+
+          all = await (
+            await this.fetch('https://oauth.reddit.com/api/submit', {
+              method: 'POST',
+              headers: {
+                Authorization: `Bearer ${accessToken}`,
+                'Content-Type': 'application/x-www-form-urlencoded',
+              },
+              body: new URLSearchParams(postData),
+            })
+          ).json();
+        }
+      } catch (err) {
+        // If any error occurs during gallery submission, fallback to single image
+        if (kind === 'gallery' && images.length > 0) {
+          console.warn('Reddit gallery submission failed, falling back to single image:', err);
+          
+          const firstImageUpload = await this.uploadFileToReddit(accessToken, images[0].path);
+          postData = {
+            api_type: 'json',
+            title: firstPostSettings.value.title || '',
+            kind: 'image',
+            url: firstImageUpload.url,
+            text: post.message,
+            sr: firstPostSettings.value.subreddit,
+            ...(firstPostSettings.value.flair
+              ? { flair_id: firstPostSettings.value.flair.id }
+              : {}),
+          };
+
+          all = await (
+            await this.fetch('https://oauth.reddit.com/api/submit', {
+              method: 'POST',
+              headers: {
+                Authorization: `Bearer ${accessToken}`,
+                'Content-Type': 'application/x-www-form-urlencoded',
+              },
+              body: new URLSearchParams(postData),
+            })
+          ).json();
+        } else {
+          throw err;
+        }
+      }
 
       const { id, name, url } = await new Promise<{
         id: string;
@@ -238,6 +358,12 @@ export class RedditProvider extends SocialAbstract implements SocialProvider {
           res(all.json.data);
         }
 
+        // Guard against missing websocket_url
+        if (!all?.json?.data?.websocket_url) {
+          res({ id: '', name: '', url: '' });
+          return;
+        }
+
         const ws = new WebSocket(all.json.data.websocket_url);
         ws.on('message', (data: any) => {
           setTimeout(() => {