chore(frontend): 開発モード時に言語ファイルの変更を自動で反映するように (#16215)

* chore(frontend): 開発モード時に言語ファイルの変更を自動で反映するように

* fix message

* naming

* SPDX

1 files changed, 36 insertions, 0 deletions

diff --git a/packages/frontend/lib/vite-plugin-watch-locales.ts b/packages/frontend/lib/vite-plugin-watch-locales.ts
new file mode 100644
index 0000000000..8e209d27bd
--- /dev/null
+++ b/packages/frontend/lib/vite-plugin-watch-locales.ts
@@ -0,0 +1,36 @@
+/*
+ * SPDX-FileCopyrightText: syuilo and misskey-project
+ * SPDX-License-Identifier: AGPL-3.0-only
+ */
+
+import path from 'node:path'
+import locales from '../../../locales/index.js';
+
+const localesDir = path.resolve(__dirname, '../../../locales')
+
+/**
+ * 外部ファイルを監視し、必要に応じてwebSocketでメッセージを送るViteプラグイン
+ * @returns {import('vite').Plugin}
+ */
+export default function pluginWatchLocales() {
+  return {
+    name: 'watch-locales',
+
+    configureServer(server) {
+      const localeYmlPaths = Object.keys(locales).map(locale => path.join(localesDir, `${locale}.yml`));
+
+      // watcherにパスを追加
+      server.watcher.add(localeYmlPaths);
+
+			server.watcher.on('change', (filePath) => {
+				if (localeYmlPaths.includes(filePath)) {
+					server.ws.send({
+						type: 'custom',
+						event: 'locale-update',
+						data: filePath.match(/([^\/]+)\.yml$/)?.[1] || null,
+					})
+				}
+			});
+    },
+  };
+}