DEV: Update images-uploader uppy usage (#29341)

Also moves this component to the admin bundle. It is only used in the admin panel, and has dependencies on admin-specific i18n strings.

app/assets/javascripts/admin/addon/components/images-uploader.hbs

@@ -5,13 +5,15 @@
 >
   {{d-icon "far-image"}} {{this.uploadButtonText}}
   <input
+    {{did-insert this.uppyUpload.setup}}
     class="hidden-upload-field"
-    disabled={{this.uploading}}
+    disabled={{this.uppyUpload.uploading}}
     type="file"
     accept="image/*"
     multiple
   />
 </label>
 {{#if this.uploadingOrProcessing}}
-  <span>{{i18n "upload_selector.uploading"}} {{this.uploadProgress}}%</span>
+  <span>{{i18n "upload_selector.uploading"}}
+    {{this.uppyUpload.uploadProgress}}%</span>
 {{/if}}

app/assets/javascripts/admin/addon/components/images-uploader.js

@@ -0,0 +1,27 @@
+import Component from "@ember/component";
+import { getOwner } from "@ember/owner";
+import { tagName } from "@ember-decorators/component";
+import UppyUpload from "discourse/lib/uppy/uppy-upload";
+import I18n from "discourse-i18n";
+
+@tagName("span")
+export default class ImagesUploader extends Component {
+  uppyUpload = new UppyUpload(getOwner(this), {
+    id: "images-uploader",
+    type: "avatar",
+    validateUploadedFilesOptions: {
+      imagesOnly: true,
+    },
+    uploadDone: (upload) => {
+      this.done(upload);
+    },
+  });
+
+  get uploadingOrProcessing() {
+    return this.uppyUpload.uploading || this.uppyUpload.processing;
+  }
+
+  get uploadButtonText() {
+    return this.uploadingOrProcessing ? I18n.t("uploading") : I18n.t("upload");
+  }
+}

app/assets/javascripts/discourse/app/components/images-uploader.js

@@ -1,23 +0,0 @@
-import Component from "@ember/component";
-import { tagName } from "@ember-decorators/component";
-import UppyUploadMixin from "discourse/mixins/uppy-upload";
-import discourseComputed from "discourse-common/utils/decorators";
-import I18n from "discourse-i18n";
-
-@tagName("span")
-export default class ImagesUploader extends Component.extend(UppyUploadMixin) {
-  type = "avatar";
-
-  @discourseComputed("uploadingOrProcessing")
-  uploadButtonText(uploadingOrProcessing) {
-    return uploadingOrProcessing ? I18n.t("uploading") : I18n.t("upload");
-  }
-
-  validateUploadedFilesOptions() {
-    return { imagesOnly: true };
-  }
-
-  uploadDone(upload) {
-    this.done(upload);
-  }
-}