From: Cyperghost <olaf_schmitz_1@t-online.de>
Date: Mon, 2 Dec 2024 12:27:14 +0000 (+0100)
Subject: Migrate `WCF.ACP.Language.ItemList` to TypeScript
X-Git-Url: https://git.stricted.de/?a=commitdiff_plain;h=685ea8aca0b788fd5380b754807b8012831395b1;p=GitHub%2FWoltLab%2FWCF.git

Migrate `WCF.ACP.Language.ItemList` to TypeScript
---

diff --git a/ts/WoltLabSuite/Core/Acp/Ui/Language/ItemList.ts b/ts/WoltLabSuite/Core/Acp/Ui/Language/ItemList.ts
new file mode 100644
index 0000000000..4e8072ad82
--- /dev/null
+++ b/ts/WoltLabSuite/Core/Acp/Ui/Language/ItemList.ts
@@ -0,0 +1,80 @@
+/**
+ * Handles language item list.
+ *
+ * @author  Olaf Braun
+ * @copyright  2001-2024 WoltLab GmbH
+ * @license  GNU Lesser General Public License <http://opensource.org/licenses/lgpl-license.php>
+ */
+
+import { dboAction } from "WoltLabSuite/Core/Ajax";
+import { dialogFactory } from "WoltLabSuite/Core/Component/Dialog";
+import { getPhrase } from "WoltLabSuite/Core/Language";
+import { confirmationFactory } from "WoltLabSuite/Core/Component/Confirmation";
+import { show as showNotification } from "WoltLabSuite/Core/Ui/Notification";
+
+interface BeginEditResponse {
+  languageItem: string;
+  isCustomLanguageItem: boolean;
+  template: string;
+}
+
+export function init() {
+  document.querySelectorAll<HTMLElement>(".jsLanguageItem").forEach((button) => {
+    button.addEventListener("click", () => {
+      void beginEdit(parseInt(button.dataset.languageItemId!, 10));
+    });
+  });
+}
+
+async function beginEdit(languageItemID: number) {
+  const result = (await dboAction("prepareEdit", "wcf\\data\\language\\item\\LanguageItemAction")
+    .objectIds([languageItemID])
+    .dispatch()) as BeginEditResponse;
+
+  const dialog = dialogFactory()
+    .fromHtml(result.template)
+    .asPrompt(
+      result.isCustomLanguageItem
+        ? {
+            extra: getPhrase("wcf.global.button.delete"),
+          }
+        : undefined,
+    );
+
+  dialog.addEventListener("extra", () => {
+    void confirmationFactory()
+      .custom(getPhrase("wcf.global.confirmation.title"))
+      .message(getPhrase("wcf.acp.language.item.delete.confirmMessage"))
+      .then((result) => {
+        if (result) {
+          void dboAction("deleteCustomLanguageItems", "wcf\\data\\language\\item\\LanguageItemAction")
+            .objectIds([languageItemID])
+            .dispatch();
+
+          dialog.close();
+
+          window.location.reload();
+        }
+      });
+  });
+
+  dialog.addEventListener("primary", () => {
+    const languageItemValue = dialog.querySelector<HTMLInputElement>('[name="languageItemValue"]')?.value;
+    const languageCustomItemValue = dialog.querySelector<HTMLInputElement>('[name="languageCustomItemValue"]')?.value;
+    const languageUseCustomValue = dialog.querySelector<HTMLInputElement>('[name="languageUseCustomValue"]')?.checked;
+
+    void dboAction("edit", "wcf\\data\\language\\item\\LanguageItemAction")
+      .objectIds([languageItemID])
+      .payload({
+        languageItemValue: languageItemValue ?? null,
+        languageCustomItemValue: languageCustomItemValue ?? null,
+        languageUseCustomValue: languageUseCustomValue ?? null,
+      })
+      .dispatch()
+      .then(() => {
+        showNotification();
+      });
+  });
+
+  dialog.show(result.languageItem);
+}
diff --git a/wcfsetup/install/files/acp/templates/languageItemEditDialog.tpl b/wcfsetup/install/files/acp/templates/languageItemEditDialog.tpl
index 3b3b327098..5b2d8e563f 100644
--- a/wcfsetup/install/files/acp/templates/languageItemEditDialog.tpl
+++ b/wcfsetup/install/files/acp/templates/languageItemEditDialog.tpl
@@ -4,7 +4,7 @@
 	<dl class="wide">
 		<dt></dt>
 		<dd>
-			<textarea rows="5" cols="60" name="languageItemValue" id="overlayLanguageItemValue"{if $item->languageItemOriginIsSystem} readonly{/if}>{$item->languageItemValue}</textarea>
+			<textarea rows="5" cols="60" name="languageItemValue"{if $item->languageItemOriginIsSystem} readonly{/if}>{$item->languageItemValue}</textarea>
 		</dd>
 	</dl>
 </section>
@@ -32,23 +32,13 @@
 		<dl class="wide">
 			<dt></dt>
 			<dd>
-				<textarea rows="5" cols="60" name="languageCustomItemValue" id="overlayLanguageCustomItemValue">{$item->languageCustomItemValue}</textarea>
+				<textarea rows="5" cols="60" name="languageCustomItemValue">{$item->languageCustomItemValue}</textarea>
 			</dd>
 		</dl>
 		
 		<dl class="wide">
 			<dt></dt>
-			<dd><label><input type="checkbox" name="languageUseCustomValue" id="overlayLanguageUseCustomValue" value="1"{if $item->languageUseCustomValue} checked{/if}> {lang}wcf.acp.language.item.useCustomValue{/lang}</label></dd>
+			<dd><label><input type="checkbox" name="languageUseCustomValue" value="1"{if $item->languageUseCustomValue} checked{/if}> {lang}wcf.acp.language.item.useCustomValue{/lang}</label></dd>
 		</dl>
 	</section>
 {/if}
