Allow logo removal

src-ui/messages.xlf

@@ -3713,6 +3713,10 @@
           <context context-type="sourcefile">src/app/components/common/input/file/file.component.html</context>
           <context context-type="linenumber">11</context>
         </context-group>
+        <context-group purpose="location">
+          <context context-type="sourcefile">src/app/components/common/input/file/file.component.html</context>
+          <context context-type="linenumber">25</context>
+        </context-group>
         <context-group purpose="location">
           <context context-type="sourcefile">src/app/components/common/input/number/number.component.html</context>
           <context context-type="linenumber">11</context>

src-ui/src/app/components/common/input/file/file.component.html

@@ -14,10 +14,17 @@
         </div>
         <div class="input-group" [class.col-md-9]="horizontal" [class.is-invalid]="error">
           <input #fileInput type="file" class="form-control" [id]="inputId" (change)="onFile($event)" [disabled]="disabled">
-          <button class="btn btn-outline-secondary py-0" type="button" (click)="onButton()" [disabled]="disabled || !file" i18n>Upload</button>
+          <button class="btn btn-outline-primary py-0" type="button" (click)="uploadClicked()" [disabled]="disabled || !file" i18n>Upload</button>
         </div>
         @if (filename) {
-            <small class="form-text text-muted">{{filename}}</small>
+            <div class="form-text d-flex align-items-center">
+              <span class="text-muted">{{filename}}</span>
+              <button type="button" class="btn btn-link btn-sm ms-2" (click)="clear()">
+                <svg class="sidebaricon" fill="currentColor">
+                  <use xlink:href="assets/bootstrap-icons.svg#x"/>
+                </svg><small class="ms-1" i18n>Remove</small>
+              </button>
+            </div>
         }
         <input #inputField type="hidden" class="form-control small" [(ngModel)]="value" [disabled]="true">
         @if (hint) {

src-ui/src/app/components/common/input/file/file.component.spec.ts

@@ -34,7 +34,7 @@ describe('FileComponent', () => {
     let firedFile
     component.file = new File([], 'test.png')
     component.upload.subscribe((file) => (firedFile = file))
-    component.onButton()
+    component.uploadClicked()
     expect(firedFile.name).toEqual('test.png')
     expect(component.file).toBeUndefined()
   })

src-ui/src/app/components/common/input/file/file.component.ts

@@ -39,9 +39,15 @@ export class FileComponent extends AbstractInputComponent<string> {
     this.file = (event.target as HTMLInputElement).files[0]
   }
 
-  onButton() {
+  uploadClicked() {
     this.upload.emit(this.file)
+    this.clear()
+  }
+
+  clear() {
     this.file = undefined
     this.fileInput.nativeElement.value = null
+    this.writeValue(null)
+    this.onChange(null)
   }
 }

src-ui/src/app/services/config.service.spec.ts

@@ -48,4 +48,17 @@ describe('ConfigService', () => {
     expect(req.request.method).toEqual('PATCH')
     expect(req.request.body).not.toBeNull()
   })
+
+  it('should not pass string app_logo', () => {
+    service
+      .saveConfig({
+        id: 1,
+        app_logo: '/logo/foobar.png',
+      } as PaperlessConfig)
+      .subscribe()
+    const req = httpTestingController.expectOne(
+      `${environment.apiBaseUrl}config/1/`
+    )
+    expect(req.request.body).toEqual({ id: 1 })
+  })
 })

src-ui/src/app/services/config.service.ts

@@ -20,6 +20,8 @@ export class ConfigService {
   }
 
   saveConfig(config: PaperlessConfig): Observable<PaperlessConfig> {
+    // dont pass string
+    if (typeof config.app_logo === 'string') delete config.app_logo
     return this.http
       .patch<PaperlessConfig>(`${this.baseUrl}${config.id}/`, config)
       .pipe(first())