optimize I18NSelector

src/ui/I18N/I18NSelector/index.tsx

 import React, { useEffect } from "react";
 import { useTranslation } from "react-i18next";
 
+import { Select } from "@/ui/Shared";
+
 export const I18NSelector: React.FC = () => {
   const { i18n } = useTranslation();
 
-  const onClickLanguageChange = (e: React.ChangeEvent<HTMLSelectElement>) => {
-    const language = e.target.value;
+  const onClickLanguageChange = (language: any) => {
     i18n.changeLanguage(language);
   };
 
@@ -15,14 +16,18 @@ export const I18NSelector: React.FC = () => {
   }, [i18n.language]);
 
   return (
-    <select value={i18n.language} onChange={onClickLanguageChange}>
-      <option value="cn">Chinese</option>
-      <option value="en">English</option>
-      <option value="fr">French</option>
-      <option value="jp">Japanese</option>
-      <option value="br">Brazilian</option>
-      <option value="pt">Portuguese</option>
-      <option value="es">Spanish</option>
-    </select>
+    <Select
+      value={i18n.language}
+      onChange={onClickLanguageChange}
+      options={[
+        { value: "cn", label: "简体中文" },
+        { value: "en", label: "English" },
+        { value: "fr", label: "Français" },
+        { value: "jp", label: "日本語" },
+        { value: "br", label: "português do Brasil" },
+        { value: "pt", label: "português" },
+        { value: "es", label: "Castellano" },
+      ]}
+    />
   );
 };

src/ui/Shared/Select/index.tsx

@@ -4,10 +4,10 @@ import classNames from "classnames";
 import styles from "./index.module.scss";
 
 export const Select: React.FC<
-  React.ComponentProps<typeof AntdSelect> & { title: string }
+  React.ComponentProps<typeof AntdSelect> & { title?: string }
 > = ({ title, className, dropdownStyle, ...rest }) => (
   <div className={styles["custom-select"]}>
-    <span className={styles.prefix}>{title}</span>
+    {title && <span className={styles.prefix}>{title}</span>}
     <AntdSelect
       className={classNames(styles.select, className)}
       size="large"