Merge pull request #6119 from WoltLab/user-activity-point-list-typescript

Migrate `WCF.User.Profile.ActivityPointList` to Typescript

Author: BurntimeX

com.woltlab.wcf/templates/headIncludeJavaScript.tpl

@@ -160,8 +160,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();

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());
+  });
 
   whenFirstSeen("[data-fancybox]", () => {
     void import("./Component/Image/Viewer").then(({ setup }) => setup());

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!));
+      }),
+    );
+  });
+}

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 = {
 	/**