fix: Refactor i18n config and fix plugin search box styling issue (#22945)

web/i18n-config/DEV.md

@@ -0,0 +1,49 @@
+
+## library
+
+* i18next
+* react-i18next
+
+## hooks
+
+* useTranslation
+* useGetLanguage
+* useI18N
+* useRenderI18nObject
+
+## impl
+
+* App Boot
+  - app/layout.tsx load i18n and init context
+    - use `<I18nServer/>`
+      - read locale with `getLocaleOnServer` (in node.js)
+        - locale from cookie, or browser request header
+        - only used in client app init and 2 server code(plugin desc, datasets)
+      - use `<I18N/>`
+        - init i18n context
+        - `setLocaleOnClient`
+          - `changeLanguage` (defined in i18n/i18next-config, also init i18n resources (side effects))
+            * is `i18next.changeLanguage`
+            * all languages text is merge & load in FrontEnd as .js (see i18n/i18next-config)
+* i18n context
+  - `locale` - current locale code (ex `eu-US`, `zh-Hans`)
+  - `i18n` - useless
+  - `setLocaleOnClient` - used by App Boot and user change language
+
+### load i18n resources
+
+- client: i18n/i18next-config.ts
+  * ns = camalCase(filename)
+  * ex: `app/components/datasets/create/embedding-process/index.tsx`
+    * `t('datasetSettings.form.retrievalSetting.title')`
+- server: i18n/server.ts
+  * ns = filename
+  * ex: `app/(commonLayout)/datasets/(datasetDetailLayout)/[datasetId]/settings/page.tsx`
+    * `translate(locale, 'dataset-settings')`
+
+## TODO
+
+* [ ] ts docs for useGetLanguage
+* [ ] ts docs for useI18N
+* [ ] client docs for i18n
+* [ ] server docs for i18n