From 7e2dd215e486b58099a1a69e8d60bcfd28143850 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 5 May 2026 14:49:49 +0300
Subject: [PATCH] fix user background upload fail + display them

---
 src/App.scss                                    | 13 +++++++++++++
 .../settings_modal/tabs/appearance_tab.js       |  9 ++++++++-
 .../settings_modal/tabs/appearance_tab.vue      | 17 +++++++++++++++++
 3 files changed, 38 insertions(+), 1 deletion(-)

diff --git a/src/App.scss b/src/App.scss
index b36e702d5..f556a7d9d 100644
--- a/src/App.scss
+++ b/src/App.scss
@@ -787,6 +787,19 @@ option {
   padding: 0 0.25em;
   border-radius: var(--roundness);
   border: 1px solid var(--border);
+
+  &.-dismissible {
+    display: flex;
+    padding-left: 0.5em;
+    margin: 0;
+    align-items: baseline;
+    line-height: 2;
+
+    span {
+      display: block;
+      flex: 1 0 auto;
+    }
+  }
 }
 
 .faint {
diff --git a/src/components/settings_modal/tabs/appearance_tab.js b/src/components/settings_modal/tabs/appearance_tab.js
index 99e267d8b..68d2b923a 100644
--- a/src/components/settings_modal/tabs/appearance_tab.js
+++ b/src/components/settings_modal/tabs/appearance_tab.js
@@ -67,6 +67,7 @@ const AppearanceTab = {
       })),
       backgroundUploading: false,
       background: null,
+      backgroundError: null,
       backgroundPreview: null,
     }
   },
@@ -474,6 +475,9 @@ const AppearanceTab = {
     resetUploadedBackground() {
       this.backgroundPreview = null
     },
+    clearBackgroundError() {
+      this.backgroundError = null
+    },
     submitBackground(background) {
       if (!this.backgroundPreview && background !== '') {
         return
@@ -486,8 +490,11 @@ const AppearanceTab = {
           this.$store.commit('addNewUsers', [data])
           this.$store.commit('setCurrentUser', data)
           this.backgroundPreview = null
+          this.backgroundError = null
+        })
+        .catch((e) => {
+          this.backgroundError = e
         })
-        .catch(this.displayUploadError)
         .finally(() => {
           this.backgroundUploading = false
         })
diff --git a/src/components/settings_modal/tabs/appearance_tab.vue b/src/components/settings_modal/tabs/appearance_tab.vue
index a0439ed4a..2a58e1104 100644
--- a/src/components/settings_modal/tabs/appearance_tab.vue
+++ b/src/components/settings_modal/tabs/appearance_tab.vue
@@ -208,6 +208,23 @@
               {{ $t('settings.reset') }}
             </button>
           </div>
+          <div
+            v-if="backgroundError"
+            class="alert error -dismissible"
+          >
+            <span>
+              {{ backgroundError }}
+            </span>
+            <button
+              class="button-unstyled"
+              @click="clearBackgroundError"
+            >
+              <FAIcon
+                class="fa-scale-110 fa-old-padding"
+                icon="times"
+              />
+            </button>
+          </div>
           <button
             v-if="!isDefaultBackground"
             class="btn button-default reset-button"