diff --git a/app/assets/javascripts/discourse/app/components/uppy-image-uploader.js b/app/assets/javascripts/discourse/app/components/uppy-image-uploader.js
index b1dbd7308f8..5933c4fd9d7 100644
--- a/app/assets/javascripts/discourse/app/components/uppy-image-uploader.js
+++ b/app/assets/javascripts/discourse/app/components/uppy-image-uploader.js
@@ -7,10 +7,22 @@ import { isEmpty } from "@ember/utils";
 import lightbox from "discourse/lib/lightbox";
 import { next } from "@ember/runloop";
 import { htmlSafe } from "@ember/template";
+import { authorizesOneOrMoreExtensions } from "discourse/lib/uploads";
 
 export default Component.extend(UppyUploadMixin, {
   classNames: ["image-uploader"],
-  uploadingOrProcessing: or("uploading", "processing"),
+  disabled: or("notAllowed", "uploading", "processing"),
+
+  @discourseComputed(
+    "currentUser.staff",
+    "siteSettings.{authorized_extensions,authorized_extensions_for_staff}"
+  )
+  notAllowed() {
+    return !authorizesOneOrMoreExtensions(
+      this.currentUser?.staff,
+      this.siteSettings
+    );
+  },
 
   @discourseComputed("imageUrl", "placeholderUrl")
   showingPlaceholder(imageUrl, placeholderUrl) {
diff --git a/app/assets/javascripts/discourse/app/lib/uploads.js b/app/assets/javascripts/discourse/app/lib/uploads.js
index 1ea697dcc17..95dbeba100b 100644
--- a/app/assets/javascripts/discourse/app/lib/uploads.js
+++ b/app/assets/javascripts/discourse/app/lib/uploads.js
@@ -64,6 +64,7 @@ export function validateUploadedFile(file, opts) {
   let staff = user && user.staff;
 
   if (!authorizesOneOrMoreExtensions(staff, opts.siteSettings)) {
+    dialog.alert(I18n.t("post.errors.no_uploads_authorized"));
     return false;
   }
 
diff --git a/app/assets/javascripts/discourse/app/templates/components/uppy-image-uploader.hbs b/app/assets/javascripts/discourse/app/templates/components/uppy-image-uploader.hbs
index 7fe9d0626ab..a7473cfc7ee 100644
--- a/app/assets/javascripts/discourse/app/templates/components/uppy-image-uploader.hbs
+++ b/app/assets/javascripts/discourse/app/templates/components/uppy-image-uploader.hbs
@@ -3,9 +3,9 @@
     <div class="placeholder-overlay" style={{this.placeholderStyle}}></div>
   {{/if}}
   <div class="image-upload-controls">
-    <label class="btn btn-default pad-left no-text {{if this.uploadingOrProcessing "disabled"}}">
+    <label class="btn btn-default pad-left no-text {{if this.disabled "disabled"}}">
       {{d-icon "far-image"}}
-      <PickFilesButton @fileInputDisabled={{this.uploadingOrProcessing}} @fileInputClass="hidden-upload-field" @acceptedFormatsOverride="image/*" />
+      <PickFilesButton @fileInputDisabled={{this.disabled}} @fileInputClass="hidden-upload-field" @acceptedFormatsOverride="image/*" />
     </label>
 
     {{#if this.imageUrl}}
diff --git a/app/assets/javascripts/discourse/tests/unit/lib/uploads-test.js b/app/assets/javascripts/discourse/tests/unit/lib/uploads-test.js
index dcadb831f1f..c6d632748a3 100644
--- a/app/assets/javascripts/discourse/tests/unit/lib/uploads-test.js
+++ b/app/assets/javascripts/discourse/tests/unit/lib/uploads-test.js
@@ -138,6 +138,38 @@ discourseModule("Unit | Utility | uploads", function () {
     );
   });
 
+  test("shows error message when no extensions are authorized", function (assert) {
+    this.siteSettings.authorized_extensions = "";
+    this.siteSettings.authorized_extensions_for_staff = "";
+
+    sinon.stub(dialog, "alert");
+    assert.notOk(
+      validateUploadedFiles([{ name: "test.jpg" }], {
+        user: User.create(),
+        siteSettings: this.siteSettings,
+      })
+    );
+    assert.ok(
+      dialog.alert.calledWith(I18n.t("post.errors.no_uploads_authorized"))
+    );
+  });
+
+  test("shows error message when no extensions are authorized for staff", function (assert) {
+    this.siteSettings.authorized_extensions = "";
+    this.siteSettings.authorized_extensions_for_staff = "";
+
+    sinon.stub(dialog, "alert");
+    assert.notOk(
+      validateUploadedFiles([{ name: "test.jpg" }], {
+        user: User.create({ staff: true }),
+        siteSettings: this.siteSettings,
+      })
+    );
+    assert.ok(
+      dialog.alert.calledWith(I18n.t("post.errors.no_uploads_authorized"))
+    );
+  });
+
   test("staff can upload anything in PM", function (assert) {
     const files = [{ name: "some.docx" }];
     this.siteSettings.authorized_extensions = "jpeg";
diff --git a/config/locales/client.en.yml b/config/locales/client.en.yml
index 4f25893a41f..358d4d18d8c 100644
--- a/config/locales/client.en.yml
+++ b/config/locales/client.en.yml
@@ -3286,6 +3286,7 @@ en:
           one: "Sorry, you can only upload %{count} file at a time."
           other: "Sorry, you can only upload %{count} files at a time."
         upload_not_authorized: "Sorry, the file you are trying to upload is not authorized (authorized extensions: %{authorized_extensions})."
+        no_uploads_authorized: "Sorry, no files are authorized to be uploaded."
         image_upload_not_allowed_for_new_user: "Sorry, new users can not upload images."
         attachment_upload_not_allowed_for_new_user: "Sorry, new users can not upload attachments."
         attachment_download_requires_login: "Sorry, you need to be logged in to download attachments."