feat: support setting language for FormKit and Uppy (#3630)

#### What type of PR is this?

/kind feature
/area console
/milestone 2.4.0

#### What this PR does / why we need it:

FormKit 和 Uppy 上传组件支持同步设置系统语言。

#### Which issue(s) this PR fixes:

Fixes https://github.com/halo-dev/halo/issues/3574

#### Special notes for your reviewer:

在不同语言的浏览器中测试表单的验证和上传组件的语言是否显示正确即可。

#### Does this PR introduce a user-facing change?

```release-note
None
```

console/src/App.vue

@@ -1,6 +1,6 @@
 <script lang="ts" setup>
 import { RouterView, useRoute } from "vue-router";
-import { computed, watch, ref, reactive, onMounted } from "vue";
+import { computed, watch, ref, reactive, onMounted, inject } from "vue";
 import { useTitle } from "@vueuse/core";
 import { useFavicon } from "@vueuse/core";
 import { useSystemConfigMapStore } from "./stores/system-configmap";
@@ -11,6 +11,8 @@ import {
   useOverlayScrollbars,
   type UseOverlayScrollbarsParams,
 } from "overlayscrollbars-vue";
+import type { FormKitConfig } from "@formkit/core";
+import { i18n } from "./locales";
 
 const { t } = useI18n();
 
@@ -81,6 +83,17 @@ const [initialize] = useOverlayScrollbars(reactiveParams);
 onMounted(() => {
   if (body) initialize({ target: body });
 });
+
+// setup formkit locale
+// see https://formkit.com/essentials/internationalization
+const formkitLocales = {
+  en: "en",
+  zh: "zh",
+  "en-US": "en",
+  "zh-CN": "zh",
+};
+const formkitConfig = inject(Symbol.for("FormKitConfig")) as FormKitConfig;
+formkitConfig.locale = formkitLocales[i18n.global.locale.value] || "zh";
 </script>
 
 <template>

console/src/components/upload/UppyUpload.vue

@@ -6,9 +6,11 @@ import Uppy, { type SuccessResponse } from "@uppy/core";
 import type { Restrictions } from "@uppy/core";
 import XHRUpload from "@uppy/xhr-upload";
 import zh_CN from "@uppy/locales/lib/zh_CN";
+import en_US from "@uppy/locales/lib/en_US";
 import { computed, onUnmounted } from "vue";
 import { Toast } from "@halo-dev/components";
 import type { ProblemDetail } from "@/utils/api-client";
+import { i18n } from "@/locales";
 
 const props = withDefaults(
   defineProps<{
@@ -39,9 +41,16 @@ const emit = defineEmits<{
   (event: "error", file, response): void;
 }>();
 
+const locales = {
+  en: en_US,
+  zh: zh_CN,
+  "en-US": en_US,
+  "zh-CN": zh_CN,
+};
+
 const uppy = computed(() => {
   return new Uppy({
-    locale: zh_CN,
+    locale: locales[i18n.global.locale.value] || locales["zh-CN"],
     meta: props.meta,
     restrictions: props.restrictions,
     autoProceed: props.autoProceed,

console/src/formkit/formkit.config.ts

@@ -1,6 +1,6 @@
 import { generateClasses } from "@formkit/themes";
 import theme from "./theme";
-import { zh } from "@formkit/i18n";
+import { zh, en } from "@formkit/i18n";
 import type { DefaultConfigOptions } from "@formkit/vue";
 import { form } from "./inputs/form";
 import { attachment } from "./inputs/attachment";
@@ -40,7 +40,7 @@ const config: DefaultConfigOptions = {
     categoryCheckbox,
     tagCheckbox,
   },
-  locales: { zh },
+  locales: { zh, en },
   locale: "zh",
 };