Emoji picker

com.woltlab.wcf/option.xml

@@ -303,7 +303,7 @@
 			<option name="module_smiley">
 				<categoryname>module.customization</categoryname>
 				<optiontype>boolean</optiontype>
-				<defaultvalue>1</defaultvalue>
+				<defaultvalue>0</defaultvalue>
 			</option>
 			<option name="module_users_online">
 				<categoryname>module.user</categoryname>

emoji-picker-webpack.config.js

@@ -0,0 +1,13 @@
+"use strict";
+
+const path = require("path");
+
+module.exports = {
+	entry: "./node_modules/emoji-picker-element/index.js",
+	output: {
+		path: path.resolve(__dirname, "wcfsetup", "install", "files", "js", "3rdparty"),
+		filename: "emoji-picker-element.min.js",
+		libraryTarget: "amd",
+	},
+	mode: "production",
+};

extra/package.json

@@ -2,6 +2,8 @@
   "dependencies": {
     "@woltlab/r.js": "git+https://github.com/WoltLab/r.js.git#ad2413df45fdf6164611243f9870943de3d2bce3",
     "deepmerge": "^4.3.0",
+    "emoji-picker-element": "^1.22.8",
+    "emoji-picker-element-data": "^1.6.1",
     "terser": "^5.16.5",
     "ts-node": "^10.9.1"
   },

extra/update-emoji-picker-element.ts

@@ -0,0 +1,129 @@
+import * as fs from "fs";
+import { promisify } from "util";
+import * as path from "path";
+import { I18n } from "emoji-picker-element/shared";
+import de from "emoji-picker-element/i18n/de";
+import en from "emoji-picker-element/i18n/en";
+import es from "emoji-picker-element/i18n/es";
+import fr from "emoji-picker-element/i18n/fr";
+import it from "emoji-picker-element/i18n/it";
+import nl from "emoji-picker-element/i18n/nl";
+import pl from "emoji-picker-element/i18n/pl";
+import pt_PT from "emoji-picker-element/i18n/pt_PT";
+import ru_RU from "emoji-picker-element/i18n/ru_RU";
+
+const copyFile = promisify(fs.copyFile);
+const writeFile = promisify(fs.writeFile);
+const rm = promisify(fs.rm);
+const readdir = promisify(fs.readdir);
+
+if (process.argv.length !== 4) {
+  throw new Error(
+    "Expects the path to the directory in which the emoji data is saved as the #1 argument and the path to the Localisation.ts as the #2 argument.",
+  );
+}
+
+const repository = process.argv[2];
+if (!fs.existsSync(repository)) {
+  throw new Error(`The path '${repository}' does not exist.`);
+}
+
+const localisation = process.argv[3];
+if (!fs.existsSync(localisation)) {
+  throw new Error(`The path '${localisation}' does not exist.`);
+}
+
+const languages: LanguageItem[] = [
+  { local: "da" },
+  { local: "nl", i18n: nl },
+  { local: "en", i18n: en },
+  { local: "en-gb" },
+  { local: "et" },
+  { local: "fi" },
+  { local: "fr", i18n: fr },
+  { local: "de", i18n: de },
+  { local: "hu" },
+  { local: "it", i18n: it },
+  { local: "lt" },
+  { local: "nb" },
+  { local: "pl", i18n: pl },
+  { local: "pt", i18n: pt_PT },
+  { local: "ru", i18n: ru_RU },
+  { local: "es", i18n: es },
+  { local: "sv" },
+  { local: "uk" },
+];
+
+(async () => {
+  let localisationContent = `/**
+ * This file is auto-generated, DO NOT MODIFY IT MANUALLY!
+ *
+ * To update the file, run in the extra directory:
+ * > \`npx tsx ./update-emoji-picker-element.ts ../wcfsetup/install/files/emoji ../ts/WoltLabSuite/Core/Component/EmojiPicker/Localization.ts\`
+ *
+ * @woltlabExcludeBundle all
+ */
+
+import { I18n } from "emoji-picker-element/shared";
+
+// prettier-ignore
+const locales = [
+  ${languages.map((item) => {
+    return `"${item.local}"`;
+  })}
+];
+
+export function getLocalizationData(localization: string): I18n {
+  if (localization.includes("-")) {
+    localization = localization.split("-")[0];
+  }
+
+  switch (localization) {
+    ${languages
+      .filter((item) => {
+        return item.local !== "en";
+      })
+      .filter((language) => language.i18n)
+      .map((item) => {
+        return `case "${item.local}":
+      // prettier-ignore
+      return ${JSON.stringify(item.i18n)};`;
+      })
+      .join("\n    ")}
+    default:
+      // prettier-ignore
+      return ${JSON.stringify(en)};
+  }
+}
+
+export function getDataSource(locale: string): string {
+  if (!locales.includes(locale)) {
+    return \`\${window.WSC_API_URL}emoji/en.json\`;
+  }
+
+  return \`\${window.WSC_API_URL}emoji/\${locale}.json\`;
+}
+`;
+
+  for (const file in await readdir(repository)) {
+    if (!file.endsWith(".json")) {
+      continue;
+    }
+
+    await rm(path.join(repository, file));
+  }
+
+  for (const language of languages) {
+    await copyFile(
+      path.join(__dirname, `node_modules/emoji-picker-element-data/${language.local}/cldr-native/data.json`),
+      path.join(repository, `${language.local}.json`),
+    );
+  }
+
+  await writeFile(localisation, localisationContent);
+})();
+
+interface LanguageItem {
+  local: string;
+  i18n?: I18n;
+}