Display an error message if the file cannot be deleted

Author: Cyperghost

ts/WoltLabSuite/Core/Form/Builder/Field/Controller/FileProcessor.ts

@@ -16,6 +16,7 @@ import {
   trackUploadProgress,
 } from "WoltLabSuite/Core/Component/File/Helper";
 import { clearPreviousErrors } from "WoltLabSuite/Core/Component/File/Upload";
+import { innerError } from "WoltLabSuite/Core/Dom/Util";
 
 type FileId = string;
 const fileProcessors = new Map<FileId, FileProcessor>();
@@ -129,9 +130,21 @@ export class FileProcessor {
     deleteButton.classList.add("button", "small");
     deleteButton.textContent = getPhrase("wcf.global.button.delete");
     deleteButton.addEventListener("click", async () => {
-      await deleteFile(element.fileId!);
+      const result = await deleteFile(element.fileId!);
+      if (result.ok) {
+        this.#unregisterFile(element);
+      } else {
+        let container: HTMLElement = element;
+        if (!this.#useBigPreview) {
+          container = container.parentElement!;
+        }
 
-      this.#unregisterFile(element);
+        if (result.error.code === "permission_denied") {
+          innerError(container, getPhrase("wcf.upload.error.delete.permissionDenied"), true);
+        } else {
+          innerError(container, result.error.message ?? getPhrase("wcf.upload.error.delete.unknownError"));
+        }
+      }
     });
 
     return deleteButton;

wcfsetup/install/files/js/WoltLabSuite/Core/Form/Builder/Field/Controller/FileProcessor.js

@@ -153,6 +153,8 @@ public function __invoke(PreloadPhrasesCollecting $event): void
         $event->preload('wcf.upload.error.fileExtensionNotPermitted');
         $event->preload('wcf.upload.error.fileSizeTooLarge');
         $event->preload('wcf.upload.error.maximumCountReached');
+        $event->preload('wcf.upload.error.delete.permissionDenied');
+        $event->preload('wcf.upload.error.delete.unknownError');
 
         $event->preload('wcf.user.activityPoint');
         $event->preload('wcf.user.language');

wcfsetup/install/files/lib/system/event/listener/PreloadPhrasesCollectingListener.class.php

@@ -25,7 +25,8 @@
 	grid-template-areas:
 		"file filename"
 		"file fileSize"
-		"file buttons";
+		"file buttons"
+		"file error";
 	grid-template-columns: 80px auto;
 	padding: 10px;
 }
@@ -38,6 +39,10 @@
 	color: var(--wcfStatusErrorText);
 }
 
+.fileList__item .innerError {
+	grid-area: error;
+}
+
 .fileList__item__file {
 	display: flex;
 	grid-area: file;

wcfsetup/install/files/style/ui/fileList.scss

@@ -5566,6 +5566,8 @@ Benachrichtigungen auf <a href="{link isHtmlEmail=true}{/link}">{PAGE_TITLE|phra
 		<item name="wcf.upload.error.fileSizeTooLarge"><![CDATA[Die Datei ist zu groß.]]></item>
 		<item name="wcf.upload.error.maximumCountReached"><![CDATA[Es {plural value=$maximumCount 1='darf nur eine Datei' other='dürfen nur # Dateien'} hochgeladen werden.]]></item>
 		<item name="wcf.upload.error.adopt"><![CDATA[Die Datei „{$filename}“ kann nicht zugewiesen werden.]]></item>
+		<item name="wcf.upload.error.delete.unknownError"><![CDATA[Beim Löschen der Datei ist ein unbekannter Fehler aufgetreten.]]></item>
+		<item name="wcf.upload.error.delete.permissionDenied"><![CDATA[Die Datei kann nicht gelöscht werden, {if LANGUAGE_USE_INFORMAL_VARIANT}verwende{else}verwenden Sie{/if} stattdessen <b>Ersetzen</b>, um die Datei zu erneuern.]]></item>
 	</category>
 </import>
 <delete>

wcfsetup/install/lang/de.xml

@@ -5568,6 +5568,8 @@ your notifications on <a href="{link isHtmlEmail=true}{/link}">{PAGE_TITLE|phras
 		<item name="wcf.upload.error.fileSizeTooLarge"><![CDATA[The file is too large.]]></item>
 		<item name="wcf.upload.error.maximumCountReached"><![CDATA[{plural value=$maximumCount 1='Only one file' other='Only up to # files'} may be uploaded.]]></item>
 		<item name="wcf.upload.error.adopt"><![CDATA[The file “{$filename}” cannot be assigned.]]></item>
+		<item name="wcf.upload.error.delete.unknownError"><![CDATA[An unknown error occurred while deleting the file.]]></item>
+		<item name="wcf.upload.error.delete.permissionDenied"><![CDATA[The file cannot be deleted, use <b>Replace</b> instead to renew the file.]]></item>
 	</category>
 </import>
 <delete>