From d909211bf4427955eb253c15959a466d23b158f4 Mon Sep 17 00:00:00 2001
From: Marcel Werk <burntime@woltlab.com>
Date: Mon, 25 Nov 2024 13:35:31 +0100
Subject: [PATCH] Migrate `WCF.User.Profile.ActivityPointList` to Typescript

Closes #6092
---
 .../templates/headIncludeJavaScript.tpl       |  2 -
 ts/WoltLabSuite/Core/Bootstrap.ts             |  3 ++
 .../Core/Component/User/ActivityPointList.ts  | 39 +++++++++++++++++++
 wcfsetup/install/files/js/WCF.User.js         |  2 +
 .../files/js/WoltLabSuite/Core/Bootstrap.js   |  3 ++
 .../Core/Component/User/ActivityPointList.js  | 28 +++++++++++++
 6 files changed, 75 insertions(+), 2 deletions(-)
 create mode 100644 ts/WoltLabSuite/Core/Component/User/ActivityPointList.ts
 create mode 100644 wcfsetup/install/files/js/WoltLabSuite/Core/Component/User/ActivityPointList.js

diff --git a/com.woltlab.wcf/templates/headIncludeJavaScript.tpl b/com.woltlab.wcf/templates/headIncludeJavaScript.tpl
index a607acfb5e1..12dbdfb21e4 100644
--- a/com.woltlab.wcf/templates/headIncludeJavaScript.tpl
+++ b/com.woltlab.wcf/templates/headIncludeJavaScript.tpl
@@ -161,8 +161,6 @@ window.addEventListener('pageshow', function(event) {
 
 <script data-relocate="true">
 	$(function() {
-		WCF.User.Profile.ActivityPointList.init();
-		
 		{if MODULE_TROPHY && $__wcf->session->getPermission('user.profile.trophy.canSeeTrophies')}
 			require(['WoltLabSuite/Core/Ui/User/Trophy/List'], function (UserTrophyList) {
 				new UserTrophyList();
diff --git a/ts/WoltLabSuite/Core/Bootstrap.ts b/ts/WoltLabSuite/Core/Bootstrap.ts
index 3305619a490..55a8dfb3209 100644
--- a/ts/WoltLabSuite/Core/Bootstrap.ts
+++ b/ts/WoltLabSuite/Core/Bootstrap.ts
@@ -175,6 +175,9 @@ export function setup(options: BoostrapOptions): void {
     void import("./Component/File/woltlab-core-file");
     void import("./Component/File/Upload").then(({ setup }) => setup());
   });
+  whenFirstSeen(".activityPointsDisplay", () => {
+    void import("./Component/User/ActivityPointList").then(({ setup }) => setup());
+  });
 
   // Move the reCAPTCHA widget overlay to the `pageOverlayContainer`
   // when widget form elements are placed in a dialog.
diff --git a/ts/WoltLabSuite/Core/Component/User/ActivityPointList.ts b/ts/WoltLabSuite/Core/Component/User/ActivityPointList.ts
new file mode 100644
index 00000000000..886c55914a2
--- /dev/null
+++ b/ts/WoltLabSuite/Core/Component/User/ActivityPointList.ts
@@ -0,0 +1,39 @@
+/**
+ * Shows the activity point list for users.
+ *
+ * @author Marcel Werk
+ * @copyright 2001-2024 WoltLab GmbH
+ * @license GNU Lesser General Public License <http://opensource.org/licenses/lgpl-license.php>
+ * @since 6.2
+ */
+
+import { dboAction } from "WoltLabSuite/Core/Ajax";
+import { promiseMutex } from "WoltLabSuite/Core/Helper/PromiseMutex";
+import { wheneverFirstSeen } from "WoltLabSuite/Core/Helper/Selector";
+import { dialogFactory } from "WoltLabSuite/Core/Component/Dialog";
+import { getPhrase } from "WoltLabSuite/Core/Language";
+
+type ResponseGetDetailedActivityPointList = {
+  template: string;
+};
+
+async function showDialog(userId: number): Promise<void> {
+  const response = (await dboAction("getDetailedActivityPointList", "wcf\\data\\user\\UserProfileAction")
+    .objectIds([userId])
+    .dispatch()) as ResponseGetDetailedActivityPointList;
+
+  const dialog = dialogFactory().fromHtml(response.template).withoutControls();
+  dialog.show(getPhrase("wcf.user.activityPoint"));
+}
+
+export function setup(): void {
+  wheneverFirstSeen(".activityPointsDisplay", (button) => {
+    button.addEventListener(
+      "click",
+      promiseMutex((event) => {
+        event.preventDefault();
+        return showDialog(parseInt(button.dataset.userId!));
+      }),
+    );
+  });
+}
diff --git a/wcfsetup/install/files/js/WCF.User.js b/wcfsetup/install/files/js/WCF.User.js
index 1029c79f32b..f393563f8fd 100644
--- a/wcfsetup/install/files/js/WCF.User.js
+++ b/wcfsetup/install/files/js/WCF.User.js
@@ -15,6 +15,8 @@ WCF.User.Profile = {};
 
 /**
  * Shows the activity point list for users.
+ * 
+ * @deprecated 6.2 Use `WoltLabSuite/Core/Component/User/ActivityPointList` instead.
  */
 WCF.User.Profile.ActivityPointList = {
 	/**
diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Bootstrap.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Bootstrap.js
index ba169b79e83..3f104bef046 100644
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Bootstrap.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Bootstrap.js
@@ -140,6 +140,9 @@ define(["require", "exports", "tslib", "./Core", "./Date/Picker", "./Devtools",
             void new Promise((resolve_7, reject_7) => { require(["./Component/File/woltlab-core-file"], resolve_7, reject_7); }).then(tslib_1.__importStar);
             void new Promise((resolve_8, reject_8) => { require(["./Component/File/Upload"], resolve_8, reject_8); }).then(tslib_1.__importStar).then(({ setup }) => setup());
         });
+        (0, LazyLoader_1.whenFirstSeen)(".activityPointsDisplay", () => {
+            void new Promise((resolve_9, reject_9) => { require(["./Component/User/ActivityPointList"], resolve_9, reject_9); }).then(tslib_1.__importStar).then(({ setup }) => setup());
+        });
         // Move the reCAPTCHA widget overlay to the `pageOverlayContainer`
         // when widget form elements are placed in a dialog.
         const observer = new MutationObserver((mutations) => {
diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Component/User/ActivityPointList.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Component/User/ActivityPointList.js
new file mode 100644
index 00000000000..3f38e3f8333
--- /dev/null
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Component/User/ActivityPointList.js
@@ -0,0 +1,28 @@
+/**
+ * Shows the activity point list for users.
+ *
+ * @author Marcel Werk
+ * @copyright 2001-2024 WoltLab GmbH
+ * @license GNU Lesser General Public License <http://opensource.org/licenses/lgpl-license.php>
+ * @since 6.2
+ */
+define(["require", "exports", "WoltLabSuite/Core/Ajax", "WoltLabSuite/Core/Helper/PromiseMutex", "WoltLabSuite/Core/Helper/Selector", "WoltLabSuite/Core/Component/Dialog", "WoltLabSuite/Core/Language"], function (require, exports, Ajax_1, PromiseMutex_1, Selector_1, Dialog_1, Language_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.setup = setup;
+    async function showDialog(userId) {
+        const response = (await (0, Ajax_1.dboAction)("getDetailedActivityPointList", "wcf\\data\\user\\UserProfileAction")
+            .objectIds([userId])
+            .dispatch());
+        const dialog = (0, Dialog_1.dialogFactory)().fromHtml(response.template).withoutControls();
+        dialog.show((0, Language_1.getPhrase)("wcf.user.activityPoint"));
+    }
+    function setup() {
+        (0, Selector_1.wheneverFirstSeen)(".activityPointsDisplay", (button) => {
+            button.addEventListener("click", (0, PromiseMutex_1.promiseMutex)((event) => {
+                event.preventDefault();
+                return showDialog(parseInt(button.dataset.userId));
+            }));
+        });
+    }
+});