WIP

app/assets/javascripts/discourse/app/instance-initializers/auto-grid-images.js

@@ -0,0 +1,30 @@
+import { schedule } from "@ember/runloop";
+import CodeblockButtons from "discourse/lib/codeblock-buttons";
+import { withPluginApi } from "discourse/lib/plugin-api";
+import { next } from "@ember/runloop";
+
+export default {
+  initialize(owner) {
+    withPluginApi("1.37.2", (api) => {
+      api.addComposerUploadMarkdownResolver(async (upload) => {
+        // console.log("upload called");
+        // TODO need alternate solution as uploads are separate and can't check simultaneous uploads...
+      });
+
+      // TODO get full list of supported image types
+      // api.addComposerUploadHandler(["jpg", "jpeg", "png"], (files, editor) => {
+      //   console.log(files, editor, files.length);
+      //   return true;
+      // files.forEach((file) => {
+      //   // TODO seems to be preventing normal upload process despite return true :(
+      //   return true;
+      //   // console.log("Handling upload for", file.name, files, editor);
+      // });
+      // next(() => {
+      //   console.log("next called");
+      //   return true;
+      // });
+      // });
+    });
+  },
+};

app/assets/javascripts/discourse/app/mixins/composer-upload-uppy.js

@@ -14,6 +14,7 @@ import {
   displayErrorForBulkUpload,
   displayErrorForUpload,
   getUploadMarkdown,
+  isImage,
   validateUploadedFile,
 } from "discourse/lib/uploads";
 import UppyChecksum from "discourse/lib/uppy-checksum-plugin";
@@ -202,6 +203,14 @@ export default Mixin.create(ExtendableUploader, UppyS3Multipart, {
           return this._abortAndReset();
         }
 
+        const MIN_AUTO_GRID_IMAGES = 3;
+        const imageFiles = Object.values(unhandledFiles)
+          .map((file) => file.name)
+          .filter((name) => isImage(name));
+
+        if (imageFiles?.length >= MIN_AUTO_GRID_IMAGES) {
+          // todo add grid code or call fnc.
+        }
         // uppy uses this new object to track progress of remaining files
         return unhandledFiles;
       },
@@ -318,18 +327,52 @@ export default Mixin.create(ExtendableUploader, UppyS3Multipart, {
       });
     });
 
+    const imageUploadExtensions = ["jpg", "jpeg", "png", "gif", "heic"]; // todo get better list (see lib/uploads?)
+    const uploadMarkdowns = [];
+    let imageUploadCount = 0;
+
     this._uppyInstance.on("upload-success", (file, response) => {
       run(async () => {
         if (!this._uppyInstance) {
           return;
         }
+        console.log(
+          "f",
+          file,
+          "r",
+          response,
+          this,
+          this.inProgressUploads.length
+        );
+
         this._removeInProgressUpload(file.id);
         let upload = response.body;
+
         const markdown = await this.uploadMarkdownResolvers.reduce(
           (md, resolver) => resolver(upload) || md,
           getUploadMarkdown(upload)
         );
 
+        if (imageUploadExtensions.includes(file.extension)) {
+          imageUploadCount++;
+          uploadMarkdowns.push(markdown);
+          console.log("imageUploadCount", imageUploadCount, uploadMarkdowns);
+
+          if (imageUploadCount >= 3) {
+            const gridMarkdown = `\n[grid]\n${uploadMarkdowns.join(
+              "\n"
+            )}\n[/grid]\n`;
+
+            this.appEvents.trigger(
+              `${this.composerEventPrefix}:insert-text`,
+              gridMarkdown
+            );
+
+            imageUploadCount = 0;
+            uploadMarkdowns.splice(0, uploadMarkdowns.length);
+          }
+        }
+
         cacheShortUploadUrl(upload.short_url, upload);
 
         new ComposerVideoThumbnailUppy(getOwner(this)).generateVideoThumbnail(