-
-<input type="hidden" name="languageItemID" id="overlayLanguageItemID" value="{$item->languageItemID}">
-
-<div class="formSubmit">
-	<button type="button" class="button buttonPrimary jsSubmitLanguageItem" accesskey="s">{lang}wcf.global.button.submit{/lang}</button>
-	
-	{if $item->isCustomLanguageItem}
-		<button type="button" class="button jsDeleteLanguageItem">{lang}wcf.global.button.delete{/lang}</button>
-	{/if}
-</div>
diff --git a/wcfsetup/install/files/acp/templates/languageItemList.tpl b/wcfsetup/install/files/acp/templates/languageItemList.tpl
index 9b2103c89c..07d91a1276 100644
--- a/wcfsetup/install/files/acp/templates/languageItemList.tpl
+++ b/wcfsetup/install/files/acp/templates/languageItemList.tpl
@@ -1,11 +1,10 @@
 {include file='header' pageTitle="wcf.acp.language.item.list"}
 
-<script data-relocate="true" src="{@$__wcf->getPath()}acp/js/WCF.ACP.Language.js?v={@LAST_UPDATE_TIME}"></script>
 <script data-relocate="true">
-	$(function() {
-		WCF.Language.add('wcf.acp.language.item.delete.confirmMessage', '{jslang}wcf.acp.language.item.delete.confirmMessage{/jslang}');
-		
-		new WCF.ACP.Language.ItemList();
+	{jsphrase name='wcf.acp.language.item.delete.confirmMessage'}
+
+	require(['WoltLabSuite/Core/Acp/Ui/Language/ItemList'], ({ init }) => {
+		init();
 	});
 </script>
 
diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Acp/Ui/Language/ItemList.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Acp/Ui/Language/ItemList.js
new file mode 100644
index 0000000000..95ce1a8c90
--- /dev/null
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Acp/Ui/Language/ItemList.js
@@ -0,0 +1,62 @@
+/**
+ * Handles language item list.
+ *
+ * @author  Olaf Braun
+ * @copyright  2001-2024 WoltLab GmbH
+ * @license  GNU Lesser General Public License <http://opensource.org/licenses/lgpl-license.php>
+ */
+define(["require", "exports", "WoltLabSuite/Core/Ajax", "WoltLabSuite/Core/Component/Dialog", "WoltLabSuite/Core/Language", "WoltLabSuite/Core/Component/Confirmation", "WoltLabSuite/Core/Ui/Notification"], function (require, exports, Ajax_1, Dialog_1, Language_1, Confirmation_1, Notification_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.init = init;
+    function init() {
+        document.querySelectorAll(".jsLanguageItem").forEach((button) => {
+            button.addEventListener("click", () => {
+                void beginEdit(parseInt(button.dataset.languageItemId, 10));
+            });
+        });
+    }
+    async function beginEdit(languageItemID) {
+        const result = (await (0, Ajax_1.dboAction)("prepareEdit", "wcf\\data\\language\\item\\LanguageItemAction")
+            .objectIds([languageItemID])
+            .dispatch());
+        const dialog = (0, Dialog_1.dialogFactory)()
+            .fromHtml(result.template)
+            .asPrompt(result.isCustomLanguageItem
+            ? {
+                extra: (0, Language_1.getPhrase)("wcf.global.button.delete"),
+            }
+            : undefined);
+        dialog.addEventListener("extra", () => {
+            void (0, Confirmation_1.confirmationFactory)()
+                .custom((0, Language_1.getPhrase)("wcf.global.confirmation.title"))
+                .message((0, Language_1.getPhrase)("wcf.acp.language.item.delete.confirmMessage"))
+                .then((result) => {
+                if (result) {
+                    void (0, Ajax_1.dboAction)("deleteCustomLanguageItems", "wcf\\data\\language\\item\\LanguageItemAction")
+                        .objectIds([languageItemID])
+                        .dispatch();
+                    dialog.close();
+                    window.location.reload();
+                }
+            });
+        });
+        dialog.addEventListener("primary", () => {
+            const languageItemValue = dialog.querySelector('[name="languageItemValue"]')?.value;
+            const languageCustomItemValue = dialog.querySelector('[name="languageCustomItemValue"]')?.value;
+            const languageUseCustomValue = dialog.querySelector('[name="languageUseCustomValue"]')?.checked;
+            void (0, Ajax_1.dboAction)("edit", "wcf\\data\\language\\item\\LanguageItemAction")
+                .objectIds([languageItemID])
+                .payload({
+                languageItemValue: languageItemValue ?? null,
+                languageCustomItemValue: languageCustomItemValue ?? null,
+                languageUseCustomValue: languageUseCustomValue ?? null,
+            })
+                .dispatch()
+                .then(() => {
+                (0, Notification_1.show)();
+            });
+        });
+        dialog.show(result.languageItem);
+    }
+});
diff --git a/wcfsetup/install/files/lib/data/language/item/LanguageItemAction.class.php b/wcfsetup/install/files/lib/data/language/item/LanguageItemAction.class.php
index 2775156b1a..8fd7719315 100644
--- a/wcfsetup/install/files/lib/data/language/item/LanguageItemAction.class.php
+++ b/wcfsetup/install/files/lib/data/language/item/LanguageItemAction.class.php
@@ -112,6 +112,7 @@ class LanguageItemAction extends AbstractDatabaseObjectAction
 
         return [
             'languageItem' => $item->languageItem,
+            'isCustomLanguageItem' => $item->isCustomLanguageItem,
             'template' => WCF::getTPL()->fetch('languageItemEditDialog'),
         ];
     }